:root{color:#152018;background:#0d1512;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body{margin:0;min-width:320px;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;touch-action:manipulation}#app{width:100%;height:100dvh;overflow:hidden}button,input{font:inherit;touch-action:manipulation}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.72}.landing{position:relative;height:100dvh;display:grid;grid-template-columns:minmax(320px,650px);align-items:center;justify-content:center;padding:clamp(20px,4vw,54px) clamp(18px,6vw,88px);overflow:hidden;background:linear-gradient(116deg,#0b1411,#132019 42%,#24131a),#0d1512}.landing:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(120deg,transparent 0 46%,rgba(255,255,255,.055) 46% 47%,transparent 47% 100%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.032) 1px,transparent 1px);background-size:220px 220px,44px 44px,44px 44px;-webkit-mask-image:linear-gradient(90deg,#000000b8,#00000038);mask-image:linear-gradient(90deg,#000000b8,#00000038)}.landing:after{content:"";position:absolute;inset:9% 0 auto auto;width:42vw;height:78vh;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(19,161,153,.16),transparent),linear-gradient(180deg,transparent,rgba(249,115,22,.12),transparent);clip-path:polygon(34% 0,100% 0,66% 100%,0 100%);opacity:.75}.landing-3d{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;opacity:.72;filter:blur(3px);transform:scale(1.015);pointer-events:none}.landing-3d canvas{width:100%;height:100%;display:block}.hero{position:relative;z-index:1;width:min(650px,100%);justify-self:center;display:grid;gap:18px}.brand{display:flex;align-items:center;gap:18px}.brand-logo{width:78px;height:78px;flex:0 0 auto;filter:drop-shadow(0 20px 34px rgba(0,0,0,.38))}.eyebrow{margin:0 0 6px;color:#8bb8a3;font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1{margin:0;color:#fffaf0;font-size:clamp(3.2rem,7vw,7.4rem);line-height:.86;letter-spacing:0}.hero-copy{max-width:580px;margin:-4px 0 2px;color:#c5d3c6;font-size:clamp(1.02rem,1.8vw,1.22rem);line-height:1.45;font-weight:750}.lobby-card,.panel{background:#fffaf0;border:1px solid rgba(255,255,255,.14);border-radius:8px;box-shadow:0 24px 70px #00000047}.lobby-card{display:grid;gap:15px;padding:20px;border-color:#ffffff2e;background:linear-gradient(180deg,#ffffffeb,#fffaf0d6)}.avatar-picker{min-width:0;margin:0;padding:0;border:0}.avatar-picker legend{margin:0 0 8px;color:#536452;font-size:.9rem;font-weight:800}.avatar-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.avatar-option{min-width:0;min-height:74px;display:grid;place-items:center;gap:3px;padding:8px 6px;border:1px solid #d9dfd5;border-radius:8px;color:#111a15;background:#fff;box-shadow:none;font-weight:800}.avatar-option.selected{border-color:#f97316;background:#fff1d7;box-shadow:inset 0 0 0 1px #f9731633}.avatar-option span{font-size:1.75rem;line-height:1}.avatar-option small{max-width:100%;overflow:hidden;color:#172018;font-size:.82rem;font-weight:750;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}label{display:grid;gap:8px;color:#536452;font-size:.9rem;font-weight:700}input{width:100%;min-height:48px;padding:0 14px;border:1px solid #bdcbb8;border-radius:6px;color:#172018;background:#fff;outline:none}input:focus{border-color:#0e938b;box-shadow:0 0 0 3px #0e938b29}.lobby-actions,.join-row,.room-tools{display:flex;gap:10px}.join-row input{text-transform:uppercase}.primary,.secondary,.ghost,.room-code-button{min-height:44px;border:0;border-radius:6px;padding:0 16px;font-weight:800}.primary{color:#fff;background:linear-gradient(135deg,#111a15,#0b2d27);box-shadow:0 12px 28px #05120f47}.secondary{color:#12342e;background:#e7efe8;border:1px solid rgba(18,52,46,.12)}.ghost{color:#334238;background:transparent;border:1px solid #c7d4c3}.shell{position:relative;height:100dvh;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px;padding:12px 16px 16px;overflow:hidden;background:#eef3ec}.toast{position:fixed;left:50%;bottom:18px;z-index:30;max-width:min(520px,calc(100vw - 32px));transform:translate(-50%);padding:11px 16px;border:1px solid #f2b8c5;border-radius:999px;color:#7d1230;background:#ffe4ea;box-shadow:0 14px 38px #4c1e2b2e;font-weight:900;text-align:center;animation:toast-in .18s ease-out}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-items:center;padding:18px;background:#141f1852;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.game-over-modal{position:relative;z-index:2;width:min(360px,calc(100vw - 32px));display:grid;gap:14px;padding:22px;border:1px solid #cbd8c7;border-radius:8px;background:#fffdf7;box-shadow:0 28px 80px #121f1842;text-align:center}.game-over-modal h2{margin:0;color:#172018;font-size:2.1rem;line-height:1}.result-list{display:grid;gap:8px}.result-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 10px;border-radius:6px;background:#edf5e9;color:#344536}.result-row strong{color:#172018;font-size:1.35rem}.fireworks{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.fireworks span{position:absolute;width:8px;height:8px;left:var(--x);top:var(--y);border-radius:999px;background:var(--c);box-shadow:0 -34px 0 var(--c),24px -24px 0 var(--c),34px 0 0 var(--c),24px 24px 0 var(--c),0 34px 0 var(--c),-24px 24px 0 var(--c),-34px 0 0 var(--c),-24px -24px 0 var(--c);animation:firework-pop 1.35s ease-out infinite}.fireworks span:nth-child(1){--x: 22%;--y: 28%;--c: #e11d48}.fireworks span:nth-child(2){--x: 76%;--y: 24%;--c: #0891b2;animation-delay:.2s}.fireworks span:nth-child(3){--x: 70%;--y: 70%;--c: #ea580c;animation-delay:.38s}.fireworks span:nth-child(4){--x: 30%;--y: 74%;--c: #16a34a;animation-delay:.58s}.fireworks span:nth-child(5){--x: 50%;--y: 18%;--c: #7c3aed;animation-delay:.74s}@keyframes firework-pop{0%{opacity:0;transform:scale(.15)}25%{opacity:1}to{opacity:0;transform:scale(1.65)}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px}.topbar-brand{min-width:0;display:flex;align-items:center;gap:10px}.game-logo{width:42px;height:42px;flex:0 0 auto}.topbar .eyebrow{margin:0;color:#60705f;line-height:1}.topbar h1{color:#172018;font-size:clamp(1.55rem,2.4vw,2.2rem);line-height:.95}.room-tools{min-width:0;align-items:center;flex-wrap:nowrap;justify-content:flex-end}.room-code-button{min-width:132px;display:inline-flex;align-items:center;justify-content:center;gap:8px;color:#102b25;background:#e5eee1;border:1px solid #c8d6c2;white-space:nowrap}.room-code-button small{color:#60705f;font-size:.72rem;font-weight:950;letter-spacing:0;text-transform:uppercase}.room-code-button span{font-size:clamp(1.35rem,2.7vw,2.25rem);font-weight:950;letter-spacing:.08em}.share-icon{width:22px;height:22px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.pill{min-height:38px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;color:#611326;background:#f9d7de;font-weight:900}.game-layout{min-height:0;height:100%;display:grid;grid-template-columns:250px minmax(0,1fr);gap:12px;align-items:stretch}.panel{padding:16px}.scoreboard,.side-controls{align-self:start;display:grid;gap:14px}.side-controls{margin-top:8px;padding-top:14px;border-top:1px solid #d8e2d4}.player{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;padding:10px;border:1px solid transparent;border-radius:8px}.player.active{border-color:color-mix(in srgb,var(--player, #176b5d) 70%,#ffffff);background:color-mix(in srgb,var(--player, #176b5d) 12%,#fffdf7);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--player, #176b5d) 16%,transparent)}.marker{width:42px;height:42px;display:grid;place-items:center;color:var(--player);background:#fff;border:2px solid color-mix(in srgb,var(--player, #176b5d) 55%,#ffffff);border-radius:8px;font-size:28px;font-weight:900}.avatar-marker{color:#172018;font-size:1.55rem}.player strong,.player span{display:block}.player span{margin-top:3px;color:#697967;font-size:.9rem}.waiting,.hint,.error{color:#5c6f5d;line-height:1.35}.error{color:#8f1230;background:#ffe2e8;border-radius:6px;padding:10px;font-weight:700}.board-wrap{min-height:0;height:100%;overflow:hidden;display:grid;place-items:center;border-top:1px solid #cbd8c7;border-bottom:1px solid #cbd8c7}.board{width:100%;max-width:100%;max-height:100%;aspect-ratio:1000 / 720;filter:drop-shadow(0 18px 34px rgba(34,47,35,.16));touch-action:manipulation}.board rect{fill:#fffdf7;stroke:#c7d4c2;stroke-width:2}.triangle-fill{fill:color-mix(in srgb,var(--player) 16%,transparent)}.line,.candidate-line{stroke-linecap:round;vector-effect:non-scaling-stroke}.line{stroke:var(--player);stroke-width:3.5}.candidate-line{stroke:#176b5d38;stroke-width:2;stroke-dasharray:8 10;pointer-events:none}.candidate-line.active-preview{stroke:#176b5d61;stroke-width:2.6;animation:dash-flow .75s linear infinite}@keyframes dash-flow{to{stroke-dashoffset:-18}}.point{stroke:#fffaf0;stroke-width:5;transition:r .12s ease,stroke .12s ease}.point-target{fill:transparent;stroke:transparent;pointer-events:all;r:24}.point-hit{cursor:pointer}.point:hover,.point.selected{r:23;stroke:#172018}.dice{width:108px;height:108px;display:grid;place-items:center;justify-self:center;color:#172018;background:color-mix(in srgb,var(--turn-player, #d9464f) 10%,#ffffff);border:2px solid color-mix(in srgb,var(--turn-player, #d9464f) 82%,#172018);border-radius:8px;box-shadow:8px 8px color-mix(in srgb,var(--turn-player, #d9464f) 78%,#ffffff);font-size:3.8rem;font-weight:900;transform-origin:center}.dice.rolling{animation:dice-roll .72s cubic-bezier(.18,.8,.28,1)}@keyframes dice-roll{0%{transform:translateY(0) rotate(0) scale(1)}24%{transform:translateY(-18px) rotate(-14deg) scale(1.05)}52%{transform:translateY(4px) rotate(16deg) scale(.98)}76%{transform:translateY(-7px) rotate(-7deg) scale(1.02)}to{transform:translateY(0) rotate(0) scale(1)}}.turn-copy{display:grid;justify-items:center;gap:4px;color:#60705f}.turn-copy strong{color:#172018;font-size:2.4rem}.turn-copy.pulse strong{animation:line-counter-pulse .72s ease}@keyframes line-counter-pulse{0%,to{transform:scale(1)}45%{transform:scale(1.15)}}@media(max-width:940px){.landing{grid-template-columns:1fr}.hero{width:100%}.landing-3d{opacity:.72}.game-layout{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden}.scoreboard{grid-template-columns:repeat(2,minmax(0,1fr))}.side-controls{grid-template-columns:120px 1fr;align-items:center;align-self:stretch}.dice{width:86px;height:86px;font-size:3rem}}@media(max-width:620px){.shell,.landing{padding:12px}.lobby-actions,.join-row{display:grid}.brand{gap:12px}.brand-logo{width:58px;height:58px}h1{font-size:clamp(3rem,18vw,4.8rem)}.hero-copy{font-size:.98rem}.lobby-card{gap:12px;padding:14px}.avatar-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.avatar-option{min-height:58px;padding:6px 4px}.avatar-option span{font-size:1.45rem}.avatar-option small{font-size:.72rem}.topbar{display:grid;grid-template-columns:1fr}.room-tools{justify-content:stretch}.room-code-button{max-width:none}.scoreboard,.side-controls{grid-template-columns:1fr}}@media(max-height:520px)and (orientation:landscape){.shell{gap:8px;padding:8px}.topbar{align-items:center}.topbar h1{font-size:1.8rem}.ghost,.room-code-button,.pill{min-height:34px}.game-layout{grid-template-columns:210px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:8px}.panel{padding:8px}.scoreboard,.side-controls{align-self:stretch;grid-template-columns:1fr;align-content:start;gap:8px}.player{grid-template-columns:34px 1fr;padding:6px}.marker{width:34px;height:34px;font-size:22px}.dice{width:72px;height:72px;font-size:2.5rem}}@media(max-width:620px)and (orientation:portrait){.shell{gap:6px;padding:8px;grid-template-rows:auto minmax(0,1fr)}.topbar{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:8px}.topbar-brand{display:none}.topbar .ghost{min-height:34px;padding:0 10px}.topbar .eyebrow,.topbar h1{display:none}.topbar h1{font-size:1.85rem}.room-tools{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px;justify-content:stretch}.room-code-button,.pill{min-height:34px}.room-code-button{min-width:0;padding:0 10px;gap:5px}.room-code-button small{font-size:.62rem}.room-code-button span{font-size:1.1rem;letter-spacing:.06em}.share-icon{width:18px;height:18px}.pill{padding:0 10px;white-space:nowrap}.game-layout{gap:0;grid-template-rows:auto minmax(0,1fr);min-height:0}.scoreboard{order:1;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"active controls" "rival controls";align-items:center;gap:6px;padding:6px}.player{grid-template-columns:28px minmax(0,1fr);gap:6px;padding:4px}.player.active{grid-area:active}.player:not(.active){grid-area:rival;min-height:28px;padding-block:2px;opacity:.72;background:transparent}.marker{width:28px;height:28px;font-size:19px}.player:not(.active) .marker{width:22px;height:22px;font-size:15px;border-width:1px}.player:not(.active) strong,.player:not(.active) span{display:inline;font-size:.78rem}.player:not(.active) span{margin-left:5px}.player strong,.player span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-wrap{order:2;width:100%;height:100%;min-height:0;overflow:hidden;border-left:0;border-right:0}.side-controls{grid-area:controls;grid-template-columns:92px;justify-items:center;gap:6px;align-items:center;margin-top:0;padding-top:0;border-top:0}.toast{bottom:78px;font-size:.9rem}.dice{width:50px;height:50px;font-size:1.85rem;box-shadow:5px 5px color-mix(in srgb,var(--turn-player, #d9464f) 78%,#ffffff)}.turn-copy{display:flex;align-items:baseline;justify-content:center;gap:4px;width:92px}.turn-copy span{font-size:.52rem;line-height:1;white-space:nowrap}.turn-copy strong{font-size:.82rem;line-height:1}.board{width:min(146%,calc(100dvh - 148px));max-width:none;max-height:none;transform:rotate(90deg);transform-origin:center}.point-target{r:52}.point{r:20}.point:hover,.point.selected{r:27}}