:root{--velvet-ink: #1b1d27;--velvet-abyss: #202233;--velvet-navy: #313866;--velvet-indigo: #50409a;--velvet-purple: #964ec2;--velvet-pink: #ff7bbf;--surface: rgba(34, 35, 54, .94);--surface-strong: rgba(44, 44, 75, .96);--surface-soft: rgba(255, 255, 255, .055);--border: rgba(255, 123, 191, .24);--border-muted: rgba(197, 173, 255, .16);--text: #fbf7ff;--text-muted: #c9c2da;--text-subtle: #9f96b8;--gold: #f5cf7a;--success: #7bf0c0;--success-bg: rgba(55, 164, 124, .16);--error: #ff8b9d;--error-bg: rgba(255, 91, 124, .16);--shadow: 0 20px 54px rgba(5, 6, 18, .42);--glow: 0 0 0 1px rgba(255, 123, 191, .18), 0 20px 60px rgba(150, 78, 194, .2);color:var(--text);background:var(--velvet-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{background:radial-gradient(circle at 20% 8%,rgba(255,123,191,.16),transparent 28%),radial-gradient(circle at 86% 18%,rgba(150,78,194,.2),transparent 34%),linear-gradient(135deg,#161820,#24263a 42%,#171923);margin:0;min-height:100vh;min-width:320px}button,input,select{font:inherit}button{background:#ffffff12;border:1px solid var(--border-muted);border-radius:7px;color:var(--text);cursor:pointer;min-height:40px;padding:0 14px;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}button:hover{border-color:#ff7bbf8c;box-shadow:0 0 18px #ff7bbf1f}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--velvet-pink);outline-offset:2px}button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:.5}.app-shell{margin:0 auto;padding:30px 0 42px;width:min(1180px,calc(100vw - 32px))}.top-bar,.panel-heading,.top-actions,.session-stats,.tags,.toggle-grid,.segmented,.fu-totals{align-items:center;display:flex}.top-bar{gap:24px;justify-content:space-between;margin-bottom:22px}.top-actions{align-items:stretch;gap:10px;justify-content:flex-end}h1,h2,h3,p{margin:0}h1{color:#fff;font-size:clamp(2.15rem,5vw,4.4rem);letter-spacing:0;line-height:.96;text-shadow:0 0 26px rgba(255,123,191,.18)}h2{color:var(--text);font-size:1.12rem;line-height:1.2}h3{color:var(--gold);font-size:.78rem;font-weight:800;letter-spacing:0;margin-bottom:8px;text-transform:uppercase}.eyebrow{color:var(--velvet-pink);font-size:.76rem;font-weight:900;letter-spacing:0;margin-bottom:5px;text-transform:uppercase}.session-stats{background:linear-gradient(180deg,#313866db,#1f2032eb);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);flex-wrap:wrap;gap:12px;justify-content:flex-end;padding:10px}.session-stats span{color:var(--text-muted);font-size:.9rem}.session-stats strong{color:#fff;font-size:1.2rem;margin-left:4px}.session-stats button{background:#ffffff14;border-color:#f5cf7a4d;color:var(--gold);font-weight:800}.main-grid{display:grid;gap:16px;grid-template-columns:minmax(0,1.45fr) minmax(320px,.85fr)}.panel{background:linear-gradient(180deg,rgba(255,255,255,.045),transparent),var(--surface);border:1px solid var(--border-muted);border-radius:8px;box-shadow:var(--shadow);padding:18px}.hand-panel{background:linear-gradient(140deg,rgba(255,123,191,.09),transparent 30%),linear-gradient(180deg,#50409a54,#171826f5),var(--surface-strong);border-color:#ff7bbf57;box-shadow:var(--glow)}.panel-heading{gap:16px;justify-content:space-between;margin-bottom:18px}.tags{flex-wrap:wrap;gap:6px;justify-content:flex-end}.tags span{background:#ff7bbf1a;border:1px solid rgba(255,123,191,.24);border-radius:999px;color:var(--text-muted);font-size:.75rem;font-weight:800;padding:4px 8px}.tile-section+.tile-section,.hand-details{margin-top:20px}.tiles,.meld-list{display:flex;flex-wrap:wrap;gap:8px}.meld-list{gap:13px}.concealed-kan-list{margin-top:10px}.concealed-kan{opacity:.94}.tile{align-items:center;aspect-ratio:3 / 4;background:linear-gradient(180deg,#f0eef5,#d7d1e3);border:1px solid rgba(255,255,255,.22);border-radius:4px;box-shadow:0 8px 18px #00000047,0 0 0 1px #ffffff14;box-sizing:border-box;display:inline-flex;flex-direction:column;inline-size:44px;justify-content:center;padding-inline:6px;position:relative;vertical-align:middle}.compact .tile{inline-size:34px;padding-inline:4px}.tile.rotated{transform:rotate(90deg);transform-origin:center}.meld .tile.rotated{margin-inline:8px}.win-value .tile.rotated{margin-inline:6px}.tile.muted{opacity:.72}.tile.face-down{background:linear-gradient(180deg,#f7f0ff,#6551a6);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 0 0 3px #31386673,0 8px 18px #00000047}.tile-image{block-size:100%;display:block;inline-size:100%;object-fit:contain;-webkit-user-select:none;user-select:none}.tile-note{background:#1b1d27db;border:1px solid rgba(255,123,191,.34);border-radius:999px;color:#fff;font-size:.48rem;font-weight:900;line-height:1;max-inline-size:calc(100% - 2px);overflow:hidden;padding:1px 2px;position:absolute;right:-1px;text-overflow:ellipsis;top:2px;white-space:nowrap}.hand-details{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr))}.hand-details>div{background:#0f101b6b;border:1px solid rgba(245,207,122,.2);border-radius:7px;min-height:70px;padding:10px}.hand-details .detail-label{color:var(--text-subtle);display:block;font-size:.72rem;font-weight:900;margin-bottom:6px;text-transform:uppercase}.wind-value,.win-value{align-items:center;color:var(--text);display:flex;gap:10px}.wind-value .tile,.win-value .tile{min-width:34px}.toggle-grid{align-items:stretch;display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:14px}.toggle{align-items:center;display:inline-flex;gap:8px;min-height:36px}.toggle input{accent-color:var(--velvet-pink);block-size:18px;inline-size:18px}.toggle span{color:var(--text-muted);font-size:.9rem;font-weight:750}.segmented{background:#0a0b1470;border:1px solid var(--border-muted);border-radius:8px;gap:4px;margin-bottom:14px;padding:4px}.segmented button{border-color:transparent;flex:1}.segmented button.active{background:linear-gradient(135deg,var(--velvet-indigo),var(--velvet-purple));box-shadow:0 0 20px #964ec240;color:#fff}.answer-grid{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.answer-group{border-top:1px solid var(--border-muted);margin-top:14px;padding-top:14px}.answer-group:first-of-type{margin-top:0}.settings-button,.inline-info-toggle{align-items:center;background:#964ec229;border-color:#ff7bbf47;color:var(--velvet-pink);display:inline-flex;font-weight:900;justify-content:center;padding:0}.settings-button{border-radius:8px;box-shadow:var(--shadow);height:62px;min-height:62px;width:48px}.inline-info-toggle{border-radius:50%;height:20px;margin-left:6px;min-height:20px;width:20px}.floating-popover{background:#1c1d2efa;border:1px solid var(--border);border-radius:8px;box-shadow:0 24px 72px #00000080;color:var(--text);max-width:min(320px,calc(100vw - 24px));padding:14px;z-index:20}.info-popover{background:#29233afa;border-color:#f5cf7a52;padding-right:42px}.wide-popover{left:50%!important;max-height:min(78vh,760px);max-width:min(760px,calc(100vw - 24px));overflow:auto;position:fixed!important;top:50%!important;transform:translate(-50%,-50%);width:min(760px,calc(100vw - 24px))}.popover-copy{display:grid;gap:12px}.popover-copy p{color:var(--text-muted);font-size:.88rem;font-weight:700;line-height:1.35}.points-reference{display:grid;gap:14px}.points-reference-note{color:var(--text-muted);font-size:.8rem;font-weight:750}.points-chart-table,.points-limit-table{border-collapse:collapse;width:100%}.points-chart-table th,.points-chart-table td,.points-limit-table th,.points-limit-table td{border:1px solid rgba(255,123,191,.2);padding:5px 6px;text-align:center;vertical-align:middle}.points-chart-table{table-layout:fixed}.points-chart-table .points-side-col{width:calc((100% - 72px)/8)}.points-chart-table .points-fu-col{width:72px}.points-chart-table thead th,.points-limit-table thead th{background:#50409a85;color:#fff;font-size:.7rem;font-weight:900;text-transform:uppercase}.points-chart-table thead .span-header{font-size:.72rem}.points-chart-table .fu-spacer{background:#50409a85;width:72px}.points-chart-table tbody th,.points-limit-table tbody th{background:#313866a3;color:var(--gold);font-size:.73rem;font-weight:900;white-space:nowrap}.points-chart-table td,.points-limit-table td{background:#ffffff0b;min-width:0}.points-main,.points-sub{display:block;line-height:1.15}.points-main{color:var(--text);font-size:.8rem;font-weight:900}.points-main.unavailable{color:var(--text-subtle)}.points-sub{color:var(--text-muted);font-size:.66rem;font-weight:700;margin-top:2px}.points-sub-inline{display:inline;font-size:.58rem;margin-top:0;white-space:nowrap}.points-limit-table td,.points-limit-table td .points-main,.points-limit-table td .points-sub{text-align:left}.points-main-label{font-size:.78rem}.tile-order{align-items:center;display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.tile-order-step{align-items:center;display:inline-flex;gap:5px}.tile-order .tile{min-width:34px}.order-arrow{color:var(--velvet-pink);font-size:.8rem;font-weight:900}.popover-close{align-items:center;background:transparent;border:0;color:var(--text-muted);display:inline-flex;height:28px;justify-content:center;min-height:28px;padding:0;position:absolute;right:6px;top:6px;width:28px}.inline-close{position:static}.settings-popover{position:relative;width:min(320px,calc(100vw - 24px))}.settings-heading{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.settings-heading h2{font-size:1rem}.settings-section{border-top:1px solid var(--border-muted);display:grid;gap:8px;padding:12px 0 0}.settings-section+.settings-section{margin-top:12px}.settings-section:first-of-type{border-top:0;padding-top:0}.settings-section h3{margin-bottom:0}.settings-toggle-grid{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.settings-toggle-grid .toggle span,.settings-section>.toggle span{text-transform:none}.compact-segmented{margin-bottom:0}.field{display:grid;gap:6px}.field span{color:var(--text-muted);font-size:.74rem;font-weight:900;text-transform:uppercase}.field input,.field select{background:#090a128c;border:1px solid rgba(197,173,255,.2);border-radius:7px;color:var(--text);min-height:42px;min-width:0;padding:0 10px;width:100%}.field select option{background:var(--velvet-abyss);color:var(--text)}.binary-field{align-content:end;background:#ffffff09;border:1px solid var(--border-muted);border-radius:7px;padding:8px 10px}.binary-field input{accent-color:var(--velvet-pink);block-size:22px;inline-size:22px;min-height:22px;padding:0;width:22px}.field.correct input,.field.correct select{border-color:#7bf0c0d1;box-shadow:0 0 0 2px #7bf0c024}.field.incorrect input,.field.incorrect select{border-color:#ff8b9ddb;box-shadow:0 0 0 2px #ff8b9d24}.primary-action{background:linear-gradient(135deg,var(--velvet-indigo),var(--velvet-purple));border-color:#ffffff29;box-shadow:0 12px 28px #964ec247;color:#fff;font-weight:900;margin-top:14px;width:100%}.primary-action:hover{border-color:#ffffff6b;box-shadow:0 16px 34px #ff7bbf3d;transform:translateY(-1px)}.result{border-radius:7px;font-weight:900;margin-top:12px;padding:10px}.result.success{background:var(--success-bg);border:1px solid rgba(123,240,192,.28);color:var(--success)}.result.error{background:var(--error-bg);border:1px solid rgba(255,139,157,.28);color:var(--error)}.explanation{margin-top:16px}.answer-summary{color:var(--gold);text-align:right}.breakdown-grid{display:grid;gap:18px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.breakdown-list{display:grid;gap:8px;list-style:none;margin:0;padding:0}.breakdown-list li{align-items:center;background:#ffffff0b;border:1px solid var(--border-muted);border-radius:7px;display:grid;gap:8px;grid-template-columns:76px minmax(0,1fr) auto;min-height:42px;padding:8px 10px}.breakdown-list span{color:var(--velvet-pink);font-size:.84rem;font-weight:900}.breakdown-list strong{color:var(--text);font-size:.92rem}.breakdown-list em{color:var(--text-subtle);font-size:.76rem;font-style:normal;font-weight:800}.fu-totals{background:#50409a38;border:1px solid rgba(255,123,191,.22);border-radius:7px;flex-wrap:wrap;gap:8px;margin-top:10px;padding:10px}.fu-totals span,.fu-totals strong{color:var(--text-muted);font-size:.86rem}.fu-totals strong{color:var(--gold)}.limit-note{background:#f5cf7a1f;border:1px solid rgba(245,207,122,.28);border-radius:7px;color:#f8df9c;font-weight:750;margin-top:14px;padding:12px}.problem-hash{color:var(--text-subtle);font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.68rem;font-weight:750;line-height:1;margin-top:12px;text-align:right}.next-action{min-height:40px;max-width:220px;padding-inline:18px}.app-footer{border-top:1px solid var(--border-muted);color:var(--text-subtle);display:grid;font-size:.86rem;gap:6px;margin-top:24px;padding:18px 0 0;text-align:center}.app-footer a{color:var(--velvet-pink);font-weight:900}.notice-backdrop{align-items:center;background:#090a12ad;display:flex;inset:0;justify-content:center;padding:18px;position:fixed;z-index:30}.notice-dialog{border-color:#ff7bbf61;box-shadow:0 0 0 1px #ff7bbf2e,0 28px 90px #00000094;max-width:420px;width:min(100%,420px)}.notice-dialog p:not(.eyebrow){color:var(--text-muted);font-size:.95rem;font-weight:700;line-height:1.45;margin-top:10px}@media(max-width:900px){.top-bar,.panel-heading{align-items:flex-start;flex-direction:column}.main-grid,.breakdown-grid{grid-template-columns:1fr}.session-stats,.top-actions,.tags{justify-content:flex-start}.top-actions{flex-wrap:wrap}}@media(max-width:620px){.app-shell{padding-top:16px;width:min(100vw - 20px,1180px)}.top-actions{display:grid;grid-template-columns:minmax(0,1fr) 48px;width:100%}.session-stats{gap:9px;min-width:0}.session-stats span{font-size:.84rem}.session-stats strong{font-size:1.08rem}.panel{padding:14px}.hand-details,.answer-grid,.toggle-grid{grid-template-columns:1fr}.tile{min-width:36px}.breakdown-list li{align-items:start;grid-template-columns:64px minmax(0,1fr)}.breakdown-list em{grid-column:2}}