:root{--bg:#0f0e13;--surface:#1a1922;--surface-2:#23222e;--surface-muted:#15141c;--border:#ffffff14;--border-strong:#ffffff2e;--text:#eeecf0;--text-muted:#9a97a6;--text-subtle:#6b6878;--accent:#a08cff;--accent-bg:#a08cff1f;--good:#4fc98d;--good-bg:#4fc98d24;--warn:#e0a048;--warn-bg:#e0a04824;--danger:#e36b6b;--danger-bg:#e36b6b24;--rarity-3:#8a8692;--rarity-4:#8c7bd4;--rarity-5:#e8b84a;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:20px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{background:var(--bg);min-height:100vh;color:var(--text);margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button{font-family:inherit}.page{max-width:1400px;margin:0 auto;padding:24px 20px 80px}.app-nav{border-bottom:1px solid var(--border);background:var(--surface-muted);z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);justify-content:space-between;align-items:center;padding:14px 24px;display:flex;position:sticky;top:0}.app-nav .brand{letter-spacing:.02em;font-size:15px;font-weight:600}.app-nav .brand span{color:var(--accent)}.app-nav .links{gap:4px;display:flex}.app-nav .links a{border-radius:var(--radius-sm);color:var(--text-muted);padding:6px 12px;font-size:13px}.app-nav .links a:hover{color:var(--text);background:var(--surface-2)}.app-nav .links a.active{color:var(--text);background:var(--accent-bg)}header.page-header{margin-bottom:20px}header.page-header h1{margin:0 0 4px;font-size:24px;font-weight:500}header.page-header p{color:var(--text-muted);margin:0;font-size:13px}.filter-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:14px;padding:14px;display:grid}.filter-group label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;font-size:10.5px;display:block}.filter-group select,.filter-group input[type=text]{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-muted);width:100%;color:var(--text);padding:7px 10px;font-family:inherit;font-size:13px}.stats-bar{color:var(--text-muted);justify-content:space-between;align-items:center;margin-bottom:10px;font-size:12px;display:flex}.stats-bar .count{color:var(--text);font-variant-numeric:tabular-nums;font-weight:500}.btn{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);cursor:pointer;padding:7px 14px;font-size:12px;transition:background .1s,border-color .1s}.btn:hover{background:var(--surface-2)}.btn.btn-primary{background:var(--accent);color:#0f0e13;border-color:var(--accent);font-weight:500}.btn.btn-primary:hover{filter:brightness(1.1)}.btn.btn-primary:disabled{opacity:.4;cursor:not-allowed}.btn.btn-ghost{background:0 0}.combo-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;display:grid}.combo-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;text-align:left;flex-direction:column;gap:8px;min-height:140px;padding:14px 16px;transition:border-color .15s,transform .15s;display:flex}.combo-card:hover{border-color:var(--accent);transform:translateY(-1px)}.combo-card .name{color:var(--text);font-size:14.5px;font-weight:500}.combo-card .slug{color:var(--text-subtle);font-family:ui-monospace,Menlo,monospace;font-size:10.5px}.combo-card .axes{flex-wrap:wrap;gap:4px;display:flex}.combo-card .bottom{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.tag{white-space:nowrap;border-radius:3px;padding:2px 8px;font-size:10.5px;font-weight:500;display:inline-block}.tag-good{background:var(--good-bg);color:var(--good)}.tag-warn{background:var(--warn-bg);color:var(--warn)}.tag-danger{background:var(--danger-bg);color:var(--danger)}.tag-neutral{background:var(--surface-2);color:var(--text-muted)}.tag-accent{background:var(--accent-bg);color:var(--accent)}.generosity-pips{gap:3px;display:inline-flex}.pip{background:var(--surface-2);border:1px solid var(--border);border-radius:50%;width:7px;height:7px}.pip.filled{background:var(--accent);border-color:var(--accent)}.player-shell{grid-template-columns:1fr 320px;align-items:start;gap:20px;display:grid}@media (width<=900px){.player-shell{grid-template-columns:1fr}}.player-main{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);min-height:400px;padding:24px}.player-meta{flex-direction:column;gap:12px;display:flex}.player-meta .meta-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px 16px}.player-meta h3{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin:0 0 8px;font-size:11px;font-weight:500}.pull-row{flex-wrap:wrap;gap:10px;margin:16px 0;display:flex}.pull-row .btn{padding:10px 18px;font-size:13px}.counter-row{color:var(--text-muted);font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:14px;margin-bottom:8px;font-size:12px;display:flex}.counter-row .kv{gap:6px;display:flex}.counter-row .kv b{color:var(--text);font-weight:500}.results-grid{grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:10px;margin-top:12px;display:grid}.unit-card{aspect-ratio:3/4;border-radius:var(--radius-md);border:1px solid var(--border-strong);background:var(--surface-2);flex-direction:column;justify-content:flex-end;padding:8px;transition:transform .2s;animation:.3s ease-out pop;display:flex;position:relative;overflow:hidden}.unit-card .unit-bg{background:linear-gradient(180deg, transparent 30%, #0006 100%), var(--unit-color,var(--surface-2));opacity:.9;position:absolute;inset:0}.unit-card .unit-name{color:#fff;text-shadow:0 1px 2px #00000080;font-size:11.5px;font-weight:500;position:relative}.unit-card .unit-rarity{color:#fff;background:#0000008c;border-radius:3px;padding:2px 6px;font-size:10px;font-weight:600;position:absolute;top:6px;right:6px}.unit-card.r5{box-shadow:0 0 0 1px var(--rarity-5), 0 0 24px -4px var(--rarity-5)}.unit-card.r4{box-shadow:0 0 0 1px var(--rarity-4)}.unit-card .flags{flex-direction:column;gap:3px;display:flex;position:absolute;top:30px;left:6px}.unit-card .flag{color:#fff;letter-spacing:.03em;text-transform:uppercase;background:#0009;border-radius:2px;padding:1px 5px;font-size:9px}@keyframes pop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.bar{background:var(--surface-muted);border-radius:3px;height:6px;margin-top:4px;overflow:hidden}.bar>span{background:var(--accent);height:100%;transition:width .3s;display:block}.bar.danger>span{background:var(--danger)}.bar.warn>span{background:var(--warn)}.bar.good>span{background:var(--good)}.history-log{max-height:220px;color:var(--text-muted);font-family:ui-monospace,Menlo,monospace;font-size:11px;overflow-y:auto}.history-log .entry{border-bottom:1px solid var(--border);padding:2px 0}.history-log .entry:last-child{border-bottom:none}.history-log .r5{color:var(--rarity-5)}.history-log .r4{color:var(--rarity-4)}.tier-list{flex-direction:column;gap:8px;display:flex}.tier-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);grid-template-columns:56px 1fr;min-height:80px;display:grid;overflow:hidden}.tier-label{background:var(--tier-color,var(--surface-2));color:#0f0e13;justify-content:center;align-items:center;font-size:22px;font-weight:600;display:flex}.tier-items{flex-wrap:wrap;align-content:flex-start;gap:6px;padding:8px;display:flex}.tier-items.drop-target{background:var(--accent-bg);outline:2px dashed var(--accent);outline-offset:-4px}.tier-item{border-radius:var(--radius-sm);background:var(--surface-2);border:1px solid var(--border-strong);cursor:grab;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;padding:6px 10px;font-size:12px;display:inline-flex}.tier-item.dragging{opacity:.4}.tier-item:hover{border-color:var(--accent)}.unranked-bar{background:var(--surface);border:1px dashed var(--border-strong);border-radius:var(--radius-md);margin-top:20px;padding:14px}.unranked-bar h3{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin:0 0 8px;font-size:11px;font-weight:500}.preview-queue{flex-wrap:wrap;gap:6px;display:flex}.preview-slot{border-radius:var(--radius-sm);border:1px dashed var(--border-strong);background:var(--unit-color,var(--surface-muted));color:#fff;text-shadow:0 1px 1px #0009;justify-content:center;align-items:flex-end;width:52px;height:68px;padding:4px;font-size:10px;display:flex}.sugoroku-track{flex-wrap:wrap;gap:4px;margin:12px 0;display:flex}.tile{background:var(--surface-muted);border:1px solid var(--border);width:28px;height:28px;color:var(--text-subtle);border-radius:4px;justify-content:center;align-items:center;font-size:10px;display:flex}.tile.milestone{background:var(--accent-bg);border-color:var(--accent);color:var(--accent)}.tile.major{background:var(--warn-bg);border-color:var(--warn);color:var(--warn)}.tile.current{outline:2px solid var(--accent);outline-offset:2px}.wishlist-picker{flex-wrap:wrap;gap:6px;display:flex}.wishlist-picker .chip{background:var(--surface-2);border:1px solid var(--border-strong);cursor:pointer;border-radius:4px;padding:5px 10px;font-size:11.5px}.wishlist-picker .chip.active{background:var(--rarity-5);color:#0f0e13;border-color:var(--rarity-5);font-weight:500}.detail-list{flex-direction:column;gap:6px;font-size:12px;display:flex}.detail-list .kv{justify-content:space-between;gap:8px;display:flex}.detail-list .kv span:first-child{color:var(--text-muted)}.layers-list{flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.empty-state{text-align:center;color:var(--text-muted);background:var(--surface);border:1px dashed var(--border-strong);border-radius:var(--radius-md);padding:32px}.step-badge{background:var(--accent-bg);color:var(--accent);letter-spacing:.04em;text-transform:uppercase;border-radius:4px;justify-content:center;align-items:center;padding:4px 10px;font-size:11px;font-weight:500;display:inline-flex}.back-link{color:var(--text-muted);align-items:center;gap:6px;margin-bottom:14px;font-size:13px;display:inline-flex}.back-link:hover{color:var(--accent)}