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:150px;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}.lg-stage{margin-top:8px}.players{display:grid;gap:8px}.player{border:2px solid var(--lg-line);border-radius:16px;padding:10px;background:var(--lg-cream);font-weight:800;font-size:.9rem}.player.active{border-color:var(--lg-rose);background:var(--lg-pink)}.player small{display:block;color:var(--lg-muted);font-weight:600}.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:10px}#turn{text-align:center;font-weight:900;font-size:1.1rem;min-height:2em}#board{display:block;aspect-ratio:1;width:100%;max-width:760px;border-radius:28px;box-shadow:0 12px 28px #482b3826;touch-action:none}#board:focus-visible{outline:4px solid var(--lg-leaf);outline-offset:3px}.board-caption{font-size:.82rem;text-align:center}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions .lg-button{flex:1;padding:9px 12px}#result{font-weight:800}#aim-controls label{display:flex;justify-content:space-between;font-weight:800;font-size:.9rem}#aim-controls input{width:100%;min-height:44px;accent-color:var(--lg-rose);margin:0}#aim-controls output{color:var(--lg-rose)}#power-meter{width:100%;height:14px;display:block;margin:0 0 12px}#shoot{width:100%}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(240px,290px);gap:20px}.lg-center{container-type:size}#board{width:min(100cqw,calc(100cqh - 105px));height:min(100cqw,calc(100cqh - 105px));max-height: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,.players,.stats,.numbers{grid-column:1/-1}.players{grid-template-columns:1fr 1fr}.player{padding:8px;font-size:.85rem}.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.lg-center{display:flex;flex-direction:column;align-items:center}#board{border-radius:18px}.setup{padding:18px}.lg-lobby{padding:18px}#aim-controls{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}#aim-controls label{grid-column:1}#aim-controls input{grid-column:1}#aim-controls #power-meter{grid-column:2;grid-row:3;align-self:center}#aim-controls #shoot{grid-column:2;grid-row:4/7;max-height:90px;align-self:center}#aim-controls label[for=power]{grid-column:2;grid-row:1}#aim-controls #power{grid-column:2;grid-row:2}#aim-controls label[for=angle]{grid-row:3}#aim-controls #angle{grid-row:4}}

/* 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}}