 :root{--bg:#f4f6f9;--panel:#fff;--text:#172033;--muted:#6b7280;--line:#e5e7eb;--nav:#111827;--accent:#2563eb;--green:#14b8a6;--shadow:0 12px 35px #18233c12}
body.dark{--bg:#0f172a;--panel:#172033;--text:#f8fafc;--muted:#aab2c0;--line:#2d3748;--nav:#050913}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}
aside{position:fixed;inset:0 auto 0 0;width:260px;background:linear-gradient(180deg,var(--nav),#0b1220);color:#fff;padding:24px 18px;overflow:auto}.brand{font-size:26px;font-weight:900;display:flex;gap:11px;align-items:center}.brand span{font-size:17px}.brand small{display:block;color:#9ca3af;font-size:11px;font-weight:500}
nav{display:grid;gap:4px;margin:28px 0}nav a{color:#bec6d4;text-decoration:none;padding:11px;border-radius:10px;font-weight:700;font-size:13px}nav a:hover{background:#ffffff12;color:#fff}.weights,.save{background:#ffffff10;border:1px solid #ffffff12;border-radius:15px;padding:14px}.weights p{font-size:11px;color:#bac1ce}.save{margin-top:12px;display:grid;gap:8px}
.wrow{margin:10px 0}.wrow div{display:flex;justify-content:space-between;font-size:11px}.wrow input{width:100%;accent-color:#60a5fa}
main{margin-left:260px;padding:32px 38px 50px;min-width:0}header{display:flex;justify-content:space-between;gap:25px;align-items:flex-start}h1{font-size:34px;margin:4px 0 7px}header p,.title p{color:var(--muted)}.eyebrow{font-size:10px;letter-spacing:.13em;color:var(--accent);font-weight:900}
.cardx,.kpi,.rank,.chart,.compare-card{background:var(--panel);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow)}
.filters{margin:25px 0;display:grid;grid-template-columns:1.2fr .8fr repeat(4,1fr);gap:14px;padding:17px}.filters label{font-size:11px;font-weight:800;color:var(--muted)}.filters input,.filters select{margin-top:6px}.filters input[type=range]{width:100%;accent-color:var(--accent)}.filters b{display:block;color:var(--text);margin-top:3px}.filter-foot{grid-column:1/-1;border-top:1px solid var(--line);padding-top:12px;display:flex;gap:18px}.filter-foot span{margin-left:auto;color:var(--muted)}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}.kpi{padding:17px}.kpi small,.kpi span{display:block;color:var(--muted)}.kpi strong{display:block;font-size:23px;margin:7px 0}
section{scroll-margin-top:20px}.title{margin:30px 0 13px}.title h2{font-size:23px;margin:4px 0}.rank-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.rank{padding:16px;position:relative}.rank h3{font-size:17px;margin:0 42px 3px 0}.rank .sub{color:var(--muted);font-size:11px}.num{position:absolute;right:13px;top:13px;background:var(--bg);color:var(--accent);padding:7px 10px;border-radius:9px;font-weight:900}.score{display:flex;gap:10px;align-items:center;margin:15px 0}.score b{font-size:30px}.meter{height:8px;background:var(--line);border-radius:10px;flex:1;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--green))}.mini{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.mini div{background:var(--bg);padding:8px;border-radius:9px}.mini small{display:block;color:var(--muted);font-size:9px}.star{position:absolute;right:14px;bottom:12px;border:0;background:none;color:#f59e0b;font-size:20px}
.chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.chart{padding:15px;min-width:0}.chart.wide{grid-column:span 2}.chart h5{font-size:14px}.chart>div{height:330px}.row-title{display:flex;justify-content:space-between;align-items:end}.tablebox{max-height:680px;overflow:auto;border-radius:16px;border:1px solid var(--line);background:var(--panel)}table{min-width:1450px;margin:0;color:var(--text)!important}thead{position:sticky;top:0;z-index:3}th{background:#111827!important;color:#fff!important;font-size:10px;white-space:nowrap;cursor:pointer}td{font-size:11px;border-color:var(--line)!important;vertical-align:middle}td[contenteditable=true]{outline:2px solid var(--accent);background:var(--bg)}.compare-selects,.compare-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.compare-card{padding:17px}.compare-card h3{font-size:17px}.pairs{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:11px}.pairs span{color:var(--muted)}footer{margin-top:30px;border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:11px}
#toast{position:fixed;right:24px;bottom:24px;background:#111827;color:#fff;padding:12px 16px;border-radius:10px;opacity:0;transition:.2s}#toast.show{opacity:1}
@media(max-width:1100px){.filters{grid-template-columns:repeat(3,1fr)}.kpis{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){aside{position:relative;width:auto}.weights,.save{display:none}main{margin:0;padding:20px}.rank-grid,.chart-grid,.compare-grid{grid-template-columns:1fr}.chart.wide{grid-column:auto}.filters,.kpis,.compare-selects{grid-template-columns:1fr}header{display:block}}.weights-intro{line-height:1.45;margin-bottom:10px}.weight-summary{display:flex;justify-content:space-between;align-items:center;background:#ffffff10;border-radius:9px;padding:8px 9px;margin-bottom:10px;font-size:11px}.weight-summary b{font-size:13px;color:#93c5fd}.weight-summary b.warn{color:#fbbf24}.weight-note{font-size:10px;line-height:1.4;color:#aeb7c7;border-top:1px solid #ffffff16;padding-top:10px;margin-top:12px}.wrow{padding-bottom:10px;border-bottom:1px solid #ffffff12}.wrow:last-child{border-bottom:0}.wrow .whead{display:flex;justify-content:space-between;gap:8px;font-size:11px;font-weight:700}.wrow small{display:block;color:#aeb7c7;font-size:9px;line-height:1.35;margin:3px 0 5px}.wrow input{display:block}
