:root{--ink:#f3e7d8;--muted:#f3e7d894;--card:#160e099e;--edge:#ffc48c29;--ember:#ffb46b;--serif:"Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif}html,body,#root{background:#1b1512;height:100%;margin:0;overflow:hidden}.hud{pointer-events:none;color:var(--ink);font:14px/1.4 var(--serif);-webkit-user-select:none;user-select:none;position:fixed;inset:0}.card{pointer-events:auto;border:1px solid var(--edge);background:var(--card);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:10px;padding:10px 14px;position:absolute;box-shadow:0 8px 30px #00000059,inset 0 1px #ffdcb40f}.muted{color:var(--muted)}.swatch{vertical-align:-.05em;border-radius:50%;width:.8em;height:.8em;display:inline-block;box-shadow:inset 0 -2px 3px #00000059,0 0 0 1px #0000004d}.swatch-white{background:radial-gradient(circle at 35% 30%,#f6e2c0,#c9a77a)}.swatch-black{background:radial-gradient(circle at 35% 30%,#6b4a36,#24150d)}.turn{min-width:190px;top:16px;left:16px}.turn-line{align-items:center;gap:8px;font-size:19px;display:flex}.turn-name{font-variant:small-caps;letter-spacing:.04em}.turn-sub{margin-top:2px;font-size:13px;font-style:italic}.flats{border-top:1px solid var(--edge);font-variant-numeric:tabular-nums;justify-content:space-between;align-items:center;margin-top:8px;padding-top:8px;display:flex}.menu{gap:4px;padding:6px;display:flex;top:16px;right:16px}.hint{white-space:nowrap;align-items:center;gap:12px;font-size:13px;display:flex;bottom:20px;left:50%;transform:translate(-50%)}.hint.quiet{background:#160e0966}button{font:inherit;color:var(--ink);cursor:pointer;background:linear-gradient(#7848288c,#4628168c);border:1px solid #ffc48c4d;border-radius:7px;padding:5px 12px;transition:background .15s,border-color .15s,opacity .15s}button:hover:not(:disabled){background:linear-gradient(#965c32a6,#5a341ca6);border-color:#ffc48c99}button:disabled{opacity:.35;cursor:default}button.ghost{background:0 0;border-color:#0000}button.ghost:hover:not(:disabled){border-color:var(--edge);background:#ffc48c14}.dots:after{content:"";text-align:left;width:1em;animation:1.2s step-end infinite dots;display:inline-block}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}.chip{color:var(--ember);font-variant:small-caps;letter-spacing:.04em;background:#ffb46b24;border-radius:999px;padding:3px 10px}.toggle,.stepper{align-items:center;gap:2px;display:flex}.toggle{border:1px solid var(--edge);border-radius:8px;padding:2px}.toggle button{background:0 0;border-color:#0000;padding:3px 12px}.toggle button.on{color:var(--ember);background:#ffb46b33}.stepper button{width:28px;padding:3px 0}.gameover{background:radial-gradient(#0000 30%,#0a050273);place-items:center;animation:.6s ease-out .5s both fade-in;display:grid;position:absolute;inset:0}.result{text-align:center;min-width:260px;padding:22px 30px 20px;position:static}.result h1{font-variant:small-caps;letter-spacing:.04em;margin:4px 0 2px;font-size:30px;font-weight:400}.result-ptn{letter-spacing:.2em;font-size:12px}.result .actions{justify-content:center;gap:8px;margin-top:16px;display:flex}@keyframes fade-in{0%{opacity:0;transform:translateY(6px)}}.main-menu{--menu-serif:Constantia, var(--serif);color:#fff;font-family:var(--menu-serif);-webkit-user-select:none;user-select:none;transition:opacity .6s;position:fixed;inset:0}.main-menu.hidden{opacity:0;pointer-events:none}.main-menu-shade{pointer-events:none;background:linear-gradient(270deg,#000000f2 0%,#000000d9 20%,#0006 36%,#0000 52%);position:absolute;inset:0}.main-menu-column{flex-direction:column;align-items:flex-end;gap:.35em;font-size:clamp(22px,2.3vw,36px);transition:opacity .5s;display:flex;position:absolute;top:6vh;right:4vw}.main-menu.behind .main-menu-column{opacity:.1;pointer-events:none}.logo{filter:drop-shadow(0 4px 18px #0009);width:clamp(160px,15vw,280px);margin:0 -.4em .9em 0}.menu-item{color:#fff;font:inherit;text-shadow:0 2px 10px #000c;background:0 0;border:0;border-radius:0;padding:.1em 0;position:relative}.menu-item:hover:not(:disabled){background:0 0;border:0}.menu-item:after{content:"";transform-origin:100%;background:linear-gradient(270deg,#ffffffd9,#fff0);width:140%;height:1px;transition:transform .3s;position:absolute;bottom:.05em;right:0;transform:scaleX(0)}.menu-item:hover:not(:disabled):after,.menu-item:focus-visible:after{transform:scaleX(1)}.menu-item:disabled{opacity:.3}.window-backdrop{place-items:center;padding:16px;display:grid;position:absolute;inset:0}.window{--frame:64px;--bleed:14px;isolation:isolate;min-width:min(520px,100%);padding:calc(var(--bleed) + var(--frame) + 10px) calc(var(--bleed) + var(--frame) + 26px) calc(var(--bleed) + var(--frame) + 44px);text-align:center;background:#000;animation:.28s ease-out both window-open;position:relative}.window:before{content:"";inset:var(--bleed);z-index:1;border:var(--frame) solid transparent;border-image:url(/assets/ui/frame.webp) 102 / var(--frame) / 0 stretch;pointer-events:none;position:absolute}.window-title{margin:-34px 0 18px;font-size:clamp(22px,2vw,30px);font-weight:400}.window-section+.window-section{margin-top:26px}.window-caption{color:#fff9;margin-top:16px;font-size:15px}.window-actions{z-index:2;left:0;right:0;bottom:calc(var(--bleed) - 32px);justify-content:center;gap:30px;display:flex;position:absolute}@keyframes window-open{0%{opacity:0;transform:scale(.96)}}.diamond{--d:108px;isolation:isolate;width:var(--d);height:var(--d);color:#fff;font:inherit;background:0 0;border:0;border-radius:0;place-items:center;padding:0;font-size:16px;display:grid;position:relative}.diamond:before{content:"";z-index:-1;background:#000;border:3px solid #fff;transition:background .15s,box-shadow .15s;position:absolute;inset:14.6%;transform:rotate(45deg)}.diamond:hover:not(:disabled){background:0 0;border:0}.diamond:hover:not(:disabled):before{box-shadow:0 0 0 3px #000,0 0 0 4px #ffffff8c}.diamond.on,.diamond:active:not(:disabled),.diamond.confirm:hover:not(:disabled){color:#000}.diamond.on:before,.diamond:active:not(:disabled):before,.diamond.confirm:hover:not(:disabled):before{background:#fff}.diamond:disabled{opacity:.35}.diamond.small{--d:64px}.diamond svg{width:22px;height:22px}.opponents{justify-content:center;gap:4px;display:flex}.picks{justify-content:center;align-items:center;gap:6px;display:flex}.picks+.picks{margin-top:12px}.picks-label{text-align:right;color:#fff9;width:92px;margin-right:8px;font-size:15px}.picks button{color:#fff;background:#000;border:1px solid #ffffff8c;border-radius:0;min-width:86px;padding:5px 12px;font-size:16px}.picks button:hover:not(.on){background:#ffffff1f;border-color:#fff}.picks button.on{color:#000;background:#fff;border-color:#fff}.sizes{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.size-tile{color:#fff;width:88px;height:88px;font:inherit;filter:brightness(.38);background:url(/assets/ui/board-size.webp) 50%/contain no-repeat;border:0;border-radius:0;place-items:center;padding:0;font-size:17px;transition:filter .2s;display:grid}.size-tile span{aspect-ratio:1;background:#000;border-radius:50%;place-items:center;width:42%;display:grid}.size-tile:hover:not(:disabled){filter:brightness(.7);background:url(/assets/ui/board-size.webp) 50%/contain no-repeat;border:0}.size-tile.on{filter:none}.hud{transition:opacity .6s}.hud.hidden{opacity:0}.hud.hidden *{pointer-events:none!important}.status{white-space:nowrap;align-items:center;gap:12px;font-size:13px;animation:.3s ease-out both fade-in;display:flex;top:16px;left:50%;transform:translate(-50%)}.invite .code{letter-spacing:.25em;-webkit-user-select:all;user-select:all;color:var(--ember);margin-right:-.25em;font-size:22px}button.warn{background:linear-gradient(#96321eb3,#5a1c10b3);border-color:#ff8c64b3}.code-input{color:#fff;width:5.6em;font:32px var(--serif);letter-spacing:.3em;text-align:center;text-transform:uppercase;background:#000;border:1px solid #ffffff8c;outline:none;padding:6px 12px 6px calc(12px + .3em)}.code-input:focus{border-color:#fff}.code-input::placeholder{color:#ffffff40}.clocks{font-variant-numeric:tabular-nums;justify-content:space-between;align-items:center;margin-top:6px;display:flex}.clocks .muted{font-size:12px}.clock{min-width:3.2em;color:var(--muted);font-size:18px;transition:color .2s;display:inline-block}.clocks>span:first-child .clock{text-align:left}.clocks>span:last-child .clock{text-align:right}.clock.running{color:var(--ember)}.clock.low{color:#ff7a5c}.name-field{margin-top:12px}.name-input{color:#fff;width:286px;font:16px var(--menu-serif);background:#000;border:1px solid #ffffff8c;border-radius:0;outline:none;padding:5px 10px}.name-input:focus{border-color:#fff}.name-input::placeholder{color:#ffffff4d}.open-games{border:1px solid #ffffff40;max-height:228px;margin:0;padding:0;list-style:none;overflow-y:auto}.open-games.empty{color:#fff9;padding:22px 16px;font-size:15px}.open-games li+li{border-top:1px solid #ffffff26}.open-games button{color:#fff;width:100%;font:16px var(--menu-serif);text-align:left;background:#000;border:0;border-radius:0;grid-template-columns:1fr 52px 70px 120px;align-items:center;gap:10px;padding:9px 14px;display:grid}.open-games button:hover:not(:disabled){color:#000;background:#fff;border:0}.open-host{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.open-side{opacity:.75;text-align:right;font-size:14px;font-style:italic}