:root{
  color-scheme:dark;
  --bg:#0d0f13;--card:#161a21;--card2:#1c212a;--ink:#e8eaee;--muted:#8b93a1;--line:#262c36;
  --acc:#4f8cff;--acc-ink:#fff;--ok:#34d399;--warn:#fbbf24;--bad:#f87171;--manual:#2a2414;
  --input:#0f1217;--input-line:#323a46;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--acc);text-decoration:none}a:hover{text-decoration:underline}
code{background:var(--card2);padding:1px 5px;border-radius:5px;font-size:13px}
header{background:rgba(13,15,19,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.bar{max-width:1100px;margin:0 auto;padding:10px 16px;display:flex;gap:6px 16px;align-items:center;flex-wrap:wrap}
.brand{font-weight:700;margin-right:8px;color:var(--ink)}
nav{display:flex;gap:4px 14px;flex-wrap:wrap;flex:1}
nav a{color:var(--muted);padding:2px 0}nav a.on{color:var(--ink);font-weight:600}
.who{color:var(--muted);font-size:13px;display:flex;gap:10px;align-items:center}
main{max-width:1100px;margin:0 auto;padding:16px}
h1{font-size:22px;margin:4px 0 14px}h2{font-size:17px;margin:22px 0 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:14px}
.flash{padding:10px 14px;border-radius:10px;margin-bottom:14px}
.flash.ok{background:#0f2a20;color:var(--ok)}.flash.err{background:#2c1416;color:var(--bad)}
.tablewrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:12px}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{font-size:12px;color:var(--muted);font-weight:600;background:var(--card2);position:sticky;top:0}
td.num,th.num{text-align:right}
tr:last-child td{border-bottom:0}
tr.cat td{background:var(--card2);font-weight:700;color:var(--ink)}
tr.off td,tr.off td a{color:#5b6270}
tr.manual td{background:var(--manual)}
tbody tr.item:hover td{background:#1a1f27}
.muted{color:var(--muted)}.small{font-size:13px}
.big{font-size:30px;font-weight:700}
.badge{display:inline-block;font-size:12px;padding:1px 8px;border-radius:99px;background:#1e2a4a;color:#a5b8ff}
.badge.warn{background:#2e2610;color:var(--warn)}.badge.bad{background:#2c1416;color:var(--bad)}.badge.ok{background:#0f2a20;color:var(--ok)}
.empty{color:var(--warn);font-size:13px}
form.inline{display:inline}
label{display:block;font-size:13px;color:var(--muted);margin:10px 0 4px}
input,select,textarea{font:inherit;font-size:16px;padding:8px 10px;border:1px solid var(--input-line);border-radius:8px;background:var(--input);color:var(--ink);width:100%;max-width:420px}
input:focus,select:focus{outline:2px solid var(--acc);outline-offset:-1px;border-color:transparent}
input::placeholder{color:#5b6270}
input.sm{width:90px}input[type=checkbox]{width:auto;accent-color:var(--acc)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.row>div{flex:0 1 auto}
button,.btn{font:inherit;padding:8px 14px;border-radius:8px;border:1px solid var(--acc);background:var(--acc);color:var(--acc-ink);cursor:pointer}
button.ghost{background:transparent;color:var(--acc)}button.danger{background:transparent;color:var(--bad);border-color:#5c2a2e}
button.link{background:none;border:0;color:var(--muted);padding:0}
.search{max-width:320px;margin-bottom:12px}
.secret{font-family:ui-monospace,Menlo,monospace;background:#05070a;color:#f9fafb;border:1px solid var(--line);padding:10px 12px;border-radius:8px;word-break:break-all;user-select:all}
details.edit summary{cursor:pointer;color:var(--acc);list-style:none;font-size:13px}
details.edit summary::-webkit-details-marker{display:none}
details.edit[open] summary{margin-bottom:6px}

/* ───── Телефон ───── */
@media (max-width:640px){
  main{padding:12px}
  th,td{padding:7px 8px}
  .hide-sm{display:none}
  .bar{padding:8px 12px}
  .brand{order:1;flex:1}.who{order:2}
  nav{order:3;flex:0 0 100%;flex-wrap:nowrap;overflow-x:auto;gap:18px;padding:4px 0 2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  nav::-webkit-scrollbar{display:none}
  nav a{white-space:nowrap}
  .search{max-width:none}
  .big{font-size:26px}
  .card{padding:14px}
  .row>div{flex:1 1 140px}
  .row input,.row select{max-width:none;width:100%}

  /* Каталог — карточки вместо широкой таблицы */
  table.cards,table.cards tbody{display:block}
  table.cards thead{display:none}
  table.cards tr.cat{display:block}
  table.cards tr.cat td{display:block;border:0;padding:14px 4px 6px;background:none;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
  table.cards tr.item{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 8px;padding:12px;border-bottom:1px solid var(--line)}
  table.cards tr.item:last-child{border-bottom:0}
  table.cards tr.item td{display:block;border:0;padding:0;text-align:left}
  table.cards tr.item td.name{grid-column:1 / span 3;font-size:16px;white-space:normal}
  table.cards tr.item td.newp{grid-column:4;text-align:right;color:var(--muted);font-size:13px;align-self:center}
  table.cards tr.item td.newp::before{content:"новый ";font-size:11px}
  table.cards tr.item td.pc{font-size:15px;font-weight:600;padding-top:6px}
  table.cards tr.item td.pc::before{content:attr(data-l);display:block;font-size:11px;font-weight:400;color:var(--muted)}
  table.cards tr.item td.below{grid-column:1 / -1;font-size:13px;color:var(--muted);padding-top:4px}
  table.cards tr.item td.below:empty,table.cards tr.item td.below.none{display:none}
  table.cards tr.item td.below::before{content:"АКБ ниже сетки: "}
  .tablewrap.cardswrap{overflow:visible}
  table.cards tr.item td.hide-sm{display:none}
}