/* Parcel Terminal — чертёжная сетка окружного архива поверх тёмной подложки */
:root{
  --ground:#081120; --panel:#0d1b2e; --panel2:#122540; --line:#1c3454;
  --ink:#e9eff6; --dim:#8ca3be; --faint:#59728f;
  --beam:#74c6e8; --stamp:#e2a33c;
  --good:#46b58c; --mid:#e2a33c; --bad:#d2564b;
  --rail:288px; --gutter:clamp(16px,2.2vw,32px);
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"IBM Plex Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --serif:"Newsreader",Georgia,serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);font-family:var(--sans);
  font-size:15px;line-height:1.45;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px,64px 64px;background-position:-1px -1px;
}
body::before{content:"";position:fixed;inset:0;background:radial-gradient(120% 80% at 50% 0%,rgba(8,17,32,.35),var(--ground) 72%);pointer-events:none;z-index:0}
body>*{position:relative;z-index:1}
.skip{position:absolute;left:-999px}
.skip:focus{left:12px;top:12px;background:var(--beam);color:#04101d;padding:8px 12px;border-radius:2px;z-index:99}
a{color:var(--beam)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ── шапка ───────────────────────────────────────────── */
.top{
  display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end;justify-content:space-between;
  padding:26px var(--gutter) 20px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(13,27,46,.94),rgba(8,17,32,.82));backdrop-filter:blur(3px);
}
.eyebrow{margin:0 0 6px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.top h1{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,44px);line-height:1.05;letter-spacing:-.01em}
.top h1 .yr{color:var(--stamp);font-family:var(--mono);font-size:.5em;vertical-align:.5em;letter-spacing:.04em}
.top .sub{margin:8px 0 0;color:var(--dim);font-size:13px;max-width:52ch}
.readout{display:flex;gap:28px;flex-wrap:wrap}
.rd{display:flex;flex-direction:column;gap:2px;min-width:118px}
.rd b{font-family:var(--mono);font-size:22px;font-weight:500;letter-spacing:-.02em}
.rd span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.rd-load b{color:var(--beam)}
.bar{margin-top:7px;height:3px;background:var(--panel2);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--beam);transition:width .5s ease}

.filters-toggle{display:none}

/* ── каркас ──────────────────────────────────────────── */
.shell{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);align-items:start}
.rail{
  position:sticky;top:0;max-height:100vh;overflow-y:auto;padding:22px var(--gutter) 40px;
  border-right:1px solid var(--line);background:rgba(8,17,32,.72);
  display:flex;flex-direction:column;gap:22px;
}
.field{display:flex;flex-direction:column;gap:8px}
.field>label{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint)}
.field>label b{color:var(--ink);letter-spacing:0}
.hint{margin:2px 0 0;font-size:11.5px;color:var(--faint);line-height:1.35}
input[type=search],input[type=number]{
  width:100%;background:var(--panel);border:1px solid var(--line);color:var(--ink);
  font-family:var(--mono);font-size:13px;padding:9px 10px;border-radius:2px;
}
input::placeholder{color:var(--faint)}
input:focus-visible,button:focus-visible,.row:focus-visible,a:focus-visible,input[type=range]:focus-visible{outline:2px solid var(--beam);outline-offset:2px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
input[type=range]{width:100%;accent-color:var(--beam)}

.hist{display:flex;align-items:flex-end;gap:2px;height:44px;padding:0 1px;border-bottom:1px solid var(--line)}
.hist i{flex:1;background:var(--panel2);min-height:2px;transition:background .15s}
.hist i.on{background:var(--beam)}

.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{
  font-family:var(--mono);font-size:11.5px;padding:5px 9px;border-radius:2px;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);color:var(--dim);
}
.chip[aria-pressed=true]{background:var(--beam);border-color:var(--beam);color:#04101d;font-weight:600}
.ziplist{max-height:212px;padding-bottom:6px;-webkit-mask-image:linear-gradient(180deg,#000 88%,transparent);mask-image:linear-gradient(180deg,#000 88%,transparent);overflow-y:auto;display:flex;flex-direction:column;gap:1px;padding-right:4px}
.zi{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12.5px;color:var(--dim);cursor:pointer;padding:3px 4px;border-radius:2px}
.zi:hover{background:var(--panel)}
.zi input{accent-color:var(--beam);margin:0}
.zi .n{margin-left:auto;color:var(--faint);font-size:11.5px}
.rail-acts{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.reset{
  align-self:flex-start;background:transparent;border:1px solid var(--line);color:var(--dim);
  font-family:var(--mono);font-size:12px;padding:8px 12px;border-radius:2px;cursor:pointer;
}
.reset:hover{border-color:var(--beam);color:var(--beam)}

/* ── таблица ─────────────────────────────────────────── */
.table-wrap{min-width:0;padding-bottom:60px}
.thead,.row{
  display:grid;
  grid-template-columns:100px minmax(190px,1fr) 80px 118px 134px 208px;
  gap:18px;align-items:center;padding:0 var(--gutter);
  max-width:1560px;
}
.thead{
  position:sticky;top:0;z-index:5;height:42px;
  background:rgba(8,17,32,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(6px);
}
.th{
  background:none;border:0;padding:0;text-align:left;cursor:pointer;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);
}
.th:hover{color:var(--beam)}
.th-num{text-align:right}
.th[data-dir]::after{content:" ↓";color:var(--beam)}
.th[data-dir="1"]::after{content:" ↑"}
.row{
  width:100%;height:58px;border:0;border-bottom:1px solid rgba(28,52,84,.55);
  background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;
}
.row:hover{background:linear-gradient(90deg,rgba(116,198,232,.10),rgba(116,198,232,0))}
.row.sel{background:rgba(116,198,232,.13)}
.c-loc{font-family:var(--mono);font-size:12.5px;color:var(--stamp);letter-spacing:.02em}
.c-addr{min-width:0}
.c-addr .s{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}
.c-addr .p{display:block;font-family:var(--mono);font-size:11px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yrs{display:flex;gap:3px}
.yrs i{font-family:var(--mono);font-size:10.5px;font-style:normal;color:var(--faint);border:1px solid var(--line);padding:1px 3px;border-radius:2px}
.c-num{font-family:var(--mono);font-size:13.5px;text-align:right;font-variant-numeric:tabular-nums}
.c-debt{color:var(--stamp)}
.c-ap{color:var(--dim)}
.c-ap.none{color:var(--faint);font-size:11.5px}
.gauge{display:flex;align-items:center;gap:9px}
.gauge .track{flex:1;height:8px;background:var(--panel2);position:relative;overflow:hidden;
  background-image:linear-gradient(90deg,rgba(28,52,84,.9) 1px,transparent 1px);background-size:12px 100%}
.gauge .fill{position:absolute;inset:0 auto 0 0;width:0}
.gauge .pct{font-family:var(--mono);font-size:12px;width:52px;text-align:right;font-variant-numeric:tabular-nums}
.sentinel{height:1px}
.empty{padding:48px var(--gutter);color:var(--dim);font-size:14px}

/* ── карточка ────────────────────────────────────────── */
.scrim{position:fixed;inset:0;background:rgba(4,10,18,.62);z-index:20;animation:fade .18s ease}
@keyframes fade{from{opacity:0}}
.drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);z-index:21;overflow-y:auto;
  background:var(--panel);border-left:1px solid var(--line);
  box-shadow:-24px 0 60px rgba(2,7,14,.55);animation:slide .24s cubic-bezier(.22,.7,.3,1);
}
@keyframes slide{from{transform:translateX(24px);opacity:.4}}
.dr-head{padding:22px 24px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--panel2),var(--panel))}
.dr-close{position:absolute;top:14px;right:16px;background:none;border:1px solid var(--line);color:var(--dim);
  width:30px;height:30px;border-radius:2px;cursor:pointer;font-size:16px;line-height:1}
.dr-close:hover{color:var(--beam);border-color:var(--beam)}
.dr-loc{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--stamp)}
.dr-head h2{margin:6px 0 2px;font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.15;padding-right:40px}
.dr-head .place{font-family:var(--mono);font-size:12px;color:var(--faint)}
.dr-key{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line);margin:18px 0 0;border:1px solid var(--line)}
.dr-key div{background:var(--panel);padding:11px 12px}
.dr-key span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:4px}
.dr-key b{font-family:var(--mono);font-size:17px;font-weight:500}
.acts{display:flex;flex-wrap:wrap;gap:8px;padding:16px 24px;border-bottom:1px solid var(--line)}
.act{
  font-family:var(--mono);font-size:12px;padding:8px 12px;border-radius:2px;text-decoration:none;cursor:pointer;
  background:var(--panel2);border:1px solid var(--line);color:var(--ink);
}
.act:hover{border-color:var(--beam);color:var(--beam)}
.act.primary{background:var(--beam);border-color:var(--beam);color:#04101d;font-weight:600}
.act.primary:hover{background:#8fd4f0;color:#04101d}
.sec{padding:20px 24px;border-bottom:1px solid var(--line)}
.sec h3{margin:0 0 12px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:600}
.kv{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;font-size:13px}
.kv dt{color:var(--faint);font-size:12px}
.kv dd{margin:0;font-family:var(--mono);font-size:12.5px;word-break:break-word}
.vhist{display:flex;flex-direction:column;gap:5px}
.vh{display:grid;grid-template-columns:38px 1fr 86px;gap:10px;align-items:center;font-family:var(--mono);font-size:12px}
.vh .y{color:var(--faint)}
.vh .b{height:12px;background:var(--panel2)}
.vh .b i{display:block;height:100%;background:var(--beam);opacity:.55}
.vh .b i.now{opacity:1}
.vh .v{text-align:right}
.dbt{display:grid;grid-template-columns:1fr auto;gap:5px 14px;font-family:var(--mono);font-size:13px}
.dbt .t{border-top:1px solid var(--line);padding-top:7px;margin-top:3px;color:var(--stamp)}
.note{font-size:12px;color:var(--faint);line-height:1.5}
.loading{padding:26px 24px;color:var(--dim);font-family:var(--mono);font-size:13px}
.loading::after{content:"";display:inline-block;width:7px;height:7px;margin-left:7px;background:var(--beam);animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.15}}

@media (max-width:1080px){
  .thead,.row{grid-template-columns:92px minmax(140px,1.5fr) 108px 116px minmax(120px,.9fr)}
  .th-yrs,.c-yrs{display:none}
}
@media (max-width:860px){
  .shell{grid-template-columns:1fr}
  .top{padding:16px var(--gutter) 14px;gap:14px;align-items:flex-start}
  .top h1{font-size:27px}
  .top .sub{font-size:12px;margin-top:6px}
  .readout{gap:18px;width:100%}
  .rd{min-width:0;flex:1}
  .rd b{font-size:16px}
  .rd span{font-size:9.5px;letter-spacing:.06em}
  .rail{position:static;max-height:none;border-right:0;border-bottom:1px solid var(--line);display:none}
  .rail.open{display:flex}
  .filters-toggle{
    display:block;margin:12px var(--gutter) 2px;background:var(--panel);border:1px solid var(--line);
    color:var(--ink);font-family:var(--mono);font-size:13px;padding:9px 14px;border-radius:2px;cursor:pointer;
  }
  .thead{display:none}
  .row{
    display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"a d" "g v";
    height:auto;gap:8px 12px;padding:13px var(--gutter);max-width:none;
  }
  .c-loc{display:none}
  .c-addr{grid-area:a}
  .c-addr .p::before{content:attr(data-loc) " · "}
  .c-debt{grid-area:d;align-self:start}
  .c-ap{grid-area:v;display:block;font-size:12px}
  .c-ap::before{content:"оценка ";color:var(--faint);font-size:10.5px}
  .c-ap.none::before{content:""}
  .gauge{grid-area:g}
  .dr-key{grid-template-columns:1fr 1fr}
  .drawer{width:100%}
  .dr-head h2{font-size:22px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}