body{min-height:100dvh}main{padding:0 8px 16px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1480px;margin:auto;padding:10px 24px}.brand{text-decoration:none;font-weight:900}.topbar #tools{display:flex;gap:6px}.topbar .lg-button{padding:8px 12px}h1{font-size:2rem;margin:0}h2{font-size:1.12rem;margin:0}p{line-height:1.5;margin:4px 0}.muted,.board-caption{color:var(--lg-muted)}.setup{max-width:540px;margin:12px auto}.setup h1{margin:10px 0}.options{display:flex;gap:12px;flex-wrap:wrap}.options label{flex:1;min-width:130px;font-weight:800}.options select{width:100%;min-height:44px;margin-top:6px;border:1px solid var(--lg-line);background:var(--lg-cream);color:var(--lg-ink);border-radius:12px;padding:8px}.check{display:flex;align-items:center;gap:10px;min-height:52px;font-size:.9rem;cursor:pointer}.check input{width:24px;height:24px;accent-color:var(--lg-rose)}.lg-stage{margin-top:8px}.scorecard{border:1px solid var(--lg-line);border-radius:20px;background:var(--lg-pink);padding:16px;display:flex;flex-direction:column;gap:2px}.scorecard strong{font-size:2.7rem;color:var(--lg-rose);font-variant-numeric:tabular-nums;line-height:1.2}.scorecard span,.scorecard small{font-size:.85rem;font-weight:800}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;border-top:1px solid var(--lg-line);padding-top:12px}.stat{font-size:.73rem;color:var(--lg-muted)}.stat strong{font-size:1.1rem;color:var(--lg-ink);display:block}.numbers{font-weight:800;font-variant-numeric:tabular-nums;font-size:.9rem}.lg-center{gap:12px}#status{text-align:center;font-weight:900;font-size:1.1rem;min-height:2em}#board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;max-width:660px;aspect-ratio:1;border-radius:24px;padding:12px;background:var(--lg-rose);box-shadow:0 12px 28px #482b3826;touch-action:none}.tile{display:grid;place-items:center;border-radius:16px;background:var(--lg-cream);color:var(--lg-ink);font-weight:900;font-size:clamp(1.5rem,4vw,3.1rem);min-width:0;line-height:1;position:relative}.tile.empty{background:var(--lg-pink);opacity:.45}.tile[data-tier="2"],.tile[data-tier="3"]{background:var(--lg-tint-2)}.tile[data-tier="4"],.tile[data-tier="5"]{background:var(--lg-tint-1)}.tile[data-tier="6"],.tile[data-tier="7"]{background:var(--lg-tint-3);outline:2px solid var(--lg-ink);outline-offset:-5px}.tile[data-tier="8"],.tile[data-tier="9"],.tile[data-tier="10"],.tile[data-tier="11"]{background:var(--lg-ink);color:var(--lg-cream);border:3px double var(--lg-cream)}.tile.large{font-size:clamp(1.4rem,3.5vw,2.7rem)}.board-caption{font-size:.82rem;text-align:center}.directions{display:flex;gap:8px}.directions .lg-button{width:54px;min-height:44px;padding:4px;font-size:1.5rem}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions .lg-button{flex:1;padding:9px 12px}#result{font-weight:800}#hint-text{font-size:.88rem;color:var(--lg-muted)}#ticker{font-size:.88rem;font-weight:800;font-variant-numeric:tabular-nums}#opponents{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.opponent{min-width:0;border:1px solid var(--lg-line);background:var(--lg-cream);border-radius:14px;padding:8px}.opponent h3{font-size:.78rem;font-weight:800;margin:0 0 4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.opponent p{font-size:.75rem;margin:4px 0 0}.mini{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;aspect-ratio:1;background:var(--lg-line);border-radius:6px;padding:3px}.mini span{display:grid;place-items:center;background:var(--lg-white);color:var(--lg-ink);font-size:.58rem;font-weight:800;border-radius:3px;min-width:0}.mini span.filled{background:var(--lg-pink)}details summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:800}details p{font-size:.86rem;margin:10px 0}
@media(min-width:1000px){html,body{height:100%;overflow:hidden}body{display:flex;flex-direction:column}.topbar{width:100%;flex:none;height:64px}main{display:flex;flex-direction:column;flex:1;min-height:0;padding-bottom:16px}#entry{overflow:auto;min-height:0}.lg-stage{flex:1;height:auto;min-height:0;width:100%;grid-template-columns:minmax(210px,250px) minmax(0,1fr) minmax(250px,300px);gap:20px}.lg-center{container-type:size}#board{width:min(100cqw,calc(100cqh - 175px));height:min(100cqw,calc(100cqh - 175px));max-height:760px;max-width:760px;flex:none}.lg-rail{gap:12px}.stats{margin-top:auto}}
@media(max-width:999px){.topbar{padding:8px}.brand{font-size:.85rem}.topbar .lg-button{font-size:.8rem;padding:8px}#game{display:flex;flex-direction:column;gap:14px}.lg-rail{padding:16px;background:var(--lg-white);border:1px solid var(--lg-line);border-radius:20px}.lg-rail--left{display:grid;grid-template-columns:1fr 1fr;gap:8px}.lg-rail--left h1,.stats,.numbers{grid-column:1/-1}.scorecard{grid-column:2;grid-row:1/5;padding:12px}.scorecard strong{font-size:2.3rem}.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.lg-center{display:flex;flex-direction:column;align-items:center}#board{padding:10px;gap:8px;border-radius:20px}.tile{font-size:2rem;border-radius:12px}.tile.large{font-size:1.5rem}.setup{padding:18px}.lg-lobby{padding:18px}#opponents{grid-template-columns:repeat(3,minmax(0,1fr))}.mini span{font-size:.6rem}}

/* A connected roster keeps its Start button in the desktop viewport. */
@media(min-width:1000px){
 .lg-lobby:has(.lg-roster):has(.lg-start:enabled){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .lg-lobby:has(.lg-roster):has(.lg-start:enabled)>*{grid-column:1/-1;margin:0}
 .lg-lobby:has(.lg-roster):has(.lg-start:enabled)>label{grid-column:auto;min-width:0}
 .lg-lobby:has(.lg-roster):has(.lg-start:enabled)>.lg-join,.lg-lobby:has(.lg-roster):has(.lg-start:enabled)>.lg-avatars,.lg-lobby:has(.lg-roster):has(.lg-start:enabled)>.lg-row,.lg-lobby:has(.lg-roster):has(.lg-start:enabled)>.lg-muted{display:none}
 .lg-lobby:has(.lg-roster):has(.lg-start:enabled) .lg-code{font-size:2rem}
 .lg-roster ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:8px 0;padding-left:20px}
 .lg-roster li{overflow-wrap:anywhere;font-size:.85rem}
}

@media(min-width:1000px){#entry:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start;width:100%;max-width:1120px;margin:12px auto}.setup{margin:0;width:100%}#lobby .lg-lobby{margin:0 auto;padding:18px 24px}}
/* Website theme: a mid-brown wooden tray in both Paper and Night, so tiles always stand out from the board. */
#board{background:color-mix(in srgb,var(--lg-muted) 70%,var(--lg-cream));border-radius:var(--lg-radius)}.tile{border-radius:6px}