/* Contextinho presentation. Game data, rankings and round storage live elsewhere. */
.container.cx-main{--cx-ease:cubic-bezier(.22,1,.36,1);--cx-border:#40515e;max-width:860px;padding:0 28px 48px}
.cx-heading{padding:30px 0 20px}
.cx-heading>.eyebrow{display:block;margin-top:18px}
.cx-heading h1{font-size:clamp(38px,7vw,56px);letter-spacing:-1.4px;margin:8px 0 12px}
.cx-heading p{max-width:600px;font-size:17px;line-height:1.65;color:var(--muted)}
.cx-main .cx-dot{color:#c5ad7d!important}
.cx-main .cx-play{background:#202d39!important;border:1px solid var(--cx-border)!important;border-radius:16px;padding:24px}
.cx-meta{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:14px;margin-bottom:24px;font-variant-numeric:tabular-nums}
.cx-meta strong{color:var(--text);font-size:20px}
#cx-form label{display:block;font-weight:600;margin-bottom:10px}
.cx-controls{display:flex;gap:10px;align-items:start}
.cx-search{position:relative;flex:1;min-width:0}
#cx-main #cx-input{width:100%;font:inherit;font-size:17px;min-height:52px;padding:14px;border:1px solid #647786!important;background:#182530!important;border-radius:10px!important;color:var(--text)!important;transition:border-color 180ms,background-color 180ms}
#cx-main #cx-input:focus{border-color:#b4c9dd!important}
#cx-input-feedback{position:absolute;inset:0;border:2px solid #8ac4ae;border-radius:10px;box-shadow:0 0 0 4px #8ac4ae14;pointer-events:none;opacity:0}
#cx-input-feedback[data-state=notice]{border-color:#d6b285;box-shadow:0 0 0 4px #d6b28514}
.cx-main .primary,.cx-main .secondary,.cx-main select{border-radius:9px!important}
.cx-main .primary,.cx-main .secondary,.cx-main .ghost{transition:background-color 180ms,border-color 180ms,transform 180ms var(--cx-ease)}
.cx-main button:active:enabled{transform:translateY(1px)}
.cx-controls button{min-height:52px;min-width:104px}
#cx-options{position:absolute;z-index:20;list-style:none;padding:0;margin:6px 0 0;width:100%;max-height:min(300px,40dvh);overflow:auto;overscroll-behavior:contain;border-radius:10px;background:#243644!important;box-shadow:0 12px 28px #09101940}
#cx-options:empty{display:none}
#cx-options li{display:flex;justify-content:space-between;gap:8px;padding:13px 15px;cursor:pointer;min-height:48px;border-bottom:1px solid var(--cx-border);background:transparent!important}
#cx-options li:hover,#cx-options li[aria-selected=true]{background:#354b5e!important;color:var(--text)!important}
#cx-options small{color:var(--muted)}
.cx-message{min-height:42px;color:#c3d0db;line-height:1.5;font-size:14px;margin:12px 0}
.cx-best{border-top:1px solid var(--cx-border);padding-top:20px}
.cx-best ul{list-style:none;padding:0;margin:12px 0 0}
.cx-best-empty{display:flex;align-items:center;min-height:76px;margin:0;padding:14px 16px;border:1px dashed var(--cx-border);border-radius:12px}
.cx-main .cx-row{--cx-tone:#afc2d4;--cx-fill:#293a49;position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(6ch,auto);gap:4px 14px;align-items:center;min-height:76px;padding:14px 16px 14px 19px;background:#22313f!important;color:var(--text)!important;border:1px solid #4c5d68!important;border-radius:12px;overflow:hidden;overflow-anchor:none}
.cx-row-tint{position:absolute;z-index:-1;inset:0;border-radius:inherit;background:var(--cx-fill);box-shadow:inset 3px 0 var(--cx-tone);pointer-events:none}
.cx-row strong{min-width:0;overflow-wrap:anywhere;font-weight:600;line-height:1.35}
.cx-rank{font-size:23px;font-weight:700;line-height:1.2;grid-column:2;grid-row:1/3;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--cx-tone)}
.cx-main .cx-zone{font-size:13px;line-height:1.35;color:#c9d4de}
.cx-main .cx-row.hot{--cx-tone:#efb580;--cx-fill:#4b392d}
.cx-main .cx-row.warm{--cx-tone:#d9c194;--cx-fill:#3c3a31}
.cx-main .cx-row.mild{--cx-tone:#a9c5e1;--cx-fill:#2b4053}
.cx-main .cx-row.win{--cx-tone:#a2ddbd;--cx-fill:#26483c}
.cx-hints{margin-top:14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cx-hints p{margin:0;font-size:14px;color:var(--muted)}
#cx-reveal{margin-left:auto}
.cx-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:30px}
.cx-section-head h2{font-size:26px}
.cx-section-head label{font-size:13px;color:var(--muted)}
.cx-section-head select{display:block;border:1px solid var(--cx-border);padding:8px;font-size:14px;min-height:44px;max-width:100%}
.cx-history{display:grid;gap:8px;list-style:none;padding:0;margin:16px 0 0;overflow-anchor:none}
#cx-history-wrap,#cx-after-history{overflow-anchor:none}
.cx-main .cx-win{position:relative;isolation:isolate;overflow:hidden;padding:24px;margin-top:20px;background:#253b40;color:var(--text);border-radius:16px;border:1px solid #526c72;animation:none}
.cx-main .cx-win.cx-completed{background:linear-gradient(125deg,#294438,#233741 80%);border-color:#719486}
#cx-victory-light{position:absolute;inset:-60% -50%;z-index:-1;background:linear-gradient(110deg,transparent 35%,#c4e9cf50 50%,transparent 65%);opacity:0;pointer-events:none}
.cx-win h2{font-size:clamp(30px,5vw,42px);overflow-wrap:anywhere;margin:10px 0}
.cx-win p{line-height:1.6;color:#d0dbdd;margin:10px 0 20px}
.cx-win .secondary{display:inline-flex;margin-top:10px}
.cx-result-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0 24px;padding:18px 0;border-top:1px solid #718c8055;border-bottom:1px solid #718c8055}
.cx-result-stats strong{display:block;font-size:25px;font-variant-numeric:tabular-nums;line-height:1.2}
.cx-result-stats span{display:block;margin-top:6px;font-size:13px;color:#c2d2d0}
.cx-details{border-top:1px solid var(--cx-border);margin-top:24px;padding-top:16px}
.cx-details summary{cursor:pointer;font-weight:600;min-height:44px}
.cx-details p{font-size:15px;line-height:1.7;color:var(--muted)}
.cx-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cx-stats strong{display:block;font-size:25px;font-variant-numeric:tabular-nums}
.cx-stats span{font-size:13px;color:var(--muted)}
.cx-warning{background:#4d3c29;color:#ffe4c0;padding:12px;border-radius:10px;font-size:14px}
#cx-share-copy{width:100%;min-height:120px;margin-top:12px;font:inherit}
.cx-archive{margin:0 0 20px;padding:14px 0}
.cx-archive .actions{align-items:end}
.cx-archive label{display:grid;gap:6px;font-size:14px;min-width:0}
.cx-archive input{font:inherit;min-height:46px;max-width:100%;padding:10px;border:1px solid var(--cx-border);border-radius:9px;background:var(--card);color:var(--text)}
.cx-hint-label{font-size:11px;font-weight:500;padding:2px 6px;border:1px solid #829caf;border-radius:5px;white-space:nowrap}
#cx-reveal-dialog{background:var(--card);color:var(--text);border-color:var(--cx-border)}
@media(max-width:480px){
 .container.cx-main{padding-left:16px;padding-right:16px}
 .cx-main .cx-play{padding:16px}
 .cx-controls{gap:8px}
 .cx-controls button{min-width:76px;padding:12px}
 #cx-main #cx-input{font-size:16px;padding:14px 12px}
 .cx-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cx-main .cx-row{padding:13px 12px 13px 16px;gap:4px 10px}
 .cx-rank{font-size:21px}
 .cx-heading{padding-top:18px}
 .cx-main .cx-win{padding:20px}
 .cx-result-stats{gap:8px}
 .cx-result-stats span{font-size:12px}
 .cx-section-head h2{font-size:24px}
}
@media(max-width:360px){
 .cx-controls{flex-wrap:wrap}
 .cx-search{flex-basis:100%}
 .cx-controls button{width:100%}
 .cx-result-stats{column-gap:6px}
}
@media(prefers-reduced-motion:reduce){
 #cx-main *,#cx-main *::before,#cx-main *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}