:root{--accent:#0b5fff;--accent-d:#0847b8;--ink:#101828;--muted:#667085;--bg:#f4f6fa;--card:#fff;--border:#e4e7ec;--green:#067647;--amber:#b54708;--red:#e5484d;--radius:12px}
*{box-sizing:border-box}body{margin:0;font:14px/1.45 "Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink)}
h2{margin:0 0 12px}button{cursor:pointer;font:inherit}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 24px;background:#0d1b3e;color:#fff}
.logo{font-size:20px;font-weight:700}.logo span{font-weight:400;opacity:.85;font-size:14px;margin-left:8px}
.head-right{display:flex;align-items:center;gap:12px}.terms{font-size:12px;opacity:.8;text-align:right}
#adminBtn{background:#1e3060;border:1px solid #33507e;color:#cdd8f5;border-radius:8px;padding:6px 12px}
.currency-widget{background:rgba(255,255,255,.1);padding:4px 10px;border-radius:6px;font-size:12px;color:#ffd76a;border:1px solid rgba(255,215,106,.3)}.currency-widget b{color:#fff}
.tabs{display:flex;gap:8px;padding:14px 24px 0;background:#0d1b3e;flex-wrap:wrap}
.tabs button{border:0;background:#1e3060;color:#cdd8f5;padding:10px 18px;border-radius:10px 10px 0 0;font-weight:600}
.tabs button.active{background:var(--bg);color:var(--ink)}
.tabs button.admin-tab{background:#3a2b12;color:#ffd76a}
.tabs button.perf-tab{background:#123b2b;color:#b7f4d4}
.layout{display:grid;grid-template-columns:1fr 400px;gap:20px;padding:20px 24px;align-items:start}
.catalog-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px;flex-wrap:wrap}
#search{padding:9px 14px;border:1px solid var(--border);border-radius:10px;min-width:260px}
.series-title{margin:22px 0 10px;font-size:16px;font-weight:700;color:#0d1b3e}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:8px}
.card-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.badges-right{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:#eef2ff;color:#3538cd}
.badge.avail-now,.stock-ok{background:#e7f6ec;color:var(--green)}
.badge.avail-later{background:#fff4e5;color:var(--amber)}
.stock-none{background:#eef0f4;color:var(--muted)}
.card h3{margin:2px 0 0;font-size:18px}.pn{font-size:12px;color:var(--muted)}
.price-tag{font-size:12px;color:var(--green);font-weight:bold;margin-top:4px;display:block}
.specs{list-style:none;margin:6px 0;padding:0;font-size:12.5px}.specs li{display:flex;gap:6px;padding:2px 0;border-bottom:1px dashed #eef0f4}.specs b{flex:0 0 118px;color:var(--muted)}
.card-actions{margin-top:auto;display:flex;gap:8px}
.btn{border:1px solid var(--border);background:#fff;border-radius:9px;padding:8px 14px;font-weight:600}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.big{width:100%;padding:12px}.btn.ghost{color:var(--red)}.btn.small{padding:4px 10px;font-size:12px}.btn.back{margin-bottom:12px}
.panel{position:sticky;top:14px;max-height:calc(100vh - 28px);overflow:auto;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.empty{color:var(--muted);padding:20px 6px;text-align:center}
.cfg-section{margin:14px 0 6px;font-size:12px;font-weight:700;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border);padding-bottom:4px}
.cfg-item{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px dashed #eef0f4}.cfg-item .info{flex:1;min-width:0}.cfg-item .m{font-weight:600;font-size:13px}.cfg-item .d{font-size:11px;color:var(--muted)}
.qty{display:flex;align-items:center;gap:4px}.qty button{width:24px;height:24px;border-radius:6px;border:1px solid var(--border);background:#fff;font-weight:700}.qty input{width:44px;text-align:center;border:1px solid var(--border);border-radius:6px;padding:3px}.qty .rm{border:0;background:none;color:var(--red);width:22px}
.base-card{background:#f0f5ff;border:1px solid #c7d8ff;border-radius:10px;padding:12px}.base-card h3{margin:0 0 4px}
.totals-block{margin-top:15px;padding:10px;background:#f0f5ff;border:1px solid #c7d8ff;border-radius:8px}
.total-row{display:flex;justify-content:space-between;font-size:14px}.total-row b{font-size:16px;color:var(--accent)}.total-hint{font-size:10px;color:var(--muted);text-align:right}
/* выпадающие категории (details) */
details.acc{border:1px solid var(--border);border-radius:8px;margin-bottom:8px;background:#fff}
details.acc summary{cursor:pointer;padding:10px 12px;font-weight:600;background:#f8f9fa;border-radius:8px}
details.acc[open] summary{border-bottom:1px solid var(--border);border-radius:8px 8px 0 0}
.acc-body{padding:10px}
.opt-row{display:flex;gap:8px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:10px;padding:10px 12px;margin-bottom:8px}
.opt-row .info{flex:1}.opt-row .m{font-weight:600}.opt-row .d{font-size:12px;color:var(--muted)}.opt-row .pn{font-size:11px}.opt-row .cnt{color:var(--accent);font-weight:700;margin-left:6px}
.shelf-card{border:1px solid var(--border);border-radius:10px;padding:12px;margin-top:10px;background:#fbfcff}
.shelf-card h4{margin:0 0 8px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.shelf-add{display:flex;gap:8px;margin-top:10px}.shelf-add select{flex:1;padding:8px;border:1px solid var(--border);border-radius:9px}
.actions{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.hint{font-size:12px;color:var(--muted);margin:8px 0}
.foot{padding:14px 24px;color:var(--muted);font-size:12px;text-align:center}.debug{color:var(--red);font-size:12px;margin-top:6px}
.load-error{padding:60px;text-align:center;font-size:16px}
.modal{position:fixed;inset:0;background:rgba(13,27,62,.55);display:flex;align-items:center;justify-content:center;z-index:50}.modal[hidden]{display:none}
.modal-box{background:#fff;border-radius:12px;padding:22px;width:340px;display:flex;flex-direction:column;gap:10px}
.modal-box.wide{width:860px;max-width:95vw;max-height:85vh;overflow:auto}
.modal-box label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.modal-box input{padding:8px 10px;border:1px solid var(--border);border-radius:8px}
.modal-actions{display:flex;gap:8px}
.drive-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.drive-filters select,.drive-filters input{padding:6px 8px;border:1px solid var(--border);border-radius:6px}
.stock-table{width:100%;border-collapse:collapse;font-size:12.5px}.stock-table th,.stock-table td{border:1px solid var(--border);padding:6px 8px;text-align:left}.stock-table th{background:#f0f5ff}
@media(max-width:1100px){.layout{grid-template-columns:1fr}.panel{position:static;max-height:none}}
/* Модалка: крестик в правом верхнем углу */
.modal-box{position:relative}
.modal-close{position:absolute;top:10px;right:12px;border:0;background:none;font-size:22px;line-height:1;color:var(--muted);cursor:pointer}
.modal-close:hover{color:var(--red)}
/* Чекбокс-фильтр в списке дисков */
.chk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.chk input{width:auto}