:root{--bg: #171a21;--fg: #c7d5e0;--muted: #8f98a0;--accent: #66c0f4;--chip: #2a475e;--stroke: #233142;--panel: #1b2838;--panel-elevated: #0f172a;--layout-max-width: 1200px;--transition: .2s ease}html,body{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;background:var(--bg);color:var(--fg)}*{box-sizing:border-box}a{color:inherit}.steam-header{width:100%;display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--stroke);background:linear-gradient(180deg,#1b2838,#171a21 85%)}.layout-wide,.layout-constrained{max-width:var(--layout-max-width);margin:0 auto;padding:0 16px}h1{margin:0;font-size:18px;font-weight:600}.app-nav{display:flex;gap:8px;align-items:center;margin-left:auto}.controls{display:flex;gap:8px;align-items:center}.app-nav a{text-decoration:none;padding:6px 12px;border:1px solid transparent;border-radius:8px;font-size:13px;background:#66c0f41f;transition:background var(--transition),border-color var(--transition),color var(--transition)}.app-nav a:hover{background:#66c0f43d;border-color:#66c0f466}.app-nav a.active{background:var(--accent);color:#0b1220}input,select,button{font:inherit;color:var(--fg);background:var(--panel);border:1px solid var(--stroke);border-radius:10px;padding:8px 12px;transition:border-color var(--transition),box-shadow var(--transition)}input:focus,select:focus,button:focus{outline:none;border-color:#66c0f499;box-shadow:0 0 0 2px #66c0f440}.pill{display:inline-flex;align-items:center;white-space:nowrap;background:var(--chip);border:1px solid var(--stroke);color:var(--fg);padding:6px 10px;border-radius:999px;font-size:12px;gap:6px}.dashboard{padding:24px 16px 32px}.main-container{max-width:var(--layout-max-width);margin:0 auto;display:flex;flex-direction:column;gap:16px}.panel{background:var(--panel);border:1px solid var(--stroke);border-radius:16px;padding:20px;box-shadow:0 16px 32px #0a0e1b40}.panel-stack{display:flex;flex-direction:column;gap:20px}.panel-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.panel-header h2{margin:0;font-size:18px;font-weight:600}.panel-heading{display:flex;flex-direction:column;gap:6px}.panel-subtitle{margin:0;font-size:13px;color:var(--muted)}.filters-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.filters-bar select{min-width:160px}.stat-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.stat-card{background:var(--panel-elevated);border:1px solid var(--stroke);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;min-height:88px}.stat-card__label{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.stat-card__value{margin:0;font-size:24px;font-weight:600;color:var(--fg)}.overall-text{color:var(--muted);font-size:13px}.chart-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.chart-card{display:flex;flex-direction:column;gap:10px}.chart-card__title{display:inline-flex;align-self:flex-start}.chart-surface{background:var(--panel-elevated);border:1px solid var(--stroke);border-radius:14px;min-height:260px;padding:16px;display:flex;align-items:stretch;justify-content:stretch}.chart-surface--center{align-items:center;justify-content:center}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.summary{background:var(--panel-elevated);border:1px solid var(--stroke);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}.summary .label{font-size:13px;color:var(--muted)}.summary .value{font-size:24px;font-weight:600}.upload-drop{border:1px dashed rgba(102,192,244,.35);border-radius:14px;background:linear-gradient(180deg,#0f172a,#0b1320);min-height:180px;display:flex;align-items:center;justify-content:center;text-align:center;padding:32px 24px;position:relative;cursor:pointer;transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition)}.upload-drop.is-busy{cursor:progress}.upload-drop.is-busy .upload-copy{opacity:.35;filter:saturate(.6);transition:opacity .2s ease}.upload-drop__mask{position:absolute;inset:0;border-radius:inherit;background:#0a1320eb;display:flex;align-items:center;justify-content:center;padding:24px;z-index:2}.upload-drop:focus-visible,.upload-drop:hover{border-color:#66c0f4b3;box-shadow:0 0 0 1px #66c0f440,0 10px 30px #0f1a2866;transform:translateY(-1px)}.upload-copy{display:flex;flex-direction:column;gap:6px;max-width:520px}.upload-title{font-size:16px;font-weight:600;margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.upload-disclaimer{margin:8px auto 0;font-size:13px;color:var(--muted)}.upload-steps{list-style:disc;margin:12px auto 0;padding:0 0 0 20px;display:flex;flex-direction:column;gap:6px;max-width:540px;color:var(--muted);font-size:13px;text-align:left}.upload-separator{color:var(--muted)}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;border:0!important}.upload-link{align-self:center;border:none;background:transparent;color:var(--accent);font-size:inherit;font-weight:600;text-decoration:underline;cursor:pointer;padding:0}.upload-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.is-hidden{display:none!important}.loading-mask{position:relative;padding:12px 0}.loading-row{display:flex;gap:10px;align-items:center;justify-content:center;font-size:14px;color:var(--muted)}.spinner{width:16px;height:16px;border:2px solid var(--accent);border-top-color:transparent;border-radius:50%;display:inline-block;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.tooltip{position:fixed;pointer-events:none;background:#000;color:#fff;font-size:12px;padding:6px 8px;border-radius:6px;opacity:0;transition:opacity .12s ease,transform .12s ease;z-index:20;max-width:360px}mark.hit{background:#fde04733;color:#fde047;border-radius:3px;padding:0 2px}@media (max-width: 960px){.chart-surface{min-height:220px}}@media (max-width: 720px){.steam-header{align-items:flex-start}.app-nav{width:100%;margin-left:0;justify-content:flex-start}.filters-bar select{min-width:140px}}@media (max-width: 560px){.dashboard{padding:20px 12px 24px}.panel{padding:16px}.stat-card__value{font-size:20px}.chart-grid{grid-template-columns:1fr}}
