:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#eef3f8;background:#08131e;--panel:#102130;--panel2:#162a3b;--border:#294256;--muted:#93a7b8;--green:#218c5b;--yellow:#b88713;--red:#374957;--accent:#e9b949}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#173149,#08131e 55%);min-height:100vh}.app{max-width:1050px;margin:auto;padding:22px 16px 48px}header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.eyebrow{letter-spacing:.18em;font-weight:900;font-size:12px;color:var(--accent)}h1{margin:4px 0;font-size:clamp(27px,5vw,44px)}p{color:var(--muted)}button,input{font:inherit}button{border:1px solid var(--border);background:var(--panel2);color:#fff;border-radius:10px;padding:11px 16px;font-weight:800;cursor:pointer}.mode{display:flex;gap:6px}.mode button.active,#guessBtn,#shareBtn{background:var(--accent);color:#17202a;border-color:transparent}.scorebar,.entry,.legend,.result{background:rgba(16,33,48,.9);border:1px solid var(--border);border-radius:16px;padding:14px;margin-top:14px}.scorebar{display:flex;justify-content:space-between;align-items:center}.scorebar>div{display:flex;align-items:baseline;gap:10px}.scorebar strong{font-size:27px}.scorebar small{color:var(--muted)}.entry{display:grid;grid-template-columns:1fr auto;gap:9px}.search{position:relative}input{width:100%;padding:13px;border-radius:10px;border:1px solid var(--border);background:#0b1925;color:#fff;font-size:16px}#status{grid-column:1/-1;margin:0;min-height:18px;font-size:13px}.suggestions{position:absolute;z-index:10;top:48px;width:100%;max-height:300px;overflow:auto;background:#0e1e2b;border:1px solid var(--border);border-radius:10px;padding:5px;box-shadow:0 16px 30px #0008}.suggestions button{display:block;width:100%;text-align:left;background:transparent;border:0}.suggestions button:hover{background:var(--panel2)}.hidden{display:none!important}.legend{display:flex;flex-wrap:wrap;gap:15px;font-size:12px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:6px}.swatch{width:18px;height:18px;border-radius:5px;background:var(--red)}.swatch.exact{background:var(--green)}.swatch.close{background:var(--yellow)}.boardWrap{overflow-x:auto;margin-top:14px}.board{min-width:880px}.row{display:grid;grid-template-columns:1.7fr repeat(8,1fr);gap:5px;margin-bottom:5px}.head{color:var(--muted);font-size:11px;text-transform:uppercase;font-weight:800;text-align:center}.head div:first-child{text-align:left}.cell{min-height:58px;border:1px solid var(--border);background:var(--panel);border-radius:9px;display:flex;justify-content:center;align-items:center;text-align:center;padding:5px;font-size:12px;font-weight:800}.cell.name{justify-content:flex-start;text-align:left}.cell.exact{background:var(--green);border-color:transparent}.cell.close{background:var(--yellow);border-color:transparent}.result{text-align:center}.ball{font-size:38px}.result h2{margin-bottom:4px}.resultActions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.secondary{background:var(--panel2)}dialog{background:#0c1a26;color:#fff;border:1px solid var(--border);border-radius:18px;width:min(92vw,520px);padding:24px}dialog::backdrop{background:#000a}.close{float:right;font-size:20px;padding:5px 10px}.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.statgrid div{background:var(--panel);padding:13px;border-radius:10px;text-align:center}.statgrid strong{display:block;font-size:25px}.statgrid span{font-size:11px;color:var(--muted)}.distribution{display:grid;gap:5px}.distrow{display:flex;align-items:center;gap:7px}.bar{background:var(--green);min-width:26px;padding:5px;border-radius:5px;font-size:11px;font-weight:800}footer{text-align:center;color:var(--muted);font-size:11px;margin-top:20px}@media(max-width:620px){header{display:block}.mode{margin-top:12px}.entry{grid-template-columns:1fr}.entry #guessBtn{width:100%}.statgrid{grid-template-columns:repeat(2,1fr)}}

/* v1.4 polish */
body{padding-top:env(safe-area-inset-top)}
header .brand{display:flex;align-items:flex-start;gap:13px}
.mark{width:48px;height:48px;flex:0 0 48px;border:2px solid var(--accent);border-radius:50%;display:grid;place-items:center;position:relative;box-shadow:inset 0 0 0 4px #10283a}
.mark:after{content:"";position:absolute;width:30px;height:30px;border:2px solid var(--accent);transform:rotate(45deg);border-radius:5px;opacity:.7}
.mark span{position:relative;z-index:2;color:var(--accent);font-size:24px;font-weight:1000;background:#10283a;padding:0 5px}
.legend>strong{width:100%;color:#eef3f8;font-size:12px;letter-spacing:.04em}
.result{animation:pop .22s ease-out}
@keyframes pop{from{transform:scale(.98);opacity:.4}to{transform:scale(1);opacity:1}}
@media(max-width:620px){.app{padding:14px 14px 40px}header .brand{gap:10px}.mark{width:42px;height:42px;flex-basis:42px}h1{font-size:31px;line-height:1.08;margin-top:6px}.scorebar,.entry,.legend,.result{border-radius:18px}.legend{gap:13px}.boardWrap{margin-left:-14px;margin-right:-14px;padding:0 14px}.board{min-width:820px}}


/* v1.5 mobile clue board + finish card */
.boardWrap{position:relative;scrollbar-width:thin;overscroll-behavior-x:contain}
.board{min-width:760px}
.row{grid-template-columns:160px 62px 78px 72px 62px 70px 78px 66px 72px;gap:5px}
.row>div:first-child{position:sticky;left:0;z-index:3;box-shadow:8px 0 12px -12px #000}
.head>div:first-child{z-index:5;background:#08131e;padding:7px 6px;border-radius:7px}
.cell.name{background:#102130}
.cell.name.exact{background:var(--green)}
.result{padding:22px 18px 20px;background:linear-gradient(180deg,rgba(20,48,64,.96),rgba(16,33,48,.96));box-shadow:0 16px 40px #0003}
.resultTop{display:flex;justify-content:center;align-items:center;gap:14px;margin-bottom:8px}
.resultScore{font-size:34px;line-height:1;font-weight:1000;color:var(--accent);letter-spacing:-.04em}
.result .ball{font-size:34px}
.result h2{font-size:clamp(25px,6vw,38px);margin:10px 0 4px}
.result p{font-size:15px;margin:8px auto 18px}
.resultTag{font-size:10px;letter-spacing:.12em;color:var(--muted);font-weight:900;margin:4px 0 16px}
#shareBtn{min-width:170px}
@media(max-width:620px){
 .board{min-width:720px}
 .row{grid-template-columns:142px 54px 70px 64px 56px 62px 72px 60px 66px;gap:4px}
 .cell{min-height:54px;border-radius:8px;padding:4px;font-size:11px}
 .cell.name{font-size:11px;padding-left:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .head{font-size:10px}
 .boardWrap{padding-left:14px;padding-right:14px}
 .result{margin-top:18px}
}

/* v1.6 frozen-column cleanup */
.boardWrap{-webkit-overflow-scrolling:touch;scrollbar-width:none}
.boardWrap::-webkit-scrollbar{height:0;width:0;display:none}
.row>div:first-child{isolation:isolate;background-clip:padding-box}
.cell.name{z-index:6!important;box-shadow:10px 0 14px -14px #000,1px 0 0 var(--border)}
.cell.name.exact{background:var(--green)}
.cell.name.close{background:var(--yellow)}
.head>div:first-child{z-index:8!important;box-shadow:10px 0 14px -14px #000;background:#08131e}
@media(max-width:620px){
 .row>div:first-child{left:14px}
 .boardWrap{scroll-padding-left:156px}
}

/* v1.7 true split-pane clue board */
.boardShell{display:grid;grid-template-columns:160px minmax(0,1fr);margin-top:14px;position:relative;width:100%;overflow:hidden}
.playerPane{position:relative;z-index:4;background:#08131e;box-shadow:10px 0 14px -14px #000}
.cluePane{min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none}
.cluePane::-webkit-scrollbar{display:none;width:0;height:0}
.clueBoard{width:max-content;min-width:100%}
.paneHead{height:30px;color:var(--muted);font-size:11px;text-transform:uppercase;font-weight:800;display:flex;align-items:center;margin-bottom:5px}
.playerHead{padding-left:8px;background:#08131e}
.clueHead,.clueRow{display:grid;grid-template-columns:62px 78px 72px 62px 70px 78px 66px 72px;gap:5px}
.clueHead{text-align:center;align-items:center}
.clueHead>div{display:flex;align-items:center;justify-content:center;height:30px}
.playerRow,.clueRow{height:58px;margin-bottom:5px}
.playerRow .cell,.clueRow .cell{height:58px;min-height:58px}
.playerRow .cell.name{width:100%;position:static!important;box-shadow:none!important;background:#102130}
.playerRow .cell.name.exact{background:var(--green)}
.playerRow .cell.name.close{background:var(--yellow)}
/* Retire the old one-grid/sticky board rules. */
.boardWrap,.board,.row,.head{all:unset}
@media(max-width:620px){
 .boardShell{grid-template-columns:142px minmax(0,1fr);margin-left:0;margin-right:0}
 .clueHead,.clueRow{grid-template-columns:54px 70px 64px 56px 62px 72px 60px 66px;gap:4px}
 .paneHead{font-size:10px;height:28px;margin-bottom:4px}
 .clueHead>div{height:28px}
 .playerRow,.clueRow{height:54px;margin-bottom:4px}
 .playerRow .cell,.clueRow .cell{height:54px;min-height:54px}
 .playerRow .cell.name{font-size:11px;padding-left:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* v1.8 stats + history */
.statgrid{grid-template-columns:repeat(5,1fr)}
.statsSection{margin-top:22px;padding-top:4px;border-top:1px solid var(--border)}
.statsSectionHead{display:flex;align-items:center;justify-content:space-between;gap:12px}
.statsSectionHead span{font-size:11px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.history{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.historyItem{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:9px 4px;text-align:center}
.historyItem span{display:block;color:var(--muted);font-size:9px;font-weight:800;margin-bottom:4px}
.historyItem strong{font-size:13px}
.historyItem.win{border-bottom:3px solid var(--green)}
.historyItem.loss{border-bottom:3px solid var(--red)}
.emptyHistory{grid-column:1/-1;margin:0;padding:12px;background:var(--panel);border-radius:9px;font-size:12px}
@media(max-width:620px){.statgrid{grid-template-columns:repeat(3,1fr)}.history{grid-template-columns:repeat(7,62px);overflow-x:auto;scrollbar-width:none}.history::-webkit-scrollbar{display:none}}

/* v1.9 compact stats + next Daily */
#statsDialog{max-height:min(88vh,760px);overflow-y:auto;padding:20px}
#statsDialog h2{margin:0 0 14px;font-size:28px}
#statsDialog h3{margin:16px 0 10px;font-size:18px}
#statsDialog .statgrid{grid-template-columns:repeat(5,1fr);gap:6px}
#statsDialog .statgrid div{padding:9px 5px}
#statsDialog .statgrid strong{font-size:22px}
#statsDialog .distribution{gap:3px}
#statsDialog .distrow{gap:5px;min-height:25px}
#statsDialog .bar{padding:3px 5px}
#statsDialog .statsSection{margin-top:15px}
.nextDaily{margin-top:14px;padding:11px 12px;background:var(--panel);border:1px solid var(--border);border-radius:10px;display:flex;align-items:baseline;justify-content:center;gap:9px}
.nextDaily span,.nextDaily small{color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.nextDaily strong{font-size:18px;color:var(--accent)}
@media(max-width:620px){#statsDialog{width:94vw;max-height:86vh;padding:16px}#statsDialog .statgrid{grid-template-columns:repeat(5,1fr)}#statsDialog .statgrid strong{font-size:20px}#statsDialog .statgrid span{font-size:9px}.historyItem{padding:7px 3px}.nextDaily{position:sticky;bottom:0;background:#0c1a26}}

/* v2.0 launch polish */
.utility-actions{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.utility-btn{background:#10283a;color:#dce7ef;border:1px solid #29495e;border-radius:12px;padding:10px 13px;font-weight:800}
.info-modal{position:fixed;inset:0;z-index:9999;background:rgba(1,8,14,.82);padding:calc(env(safe-area-inset-top) + 22px) 18px calc(env(safe-area-inset-bottom) + 22px);overflow:auto}
.info-modal[hidden]{display:none}
.info-card{position:relative;max-width:560px;margin:6vh auto;background:#0d2232;border:1px solid #315064;border-radius:24px;padding:28px 24px;color:#eef4f7;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.info-card h2{font-size:32px;margin:4px 0 16px}
.info-card p{color:#a9bac7;line-height:1.55}
.info-close{position:absolute;right:16px;top:14px;width:44px;height:44px;border-radius:13px;border:1px solid #34556a;background:#142d3e;color:white;font-size:30px;font-weight:900}
.brand-kicker{color:#f3be3e;letter-spacing:.18em;font-size:13px;font-weight:900}
.info-rule{display:flex;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid #244255}
.info-rule b{min-width:62px}
.info-rule:nth-of-type(1) b{color:#25a568}
.info-rule:nth-of-type(2) b{color:#e0a91e}
.info-rule:nth-of-type(3) b{color:#8498a6}
.tagline{margin-top:20px;padding:15px;border-radius:14px;background:#071522;color:#f3be3e;text-align:center;font-weight:900;letter-spacing:.04em}
@media(max-width:520px){.info-card{margin:1vh auto;padding:24px 20px}.info-card h2{font-size:28px}.utility-actions{display:grid;grid-template-columns:1fr 1fr}}


/* v2.0.1 mobile layout cleanup */
.score-status{min-width:0}
.utility-actions{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.utility-actions .utility-btn{width:100%;padding:10px 12px}
@media(max-width:620px){
  body{padding-top:0}
  .app{padding-top:calc(env(safe-area-inset-top) + 30px)}
  header .brand{padding-top:8px}
  .scorebar{gap:10px}
  .scorebar .score-status{display:grid;grid-template-columns:auto auto 1fr;align-items:baseline;column-gap:9px;white-space:nowrap}
  .scorebar #puzzleLabel{white-space:nowrap}
  .scorebar #statsBtn{flex:0 0 auto}
  .utility-actions{margin-top:10px}
}
@media(max-width:390px){
  .scorebar{padding:12px}
  .scorebar .score-status{column-gap:6px}
  .scorebar strong{font-size:25px}
  .scorebar small{font-size:11px}
  .utility-actions .utility-btn{font-size:13px}
}