:root{
  --bg:#f3f5f8; --panel:#ffffff; --side:#14324f; --side-2:#1d4268; --side-text:#cfe0f2;
  --text:#1b2430; --muted:#6a7686; --line:#e3e8ef; --accent:#1f6fd1; --accent-soft:#e6f0fc;
  --ok:#1e8a4c; --ok-soft:#e5f5ec; --warn:#b86e00; --warn-soft:#fff3df; --bad:#c23434; --bad-soft:#fde8e8;
  --ip:#7a4cc2; --ip-soft:#f0e9fb;
  --hover:#f7f9fc; --strong:#c5cfdb; --shadow:rgba(20,50,80,.08);
  --demo-bg:#fff8d6; --demo-text:#6b5500; --demo-line:#f0dc8a;
  --sold-bg:#eceff3; --sold-text:#4a5564; --toast:#1b2430;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#0f1620; --panel:#18212d; --side:#0b1119; --side-2:#1a2533; --side-text:#b7c6d8;
  --text:#e3e9f1; --muted:#8f9cad; --line:#2a3544; --accent:#3d8bef; --accent-soft:#1c2f48;
  --ok:#4cc37f; --ok-soft:#173326; --warn:#f0a43a; --warn-soft:#3a2a12; --bad:#f06464; --bad-soft:#3d1c1e;
  --ip:#b18cf0; --ip-soft:#2c2142;
  --hover:#1f2a38; --strong:#3a4757; --shadow:rgba(0,0,0,.4);
  --demo-bg:#3a3214; --demo-text:#f1dc8c; --demo-line:#5a4c1a;
  --sold-bg:#2a3340; --sold-text:#b4bfcc; --toast:#e3e9f1;
  color-scheme:dark;
}
input,select{background:var(--panel);color:var(--text)}
.theme-switch{display:flex;gap:4px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:3px;margin-top:18px}
.theme-switch button{flex:1;border:0;background:transparent;color:var(--muted);padding:7px 8px;border-radius:7px;font-size:13px}
.theme-switch button.on{background:var(--panel);color:var(--text);box-shadow:0 1px 3px var(--shadow)}
.firm-tabs{background:var(--line)}
.firm-tabs button{font-size:14px;padding:8px 14px;white-space:nowrap}
.firm-tabs button.on{background:var(--accent);color:#fff}
aside .theme-switch{background:var(--side-2);border-color:transparent;margin:10px 0 0}
aside .theme-switch button{color:var(--side-text);padding:5px 6px;font-size:12px}
aside .theme-switch button.on{background:var(--side);color:#fff}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text)}
button{font:inherit;cursor:pointer}
input,select{font:inherit}
.demo{background:var(--demo-bg);color:var(--demo-text);border-bottom:1px solid var(--demo-line);padding:6px 16px;font-size:12.5px;text-align:center}

/* вход */
#login{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 30px);padding:16px}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:32px;width:100%;max-width:360px;box-shadow:0 10px 30px var(--shadow)}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px}
.logo-mark{width:34px;height:34px;border-radius:9px;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:15px}
.login-card label{display:block;margin:16px 0 6px;color:var(--muted);font-size:13px}
.login-card input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px}
.btn{border:1px solid var(--line);background:var(--panel);padding:8px 14px;border-radius:8px;color:var(--text)}
.btn:hover{border-color:var(--strong)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{filter:brightness(1.07)}
.btn.small{padding:5px 10px;font-size:13px}
.login-card .btn{width:100%;margin-top:22px;padding:11px}
.hint{color:var(--muted);font-size:12px;margin-top:12px}

/* каркас */
#app{display:none;min-height:calc(100vh - 30px)}
#app.on{display:flex}
aside{width:228px;flex:none;background:var(--side);color:var(--side-text);display:flex;flex-direction:column;padding:16px 10px}
aside .logo{color:#fff;padding:4px 8px 18px}
nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:var(--side-text);text-decoration:none;margin-bottom:2px}
nav a:hover{background:var(--side-2)}
nav a.active{background:var(--accent);color:#fff}
nav .ico{width:18px;text-align:center}
nav .count{margin-left:auto;background:var(--bad);color:#fff;border-radius:10px;font-size:11px;padding:1px 7px}
.user{margin-top:auto;padding:12px;border-top:1px solid var(--side-2);font-size:13px}
.user b{color:#fff;display:block}
.user a{color:var(--side-text);font-size:12px}
main{flex:1;min-width:0;padding:22px 28px 40px}
.top{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.top h1{font-size:22px;margin:0;margin-right:auto}
.search{padding:8px 12px;border:1px solid var(--line);border-radius:8px;width:280px;background:var(--panel)}
.crumbs{color:var(--muted);font-size:13px;margin-bottom:4px}
.crumbs a{color:var(--accent);text-decoration:none}

/* блоки */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.tiles.six{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1200px){.tiles.six{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.tiles.six{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.tile .k{color:var(--muted);font-size:13px}
.tile .v{font-size:28px;font-weight:700;margin-top:4px}
.tile .s{color:var(--muted);font-size:12px}
.tile.bad .v{color:var(--bad)}
.grid2{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:14px;min-width:0}
.card h2{font-size:15px;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.card h2 .r{margin-left:auto;font-weight:400}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-weight:600;color:var(--muted);font-size:12.5px;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--hover)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.tbl-wrap{overflow-x:auto}
.bar{height:8px;border-radius:4px;background:var(--line);overflow:hidden;min-width:80px}
.bar i{display:block;height:100%;background:var(--accent)}
.tag{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;white-space:nowrap}
.tag.ok{background:var(--ok-soft);color:var(--ok)}
.tag.warn{background:var(--warn-soft);color:var(--warn)}
.tag.bad{background:var(--bad-soft);color:var(--bad)}
.tag.ip{background:var(--ip-soft);color:var(--ip)}
.tag.info{background:var(--accent-soft);color:var(--accent)}
.tag.sold{background:var(--sold-bg);color:var(--sold-text)}
.timeline li.sold::before{border-color:var(--sold-text);background:var(--sold-text)}
.muted{color:var(--muted)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.filters select,.filters input{padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
a.link{color:var(--accent);text-decoration:none;cursor:pointer}
a.link:hover{text-decoration:underline}

/* паспорт */
.passport{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:16px}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.fields div span{display:block;color:var(--muted);font-size:12px}
.fields div b{font-weight:600}
.qrbox{border:1px dashed var(--strong);border-radius:10px;padding:12px;text-align:center}
.qrbox .qr{background:#fff;border-radius:8px;padding:8px;width:fit-content;margin-left:auto;margin-right:auto;display:flex;justify-content:center;margin-bottom:8px;min-height:140px;align-items:center}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{position:relative;padding:0 0 14px 22px;border-left:2px solid var(--line);margin-left:6px}
.timeline li:last-child{border-left-color:transparent}
.timeline li::before{content:"";position:absolute;left:-7px;top:3px;width:12px;height:12px;border-radius:50%;background:var(--panel);border:2px solid var(--accent)}
.timeline li.out::before{border-color:var(--warn)}
.timeline li.in::before{border-color:var(--ok)}
.timeline li.insp::before{border-color:var(--ip)}
.timeline .d{color:var(--muted);font-size:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap}

/* сигналы */
.sig{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line)}
.sig:last-child{border-bottom:0}
.sig .dot{width:10px;height:10px;border-radius:50%;margin-top:6px;flex:none}
.sig .t{font-weight:600}
.sig .btns{margin-left:auto;display:flex;gap:6px;flex:none}

/* бирки */
.labels{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.label{border:1px solid #9aa6b5;border-radius:10px;padding:10px;text-align:center;background:#fff;color:#1b2430}
.label .qr{display:flex;justify-content:center;min-height:110px;align-items:center}
.label .num{font-weight:700;letter-spacing:.5px;margin-top:6px}
.label .g{font-size:12px;color:#5b6676}

/* окно */
.modal-bg{position:fixed;inset:0;background:rgba(15,30,50,.4);display:none;align-items:center;justify-content:center;padding:16px;z-index:10}
.modal-bg.on{display:flex}
.modal{background:var(--panel);border-radius:14px;padding:22px;width:100%;max-width:440px}
.modal h3{margin:0 0 14px}
.modal label{display:block;font-size:13px;color:var(--muted);margin:10px 0 4px}
.modal input,.modal select{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px}
.modal .actions{justify-content:flex-end;margin-top:18px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--toast);color:var(--bg);padding:10px 16px;border-radius:8px;font-size:13px;opacity:0;transition:opacity .2s;pointer-events:none;z-index:20}
.toast.on{opacity:1}

@media (max-width:900px){
  #app.on{flex-direction:column}
  aside{width:auto}
  nav{display:flex;flex-wrap:wrap;gap:4px}
  .user{display:none}
  main{padding:16px}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid2,.passport{grid-template-columns:minmax(0,1fr)}
  .search{width:100%}
}
@media print{
  .demo,aside,.top .btn,.filters,.noprint{display:none!important}
  body{background:#fff}
  main{padding:0}
  .card{border:0;padding:0}
}

/* настоящая программа: без жёлтой плашки образца */
#login{min-height:100vh}
#app{min-height:100vh}
.err{color:var(--bad);font-size:13px;margin-top:10px}
.loading{color:var(--muted);padding:30px 0;text-align:center}
.linkbtn{background:none;border:0;color:var(--accent);padding:0;font-size:13px;cursor:pointer;margin-top:14px}
.codebox{font-size:30px;font-weight:800;letter-spacing:4px;text-align:center;padding:14px;border:2px dashed var(--accent);border-radius:12px;margin:12px 0}
.row-inline{display:flex;gap:10px}
.row-inline>*{flex:1}
.undone{text-decoration:line-through;opacity:.6}
.empty{color:var(--muted);text-align:center;padding:26px}
.modal{max-height:88vh;overflow-y:auto}
.modal textarea{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;min-height:60px;font:inherit;background:var(--panel);color:var(--text)}
input[type=date]{padding:7px 10px;border:1px solid var(--line);border-radius:8px}