/* Общий вид панели (макет 24.09.2026): онлайн-банк, один неоновый акцент, большие скругления.
   Подключается на всех страницах. Старые страницы используют свои имена переменных
   (--paper, --surface...), внизу они переназначены на новые. */
:root{
  --bg:#F5F6FB; --card:#FFFFFF; --card2:#F0F1F8; --ink:#0D0F22; --muted:#5D6079; --faint:#9699B0;
  --line:#E4E6F0; --crit:#F0214F; --crit-bg:#FFE8EE; --watch:#9A7C00; --watch-bg:#FFF6CC;
  --ok:#0FA971; --ok-bg:#E3F7EE; --sleep:#8E91A8; --sleep-bg:#EEEFF5;
  --acc:#7A3CFF; --on-acc:#FFFFFF; --acc-soft:#EFE8FF; --glow:0 0 0 rgba(0,0,0,0);
  --pink:#FF4FD8;
  --shadow:0 1px 2px rgba(13,15,34,.04),0 8px 24px rgba(13,15,34,.06);
  --r-lg:24px; --r-md:16px;
  --sans:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
:root[data-neon="lime"]{--acc:#6FAE00;--on-acc:#0D0F22;--acc-soft:#EEF8D6}
:root[data-neon="aqua"]{--acc:#00A99C;--on-acc:#FFFFFF;--acc-soft:#DDF7F4}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#090A14; --card:#131526; --card2:#1B1E33; --ink:#F1F2FA; --muted:#A0A3BD; --faint:#6C6F8A;
    --line:#252842; --crit:#FF3D6A; --crit-bg:#3A1224; --watch:#F5D90A; --watch-bg:#34300C;
    --ok:#2EE59D; --ok-bg:#0F2E24; --sleep:#80839E; --sleep-bg:#1D2034;
    --acc:#9B6BFF; --on-acc:#0B0C16; --acc-soft:#261B45;
    --glow:0 0 24px color-mix(in srgb,var(--acc) 45%,transparent);
    --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px rgba(0,0,0,.35);
  }
  :root:not([data-theme="light"])[data-neon="lime"]{--acc:#C4FF3A;--on-acc:#0B0C16;--acc-soft:#26330C}
  :root:not([data-theme="light"])[data-neon="aqua"]{--acc:#1FF2DF;--on-acc:#0B0C16;--acc-soft:#0C2F2E}
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#090A14; --card:#131526; --card2:#1B1E33; --ink:#F1F2FA; --muted:#A0A3BD; --faint:#6C6F8A;
  --line:#252842; --crit:#FF3D6A; --crit-bg:#3A1224; --watch:#F5D90A; --watch-bg:#34300C;
  --ok:#2EE59D; --ok-bg:#0F2E24; --sleep:#80839E; --sleep-bg:#1D2034;
  --acc:#9B6BFF; --on-acc:#0B0C16; --acc-soft:#261B45;
  --glow:0 0 24px color-mix(in srgb,var(--acc) 45%,transparent);
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px rgba(0,0,0,.35);
}
:root[data-theme="dark"][data-neon="lime"]{--acc:#C4FF3A;--on-acc:#0B0C16;--acc-soft:#26330C}
:root[data-theme="dark"][data-neon="aqua"]{--acc:#1FF2DF;--on-acc:#0B0C16;--acc-soft:#0C2F2E}

/* Старые имена переменных -> новые. :not(#_) поднимает вес правила над темными
   блоками старых страниц, иначе они перебили бы новую палитру. */
:root:not(#_){
  --paper:var(--bg); --surface:var(--card); --surface-2:var(--card2); --surface-3:var(--card2);
  --line-soft:var(--line); --ink-2:var(--muted); --ink-3:var(--faint);
  --accent:var(--acc); --accent-ink:var(--acc); --accent-soft:var(--acc-soft);
  --good:var(--ok); --good-bg:var(--ok-bg); --warn:var(--watch); --warn-bg:var(--watch-bg);
  --idle:var(--sleep); --idle-bg:var(--sleep-bg);
  --series-1:var(--acc); --series-2:var(--pink);
}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;position:relative;z-index:0;margin:0}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:6px}
[hidden]{display:none!important}

/* плавающие круги на фоне */
.orbs{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.34;animation:drift 18s ease-in-out infinite alternate}
.orb.a{width:420px;height:420px;background:var(--acc);top:-120px;right:-80px}
.orb.b{width:320px;height:320px;background:var(--pink);bottom:-100px;left:-60px;opacity:.2;animation-duration:22s}
.orb.c{width:220px;height:220px;background:#3D7BFF;top:40%;left:45%;opacity:.16;animation-duration:26s}
@keyframes drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-40px,30px) scale(1.08)}100%{transform:translate(30px,-20px) scale(.95)}}
@media (prefers-reduced-motion:reduce){.orb{animation:none}}

/* шапка: одна на все страницы, собирается в look.js */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--bg) 82%,transparent)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)!important}
.top .top-in{max-width:1180px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:18px;flex-wrap:nowrap}
.lk-logo{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.02em;font-size:17px;color:var(--ink);text-decoration:none}
.lk-logo small{font-weight:500;color:var(--muted);font-size:13px}
.lk-mark{width:30px;height:30px;border-radius:9px;background:var(--ink);display:grid;place-items:center}
.lk-mark::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--acc);box-shadow:0 0 14px var(--acc)}
.lk-nav{display:flex;gap:4px;margin-left:12px}
.lk-nav a{padding:8px 14px;border-radius:999px;color:var(--muted);font-weight:500;font-size:14px;text-decoration:none;white-space:nowrap}
.lk-nav a:hover{background:var(--card2);color:var(--ink)}
.lk-nav a.on{background:var(--ink);color:var(--bg)}
.lk-r{margin-left:auto;display:flex;align-items:center;gap:10px;position:relative}
.lk-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:var(--muted);text-decoration:none;border:0;background:none;cursor:pointer}
.lk-icon:hover{background:var(--card2);color:var(--ink)}
.lk-me{display:flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border-radius:999px;background:var(--card);border:1px solid var(--line);font:600 14px var(--sans);color:var(--ink);cursor:pointer}
.lk-ava{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;background:var(--acc);color:var(--on-acc)}
.lk-menu{position:absolute;right:0;top:48px;width:280px;background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:14px;display:grid;gap:12px;z-index:50}
.lk-menu .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.lk-seg{display:flex;gap:4px;background:var(--card2);padding:4px;border-radius:12px}
.lk-seg button{flex:1;padding:7px 6px;border-radius:9px;font:600 12.5px var(--sans);color:var(--muted);border:0;background:none;cursor:pointer}
.lk-seg button.on{background:var(--card);color:var(--ink);box-shadow:var(--shadow)}
.lk-menu a,.lk-menu .lk-out{display:block;padding:9px 10px;border-radius:10px;color:var(--ink);text-decoration:none;font:500 14px var(--sans);border:0;background:none;text-align:left;cursor:pointer;width:100%}
.lk-menu a:hover,.lk-menu .lk-out:hover{background:var(--card2)}
.lk-bnav{display:none}
@media (max-width:760px){
  .lk-nav{display:none}
  .lk-me span{display:none}
  .lk-me{padding:4px}
  .lk-bnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--card);border-top:1px solid var(--line);padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px));justify-content:space-around}
  .lk-bnav a{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--muted);padding:4px 10px;border-radius:12px;text-decoration:none}
  .lk-bnav a.on{color:var(--ink);background:var(--card2)}
  body{padding-bottom:70px}
}

/* Старые страницы: крупнее скругления и кнопки в новом духе */
.panel{border-radius:var(--r-lg)!important;border-color:var(--line)!important}
.btn{border-radius:12px!important;font-family:var(--sans)!important;transition:transform .15s,box-shadow .2s}
.btn:hover{transform:translateY(-1px)}
.btn-primary,.btn.primary{background:var(--acc)!important;border-color:var(--acc)!important;color:var(--on-acc)!important}
.field input,.field select,.field textarea{border-radius:12px!important}
.pill{border-radius:999px!important}
/* у Доступов основная кнопка - просто .btn с акцентным фоном: текст под цвет неона */
body.pg-accounts .btn{color:var(--on-acc)!important}


/* старая шапка классического экрана под новой: только инструменты, без меню */
.lk-sub{background:var(--card);border-bottom:1px solid var(--line)}
.lk-sub .mainnav,.lk-sub .brand{display:none}
