:root{
  --bg:#171512; --bg2:#1f1c18; --panel:#26221d; --panel2:#211e19; --line:#3a342c;
  --gold:#E8A23D; --goldLt:#F6CB79; --goldDk:#C8881F; --cream:#F2EFE8;
  --ink:#F3EEE4; --muted:#B7AE9E;
  --ok:#63c497; --okBg:rgba(99,196,151,.14); --okLine:rgba(99,196,151,.35);
  --warn:#e8b04d; --warnBg:rgba(232,176,77,.14);
  --danger:#e88b7d; --dangerBg:rgba(200,90,70,.16);
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:transparent;color:var(--ink);line-height:1.55;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Segoe UI',system-ui,-apple-system,sans-serif;
  background-image:radial-gradient(600px 400px at 88% -5%,rgba(232,162,61,.16),transparent 70%),
    radial-gradient(500px 400px at -5% 8%,rgba(200,136,31,.10),transparent 70%);
  background-size:auto,auto;
  background-position:center;
  background-attachment:scroll}
a{color:var(--goldLt);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Georgia,serif;letter-spacing:-.02em}
.wrap{max-width:960px;margin:0 auto;padding:0 18px}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
main.wrap{animation:fadeUp .5s ease both}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}

/* ===== header ===== */
header{background:rgba(23,21,18,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.hd{max-width:960px;margin:0 auto;padding:13px 18px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;color:#fff;font-size:18px}
.logo span:not(.cube){color:var(--gold)}
.cube{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:13px;color:#221d15;background:linear-gradient(135deg,var(--goldLt),var(--goldDk));box-shadow:0 4px 14px rgba(232,162,61,.4)}
.cubeimg{height:38px!important;width:auto!important;max-height:38px;max-width:120px;display:block}
/* карточка входа/регистрации — на фоне склада */
.center .card{background:linear-gradient(180deg,rgba(38,34,29,.9),rgba(33,30,25,.92));backdrop-filter:blur(6px)}
nav{margin-left:auto;display:flex;gap:3px;flex-wrap:wrap}
nav a{color:#c9bfad;font-size:14px;font-weight:600;padding:7px 11px;border-radius:9px}
nav a:hover{background:rgba(255,255,255,.07);color:#fff;text-decoration:none}
nav a.on{color:var(--gold);background:rgba(232,162,61,.12)}

/* ===== headings ===== */
h1{font-size:30px;font-weight:800;margin:26px 0 6px;color:#fff}
h2{font-size:20px;margin:20px 0 12px;color:#fff}
.sub{color:var(--muted);margin:0 0 20px;font-size:15px}

/* ===== cards / kpi ===== */
.card{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);
  border-radius:18px;padding:20px;margin-bottom:16px;box-shadow:0 12px 34px rgba(0,0,0,.28)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.kpi{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);
  border-radius:18px;padding:18px 20px;position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;top:-30px;right:-30px;width:90px;height:90px;border-radius:50%;
  background:radial-gradient(circle,rgba(232,162,61,.18),transparent 70%)}
.kpi .l{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.kpi .v{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,serif;font-size:30px;font-weight:800;margin-top:6px;color:#fff;
  font-variant-numeric:tabular-nums}
.kpi .v.gold,.gold{color:var(--gold)}
.kpi .v.gold{background:linear-gradient(120deg,var(--goldLt),var(--goldDk));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ===== forms ===== */
label.f{display:block;font-size:13px;font-weight:600;color:var(--muted);margin:12px 0 5px}
input,select{width:100%;padding:12px;border:1px solid var(--line);border-radius:11px;font:inherit;
  background:rgba(255,255,255,.04);color:var(--ink)}
input::placeholder{color:#7d7565}
input:focus,select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(232,162,61,.18)}
select option{background:var(--panel);color:var(--ink)}

/* ===== buttons ===== */
.btn{display:inline-block;border:0;border-radius:12px;padding:12px 22px;font-weight:700;font-size:15px;
  cursor:pointer;font-family:inherit;background:linear-gradient(135deg,var(--goldLt),var(--goldDk));color:#221d15;
  box-shadow:0 8px 24px rgba(232,162,61,.28);transition:.16s}
/* ЛЮБАЯ кнопка/ссылка-кнопка подсвечивается СРАЗУ при наведении курсора */
button,.btn,.pill,a.btn,input[type=submit],input[type=button]{transition:.15s;cursor:pointer}
button:hover,.btn:hover,.pill:hover,a.btn:hover,input[type=submit]:hover,input[type=button]:hover{
  filter:brightness(1.16) saturate(1.12);
  box-shadow:0 10px 32px rgba(232,162,61,.75),0 0 0 3px rgba(246,203,121,.6);
  transform:translateY(-2px);text-decoration:none}
nav a{transition:.15s}
nav a:hover{background:rgba(232,162,61,.16);box-shadow:0 0 0 1px rgba(246,203,121,.4)}
.btn.dark{background:rgba(255,255,255,.06);color:#fff;border:1.5px solid rgba(246,203,121,.4);box-shadow:none}
.btn.dark:hover{background:rgba(246,203,121,.14)}
.btn.block{display:block;width:100%;text-align:center}
.muted{color:var(--muted);font-size:14px}
.err{background:var(--dangerBg);border:1px solid rgba(200,90,70,.5);color:#f0b3a8;border-radius:11px;padding:11px 13px;margin-bottom:14px;font-size:14px}
.center{max-width:430px;margin:48px auto}

/* ===== tables ===== */
table{width:100%;border-collapse:collapse}
th,td{padding:10px 11px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}
th{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
td.r,th.r{text-align:right;font-variant-numeric:tabular-nums}
tr:hover td{background:rgba(255,255,255,.02)}
.qtyi{width:90px;padding:8px;text-align:right}

/* ===== totals ===== */
.total{display:flex;justify-content:space-between;align-items:baseline;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.total .v{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,serif;font-size:28px;font-weight:800;
  background:linear-gradient(120deg,var(--goldLt),var(--goldDk));-webkit-background-clip:text;background-clip:text;color:transparent;
  font-variant-numeric:tabular-nums}

/* ===== chips / flow ===== */
.chip{display:inline-block;font-size:12px;font-weight:700;padding:4px 11px;border-radius:20px;
  background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--muted)}
.chip.done{background:var(--okBg);color:var(--ok);border-color:var(--okLine)}
.chip.urgent{background:var(--dangerBg);color:var(--danger);border-color:rgba(200,90,70,.4)}
.flow{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.step{font-size:11px;padding:4px 9px;border-radius:8px;background:rgba(255,255,255,.05);color:var(--muted)}
.step.past{background:var(--okBg);color:var(--ok)}
.step.cur{background:linear-gradient(135deg,var(--goldLt),var(--goldDk));color:#221d15;font-weight:700}

/* ===== promo / footer ===== */
.promo{background:linear-gradient(120deg,var(--goldDk),var(--gold));color:#221d15;
  text-align:center;padding:13px;font-weight:700;border-radius:14px;margin-bottom:18px;box-shadow:0 10px 26px rgba(232,162,61,.24)}
footer{color:var(--muted);font-size:13px;text-align:center;padding:30px 18px;border-top:1px solid var(--line);margin-top:30px}
footer a{color:var(--goldLt)}

/* ===== мобильная полировка (PWA на телефоне) ===== */
@media(max-width:560px){
  .wrap,main.wrap{padding:0 12px}
  .hd{padding:11px 12px;gap:9px}
  .logo{font-size:16px}
  nav{margin-left:0;width:100%;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:2px;padding-bottom:2px}
  nav::-webkit-scrollbar{display:none}
  nav a{white-space:nowrap;font-size:13px;padding:6px 10px}
  h1{font-size:23px;line-height:1.15}
  th,td{padding:9px 7px}
}


/* ===== СВЕТЛАЯ ТЕМА (тумблер) ===== */
:root[data-theme="light"]{
  --bg:#f4f2ee; --bg2:#eceae4; --panel:#ffffff; --panel2:#fafafa; --line:#e4e0d8;
  --ink:#23211d; --muted:#7d766c; --cream:#2b2a28;
}
:root[data-theme="light"] body{background:transparent;color:var(--ink)}
:root[data-theme="light"] header{background:rgba(255,255,255,.92)}
:root[data-theme="light"] .card,:root[data-theme="light"] .kpi{background:#fff}
:root[data-theme="light"] input,:root[data-theme="light"] select{background:#fff;border-color:#ddd;color:#23211d}
:root[data-theme="light"] nav a:hover{background:rgba(0,0,0,.05);color:#000}

/* --- FIX светлой темы: тёмный текст вместо жёсткого #fff (20.08.2026) --- */
:root[data-theme="light"] .logo,
:root[data-theme="light"] h1,
:root[data-theme="light"] h2,
:root[data-theme="light"] .kpi .v{color:var(--ink)}
:root[data-theme="light"] nav a:hover{color:#000}
:root[data-theme="light"] .btn.dark{background:#2b2a28;color:#fff;border-color:#2b2a28}
:root[data-theme="light"] .badge,
:root[data-theme="light"] .step{background:rgba(0,0,0,.05);color:#5b554c}


/* фоновый куб бренда — ненавязчиво, в обеих темах */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:url('/static/logo-dim.png') no-repeat center 44%;
  background-size:min(640px,74vw);
  opacity:.15}
:root[data-theme="light"] body::before{opacity:.11}