/* Isla 2.0 — Midnight coast. Presentation layer, no changes to game rules. */
:root{color-scheme:dark;--ink:#edf5fa;--muted:#91a5b7;--paper:#0b1722;--line:#ffffff12;--gold:#efbd68;--sea:#0d2633;--card:#122333;--red:#ee8b79;--green:#65d6ba;font-family:"Segoe UI Variable",Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;background:#0b1722;color:var(--ink)}
body{min-height:100vh;background:radial-gradient(ellipse at 8% 0%,#1d3f474d,transparent 48%),radial-gradient(ellipse at 94% 45%,#26335130,transparent 45%),#0b1722;background-attachment:fixed}h1,h2{font-family:inherit;font-weight:750;letter-spacing:-1.5px}h3{font-weight:700}button{border-radius:12px;background:#d8eee9;color:#103132;box-shadow:0 2px 0 #ffffff08 inset;transition:background .18s,box-shadow .18s,transform .18s}button:hover:enabled{filter:none;box-shadow:0 7px 22px #0003;transform:translateY(-2px)}button:active:enabled{transform:translateY(0) scale(.98)}button:disabled{opacity:.32}.quiet{border:1px solid #ffffff15;background:#ffffff05;color:#c7d9e5}.quiet:hover:enabled{background:#ffffff0d;border-color:#ffffff2c}.gold{background:linear-gradient(135deg,#f5d08c,#e5ac53);color:#33250e;border:1px solid #ffe1a54d;box-shadow:0 4px 20px #e7ac4c20}.muted{color:var(--muted)}.topbar{height:77px;background:#0b1722bd;backdrop-filter:blur(18px);border-bottom-color:#ffffff0c;padding:0 3vw}.brand{font-size:30px;font-weight:800;letter-spacing:-1.4px;color:#f1f7fb}.brand-icon{color:#83dec6;font-size:36px}.brand-dot{color:#f0bd70}.tagline{border-left-color:#ffffff12;color:#8098a9;font-size:11px}.connection{background:#67d6b80b;border:1px solid #67d6b81b;border-radius:30px;padding:7px 11px;font-size:10px}.top-actions{gap:13px}.eyebrow{color:#8ee2c9;letter-spacing:2px;font-size:10px}.hero{max-width:1400px;padding:65px 50px 40px;gap:60px}.hero h1{font-size:clamp(48px,5.2vw,78px);line-height:1.03;letter-spacing:-4px;font-weight:760}.hero h1 em{font-style:normal;font-weight:760;background:linear-gradient(110deg,#89e7c7,#d9bf81);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-copy>p{color:#92a6b9;font-size:15px;max-width:420px}.facts{color:#7f96a9;gap:25px;font-size:11px}.facts strong{color:#dce9ed;font-size:14px}.entry-card{background:linear-gradient(135deg,#182d3a,#101e2e);border-color:#ffffff10;box-shadow:0 24px 65px #0003;border-radius:21px;padding:25px}.tabs{border-bottom-color:#ffffff10;gap:25px}.tab{background:none;box-shadow:none;color:#7f98aa;font-size:12px}.tab.selected{color:#9ee5cf;border-bottom-color:#8cdbc4}label{color:#b5cbd9;font-size:11px;letter-spacing:.2px}input,select,textarea{background:#091723;border:1px solid #ffffff12;color:#e2edf5;border-radius:11px;padding:13px;box-shadow:0 2px 8px #00000012 inset}input::placeholder,textarea::placeholder{color:#4d657b}select option{background:#102332;color:#eff7fa}.link-button{color:#91b4c0}.hero-art{aspect-ratio:1.02;border-radius:32px;background:radial-gradient(ellipse at 50% 42%,#235459,#122f3c 55%,#101f30);border:1px solid #ffffff0c;box-shadow:0 45px 80px #0003,0 1px 0 #ffffff06 inset;transform:rotate(-2deg);overflow:visible}.hero-art:after{inset:18px;border-radius:20px;border:1px dashed #b0dcce19}.hero-art svg{transform:rotate(2deg) scale(.98);filter:drop-shadow(0 14px 2px #04121d77) drop-shadow(0 26px 20px #04121d77)}.art-label{color:#a0c8c9;font-family:inherit;font-size:12px;font-style:normal;letter-spacing:2px;text-transform:uppercase;bottom:27px}.intro-strip{border-top-color:#ffffff0c;max-width:1300px;margin-top:40px}.step-number{font-family:inherit;color:#58ae9c;font-size:12px;font-weight:750;background:#58ae9c12;width:34px;height:34px;display:grid;place-items:center;border-radius:10px}.intro-strip h3{font-size:13px;color:#cbdde6}.intro-strip p{font-size:12px;color:#7991a5}footer{color:#526d80;border-top:1px solid #ffffff06;margin-top:25px;font-size:9px}.panel{background:linear-gradient(140deg,#152737,#102130);border:1px solid #ffffff0c;border-radius:18px;box-shadow:0 10px 30px #00000012,0 1px 0 #ffffff03 inset}.section-label{font-size:9px;letter-spacing:1.7px;color:#7f98ad}.lobby{margin-top:55px;gap:50px}.lobby h1{font-size:52px}.lobby .panel{padding:26px}.room-number{font-size:34px;letter-spacing:6px;color:#f1ca83;font-variant-numeric:tabular-nums}.seat{padding:15px 0;border-color:#ffffff0b}.avatar{border-radius:11px;box-shadow:0 2px 0 #ffffff1c inset,0 4px 9px #0002;color:#fff;text-shadow:0 1px 2px #0003}.seat-empty{color:#668093}.seat-empty .avatar{background:#ffffff08!important;box-shadow:none;color:#648195;border:1px dashed #ffffff1a}.notice{border:1px solid #edbd6820;background:#e8b8540b;color:#c8b48d;border-radius:13px;font-size:12px;padding:15px}.room-header{padding:24px 28px 20px;gap:14px;max-width:1720px}.room-header h2{font-size:23px;letter-spacing:-.8px}.room-pill{border:1px solid #efbd6822;background:#e7b75d09;color:#e9c486;border-radius:8px;font-size:10px;letter-spacing:2px;padding:7px 10px}.room-header>.muted{font-size:11px}.table-layout{max-width:1720px;grid-template-columns:205px minmax(380px,1fr) 252px;gap:18px}.players-panel{padding:17px 14px}.player{margin:4px -3px;padding:13px 9px;border-radius:13px}.player.active{background:linear-gradient(90deg,#75d9ba14,#75d9ba04);border-color:#75d9ba35;box-shadow:0 0 25px #75d9ba05}.player.active .player-name{color:#a5edda}.player.active .avatar{outline:2px solid #a0dfc35c;outline-offset:3px}.player-name{font-size:12px;font-weight:650;max-width:92px}.player-points{font-family:inherit;font-weight:700;font-size:25px;font-variant-numeric:tabular-nums;color:#d9e9ed}.player-stats{color:#7894a8;font-size:10px;margin-top:10px}.player-badges{color:#e3c389;font-size:9px}.cost-list{border-top-color:#ffffff0b;margin-top:22px}.cost-line{color:#9bb2c2;font-size:10px;padding:8px 0}.board-panel{border:1px solid #80c6bc22;background:#0b2230;border-radius:21px;box-shadow:0 15px 45px #0003,0 0 0 5px #ffffff02;isolation:isolate}.board-heading{background:#0e2532dc;border-bottom:1px solid #9cd8c80d;padding:17px 21px;color:#7d9eac;font-size:10px;letter-spacing:.3px}.board-heading .eyebrow{color:#8ec9bb;font-size:9px}.board-scroll{background:radial-gradient(ellipse at 45% 42%,#21545b,#102d3c 58%,#0c2130);scrollbar-color:#3a6a704d transparent;scrollbar-width:thin;max-height:64vh;min-height:400px}#boardSvg{filter:drop-shadow(0 12px 5px #04131b55);max-height:650px}.tile{stroke:#122e36;stroke-width:2.8;filter:drop-shadow(0 2px 0 #061d26);transition:stroke .2s,filter .2s}.terrain{opacity:.82}.number-disc{fill:#f3e9d0;stroke:#cbbd9566;stroke-width:2;filter:drop-shadow(0 2px 1px #12293255)}.number-text{fill:#344039;font-family:inherit;font-weight:800;font-size:16px}.number-red{fill:#b85037}.number-dots{fill:#766a50;font-size:6px}.tile.eligible{stroke:#f5d18a;filter:drop-shadow(0 0 6px #edbd6866)}.tile.eligible:hover{stroke:#fff2c6;filter:brightness(1.16)}.building{stroke:#e9eee3;stroke-width:1.2;filter:drop-shadow(0 3px 0 #08202baa) drop-shadow(0 0 3px #ffffff30)}.v-eligible{fill:#f6d88b88;stroke:#ffdf98;stroke-width:2;filter:drop-shadow(0 0 5px #edbd6855)}.edge-eligible{stroke:#ffe0a0;stroke-width:6;opacity:.9;filter:drop-shadow(0 0 4px #edbd6877)}.v-hit:hover+.v-eligible{fill:#ffedbb}.port-label{fill:#b8d0c9;font-size:9px}.port-line{stroke:#b4cbb65c}.robber-piece{fill:#1e1d2c;stroke:#ffdd9a;stroke-width:2;filter:drop-shadow(0 3px 1px #0006)}.zoom-hint{padding:7px 12px 13px;color:#6e95a1;font-size:9px}.board-controls{bottom:10px;right:11px;gap:5px}.board-controls button{background:#163a47ed;border:1px solid #b1d2c624;color:#b9d8d8;border-radius:9px;box-shadow:0 3px 10px #0002;width:32px;height:30px;padding:0}.producing>.tile{animation:terrain-production 1.5s ease-in-out 2}.producing>.number-disc{stroke:#fff0a3;stroke-width:3}.turn-panel{background:linear-gradient(120deg,#193537,#152b37 60%,#132332);border-color:#85d8bd23;border-radius:17px;padding:18px 20px;position:relative;overflow:hidden}.turn-panel:before{content:"";position:absolute;top:18px;bottom:18px;left:0;width:3px;background:#6de0be;border-radius:5px}.turn-title{gap:14px}.turn-title h3{font-size:14px;letter-spacing:-.2px;color:#daeee9}.turn-title p{font-size:11px;line-height:1.6;color:#8eacb7;margin-top:5px;max-width:500px}.actions{gap:7px;margin-top:17px;padding-top:14px;border-top:1px solid #ffffff09}.actions button{font-size:10px;padding:10px 12px;border-radius:10px}.actions .selected{background:#efbd68;color:#352911;box-shadow:0 0 17px #efbd6822}.actions .end{background:#79d7bb;color:#12372d;box-shadow:0 4px 15px #79d7bb13}.actions [data-act=roll]{background:linear-gradient(130deg,#f8d99a,#e5af57);font-size:12px;padding:11px 21px}.hand-panel{padding:20px;border-radius:18px}.hand-header{margin-bottom:11px}.hand-header .muted{font-size:10px}.hand-header b{color:#c7dfd7;font-weight:650}.victory-progress{width:100%;height:3px;border-radius:10px;background:#ffffff07;margin:0 0 17px;overflow:hidden}.victory-progress>span{display:block;background:linear-gradient(90deg,#67c9ad,#e6bc70);height:100%;border-radius:10px;transition:width .4s ease}.resource-cards{gap:10px;perspective:700px}.resource-card{min-height:115px;background:linear-gradient(145deg,color-mix(in srgb,var(--resource) 27%,#152333),#142433 80%);border:1px solid color-mix(in srgb,var(--resource) 45%,transparent);border-bottom:3px solid var(--resource);border-radius:14px;padding:17px 7px 13px;box-shadow:0 7px 16px #0002,0 1px 0 #ffffff07 inset;transition:transform .2s,box-shadow .2s}.resource-card:hover{transform:translateY(-6px) rotateX(4deg);box-shadow:0 13px 25px #0004}.resource-card.empty{opacity:.38}.resource-card .symbol{font-size:31px;filter:drop-shadow(0 4px 4px #0003);margin-top:2px}.resource-card .resource-name{font-size:10px;color:#b9cbd4;font-weight:600;margin-top:10px}.resource-card strong{font-size:19px;top:8px;right:10px;color:#e3edf2;font-weight:750;font-variant-numeric:tabular-nums}.dev-card{background:linear-gradient(135deg,#2b2d39,#202837);border:1px solid #bfa5e22b;color:#c8b6ea;border-radius:12px;min-width:125px;padding:13px;font-size:11px}.dev-card span{color:#827e98}.dev-card:enabled:hover{border-color:#c6a1ff88;background:#303044}.bank-stock{font-size:10px;color:#708b9d;gap:11px;padding-top:12px;margin-top:16px;border-top:1px solid #ffffff08}.right-panel{padding:18px 16px;border-radius:18px}.events{font-size:11px;gap:13px;max-height:230px;padding-right:4px;scrollbar-width:thin;scrollbar-color:#ffffff16 transparent}.event{border-left-color:#ffffff10;color:#738e9e;padding-left:11px;line-height:1.6}.event:first-child{color:#b6d2d6;border-left-color:#78d6ba}.chat-panel{border-top-color:#ffffff0c;margin-top:23px;padding-top:21px}.chat-messages{font-size:11px;max-height:220px;scrollbar-width:thin;scrollbar-color:#ffffff16 transparent;color:#a7bfcc}.chat-message{background:#ffffff03;border:1px solid #ffffff04;border-radius:10px;padding:9px 10px;margin-bottom:7px}.chat-message b{font-size:10px;margin-bottom:3px;filter:brightness(1.4)}.chat-form{gap:6px}.chat-form input{background:#0a1b28;font-size:11px;border-radius:10px;padding:11px}.chat-form button{border-radius:10px;background:#1e4c4a;color:#9ee4cc;border:1px solid #74cbb32c;padding:8px 12px}.offer{background:#ffffff03;border-color:#ffffff10;border-radius:13px;padding:15px}.offer b{font-size:12px;color:#b9dfd1}.offer p{color:#8ea9ba}.offer-count{background:#efbd68}.winner-banner{background:radial-gradient(ellipse at top,#60512d55,#192f33);border:1px solid #edbd6840;box-shadow:0 8px 40px #e7bc6310;color:#ead7ab;border-radius:20px}.winner-banner h2{font-size:34px;background:linear-gradient(110deg,#f8dda2,#bde9d5);background-clip:text;-webkit-background-clip:text;color:transparent}.secret{background:#091925;border:1px solid #ffffff14;color:#a6d9c5;border-radius:11px;padding:16px;font-size:12px;line-height:1.7}.help-table th{color:#8ec9ba;font-size:10px;text-transform:uppercase;letter-spacing:1px}.help-table td,.help-table th{border-color:#ffffff0c;padding:12px 6px}.help-table td{color:#b5c7d0}.danger{color:#ef9a88}.status-instruction{color:#80cfb9}
/* Dialogs and notifications */
dialog{background:radial-gradient(ellipse at top left,#1c3d4160,transparent 60%),#112332;border:1px solid #93c5bd26;border-radius:25px;box-shadow:0 35px 120px #0009,0 1px 0 #ffffff0c inset;padding:32px;max-width:590px;color:#dbe9f1}dialog[open]{animation:modal-arrive .23s ease-out}dialog::backdrop{background:#030c17b0;backdrop-filter:blur(10px)}dialog h2{font-size:27px;letter-spacing:-.8px;padding-right:20px;margin-bottom:14px;color:#ecf7f7}dialog p{color:#93aebb;font-size:12px;line-height:1.8}dialog p b{color:#c7dedf}.modal-mark{height:38px;width:38px;background:#88d9c111;border:1px solid #88d9c121;color:#91ddc5;display:grid;place-items:center;border-radius:12px;font-size:23px;margin-bottom:17px}.modal-x{position:absolute;right:19px;top:18px;width:32px;height:32px;border:1px solid #ffffff10;border-radius:10px;background:#ffffff05;color:#8fa9bb;padding:0;font-size:23px;font-weight:400;box-shadow:none}.resource-input .symbol{background:#ffffff05;border-radius:10px;padding:10px 5px}.resource-input label{font-size:10px;color:#9eb4c2}.resource-input input{background:#0b1d2a;border-color:#ffffff10}.form-submit{width:100%;margin-top:20px}.select-resources{gap:9px}.toast-stack#toast{position:fixed;left:auto;right:24px;bottom:24px;transform:none;z-index:200;width:355px;max-width:calc(100vw - 32px);padding:0;background:none;box-shadow:none;border-radius:0;display:flex;flex-direction:column;gap:10px;pointer-events:none}.notification{--accent:#8ebfdd;position:relative;overflow:hidden;display:flex;align-items:flex-start;gap:12px;background:#192c3cf5;border:1px solid #ffffff15;border-left:3px solid var(--accent);border-radius:15px;padding:17px 13px 18px 15px;box-shadow:0 12px 40px #0005;backdrop-filter:blur(18px);pointer-events:auto;animation:toast-arrive .25s ease-out}.notification.success{--accent:#79d6b7}.notification.error{--accent:#f28b7c}.notification.warning{--accent:#eec477}.notification.turn{--accent:#efc578}.notification-icon{background:color-mix(in srgb,var(--accent) 15%,transparent);border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);color:var(--accent);width:30px;height:30px;display:grid;place-items:center;border-radius:10px;font-size:16px;font-weight:700;flex-shrink:0}.notification-body{flex:1;min-width:0}.notification-body strong{display:block;font-size:12px;color:#e2edf2;margin-bottom:5px}.notification-body p{font-size:11px;color:#98b0c0;line-height:1.6;margin:0;overflow-wrap:anywhere}.notification-close{background:none;color:#7892a4;font-size:19px;padding:0 3px;border:0;box-shadow:none;margin-top:-4px}.notification-progress{position:absolute;bottom:0;left:0;height:2px;width:100%;background:var(--accent);opacity:.4;animation:notification-time 5.5s linear forwards;transform-origin:left}.notification.error .notification-progress{animation-duration:8s}.notification.leaving{animation:toast-leave .2s ease-in forwards}
/* Six real CSS faces, each carrying its own dot pattern. */
.dice-summary{align-items:center;gap:7px;flex-shrink:0}.mini-die{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#fff1d5,#dbc69e);border:1px solid #f5e9d17a;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:6px;gap:2px;box-shadow:0 3px 0 #77634d,0 5px 9px #0003;transform:rotate(-7deg)}.mini-die.mini-1{transform:rotate(7deg);background:linear-gradient(135deg,#e5f1ee,#a4c6be);border-color:#d9f1e899;box-shadow:0 3px 0 #4d736b,0 5px 9px #0003}.pip{display:block;border-radius:50%;background:#273f42;opacity:0;box-shadow:0 1px 1px #0006 inset}.pip.visible{opacity:1}.die-unknown{grid-column:1/4;grid-row:1/4;place-self:center;color:#88795e;font-size:15px;font-weight:800}.dice-total{border-left:1px solid #ffffff13;padding-left:12px;margin-left:5px;font-size:27px;font-weight:750;color:#e6c68d;line-height:1;min-width:45px;font-variant-numeric:tabular-nums}.dice-total small{display:block;color:#7096a1;font-size:7px;letter-spacing:1.5px;margin-bottom:6px}.dice-overlay[hidden]{display:none!important}.dice-overlay{position:fixed;inset:0;z-index:110;display:grid;place-items:center;overflow:auto;padding:25px}.dice-scrim{position:absolute;inset:0;background:#040e1bbf;backdrop-filter:blur(13px)}.dice-presentation{position:relative;isolation:isolate;width:min(620px,100%);text-align:center;border:1px solid #9cd7c420;border-radius:32px;padding:35px 25px 27px;background:radial-gradient(ellipse at 50% 58%,#23555466,transparent 60%),linear-gradient(150deg,#132d3c,#0b1b2b);box-shadow:0 40px 150px #0008;animation:modal-arrive .25s ease-out}.dice-presentation>.eyebrow{color:#91d7bf;font-size:10px}.dice-presentation h2{font-size:31px;letter-spacing:-1.2px;margin:15px 0 0;color:#e8f2f4}.dice-presentation>p{font-size:12px;color:#7e9cae;min-height:38px;margin:3px auto 18px;max-width:390px}.dice-presentation>button{font-size:11px;color:#c3d9da;padding:11px 18px}.dice-arena{position:relative;display:flex;align-items:center;justify-content:center;gap:85px;height:215px;perspective:850px;perspective-origin:50% 35%}.dice-arena:before{content:"";position:absolute;width:75%;height:125px;bottom:9px;border:1px solid #8bd3c211;background:radial-gradient(ellipse,#68c8ae12,transparent 65%);border-radius:50%;transform:rotateX(55deg)}.dice-space{--dice-size:76px;--cube-depth:38px;position:relative;width:var(--dice-size);height:var(--dice-size);perspective:700px;perspective-origin:50% 40%;margin-top:-6px}.dice-toss{width:100%;height:100%;transform-style:preserve-3d}.dice-cube{height:100%;width:100%;position:relative;transform-style:preserve-3d;transform:rotateX(-12deg) rotateY(-16deg);transition:transform .55s cubic-bezier(.16,.85,.25,1)}.cube-face{position:absolute;inset:0;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:14px;gap:5px;border-radius:13px;background:linear-gradient(135deg,#fff2db,#d6bf98);border:1px solid #fff2d4;backface-visibility:hidden;box-shadow:0 0 12px #a1875940 inset,0 0 1px #b49964}.cube-face .pip{background:#34494a;box-shadow:0 2px 2px #0007 inset}.die-1 .cube-face{background:linear-gradient(135deg,#e5f4ec,#9abeb5);border-color:#c4e2d3;box-shadow:0 0 15px #729f9740 inset}.face-1{transform:translateZ(var(--cube-depth))}.face-6{transform:rotateY(180deg) translateZ(var(--cube-depth))}.face-2{transform:rotateX(90deg) translateZ(var(--cube-depth))}.face-5{transform:rotateX(-90deg) translateZ(var(--cube-depth))}.face-3{transform:rotateY(90deg) translateZ(var(--cube-depth))}.face-4{transform:rotateY(-90deg) translateZ(var(--cube-depth))}.dice-shadow{position:absolute;inset:auto -15px -35px;height:22px;background:#01070e75;border-radius:50%;filter:blur(7px);transform:scale(1.2)}.rolling .dice-cube{animation:dice-spin 1s linear infinite}.rolling .die-1 .dice-cube{animation-name:dice-spin-other;animation-duration:.85s}.rolling .dice-toss{animation:dice-bounce .6s ease-in-out infinite}.rolling .die-1 .dice-toss{animation-delay:-.27s}.rolling .dice-shadow{animation:shadow-bounce .6s ease-in-out infinite}.rolling .die-1 .dice-shadow{animation-delay:-.27s}.landed .dice-toss{animation:dice-land .45s ease-out}.roll-result{font-size:56px;line-height:1;min-height:60px;margin-top:-13px;color:#edcb8a;font-weight:750;letter-spacing:-2px;font-variant-numeric:tabular-nums}.landed .roll-result{animation:result-arrive .35s ease-out}.dice-playing{overflow:hidden}[data-busy=true] [data-act]{cursor:wait;opacity:.5;pointer-events:none}
@keyframes dice-spin{0%{transform:rotateX(0) rotateY(0) rotateZ(0)}100%{transform:rotateX(720deg) rotateY(540deg) rotateZ(180deg)}}@keyframes dice-spin-other{0%{transform:rotateX(90deg) rotateY(30deg) rotateZ(0)}100%{transform:rotateX(-630deg) rotateY(-510deg) rotateZ(180deg)}}@keyframes dice-bounce{0%,100%{transform:translateY(8px) rotateZ(-9deg)}50%{transform:translateY(-35px) rotateZ(12deg)}}@keyframes dice-land{0%{transform:translateY(-20px)}55%{transform:translateY(7px)}78%{transform:translateY(-4px)}100%{transform:translateY(0)}}@keyframes shadow-bounce{50%{transform:scale(.7);opacity:.3}}@keyframes result-arrive{from{opacity:0;transform:scale(.7) translateY(7px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modal-arrive{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toast-arrive{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes toast-leave{to{opacity:0;transform:translateX(20px)}}@keyframes notification-time{to{transform:scaleX(0)}}@keyframes terrain-production{0%,100%{filter:brightness(1)}50%{filter:brightness(1.4) drop-shadow(0 0 6px #fff1b8)}}
@media(min-width:1600px){.table-layout{grid-template-columns:220px minmax(400px,1fr) 270px}.board-scroll{max-height:67vh}.hero-art{max-height:650px}}
@media(max-width:1150px){.table-layout{grid-template-columns:175px minmax(320px,1fr);gap:14px}.right-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:25px}.right-panel .chat-panel{border:0;margin:0;padding:0}.hero{gap:35px;padding:45px 30px}.hero h1{font-size:59px}.player-name{max-width:75px;font-size:11px}.players-panel{padding:14px 11px}.player-stats{margin-left:0}.turn-title p{max-width:320px}.dice-total{font-size:24px}.mini-die{width:29px;height:29px}.room-header .button-row{gap:5px}.room-header .button-row button{font-size:10px}}
@media(max-width:760px){.topbar{height:66px;padding:0 16px}.brand{font-size:28px}.connection{font-size:9px;padding:6px 8px}.top-actions{gap:7px}.top-actions button{padding:8px;font-size:10px}.hero{padding:35px 22px 25px;gap:30px}.hero h1{font-size:53px;letter-spacing:-2.8px}.hero-copy>p{font-size:13px}.facts{gap:20px}.hero-art{border-radius:24px;max-height:420px;width:100%;transform:rotate(-1deg);margin-top:8px}.hero-art:after{inset:13px;border-radius:15px}.hero-art svg{transform:rotate(1deg)}.entry-card{border-radius:18px;padding:21px}.intro-strip{margin-top:20px;padding:24px}.step-number{width:28px;height:28px;font-size:10px}.intro-strip h3{font-size:12px}.intro-strip p{font-size:11px}.lobby{margin-top:30px;padding:0 20px}.lobby h1{font-size:42px;letter-spacing:-2px}.lobby .panel{padding:22px}.room-number{font-size:29px}.room-header{padding:20px 14px 15px;gap:9px}.room-header h2{font-size:19px}.room-header>.muted{font-size:9px}.room-header .button-row{width:100%;margin-left:0;margin-top:3px}.room-header .button-row button{font-size:10px;padding:7px 11px}.table-layout{display:flex;gap:12px;padding:0 10px}.players-panel{padding:7px;border-radius:15px;gap:4px}.player{padding:8px 6px;min-width:105px;margin:0;border-radius:10px}.player-name{font-size:10px;max-width:59px}.avatar{width:24px;height:24px;border-radius:8px;font-size:10px}.player-points{font-size:22px}.player-stats{font-size:9px;margin-top:7px;gap:8px}.player-badges{font-size:8px}.board-panel{border-radius:17px}.board-heading{padding:13px 14px;font-size:8px}.board-heading .eyebrow{font-size:8px;letter-spacing:1.5px}.board-scroll{min-height:310px;max-height:58vh}#boardSvg{min-width:400px;max-height:none}.zoom-hint{font-size:8px;padding-top:6px;padding-bottom:13px;max-width:75%}.board-controls{bottom:10px;right:9px}.board-controls button{width:28px;height:27px;font-size:11px}.turn-panel{padding:16px 14px;border-radius:15px}.turn-title{gap:10px;align-items:flex-start}.turn-title h3{font-size:12px}.turn-title p{font-size:10px;max-width:none;line-height:1.6}.dice-summary{gap:5px;margin-top:2px}.mini-die{width:24px;height:24px;border-radius:6px;padding:4px;gap:2px;box-shadow:0 2px 0 #77634d}.mini-die.mini-1{box-shadow:0 2px 0 #4d736b}.dice-total{font-size:21px;padding-left:7px;margin-left:3px;min-width:30px}.dice-total small{font-size:6px;letter-spacing:1px;margin-bottom:4px}.actions{margin-top:13px;padding-top:12px;gap:6px}.actions button{font-size:10px;padding:10px 11px}.actions [data-act=roll]{font-size:11px;padding:11px 16px}.actions .end{margin-left:auto}.hand-panel{padding:15px;border-radius:15px}.hand-header{align-items:flex-start;gap:12px}.hand-header .section-label{font-size:8px;white-space:nowrap;letter-spacing:1px}.hand-header .muted{font-size:9px;text-align:right;max-width:170px}.victory-progress{margin-bottom:14px}.resource-cards{gap:6px}.resource-card{min-height:94px;padding:15px 4px 10px;border-radius:11px}.resource-card .symbol{font-size:25px;margin-top:4px}.resource-card strong{font-size:16px;top:5px;right:7px}.resource-card .resource-name{font-size:8px;margin-top:9px}.dev-card{font-size:10px;min-width:110px;padding:12px}.bank-stock{gap:9px;font-size:9px}.right-panel{padding:17px;display:block;border-radius:15px}.right-panel .chat-panel{border-top:1px solid #ffffff0c;margin-top:20px;padding-top:19px}.events{max-height:135px;font-size:10px}.chat-messages{max-height:170px}.chat-message{font-size:11px}.dice-presentation{padding:30px 18px 23px;border-radius:25px}.dice-presentation h2{font-size:25px;letter-spacing:-.8px}.dice-arena{height:205px;gap:63px}.dice-space{--dice-size:65px;--cube-depth:32.5px}.cube-face{padding:12px;gap:4px;border-radius:11px}.roll-result{font-size:50px}.dice-presentation>p{font-size:11px}.dice-overlay{padding:18px}.toast-stack#toast{right:14px;bottom:14px;max-width:calc(100vw - 28px);width:340px}.notification{border-radius:13px;padding:14px 11px 16px 12px;gap:10px}.notification-body strong{font-size:11px}.notification-body p{font-size:10px}dialog{padding:25px 22px;border-radius:22px}dialog h2{font-size:24px}.select-resources{gap:6px}.resource-input .symbol{font-size:20px;padding:8px 3px}.resource-input input{padding:9px 3px}.resource-input label{font-size:9px}.modal-mark{width:34px;height:34px;font-size:21px}.modal-x{top:15px;right:15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hero-art,.resource-card:hover{transform:none}.rolling .dice-cube{transform:rotateX(-12deg) rotateY(-16deg)}.notification-progress{display:none}}

/* Development cards — persistent market and private hand. */
.development-section{margin-top:23px;padding-top:21px;border-top:1px solid #ffffff0b}.development-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:17px}.development-heading .section-label{color:#aacbbf;font-size:10px}.development-heading p{font-size:11px;color:#7898aa;margin-top:5px}.development-heading button{flex-shrink:0;font-size:10px}.development-market{display:flex;align-items:center;gap:19px;border:1px solid #d6b46e20;border-radius:15px;background:radial-gradient(ellipse at left,#ba995611,transparent 70%),#0b1c28;padding:20px 18px;min-height:126px}.development-deck{position:relative;width:63px;height:85px;flex-shrink:0;perspective:500px;transform:rotate(-7deg);margin:0 2px}.development-deck>span{position:absolute;inset:0;border:1px solid #b4d0bb42;border-radius:8px;background:repeating-linear-gradient(45deg,#285550 0px,#285550 1px,#20453f 1px,#20453f 7px);box-shadow:0 5px 10px #0004;transform:translate(5px,-4px) rotate(8deg)}.development-deck>span:nth-child(2){transform:translate(-3px,1px) rotate(-4deg)}.development-deck>span:last-child{transform:none;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse,#2a6355,#173b36);box-shadow:0 1px 0 #ffffff10 inset,0 6px 12px #0004}.development-deck>span:last-child:after{content:"";position:absolute;inset:5px;border:1px solid #e4c98d32;border-radius:4px}.development-deck b{font-size:34px;line-height:1.3;color:#e4cc94;font-weight:400}.development-deck small{font-size:5px;letter-spacing:1.2px;color:#cfcaab;font-weight:700}.development-market-copy{flex:1;min-width:0}.development-market-copy>strong{display:block;font-size:12px;color:#dce9e4}.development-market-copy>strong>span{display:inline-block;margin-left:6px;background:#d6b77412;color:#d8bd88;border:1px solid #e9cf8f18;padding:3px 6px;border-radius:5px;font-size:9px;font-weight:500;white-space:nowrap}.development-cost{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;color:#7995a7;font-size:10px}.development-cost>span{color:#afc2c8;white-space:nowrap}.development-market-copy>p{font-size:10px;color:#7f9aab;margin-top:7px;line-height:1.6}.development-buy{flex-shrink:0;font-size:11px;padding:11px 15px;border-radius:11px}.development-buy:disabled{opacity:.45}.development-hand-label{font-size:10px;color:#98b4c3;margin-top:19px;margin-bottom:12px;font-weight:650;display:flex;gap:7px;align-items:center}.development-hand-label>span{font-size:9px;border:1px solid #ffffff12;border-radius:5px;background:#ffffff05;padding:2px 5px;color:#bcd1d7}.development-hand{display:flex;gap:12px;overflow-x:auto;padding:5px 3px 15px;scrollbar-width:thin;scrollbar-color:#b6cbbb22 transparent;perspective:800px;scroll-snap-type:x proximity}.type-knight{--dev-tone:#d8b879}.type-roads{--dev-tone:#83c9b4}.type-plenty{--dev-tone:#91b9de}.type-monopoly{--dev-tone:#c6a1dc}.type-vp{--dev-tone:#efcc78}.development-card{width:166px;min-width:166px;min-height:244px;display:flex;flex-direction:column;text-align:left;padding:14px 13px 0;border-radius:13px;background:linear-gradient(150deg,#26373c,#162a35);border:1px solid #ffffff19;box-shadow:0 5px 15px #0003;color:#e0e9ea;scroll-snap-align:start;overflow:hidden;position:relative;transition:transform .2s,border-color .2s,box-shadow .2s}.development-card:before{content:"";position:absolute;inset:5px;border:1px solid #ffffff05;border-radius:9px;pointer-events:none}.development-card.playable{border-color:#79d7b855;box-shadow:0 0 16px #79d7b809,0 6px 15px #0003}.development-card:hover:enabled{transform:translateY(-4px) rotateX(3deg);border-color:var(--dev-tone);box-shadow:0 12px 24px #0004}.development-card-tag{font-size:7px;letter-spacing:1.8px;color:var(--dev-tone);font-weight:700}.development-card-art{display:grid;place-items:center;height:80px;align-self:stretch;font-family:Georgia,serif;font-size:54px;color:var(--dev-tone);font-weight:400;line-height:1;filter:drop-shadow(0 4px 2px #0004);background:radial-gradient(ellipse,color-mix(in srgb,var(--dev-tone) 10%,transparent),transparent 65%);margin:5px -3px 6px}.development-card>strong{font-size:12px;letter-spacing:-.2px;margin-bottom:8px;color:#e2eceb}.development-card-description{font-size:9px;color:#91aab6;line-height:1.7;font-weight:400;flex:1;min-height:60px}.development-card-status{display:block;align-self:stretch;margin:13px -13px 0;padding:10px 12px;min-height:43px;border-top:1px solid #ffffff0a;background:#00000012;font-size:8px;line-height:1.5;color:#7d96a3;font-weight:500}.playable .development-card-status{color:#8cddbd;background:#6ed6ad09}.type-vp .development-card-status{color:#ddc98d}.development-empty{display:flex;align-items:center;gap:13px;border:1px dashed #ffffff12;border-radius:12px;padding:19px;color:#91a9b6}.development-empty>span{font-size:29px;color:#567c81}.development-empty p{font-size:11px;line-height:1.6}.development-empty small{display:block;font-size:10px;color:#607f91;margin-top:3px}.development-guide{display:flex;flex-direction:column;gap:10px;margin:20px 0}.development-guide-row{display:flex;gap:13px;align-items:flex-start;border:1px solid #ffffff0b;border-radius:13px;padding:14px;background:#ffffff02}.development-guide-icon{display:grid;place-items:center;width:37px;height:44px;flex-shrink:0;background:#ffffff04;border:1px solid #ffffff08;border-radius:9px;font-family:Georgia,serif;font-size:27px;color:var(--dev-tone)}.development-guide-row>div{flex:1}.development-guide-row h3{color:var(--dev-tone);font-size:12px}.development-guide-row p{font-size:11px;line-height:1.7;margin:5px 0}.development-guide-row small{font-size:10px;color:#687f90;line-height:1.6;display:block}.development-guide-row>b{font-size:14px;color:#98adaf}.development-detail-art{font-family:Georgia,serif;color:var(--dev-tone);font-size:75px;text-align:center;border:1px solid #ffffff0b;border-radius:16px;background:radial-gradient(ellipse,#ffffff05,transparent);padding:18px;margin:18px 0}
@media(max-width:760px){.development-section{margin-top:19px;padding-top:18px}.development-heading{gap:10px;margin-bottom:13px}.development-heading .section-label{font-size:9px;letter-spacing:1.2px}.development-heading p{font-size:9px;max-width:180px}.development-heading button{font-size:9px;padding:7px 9px}.development-market{padding:16px 13px;gap:14px;flex-wrap:wrap;border-radius:13px;min-height:120px}.development-deck{width:48px;height:68px;margin-left:3px}.development-deck b{font-size:27px}.development-deck small{font-size:4px;letter-spacing:.8px}.development-market-copy{flex:1;min-width:160px}.development-market-copy>strong{font-size:11px}.development-market-copy>strong>span{font-size:8px}.development-cost{font-size:9px;margin-top:7px;gap:4px}.development-market-copy>p{font-size:9px;margin-top:6px}.development-buy{width:100%;padding:11px;font-size:11px}.development-hand{gap:10px;padding-bottom:12px}.development-card{width:154px;min-width:154px;min-height:239px;padding:13px 12px 0}.development-card-tag{font-size:7px}.development-card-art{height:75px;font-size:51px}.development-card-description{font-size:9px;min-height:61px}.development-card-status{margin:12px -12px 0;padding:10px 11px;font-size:8px}.development-empty{padding:15px 13px}.development-empty p{font-size:10px}.development-empty small{font-size:9px}.development-guide-row{padding:12px 10px;gap:10px}.development-guide-row p{font-size:10px}.development-guide-row small{font-size:9px}}

/* Board result and per-device settings */
.number-hit>.number-disc{fill:#fff4a6;stroke:#fff3bd;stroke-width:4;filter:drop-shadow(0 0 10px #ffd267) drop-shadow(0 0 3px #fff6c5);animation:number-disc-flash .8s ease-in-out infinite}.number-hit>.number-text{fill:#192f36;font-size:21px;font-weight:900;paint-order:stroke;stroke:#fff1a8;stroke-width:1px}.number-hit>.tile{stroke:#e8c365;stroke-width:3.8;filter:brightness(1.16) drop-shadow(0 0 7px #edbd6855)}.number-hit>.number-dots{fill:#665025}.number-blocked>.number-disc{stroke:#e9a588;stroke-dasharray:4 2}.settings-gear{width:36px;height:36px;padding:0;font-size:21px;border-radius:11px;line-height:1;color:#a9c9c5}.settings-gear:hover:enabled{color:#f2cf8f;transform:rotate(22deg)}#settingsDialog{max-width:560px}#settingsDialog h2{font-size:25px}.preference-section{font-size:9px;letter-spacing:2px;font-weight:700;color:#82bfae;margin:24px 0 10px}.preference-row{display:flex;align-items:center;gap:12px;position:relative;margin:0;border-bottom:1px solid #ffffff08;padding:15px 0;cursor:pointer;font-weight:400}.preference-row>span:first-child{flex:1}.preference-row strong{display:block;color:#cadfe5;font-size:12px;font-weight:650}.preference-row small{display:block;color:#7895a6;font-size:10px;margin-top:4px;line-height:1.6}.preference-row>input{position:absolute;right:0;width:40px;height:28px;margin:0;opacity:0;cursor:pointer;z-index:1}.preference-switch{position:relative;width:39px;height:23px;background:#2b3d4a;border:1px solid #ffffff10;border-radius:30px;transition:background .15s;flex-shrink:0}.preference-switch:after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;background:#8ba0ad;border-radius:50%;transition:transform .15s,background .15s;box-shadow:0 2px 4px #0004}.preference-row>input:checked+.preference-switch{background:#4a967f;border-color:#83d4b84d}.preference-row>input:checked+.preference-switch:after{background:#e1f5ed;transform:translateX(16px)}.preference-row>input:focus-visible+.preference-switch{outline:2px solid #efc578;outline-offset:3px}.preference-slider{margin:17px 0;color:#92acb9;font-weight:400}.preference-slider>span{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-bottom:12px}.preference-slider b{color:#b8daca;font-size:11px;background:#8ed3b90b;padding:4px 7px;border-radius:6px;font-variant-numeric:tabular-nums}.preference-slider input{width:100%;padding:0;border:0;box-shadow:none;accent-color:#83d6b8;cursor:pointer;background:transparent;height:22px}.preference-subgroup{border:1px solid #ffffff09;background:#ffffff02;border-radius:12px;padding:0 13px;margin:13px 0}.preference-subgroup .preference-row:last-child{border-bottom:0}.preference-subgroup .preference-row{padding:12px 0}.preference-note{background:#ffffff03;border:1px solid #ffffff07;border-radius:12px;padding:13px;margin:20px 0 15px!important;font-size:10px!important;line-height:1.7;color:#78919f!important}[data-animations=off] *,[data-animations=off] *::before,[data-animations=off] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}[data-animations=off] .resource-card:hover,[data-animations=off] .development-card:hover,[data-animations=off] .settings-gear:hover{transform:none!important}[data-highlight=off] .number-hit>.number-disc{animation:none;filter:none;fill:#f3e9d0;stroke:#cbbd9566;stroke-width:2}[data-highlight=off] .number-hit>.number-text{font-size:16px;stroke:none}[data-highlight=off] .number-hit>.tile{filter:none;stroke:#122e36;stroke-width:2.8}
@keyframes number-disc-flash{0%,100%{filter:drop-shadow(0 0 4px #ffd267);fill:#f5d78b}50%{filter:drop-shadow(0 0 16px #ffd267) drop-shadow(0 0 6px #fff8c9);fill:#fffbdc}}
@media(max-width:760px){.settings-gear{width:31px;height:31px;font-size:19px!important;padding:0!important}.top-actions{gap:5px}.top-actions .connection{font-size:8px;padding:6px}.top-actions #helpBtn{font-size:9px;padding:8px 7px}#settingsDialog h2{font-size:23px}.preference-row strong{font-size:11px}.preference-row small{font-size:9px}.preference-row{padding:14px 0}.preference-section{margin-top:22px}.preference-subgroup{padding:0 11px}.preference-slider>span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.number-hit>.number-disc{animation:none!important;filter:drop-shadow(0 0 5px #ffd267)}}

/* Undo placement control */
.actions .undo-placement{color:#e7c998;background:#d8b46b0b;border:1px solid #d8b46b3a;margin-right:auto}.actions .undo-placement:hover:enabled{background:#d8b46b18;border-color:#e7c99877}