:root{--blue:#3b6ff0;--green:#2fb344;--red:#e4572e;--txt:#1f2a44;--mut:#7a88a8;--panel:#f5f9ff;--line:#dbe5fa}
*{box-sizing:border-box}
body{margin:0;font:14px/1.45 "Segoe UI",Roboto,sans-serif;color:var(--txt);background:linear-gradient(135deg,#cfe0ff,#e6eeff);min-height:100vh}
#app{display:flex;min-height:100vh}.wrap{flex:1;min-width:0;display:flex;flex-direction:column}
.side{width:210px;flex:none;background:linear-gradient(#3f68e8,#2b4ac4);color:#fff}
.logo{font-weight:700;padding:16px;font-size:15px}
.side nav a{display:flex;gap:10px;padding:10px 16px;color:#e3eaff;text-decoration:none;transition:.2s}
.side nav a:hover,.side nav a.on{background:rgba(255,255,255,.18);color:#fff}
.top{display:flex;align-items:center;gap:16px;padding:10px 20px;background:#4a74f0;color:#fff}
.top select,.top button{border:0;border-radius:8px;padding:5px 10px}
main{padding:16px 20px;flex:1}
.panel{background:var(--panel);border-radius:18px;padding:16px;box-shadow:0 4px 18px rgba(60,100,200,.12);margin-bottom:14px;animation:up .45s both;position:relative}
@keyframes up{from{opacity:0;transform:translateY(8px)}}
h3{margin:0 0 10px;font-size:15px}.muted{color:var(--mut)}.spacer{flex:1}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
button{font:inherit;border:1px solid var(--line);background:#fff;border-radius:10px;padding:7px 14px;cursor:pointer;transition:.15s}
button:hover{background:#eaf1ff}button.primary{background:var(--blue);border-color:var(--blue);color:#fff}button.primary:hover{background:#2f5bea}
button:disabled{opacity:.5;cursor:default}
input,select,textarea{font:inherit;border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:#fff}
label{display:inline-flex;flex-direction:column;gap:3px;font-size:12px;color:var(--mut)}label.sw{flex-direction:row;align-items:center;color:#fff;font-size:13px;gap:6px}
.badge{padding:2px 10px;border-radius:20px;font-size:12px;background:#e3ebfb}.badge.ok{background:#d6f3dc;color:#1c7a2e}.badge.warn{background:#fff0c9;color:#8a6200}
.err{color:var(--red)}.filters{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
/* дашборд */
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.kpi{margin:0}.kpi-h{font-weight:600;margin-bottom:6px}
.kpi-b{display:flex;align-items:center;gap:12px}.ringbox{position:relative;width:76px;height:76px;flex:none}
.ring{width:100%;height:100%}.ring-bg{fill:none;stroke:#dfe8fb;stroke-width:10}.ring circle:nth-child(2){animation:draw 1s ease-out}
@keyframes draw{from{stroke-dasharray:0 999}}
.ring-n{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;font-weight:700}
.kpi-v b{font-size:19px;display:block}.kpi-v small{color:var(--mut)}
.gauge{text-align:center}.gauge svg{width:130px}.gauge b{display:block;font-size:19px;margin-top:-18px}.gv{animation:draw 1s ease-out}
.mid{display:grid;grid-template-columns:1fr 340px;gap:14px;margin-top:14px}
.chartp{display:grid;grid-template-columns:1fr 210px;gap:14px}.chart{width:100%;height:auto}.grid{stroke:#e1e9fa}.ax{font-size:10px;fill:var(--mut)}
.legend{display:flex;gap:16px;font-size:12px;color:var(--mut);margin:4px 0}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}
.big{font-size:26px;font-weight:700}.stat{border-bottom:1px solid var(--line);padding:6px 0}.stat b{display:block;font-size:20px}.stat small{color:var(--mut)}.spark{width:100%;height:36px}
.convs{display:grid;grid-template-columns:1fr 1fr;gap:12px}.conv{text-align:center}.conv .ringbox{margin:0 auto}.conv small{display:block;color:var(--mut)}
.donutbox{position:relative;width:150px;margin:8px auto}.donut{width:100%}.donut-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-weight:700;font-size:15px}
.dl{font-size:12px;display:flex;gap:6px;align-items:center}.dl i{width:10px;height:10px;border-radius:50%}
table.t{width:100%;border-collapse:collapse;font-size:13px;cursor:default;user-select:none}
.t th{text-align:right;padding:7px 8px;color:var(--mut);font-weight:600;border-bottom:2px solid var(--line)}.t td{padding:7px 8px;text-align:right;border-bottom:1px solid var(--line)}
.t th:first-child,.t td:first-child,.t.left td,.t.left th{text-align:left}.t tr.tot td{font-weight:700;background:#eaf1ff}
.fv{display:inline-block;padding:1px 8px;border-radius:8px;font-weight:600}.fv.ok{background:#d6f3dc;color:#1c7a2e}.fv.bad{background:#fde0d8;color:#b3361a}.pv{display:block;font-size:11px;color:var(--mut)}
.tl{display:flex;position:relative;height:160px}.tl-line{position:absolute;left:0;right:0;top:50%;height:3px;background:#b9ccf7}
.tl-i{flex:1;position:relative}.dot{position:absolute;left:50%;top:50%;width:14px;height:14px;border-radius:50%;background:var(--blue);transform:translate(-50%,-50%)}
.tl-t,.tl-d{position:absolute;left:0;right:0;text-align:center;font-size:12px;padding:0 4px}.tl-t b{display:block}.tl-t small{color:var(--mut)}.tl-d{color:var(--blue);font-weight:600}
.up .tl-t{bottom:56%}.up .tl-d{top:56%}.dn .tl-t{top:56%}.dn .tl-d{bottom:56%}
.print-title{display:none}
/* симулятор */
.sim-head{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}.seg button{border-radius:0}.seg button.on{background:var(--blue);color:#fff}
.sim-cols{display:grid;grid-template-columns:1fr 380px;gap:14px}.locked{opacity:.5;pointer-events:none}
.srow{display:grid;grid-template-columns:150px 120px 1fr 90px 22px;gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid var(--line)}
.srow.target{background:#eef4ff}.srow.comp{background:#fff6dc}.sl-name{font-weight:600}.srow input[type=number]{width:90px}
.chip{font-size:11px;padding:1px 8px;border-radius:10px;background:#e3ebfb}.chip.target{background:#cfe0ff}.chip.comp{background:#ffe7a8}
.decomp{position:sticky;top:10px;align-self:start}.warn-box{background:#fff4d6;border-radius:10px;padding:8px 12px;margin-top:8px;font-size:13px}.formula{font-family:monospace;background:#eaf1ff;padding:4px 8px;border-radius:6px;display:inline-block}
/* модалки, тосты, прочее */
.modal-bg{position:fixed;inset:0;background:rgba(20,35,80,.45);display:grid;place-items:center;z-index:50}
.modal{background:#fff;border-radius:16px;padding:22px;min-width:360px;max-width:560px;animation:up .25s}.modal-btns{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.toast{position:fixed;right:20px;bottom:20px;background:#1f2a44;color:#fff;padding:10px 18px;border-radius:10px;z-index:60;animation:up .3s}.toast.err{background:var(--red)}
.lock-note{text-align:center;padding:60px 20px;font-size:16px}.banner{background:#fff0c9;border-radius:12px;padding:8px 14px;margin-bottom:12px}
.login{margin:12vh auto;width:340px}.login input{width:100%;margin-bottom:10px}.rules li{margin:6px 0}details.rep{border-bottom:1px solid var(--line);padding:8px 0}details.rep summary{cursor:pointer}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;max-width:760px}.form-grid label{color:var(--txt)}
@media print{@page{size:A4 landscape;margin:10mm}body{background:#fff}.side,.top,.filters,#pdf-bar,.banner{display:none!important}.print-title{display:block;font-size:18px;font-weight:700;margin-bottom:8px}.panel{box-shadow:none;break-inside:avoid;animation:none}}