:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#000;--surface:#0d0d0d;--surface-raised:#161616;--surface-hover:#1f1f1f;--border:#262626;--border-strong:#3a3a3a;--text:#f5f5f5;--text-soft:#d4d4d4;--muted:#a3a3a3;--muted-2:#737373;--accent:#2dd4bf;--accent-strong:#5eead4;--accent-soft:#2dd4bf24;--accent-border:#2dd4bf80;--on-accent:#000;--card-face:#fff;--card-border:#d4d4d4;--card-ink:#111;--card-red:#c1121f;--card-back:#161616;--card-back-border:#2e2e2e;--card-radius:18px;--scrim:#000000bf;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px}
*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);min-height:100%;color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,SF Pro Display,Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}input{font:inherit}.app-shell{background:var(--bg);min-height:100vh}
.page-shell{padding:var(--space-6)var(--space-5)var(--space-7);min-height:100vh}.page-content{gap:var(--space-6);flex-direction:column;max-width:1320px;margin:0 auto;display:flex}.grid-main{gap:var(--space-5);grid-template-columns:1fr;align-items:start;display:grid}@media (min-width:1024px){.grid-main{gap:var(--space-6);grid-template-columns:minmax(340px,400px) 1fr}}.stack-sm{gap:var(--space-3);flex-direction:column;display:flex}.stack-md,.stack-lg{gap:var(--space-5);flex-direction:column;display:flex}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--card-radius);padding:var(--space-5)}.panel-hero{padding:var(--space-6);background:var(--surface);border:1px solid var(--border-strong);border-radius:24px;position:relative;overflow:hidden}.hero-overlay{display:none}.hero-content{z-index:1;position:relative}
.text-right{text-align:right}.label{letter-spacing:.01em;color:var(--muted);text-transform:uppercase;font-size:12px}.label-inline{color:var(--muted);font-size:12px}.label-strong{letter-spacing:-.01em;font-size:14px;font-weight:700}.title{letter-spacing:-.02em;font-size:22px;font-weight:800}.title-sm{font-size:18px;font-weight:700}.subtitle{color:var(--muted-2);font-size:13px}.muted{color:var(--muted);font-size:13px}.muted-strong{color:var(--text-soft);font-size:14px}.meta{color:var(--muted-2);font-size:12px}.meta-center{text-align:center}.text-strong{color:var(--text);font-weight:700}.row-between{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}
.card-row{justify-content:center;gap:var(--space-4);margin:var(--space-4)0 var(--space-5);display:flex}.info-line{margin:6px 0}.info-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-top:8px;display:grid}.info-grid-wrap{position:relative}.info-grid-wide{grid-column:1/-1}.opponent-line{border:1px solid var(--border);background:var(--surface-raised);border-radius:10px;padding:8px 10px}.action-row{gap:var(--space-4);margin-top:var(--space-3);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.opp-showdown{gap:var(--space-2);flex-direction:column;display:flex}.opp-showdown-cards{gap:var(--space-2);display:flex}.opp-winner{border-color:var(--accent);background:var(--accent-soft)}.action-box.opp-winner,.action-box.self.opp-winner{background:var(--accent-soft);border-color:var(--accent)}.turn-active{border-color:var(--accent)}.opp-hand-note{color:var(--muted);font-size:12px}.action-box .label{padding-top:var(--space-2)}.action-box{padding:var(--space-4);border:1px solid var(--border);background:var(--surface);gap:var(--space-2);border-radius:12px;flex-direction:column;min-height:72px;display:flex}.action-box.self{border-color:var(--accent-border)}.winner-flag{color:var(--accent);font-weight:800}.runout-detail-text{color:var(--text-soft);font-size:15px;line-height:1.6}
.action-buttons{gap:var(--space-3);flex-wrap:wrap;justify-content:center;display:flex}.helper-text{text-align:center;color:var(--muted);margin-top:10px;font-size:12px}.raise-slider{margin-top:var(--space-5);gap:var(--space-2);flex-direction:column;display:flex}.raise-slider input[type=range]{width:100%;accent-color:var(--accent)}.btn{border:1px solid var(--border-strong);background:var(--surface-raised);color:var(--text);border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-weight:600;transition:background .15s,border-color .15s,transform .12s;display:inline-flex}.btn:hover{background:var(--surface-hover)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-accent{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.btn-accent:hover{background:var(--accent-strong)}.btn-accent .icon{color:var(--on-accent)}.btn-disabled{opacity:.55;cursor:not-allowed}.btn.ghost,.btn-ghost{border-color:var(--border-strong);background:0 0}.input{border:1px solid var(--border-strong);background:var(--surface-raised);width:132px;color:var(--text);border-radius:12px;outline:none;padding:10px 12px;transition:border-color .15s,background .15s}.input:focus{border-color:var(--accent)}.input-row{flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;display:flex}
.board-panel{background:var(--surface-raised)}.board-cards{margin-top:var(--space-5);margin-bottom:var(--space-2);gap:var(--space-4);justify-content:center;display:flex}.board-footer{margin-top:12px}.hero-hand{padding:var(--space-5);border:1px solid var(--border);background:var(--surface-raised);gap:var(--space-3);border-radius:16px;flex-direction:column;display:flex}
.progress-track{background:var(--surface-hover);border-radius:999px;width:100%;height:12px;margin-top:12px;overflow:hidden}.progress-track.with-icons{margin-top:0}.progress-bar{background:var(--accent);border-radius:999px;height:100%}.progress-row{align-items:center;gap:var(--space-3);margin-top:var(--space-4);display:flex}.rank-icon{border:1px solid var(--border);background:var(--surface-raised);border-radius:14px;flex-shrink:0;width:56px;height:56px;position:relative;overflow:hidden}.rank-badge{align-items:center;gap:var(--space-4);display:flex}.rank-image-frame{border:1px solid var(--border);background:var(--surface-raised);border-radius:18px;width:64px;height:64px;position:relative;overflow:hidden}.rank-image,.rank-icon img{object-fit:contain}
.header{justify-content:space-between;align-items:center;gap:var(--space-4);padding-bottom:var(--space-5);border-bottom:1px solid var(--border);display:flex}.header-left{align-items:center;gap:12px;display:flex}.logo-mark{background:var(--accent);border:1px solid var(--accent);border-radius:16px;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.logo-mark .icon{color:var(--on-accent)}.header-actions{justify-content:flex-end;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.mode-toggle{flex-direction:column;flex:none;display:flex}.mode-toggle-shell{background:0 0;border:none;border-radius:14px;align-items:center;gap:8px;height:42px;padding:4px 6px;display:flex}.mode-toggle-buttons{align-items:center;display:flex}.mode-btn{border:1px solid var(--border-strong);background:var(--surface-raised);color:var(--text);letter-spacing:.01em;cursor:pointer;margin-left:-1px;padding:8px 12px;font-weight:700;transition:background .12s,border-color .12s,color .12s}.mode-btn.first{border-top-left-radius:10px;border-bottom-left-radius:10px;margin-left:0}.mode-btn.last{border-top-right-radius:10px;border-bottom-right-radius:10px}.mode-btn:hover{background:var(--surface-hover)}.mode-btn.active{border-color:var(--accent);background:var(--accent);color:var(--on-accent);z-index:1;position:relative}.icon{width:18px;height:18px;color:var(--text)}.header-btn{gap:6px;height:38px;padding:0 12px}
.info-button{border:1px solid var(--border-strong);background:var(--surface-raised);width:28px;height:28px;color:var(--muted);border-radius:999px;justify-content:center;align-items:center;font-weight:700;transition:background .15s,border-color .15s;display:inline-flex}.info-button:hover{background:var(--surface-hover);color:var(--text)}.info-overlay{border:1px solid var(--border);background:var(--surface-raised);border-radius:12px;margin-top:10px;padding:10px 12px}.info-rules{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin-top:8px;display:grid}.info-pill{border:1px solid var(--border);background:var(--surface);border-radius:10px;flex-direction:column;gap:4px;padding:8px 10px;display:flex}.pill-label{text-transform:uppercase;color:var(--muted);letter-spacing:.02em;font-size:11px}.pill-value{color:var(--muted-2);flex-direction:column;gap:2px;font-size:13px;line-height:1.4;display:flex}.pill-caption{color:var(--muted);letter-spacing:.01em;font-size:11px}.pill-math{color:var(--text-soft);font-size:13px}.call-chart{flex-direction:column;gap:6px;margin:0;padding:8px 0 0;list-style:none;display:flex}.call-chart li{border:1px solid var(--border);background:var(--surface);color:var(--text-soft);border-radius:10px;justify-content:space-between;align-items:center;padding:8px 10px;font-size:13px;display:flex}.pos-list-inline{color:var(--muted-2);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:6px 12px;margin-top:10px;font-size:12px;display:grid}.row-buttons{align-items:center;gap:8px;display:flex}
.elo-change{align-items:center;gap:4px;font-size:12px;animation:.8s elo-pop;display:inline-flex}.elo-gain{color:var(--accent)}.elo-loss{color:var(--muted)}@keyframes elo-pop{0%{opacity:0;transform:translateY(4px)}50%{opacity:1;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.elo-main{align-items:center;gap:8px;display:flex}.rank-display .rank-big{font-size:22px;font-weight:800}.rank-display .rank-global{color:var(--muted-2);margin-top:4px;font-size:12px}.rank-global-change{justify-content:flex-end;width:100%;margin-top:4px;font-size:12px;display:inline-flex}
.stat-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:16px;display:grid}.stat-card{border:1px solid var(--border);background:var(--surface-raised);border-radius:14px;padding:14px}.stat-number{font-size:22px;font-weight:800}.preferred-hands{border:1px solid var(--border);background:var(--surface-raised);border-radius:12px;flex-direction:column;gap:10px;margin-top:14px;padding:12px;display:flex}.pref-buttons{flex-wrap:wrap;gap:8px;display:flex}.pref-buttons .pref-button{border-radius:10px;flex:1 0 120px;margin-left:0}
.modal-backdrop{z-index:50;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-scrim{background:var(--scrim);position:absolute;inset:0}.modal-card{width:100%;max-width:560px;padding:var(--space-6);border:1px solid var(--border-strong);background:var(--surface);z-index:1;border-radius:18px;position:relative}.modal-card.modal-card-wide{width:min(94vw,900px);max-width:900px}.modal-head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.runout-elo-note{border:1px solid var(--border);background:var(--surface-raised);color:var(--text-soft);border-radius:12px;margin-top:12px;padding:10px 12px;font-weight:600}.congrats-card{text-align:center;flex-direction:column;align-items:center;gap:14px;display:flex;overflow:hidden}.congrats-content{z-index:1;flex-direction:column;align-items:center;gap:12px;display:flex;position:relative}.congrats-title{font-size:24px;font-weight:800}.congrats-text{color:var(--muted-2);max-width:360px;font-size:16px}.congrats-rank{border:1px solid var(--border);background:var(--surface-raised);border-radius:12px;align-items:center;gap:12px;padding:10px 14px;display:flex}.congrats-rank img{object-fit:contain;width:64px;height:64px}.congrats-rank-name{font-size:18px;font-weight:700}.stats-footer{margin-top:12px}
.outs-panel .meta{margin-top:var(--space-3)}.result-banner{margin-top:var(--space-4);padding:var(--space-4);border:1px solid var(--border);background:var(--surface-raised);border-radius:14px;font-size:14px}.result-perfect{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}.result-close{border-color:var(--border-strong);color:var(--text-soft)}.result-wrong{border-color:var(--border);color:var(--muted)}
.coach-panel{min-height:180px}.coach-body{margin-top:var(--space-4)}.coach-loading{color:var(--text-soft);margin-top:12px}.loading-track{background:var(--surface-hover);border-radius:999px;width:100%;height:8px;margin-top:10px;overflow:hidden}.loading-bar{background:var(--accent);width:60%;height:100%;animation:1.2s ease-in-out infinite pulse-bar}@keyframes pulse-bar{0%{transform:translate(-40%)}50%{transform:translate(10%)}to{transform:translate(60%)}}.coach-error{color:var(--text-soft);margin-top:12px}.reason-list{color:var(--text-soft);gap:var(--space-2);flex-direction:column;margin:0;padding-left:18px;line-height:1.6;display:flex}.chip-row{gap:var(--space-2);padding-top:var(--space-2);flex-wrap:wrap;display:flex}.chip{border:1px solid var(--border-strong);background:var(--surface-raised);color:var(--muted);border-radius:999px;padding:6px 10px;font-size:12px;display:inline-flex}
.rank-list{flex-direction:column;gap:10px;margin-top:16px;display:flex}.rank-row{border:1px solid var(--border);background:var(--surface-raised);border-radius:12px;align-items:center;gap:12px;padding:10px 12px;display:flex}.rank-top{margin-left:auto;font-size:14px;font-weight:700}.rank-row.current{border-color:var(--accent);background:var(--accent-soft)}.rank-row-text{flex-direction:column;gap:4px;display:flex}
.verdict-pill{border:1px solid var(--border-strong);letter-spacing:.04em;color:var(--text-soft);border-radius:999px;padding:6px 10px;font-size:12px}.verdict-pill.perfect,.verdict-pill.great{border-color:var(--accent);background:var(--accent);color:var(--on-accent);font-weight:700}.verdict-pill.good{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}.verdict-pill.neutral{border-color:var(--accent-border);color:var(--text)}.verdict-pill.not-ideal{border-color:var(--border-strong);color:var(--muted)}.verdict-pill.bad{border-color:var(--border);background:var(--surface-raised);color:var(--muted-2)}.result-pill{border:1px solid var(--border-strong);background:var(--surface-raised);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:700}.result-pill.win{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}.result-pill.lose{color:var(--muted)}.result-pill.chop{border-color:var(--accent-border);color:var(--text)}.result-pill.fold{color:var(--muted)}
.card-shell{--card-w:84px;--card-h:116px;width:var(--card-w);height:var(--card-h);flex:0 0 var(--card-w);border:1px solid var(--card-border);background:var(--card-face);color:var(--card-ink);border-radius:10px;flex-direction:column;justify-content:space-between;padding:10px;display:flex;position:relative;overflow:hidden}.card-shell.small{--card-w:72px;--card-h:112px;width:var(--card-w);height:var(--card-h);padding:12px}.card-face{flex-direction:column;justify-content:space-between;height:100%;display:flex}.card-back{background:var(--card-back);border:1px solid var(--card-back-border);justify-content:center;align-items:center;display:flex}.card-back-inner{border:1px solid var(--card-back-border);border-radius:8px;width:100%;height:100%}.card-empty{border:1px solid var(--card-border);background:var(--card-face);justify-content:center;align-items:center;display:flex}.card-flip{transform-style:preserve-3d;animation:.7s flip-in}@keyframes flip-in{0%{opacity:0;transform:rotateY(90deg)}60%{opacity:1;transform:rotateY(-6deg)}to{transform:rotateY(0)}}.card-rank{align-items:center;gap:6px;font-size:14px;font-weight:700;display:flex}.card-rank.bottom{align-self:flex-end;transform:rotate(180deg)}.card-rank .suit{margin-left:2px}.card-suit{text-align:center;font-size:30px;font-weight:800}.card-face.red{color:var(--card-red)}.card-face.dark{color:var(--card-ink)}.board-panel .card-shell{background:var(--card-face)}.board-panel .card-back{background:var(--card-back);border-color:var(--card-back-border)}
.showdown-panel{flex-direction:column;gap:12px;display:flex}.showdown-board{border:1px solid var(--border);background:var(--surface-raised);border-radius:12px;gap:8px;min-width:0;padding:10px 12px;display:flex;overflow-x:auto}.showdown-players{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;display:grid}.showdown-player{border:1px solid var(--border);background:var(--surface-raised);border-radius:12px;flex-direction:column;gap:6px;padding:10px 12px;display:flex}.showdown-player.hero{border-color:var(--accent-border)}.showdown-player.winner{border-color:var(--accent);background:var(--accent-soft)}.showdown-hand{align-items:center;gap:8px;display:flex}.chip-hero{border-color:var(--accent-border);color:var(--text)}.chip-win{border-color:var(--accent);color:var(--accent)}.chip-ghost{border-color:var(--border-strong);color:var(--text-soft)}