/* =====================================================================
   LIQUID CHROME OS  ·  theme for RAISE THE BAR
   Based on metallic-theme.css (design package v1.0), extended to every
   existing component of the app. Black titanium base, molten crimson
   chrome for focus, silver rims for shape.
   ===================================================================== */
:root{
  /* package tokens */
  --nl-void:#050507;--nl-bg:#08090D;--nl-titanium:#14161C;--nl-gunmetal:#30343D;--nl-crimson:#C90025;--nl-hot:#FF3154;
  --nl-ruby:#650016;--nl-chrome:#C5CBD4;--nl-white:#F7F8FA;--nl-muted:#969CA8;--nl-success:#32D6A0;--nl-radius:18px;
  /* app aliases (existing class names keep working) */
  --red:var(--nl-hot);--red-d:#FF8FA0;--red-l:rgba(201,0,37,.18);--red-ll:rgba(201,0,37,.08);
  --ink:var(--nl-white);--ink2:#C3C7CF;--mute:var(--nl-muted);--line:#262931;--line2:#353942;
  --bg:var(--nl-bg);--white:var(--nl-titanium);--ok:var(--nl-success);--warn:#F5B547;
  --r:16px;--sh:0 12px 32px rgba(0,0,0,.45);
  --ti-grad:linear-gradient(145deg,#22252d 0%,#16181f 38%,#0f1015 100%);
  --metal-grad:linear-gradient(128deg,#101116 0%,#2b2f38 31%,#111218 54%,#33101a 84%,#101116 100%);
  --chrome-red:linear-gradient(165deg,#ff7c91 0%,#fa264b 16%,#c90025 38%,#650016 53%,#db002a 78%,#ff5471 100%);
  --rim:inset 0 1px 0 rgba(255,255,255,.10),inset 0 -1px 0 rgba(0,0,0,.6);
  --font-d:Inter,system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--nl-void);color:var(--ink);font:14px/1.5 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body{background:radial-gradient(1200px 600px at 85% -10%,rgba(201,0,37,.10),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(101,0,22,.10),transparent 60%),var(--nl-bg);min-height:100vh}
h1,h2,h3,.hd{font-family:var(--font-d);text-transform:uppercase;letter-spacing:-.01em;margin:0;font-weight:800}
button{font:inherit;cursor:pointer;color:inherit}
input,select,textarea{font:inherit;color:inherit}
a{color:var(--red-d)}
.hidden{display:none!important}
::selection{background:rgba(255,49,84,.35)}
:focus-visible{outline:2px solid var(--nl-chrome);outline-offset:2px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#0b0c10}::-webkit-scrollbar-thumb{background:#2a2d35;border-radius:9px;border:2px solid #0b0c10}::-webkit-scrollbar-thumb:hover{background:#3a3e48}

/* ---------- app shell: titanium top bar ---------- */
.top{position:sticky;top:0;z-index:20;background:linear-gradient(180deg,#191b22,#0f1015);border-bottom:1px solid #2b2e36;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 30px rgba(0,0,0,.55)}
.top:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,49,84,.55) 30%,rgba(197,203,212,.5) 55%,transparent)}
.top-in{max-width:1240px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:10px 20px}
.logo{white-space:nowrap;display:flex;align-items:center;gap:12px;font-family:var(--font-d);font-weight:700;font-size:19px;letter-spacing:.08em;color:var(--ink)}
.logo .mark{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:11.5px;font-weight:800;letter-spacing:.01em;color:#fff;background:var(--chrome-red);border:1px solid #ff8da0;box-shadow:inset 0 2px 2px rgba(255,255,255,.55),inset 0 -3px 5px #330009,0 0 18px rgba(201,0,37,.35);text-shadow:0 1px 1px rgba(0,0,0,.4)}
.logo small{font-family:Inter;font-weight:600;font-size:9.5px;letter-spacing:.24em;color:var(--mute);display:block;margin-top:-1px}
.sp{flex:1}
.seg{display:flex;background:#0b0c10;border:1px solid #2b2e36;border-radius:999px;padding:3px;box-shadow:inset 0 2px 6px rgba(0,0,0,.6)}
.seg button{border:0;background:transparent;color:var(--mute);padding:6px 15px;border-radius:999px;font-weight:700;font-size:12.5px;letter-spacing:.04em;transition:color .2s}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--chrome-red);color:#fff;box-shadow:inset 0 1px 1px rgba(255,255,255,.5),0 4px 12px rgba(201,0,37,.35)}
.demo-pill{font-size:10px;font-weight:800;letter-spacing:.2em;color:var(--nl-chrome);padding:4px 8px;border-radius:6px;border:1px solid #3a3e48;background:linear-gradient(180deg,#24272f,#121318)}
.top select{background:#0b0c10;color:var(--ink);border:1px solid #30343d;border-radius:10px;padding:7px 10px}
.top select option{background:#14161c;color:var(--ink)}
.ro-pill{font-size:10px;font-weight:800;letter-spacing:.14em;background:#0b0c10;border:1px solid #3a3e48;color:var(--warn);padding:4px 8px;border-radius:6px}

.tabs{background:rgba(12,13,17,.92);backdrop-filter:saturate(1.2);border-bottom:1px solid #1f2128;position:sticky;top:57px;z-index:15}
.tabs-in{max-width:1240px;margin:0 auto;display:flex;gap:2px;padding:0 20px;overflow-x:auto}
.tab{border:0;background:none;padding:14px 14px 12px;font-weight:600;color:var(--mute);border-bottom:2px solid transparent;white-space:nowrap;letter-spacing:.02em;transition:color .2s,border-color .2s;position:relative}
.tab:hover{color:var(--ink)}
.tab.on{color:var(--ink);border-bottom-color:var(--nl-hot)}
.tab.on:after{content:"";position:absolute;left:20%;right:20%;bottom:-2px;height:2px;box-shadow:0 0 14px 2px rgba(255,49,84,.6)}

.wrap{max-width:1240px;margin:0 auto;padding:24px 20px 80px}
.narrow{max-width:780px}
#app.pg-in{animation:nlPage .22s ease-out both}
@keyframes nlPage{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.status{pointer-events:none;position:fixed;right:16px;bottom:16px;background:linear-gradient(180deg,#22252d,#121318);border:1px solid #47353b;color:var(--ink);padding:9px 16px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.03em;opacity:0;transform:translateY(8px);transition:.22s;z-index:60;box-shadow:0 10px 30px rgba(0,0,0,.6),0 0 16px rgba(201,0,37,.18)}
.status.show{opacity:1;transform:none}
.banner{background:linear-gradient(180deg,rgba(245,181,71,.10),rgba(245,181,71,.04));border:1px solid rgba(245,181,71,.35);color:#F3D9A4;border-radius:12px;padding:11px 14px;margin-bottom:16px;font-size:13px}
.banner.red{background:linear-gradient(180deg,rgba(201,0,37,.18),rgba(101,0,22,.10));border-color:rgba(255,49,84,.45);color:#FFC2CC}
.banner b{color:#fff}

/* ---------- surfaces ---------- */
.card{position:relative;background:var(--ti-grad);border:1px solid #2a2d35;border-radius:var(--r);box-shadow:var(--rim),0 12px 32px rgba(0,0,0,.42)}
.pad{padding:18px}
/* interactive metal (pointer specular + optional tilt, driven by js/metal.js) */
.metal{--px:50%;--py:50%;--tx:0deg;--ty:0deg;isolation:isolate;overflow:hidden;background:radial-gradient(circle at var(--px) var(--py),rgba(255,255,255,.10),transparent 46%),var(--metal-grad);border-color:#3a2d33;transform:perspective(900px) rotateX(var(--tx)) rotateY(var(--ty));transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.metal:after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(110deg,transparent 24%,rgba(255,255,255,.06) 35%,rgba(255,255,255,.22) 40%,transparent 49%);transform:translateX(-150%);transition:transform .65s ease;z-index:0}
.metal>*{position:relative;z-index:1}
@media(hover:hover){
  .metal:hover{border-color:#ff637b;box-shadow:inset 0 1px 1px rgba(255,255,255,.28),0 18px 38px rgba(0,0,0,.7),0 0 22px rgba(201,0,37,.18)}
  .metal:hover:after{transform:translateX(150%)}
  .metal.lift:hover{translate:0 -4px}
}
.metal:active{scale:.995}
.row{display:flex;gap:12px;align-items:center}
.wrapx{flex-wrap:wrap}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:860px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.g2,.g3,.g4{grid-template-columns:1fr}}
.muted{color:var(--mute)}.small{font-size:12px}
.k{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#C9A2AB}

/* ---------- buttons ---------- */
.btn{position:relative;overflow:hidden;border:1px solid #3a3e48;background:linear-gradient(180deg,#2a2d35,#17191f);color:var(--ink);padding:8px 14px;border-radius:10px;font-weight:650;font-size:13px;display:inline-flex;align-items:center;gap:6px;min-height:36px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 12px rgba(0,0,0,.35);transition:transform .18s ease,filter .18s ease,border-color .18s,box-shadow .18s;text-decoration:none}
.btn:hover{border-color:#5a5f6b;filter:brightness(1.12)}
.btn:active{transform:translateY(1px) scale(.985)}
.btn.p{border-color:#ff8da0;color:#fff;letter-spacing:.03em;background:var(--chrome-red);box-shadow:inset 0 2px 2px rgba(255,255,255,.45),inset 0 -3px 5px #330009,0 8px 20px rgba(169,0,38,.30)}
.btn.p:hover{transform:translateY(-1px);filter:brightness(1.12);box-shadow:inset 0 2px 2px rgba(255,255,255,.55),0 10px 25px rgba(201,0,37,.38)}
.btn.p:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 45%,transparent 58%);transform:translateX(-140%);transition:transform .6s ease;pointer-events:none}
.btn.p:hover:after{transform:translateX(140%)}
.btn.g{border-color:transparent;background:transparent;box-shadow:none;color:var(--ink2)}
.btn.g:hover{background:rgba(255,255,255,.05);filter:none}
.btn.d{color:#FF8FA0;background:linear-gradient(180deg,#1b0d11,#120a0c);border-color:#5a2230}
.btn.d:hover{border-color:#ff3154;color:#fff}
.btn.sm{padding:5px 10px;font-size:12px;min-height:30px;border-radius:8px}
.btn:disabled,.btn[disabled]{opacity:.42;cursor:not-allowed;filter:saturate(.4);transform:none}
.ic{border:1px solid transparent;background:transparent;color:var(--mute);width:32px;height:32px;border-radius:8px;display:inline-grid;place-items:center;font-size:15px;transition:.18s}
.ic:hover{background:rgba(255,255,255,.06);color:var(--ink);border-color:#30343d}
.ic.del:hover{color:#fff;background:rgba(201,0,37,.25);border-color:#5a2230}
.ic:disabled{opacity:.3}
.block{width:100%;justify-content:center}
.btn.big{padding:13px 16px;font-size:15px;min-height:48px}
label.btn.disabled{opacity:.45;pointer-events:none}

/* ---------- inputs ---------- */
.in{border:1px solid #30343d;border-radius:10px;padding:9px 11px;background:#0b0c10;color:var(--ink);width:100%;outline:none;box-shadow:inset 0 2px 4px rgba(0,0,0,.45);transition:border-color .18s,box-shadow .18s}
.in::placeholder{color:#5d626d}
.in:hover{border-color:#40444e}
.in:focus{border-color:#ff3154;box-shadow:inset 0 2px 4px rgba(0,0,0,.45),0 0 0 3px rgba(255,49,84,.18)}
select.in{appearance:auto}
input[type=date].in,input[type=time].in{color-scheme:dark}
label.f{display:block}
label.f>span{display:block;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}
.chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:650;padding:3px 9px;border-radius:999px;background:linear-gradient(180deg,#24272f,#16181e);border:1px solid #33363f;color:var(--ink2)}
.chip.r{background:linear-gradient(180deg,#3a0f19,#22080e);border-color:#7a2335;color:#FFB3C0}
.chip.lvl{background:var(--chrome-red);border-color:#ff8da0;color:#fff;font-weight:800}
.chip.ok{background:rgba(50,214,160,.10);border-color:rgba(50,214,160,.45);color:var(--ok)}
.title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.title-row h1{font-size:30px;letter-spacing:-.01em}
.sub{color:var(--mute);margin-top:4px}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700;color:var(--nl-hot)}

/* ---------- hero (liquid chrome art, used sparingly) ---------- */
.hero-art{position:relative;overflow:hidden;border-radius:20px;border:1px solid #743544;background:linear-gradient(90deg,rgba(8,9,13,.94) 0%,rgba(8,9,13,.70) 55%,rgba(8,9,13,.35) 100%),url('../assets/liquid-chrome-wide.jpg') center 45%/cover;box-shadow:0 18px 50px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08)}
.hero-art .eyebrow{font-size:10.5px;letter-spacing:.3em;font-weight:800;color:var(--nl-hot)}
.hero-art h1{font-size:clamp(26px,4vw,40px);letter-spacing:-.01em;margin-top:6px}
.hero-art p{color:#E2D7DC;margin:6px 0 0}

/* ---------- clients ---------- */
.client-card{padding:16px;cursor:pointer}
.avatar{width:44px;height:44px;border-radius:12px;background:var(--chrome-red);border:1px solid #ff8da0;color:#fff;display:grid;place-items:center;font-family:var(--font-d);font-weight:700;font-size:16px;flex:none;box-shadow:inset 0 2px 2px rgba(255,255,255,.45),inset 0 -3px 5px #330009,0 6px 16px rgba(201,0,37,.3)}
.macro-line{display:flex;gap:14px;margin-top:12px;font-size:12px;color:var(--ink2)}.macro-line b{color:var(--ink);font-size:14px}
.statgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06)}
.statgrid span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:700}
.statgrid b{font-size:15px;font-family:var(--font-d)}
.dl{font-size:11.5px;font-weight:700;color:var(--mute);margin-left:4px;white-space:nowrap}
.dl.up{color:var(--ok)}.dl.down{color:var(--nl-hot)}

/* ---------- client detail ---------- */
.ed-head{display:flex;gap:14px;align-items:center;margin-bottom:18px;flex-wrap:wrap;padding:18px 20px}
.ed-head h1{font-size:28px}
.ed-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px;align-items:start}
@media(max-width:980px){.ed-layout{grid-template-columns:1fr}}
.side .card+.card{margin-top:14px}
.subtabs{display:flex;gap:4px;overflow-x:auto;padding:4px;margin-bottom:18px;background:#0b0c10;border:1px solid #23262d;border-radius:14px;box-shadow:inset 0 2px 6px rgba(0,0,0,.5)}
.subtabs button{border:0;background:none;padding:9px 13px;font-weight:650;color:var(--mute);border-radius:10px;white-space:nowrap;font-size:13px;transition:.18s}
.subtabs button:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.subtabs button.on{color:#fff;background:linear-gradient(180deg,#2c2f38,#1a1c22);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -2px 0 var(--nl-hot),0 4px 12px rgba(0,0,0,.4)}
.subtabs .off{font-size:9.5px;background:#1c1e24;color:var(--mute);padding:1px 5px;border-radius:4px;margin-left:3px;border:1px solid #30343d}
.kpi-c{padding:15px 17px}
.kpi-c span{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#C9A2AB;font-weight:700;margin-bottom:6px}
.kpi-c b{font-family:var(--font-d);font-size:26px;font-weight:700;letter-spacing:-.01em}
.note{padding:9px 0;border-bottom:1px solid rgba(255,255,255,.06)}.note:last-child{border:0}
.toggles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.tg{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:500;user-select:none;position:relative}
.tg input{position:absolute;opacity:0;width:0;height:0}
.tg span{width:40px;height:22px;border-radius:99px;background:#0b0c10;border:1px solid #3a3e48;position:relative;flex:none;transition:.22s;box-shadow:inset 0 2px 4px rgba(0,0,0,.6)}
.tg span:after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:linear-gradient(180deg,#e9ecf1,#9aa1ac);transition:.22s;box-shadow:0 1px 3px rgba(0,0,0,.6)}
.tg input:checked+span{background:var(--chrome-red);border-color:#ff8da0;box-shadow:inset 0 1px 1px rgba(255,255,255,.4),0 0 12px rgba(201,0,37,.35)}
.tg input:checked+span:after{left:20px;background:linear-gradient(180deg,#fff,#d7dbe1)}
.tg input:focus-visible+span{outline:2px solid var(--nl-chrome);outline-offset:2px}
.tg input:disabled+span{opacity:.5}
.split{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
@media(max-width:760px){.split{grid-template-columns:repeat(4,1fr)}}

/* ---------- training editor ---------- */
.sessie{margin-bottom:14px;overflow:hidden}
.oef{display:flex;gap:10px;padding:12px 0;border-top:1px solid rgba(255,255,255,.06)}
.oef-n{width:26px;min-height:26px;border-radius:7px;background:#1d1013;border:1px solid #5a2230;color:#FFB3C0;font-weight:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:12px;flex:none;margin-top:20px;padding:3px 0}
.oef-g{flex:1;display:grid;grid-template-columns:2.2fr .6fr .8fr .8fr .8fr;gap:8px}.oef-g .oef-wide{grid-column:span 5}
.oef-g2{flex:1;display:grid;grid-template-columns:2.4fr 1fr .6fr 1.2fr .8fr .8fr .8fr .9fr .7fr;gap:8px}
.oef-g2 .oef-wide{grid-column:1/span 6}.oef-g2 .oef-wide2{grid-column:7/span 3}
@media(max-width:1100px){.oef-g2{grid-template-columns:repeat(4,1fr)}.oef-g2 .oef-name{grid-column:span 2}.oef-g2 .oef-wide,.oef-g2 .oef-wide2{grid-column:1/-1}}
@media(max-width:760px){.oef-g{grid-template-columns:1fr 1fr}.oef-g .oef-name,.oef-g .oef-wide{grid-column:span 2}}
.oef-a{display:flex;flex-direction:column;gap:2px;margin-top:18px}
.oef.in-ss{background:linear-gradient(90deg,rgba(201,0,37,.10),transparent 45%);border-radius:10px}
.ses-sum{padding:0 16px 14px;font-size:12.5px;color:var(--ink2)}
.ss{display:inline-grid;place-items:center;min-width:18px;height:18px;border-radius:5px;font-size:10.5px;font-weight:800;color:#fff;background:#3a3e48;padding:0 4px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.ss-A{background:linear-gradient(180deg,#ff4a68,#a8001f)}.ss-B{background:linear-gradient(180deg,#5aa0ff,#1650b8)}.ss-C{background:linear-gradient(180deg,#4fe0b0,#14805c)}.ss-D{background:linear-gradient(180deg,#ffc35c,#a86b00)}
.ss-E{background:linear-gradient(180deg,#a77bff,#5a25c0)}.ss-F{background:linear-gradient(180deg,#45d6d8,#0c7476)}.ss-G{background:linear-gradient(180deg,#ff6fc0,#9b2a72)}.ss-H{background:linear-gradient(180deg,#8a8f99,#40444d)}

/* ---------- tables ---------- */
.tscroll{overflow-x:auto}
table.t{width:100%;border-collapse:collapse}
table.t th{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);text-align:left;padding:10px 10px;border-bottom:1px solid #2a2d35;position:sticky;top:0;background:#14161c;font-weight:700}
table.t td{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.05);font-variant-numeric:tabular-nums}
table.t td.n,table.t th.n{text-align:right}
table.t tbody tr{transition:background .15s}
table.t tbody tr:hover td{background:rgba(201,0,37,.07)}
table.t.edit td{padding:5px 6px}table.t.edit .in{padding:6px 8px;min-width:80px}
table.t tr.cur td{background:rgba(201,0,37,.12)}
table.metr tr{cursor:pointer}table.metr tr.sel td{background:rgba(201,0,37,.14)}table.metr tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--nl-hot)}
table.citable td,table.citable th{white-space:nowrap;font-size:12.5px}
table.citable tr.wkrow td{background:#101116;font-size:12px;color:var(--ink2);letter-spacing:.02em}
table.tl tr.dim td{opacity:.42}table.tl td:first-child{white-space:nowrap}table.tl td{vertical-align:top}
table.pv td,table.pv th{font-size:12.5px;padding:6px 8px}

/* ---------- progress / charts ---------- */
.totals{padding:14px 18px;margin-bottom:14px;position:sticky;top:110px;z-index:5;background:linear-gradient(180deg,rgba(28,30,37,.97),rgba(17,18,23,.97))}
.bars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media(max-width:560px){.bars{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bar .lbl{display:flex;justify-content:space-between;font-size:12px;color:var(--mute);margin-bottom:6px}
.bar .lbl b{color:var(--ink);font-size:15px;font-family:var(--font-d)}
.track{height:9px;background:#0b0c10;border-radius:99px;overflow:hidden;border:1px solid #47353b;box-shadow:inset 0 2px 3px rgba(0,0,0,.6)}
.fill{height:100%;border-radius:inherit;background:linear-gradient(180deg,#ffadb8 0%,#ff3154 26%,#c90025 60%,#650016 100%);box-shadow:0 0 12px rgba(255,49,84,.42);transform-origin:left;transition:width .85s cubic-bezier(.2,.8,.2,1)}
.fill.over{background:linear-gradient(180deg,#ffe0a3,#f5b547 40%,#9b6a10);box-shadow:0 0 10px rgba(245,181,71,.4)}
.pg-in .fill{animation:nlGrow .95s cubic-bezier(.2,.8,.2,1) both}
@keyframes nlGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.chart{width:100%;height:auto;display:block;margin-top:10px}
.chart .gl{stroke:#22252c;stroke-width:1}
.chart text{font-size:11px;fill:#7d828d;font-family:Inter}
.chart .ln{fill:none;stroke:var(--nl-hot);stroke-width:2.6;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px rgba(255,49,84,.55))}
.chart circle{fill:#0b0c10;stroke:#ff3154;stroke-width:2;vector-effect:non-scaling-stroke}
.chart .goal{stroke:#C5CBD4;stroke-dasharray:4 4;stroke-width:1;vector-effect:non-scaling-stroke;opacity:.7}
.chart .goalt{fill:#C5CBD4;font-weight:600}
.pg-in .chart .ln{stroke-dasharray:2000;animation:nlDraw 1.1s ease-out both}
@keyframes nlDraw{from{stroke-dashoffset:2000}to{stroke-dashoffset:0}}
.spark{width:90px;height:24px}.spark path{fill:none;stroke:#ff3154;stroke-width:1.8;filter:drop-shadow(0 0 3px rgba(255,49,84,.5))}

/* ---------- meal editor ---------- */
.schema-tabs{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.stab{border:1px solid #30343d;background:linear-gradient(180deg,#22252d,#15171c);color:var(--ink2);padding:7px 14px;border-radius:999px;font-weight:650;font-size:13px;transition:.18s}
.stab:hover{border-color:#4a4e58;color:var(--ink)}
.stab.on{background:var(--chrome-red);border-color:#ff8da0;color:#fff;box-shadow:inset 0 1px 1px rgba(255,255,255,.45),0 6px 16px rgba(201,0,37,.3)}
.slot{margin-bottom:14px;overflow:hidden}
.slot-h{display:flex;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid #262931;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent)}
.slot-n{width:30px;height:30px;border-radius:8px;background:var(--chrome-red);border:1px solid #ff8da0;color:#fff;font-family:var(--font-d);font-weight:700;display:grid;place-items:center;flex:none;box-shadow:inset 0 1px 1px rgba(255,255,255,.45),inset 0 -2px 3px #330009}
.slot-title{font-family:var(--font-d);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.02em;border:1px solid transparent;border-radius:8px;padding:5px 8px;background:transparent;flex:1;min-width:120px;color:var(--ink)}
.slot-title:hover{border-color:#30343d}
.slot-title:focus{border-color:#ff3154;outline:none;background:#0b0c10}
.slot select.mom{border:1px solid #30343d;border-radius:8px;padding:5px 8px;background:#0b0c10;font-size:12px;font-weight:600;color:var(--ink2)}
.slot-kcal{font-family:var(--font-d);font-weight:700;font-size:16px;white-space:nowrap}
table.rows{width:100%;border-collapse:collapse}
table.rows th{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);text-align:right;padding:9px 10px;font-weight:700;border-bottom:1px solid #262931}
table.rows th.l{text-align:left}
table.rows td{padding:5px 10px;border-bottom:1px solid rgba(255,255,255,.045);text-align:right;font-variant-numeric:tabular-nums;color:var(--ink2)}
table.rows td.l{text-align:left}
table.rows tr:last-child td{border-bottom:0}
.gin{width:78px;text-align:right}.cin{width:98px;text-transform:uppercase;font-weight:700;color:var(--nl-hot)!important}
.nm{color:var(--ink);font-weight:500}.nm.bad{color:var(--nl-hot);font-weight:700}
.slot-f{display:flex;gap:8px;align-items:center;padding:10px 14px;border-top:1px solid #262931;background:rgba(0,0,0,.18);flex-wrap:wrap}
.slot-f .tot{margin-left:auto;font-size:12px;color:var(--mute)}.slot-f .tot b{color:var(--ink)}
.add-slot{width:100%;border:1px dashed #6a2a38;background:linear-gradient(180deg,rgba(201,0,37,.10),rgba(101,0,22,.06));color:#FFB3C0;border-radius:var(--r);padding:16px;font-weight:700;font-family:var(--font-d);letter-spacing:.12em;text-transform:uppercase;font-size:14px;transition:.2s}
.add-slot:hover{border-color:#ff3154;color:#fff;box-shadow:0 0 20px rgba(201,0,37,.2)}
.add-slot:disabled{border-color:#30343d;background:transparent;color:var(--mute)}

/* ---------- catalog ---------- */
.filters{display:grid;grid-template-columns:2fr repeat(4,1fr);gap:10px;margin-bottom:14px}
@media(max-width:860px){.filters{grid-template-columns:1fr 1fr}}
.meal-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.meal-card{padding:15px;cursor:pointer;display:flex;flex-direction:column;gap:8px}
.meal-card .nmx{font-weight:600;line-height:1.35}
.mm{display:flex;gap:10px;font-size:12px;color:var(--mute)}.mm b{color:var(--ink)}

/* ---------- modal ---------- */
.ov{position:fixed;inset:0;background:rgba(3,3,5,.72);backdrop-filter:blur(3px);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;overflow:auto;animation:nlFade .2s ease-out}
@keyframes nlFade{from{opacity:0}}
.modal{background:linear-gradient(160deg,#1e2128,#121318 40%,#0e0f13);border:1px solid #3a3e48;border-radius:18px;width:100%;max-width:640px;box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 30px 80px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.6);animation:nlModal .22s cubic-bezier(.2,.8,.2,1)}
@keyframes nlModal{from{opacity:0;transform:scale(.98) translateY(6px)}}
.modal.wide{max-width:860px}
.mh{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid #262931}
.mh h2{font-size:19px;flex:1}
.mb{padding:18px 20px}
.mf{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:14px 20px;border-top:1px solid #262931;flex-wrap:wrap}
.lvl-tabs{display:flex;gap:6px;margin-bottom:14px}
.lvl-tabs button{flex:1;border:1px solid #30343d;background:linear-gradient(180deg,#22252d,#15171c);border-radius:10px;padding:9px;font-weight:800}
.lvl-tabs button small{display:block;font-weight:500;color:var(--mute);font-size:11px}
.lvl-tabs button.on{border-color:#ff8da0;background:var(--chrome-red);color:#fff}.lvl-tabs button.on small{color:#ffd5dc}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:14px}
.kpi{background:#0b0c10;border:1px solid #262931;border-radius:12px;padding:10px;text-align:center}
.kpi b{display:block;font-family:var(--font-d);font-size:20px}.kpi span{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:700}
.prep{background:#0b0c10;border:1px solid #23262d;border-radius:12px;padding:12px;margin-top:10px;color:var(--ink2)}
.pv-day{border:1px solid #2a2d35;border-radius:12px;padding:12px;margin-top:12px;background:rgba(0,0,0,.2)}
.ai-out{white-space:pre-wrap;background:#0b0c10;border:1px solid #2a2d35;border-radius:12px;padding:14px;margin-top:12px;max-height:50vh;overflow:auto;font-size:13.5px;line-height:1.6;color:var(--ink2)}

/* ---------- client app ---------- */
body.client-mode{padding-bottom:78px}
body.client-mode .status{bottom:86px;right:50%;transform:translate(50%,8px)}body.client-mode .status.show{transform:translate(50%,0)}
.c-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin:4px 0 16px}
.c-top h1{font-size:30px;letter-spacing:-.01em}
.c-top.hero-art{padding:22px 20px 20px;align-items:flex-end;min-height:150px}
.c-meta{color:var(--ink2);margin-top:6px}.c-meta b{color:var(--nl-hot);font-size:17px;font-family:var(--font-d)}
.hic{border:1px solid #3a3e48;background:linear-gradient(180deg,#24272f,#121318);width:42px;height:42px;border-radius:12px;position:relative;font-size:17px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.hic:hover{border-color:#ff637b}
.hic i{position:absolute;top:-6px;right:-6px;background:var(--chrome-red);border:1px solid #ff8da0;color:#fff;font-style:normal;font-size:10px;font-weight:800;border-radius:99px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 4px}
#app.narrow .card{margin-bottom:12px}
.coachmsg{border-left:3px solid var(--nl-hot)}
.today{border-top:2px solid var(--nl-hot)}.today.done{border-top-color:var(--ok)}
.wkgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:520px){.wkgrid{grid-template-columns:repeat(2,1fr)}}
.wk{background:#0b0c10;border:1px solid #23262d;border-radius:12px;padding:11px 12px;box-shadow:inset 0 2px 6px rgba(0,0,0,.45)}
.wk span{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:700}
.wk b{display:block;font-family:var(--font-d);font-size:26px;font-weight:700;letter-spacing:-.01em}.wk b small{font-size:12px;margin-left:2px;font-family:Inter;color:var(--mute)}
.wk .dl{margin:0}
.goal{padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}.goal:last-of-type{border:0}
.gl1{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:7px}
.gl1 span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:700}
.gl1 b{font-size:15px;text-align:right;font-family:var(--font-d)}.gl1 b small{color:var(--mute);font-weight:500;font-family:Inter}
.gl2{font-size:12.5px;color:var(--ink2);margin-top:5px}
.side-goals{margin:0;padding-left:18px}.side-goals li{margin:5px 0}.side-goals li::marker{color:var(--nl-hot)}
.evdate{width:48px;height:52px;border-radius:12px;background:var(--chrome-red);border:1px solid #ff8da0;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:10px;text-transform:uppercase;font-weight:800;letter-spacing:.08em;flex:none;box-shadow:inset 0 2px 2px rgba(255,255,255,.4),inset 0 -3px 5px #330009}
.evdate b{font-family:var(--font-d);font-size:20px;line-height:1}
.ev{display:flex;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.06)}.ev:last-child{border:0}
.bnav{position:fixed;left:0;right:0;bottom:0;background:linear-gradient(180deg,#15171d,#0b0c10);border-top:1px solid #2a2d35;display:flex;justify-content:center;z-index:30;box-shadow:0 -10px 30px rgba(0,0,0,.55);padding-bottom:env(safe-area-inset-bottom)}
.bnav:before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(197,203,212,.35),rgba(255,49,84,.5),transparent)}
.bnav button{flex:1;max-width:150px;border:0;background:none;padding:9px 4px 11px;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);display:flex;flex-direction:column;align-items:center;gap:3px;min-height:56px;position:relative;transition:color .2s}
.bnav .bi{font-size:18px;line-height:1.2}
.bnav button.on{color:#fff}
.bnav button.on:before{content:"";position:absolute;top:0;left:28%;right:28%;height:2px;background:var(--nl-hot);box-shadow:0 0 12px 2px rgba(255,49,84,.6);border-radius:0 0 2px 2px}
.bnav button.on .bi{color:var(--nl-hot);text-shadow:0 0 12px rgba(255,49,84,.6)}
.bnav button:active{transform:scale(.96)}
.dayrow{position:relative;display:flex;gap:6px;overflow-x:auto;margin-bottom:14px;padding:2px 2px 6px}
.day{border:1px solid #30343d;background:linear-gradient(180deg,#1f2229,#121318);border-radius:12px;min-width:50px;padding:7px 4px;display:flex;flex-direction:column;align-items:center;position:relative;color:var(--ink)}
.day span{font-size:10px;text-transform:uppercase;color:var(--mute);font-weight:700;letter-spacing:.08em}.day b{font-size:16px;font-family:var(--font-d)}
.day.on{border-color:#ff8da0;background:var(--chrome-red);box-shadow:inset 0 1px 1px rgba(255,255,255,.45),0 6px 16px rgba(201,0,37,.35)}.day.on span{color:#ffd5dc}
.day.ok:after,.day.dr:after{content:"";position:absolute;bottom:-4px;width:8px;height:8px;border-radius:50%;background:var(--ok);border:2px solid var(--nl-bg)}
.day.dr:after{background:var(--warn)}.day.fut{opacity:.3}
.ok-line{color:var(--ok);font-weight:650;margin-bottom:12px}
.cif{padding:15px 0;border-bottom:1px solid rgba(255,255,255,.06)}.cif:last-of-type{border:0;margin-bottom:10px}
.cil{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:9px;color:var(--ink2)}
.stepper{display:flex;gap:8px}
.stepper button{width:48px;min-height:48px;border:1px solid #3a3e48;background:linear-gradient(180deg,#2a2d35,#16181e);border-radius:12px;font-size:20px;font-weight:600;color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.stepper button:active{transform:scale(.97)}
.stepper input{flex:1;text-align:center;font-size:20px;font-weight:700;font-family:var(--font-d);border:1px solid #30343d;border-radius:12px;padding:10px;outline:none;min-width:0;background:#0b0c10;color:var(--ink);box-shadow:inset 0 2px 4px rgba(0,0,0,.5)}
.stepper input:focus{border-color:#ff3154;box-shadow:inset 0 2px 4px rgba(0,0,0,.5),0 0 0 3px rgba(255,49,84,.18)}
.scale{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.scale button,.choices button{border:1px solid #30343d;background:linear-gradient(180deg,#22252d,#15171c);border-radius:12px;padding:11px 6px;font-weight:700;color:var(--ink2);min-height:44px;transition:.15s}
.scale button:hover,.choices button:hover{border-color:#4a4e58;color:var(--ink)}
.scale button.on,.choices button.on{background:var(--chrome-red);border-color:#ff8da0;color:#fff;box-shadow:inset 0 1px 1px rgba(255,255,255,.45),0 6px 16px rgba(201,0,37,.3)}
.scale-l{display:flex;justify-content:space-between;font-size:11.5px;color:var(--mute);margin-top:6px}
.choices{display:flex;flex-wrap:wrap;gap:6px}.choices button{padding:9px 14px;font-weight:650}
.cisum{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}.cisum span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:700}.cisum b{font-size:15px;font-family:var(--font-d)}
.segtabs{display:flex;background:#0b0c10;border:1px solid #23262d;border-radius:14px;padding:4px;margin-bottom:14px;gap:2px;box-shadow:inset 0 2px 6px rgba(0,0,0,.5)}
.segtabs.scroll{overflow-x:auto}
.segtabs button{flex:1;border:0;background:none;padding:10px;border-radius:10px;font-weight:700;font-size:13px;color:var(--mute);white-space:nowrap;transition:.18s;min-height:40px}
.segtabs button:hover{color:var(--ink)}
.segtabs button.on{background:linear-gradient(180deg,#2c2f38,#1a1c22);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -2px 0 var(--nl-hot),0 4px 12px rgba(0,0,0,.4)}
.wsplit{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:12px}
.wsplit div{background:#0b0c10;border:1px solid #23262d;border-radius:9px;padding:6px 4px;text-align:center;overflow:hidden}
.wsplit span{display:block;font-size:9.5px;text-transform:uppercase;color:var(--mute);font-weight:700;letter-spacing:.08em}
.wsplit b{font-size:11px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wsplit .rest b{color:#5d626d;font-weight:500}
.wsplit .t{background:var(--chrome-red);border-color:#ff8da0;color:#fff}.wsplit .t span{color:#ffd5dc}
.c-sessie{overflow:hidden}.cs-h{padding:15px 16px;gap:8px}
.oeflist{border-top:1px solid #262931}
.co{display:flex;gap:12px;padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.05)}.co:last-child{border:0}
.co-n{width:28px;height:28px;border-radius:8px;background:#1d1013;border:1px solid #5a2230;color:#FFB3C0;font-weight:800;display:grid;place-items:center;font-size:12px;flex:none}
.co.in-ss{border-left:3px solid #ff3154;padding-left:13px;background:linear-gradient(90deg,rgba(201,0,37,.08),transparent 50%)}
.co.ss-b-B{border-left-color:#3d8bff;background:linear-gradient(90deg,rgba(61,139,255,.08),transparent 50%)}
.co.ss-b-C{border-left-color:#32D6A0;background:linear-gradient(90deg,rgba(50,214,160,.07),transparent 50%)}
.co.ss-b-D{border-left-color:#F5B547;background:linear-gradient(90deg,rgba(245,181,71,.07),transparent 50%)}
.ss-head{display:flex;align-items:center;gap:8px;padding:10px 16px 0;font-size:12px;font-weight:600;color:var(--ink2)}
.setrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.setp{background:linear-gradient(180deg,#2a2d35,#15171c);border:1px solid #3a3e48;color:#fff;border-radius:9px;padding:4px 10px;font-weight:700;font-size:13px;font-family:var(--font-d);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.setp small{color:#ff8fa0;font-size:10px;margin-right:5px;font-weight:700;font-family:Inter}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.tempo-leg{font-size:11.5px;color:var(--mute);padding:10px 16px;border-top:1px solid rgba(255,255,255,.05)}
.logex{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.06)}.logex:first-child{padding-top:0}
.logset{display:grid;grid-template-columns:30px 1fr 14px 1fr;gap:6px;align-items:center;margin-top:6px}
.logset span{font-size:12px;font-weight:700;color:var(--mute);text-align:center}
.daygoal .dg{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
.daygoal .dg div{background:#0b0c10;border:1px solid #23262d;border-radius:12px;padding:10px;text-align:center}
.daygoal .dg b{font-family:var(--font-d);font-size:20px;display:block}.daygoal .dg span{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:700}
.c-meal{margin-bottom:12px}
.c-meal-h{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer}
.c-meal-h .slot-n{width:34px;height:34px;border-radius:9px}
.c-meal-h h3{font-size:16px}
.c-meal-b{padding:0 16px 16px}
.ing-list{list-style:none;margin:0;padding:0}
.ing-list li{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.05)}.ing-list li:last-child{border:0}
.ing-list .g{font-weight:700;font-variant-numeric:tabular-nums;font-family:var(--font-d)}
.chev{transition:.2s;color:var(--mute)}.open .chev{transform:rotate(180deg)}
.rules li{margin:4px 0}.rules-card{border-left:3px solid var(--nl-hot)}
.supp-mom{margin:18px 0 8px;color:var(--nl-hot)}
.shop h4{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--nl-hot);margin:16px 0 4px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.ft{position:relative;border-radius:12px;overflow:hidden;background:#0b0c10;aspect-ratio:3/4;cursor:pointer;border:2px solid #23262d;transition:.2s}
.ft:hover{border-color:#5a2230}.ft.sel{border-color:#ff3154;box-shadow:0 0 18px rgba(255,49,84,.35)}
.ft img{width:100%;height:100%;object-fit:cover;display:block}
.ft span{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;font-size:11px;font-weight:600;padding:16px 8px 6px}
.ft .fdel{position:absolute;top:4px;right:4px;background:rgba(10,10,14,.85);opacity:0}.ft:hover .fdel{opacity:1}
@media(hover:none){.ft .fdel{opacity:1}}
.cmp figure{margin:0}.cmp img{width:100%;border-radius:12px;display:block;border:1px solid #2a2d35}.cmp figcaption{font-size:12px;color:var(--mute);margin-top:6px;text-align:center}

/* ---------- misc ---------- */
.empty{text-align:center;padding:44px 20px;color:var(--mute)}
.empty .big{font-family:var(--font-d);font-size:22px;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
.loader{display:grid;place-items:center;min-height:60vh;text-align:center}
.spin{width:40px;height:40px;border-radius:50%;margin:0 auto 14px;background:conic-gradient(from 0deg,transparent,#ff3154 70%,#ffd5dc);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));animation:s .9s linear infinite;filter:drop-shadow(0 0 6px rgba(255,49,84,.5))}
@keyframes s{to{transform:rotate(360deg)}}
.skel{background:linear-gradient(90deg,#14161c,#1f2229,#14161c);background-size:200% 100%;animation:nlSkel 1.4s ease-in-out infinite;border-radius:10px}
@keyframes nlSkel{to{background-position:-200% 0}}

/* ---------- responsive ---------- */
@media(max-width:640px){
  .top-in{padding:8px 12px;gap:8px}.logo{font-size:15px;gap:9px}.logo small,.demo-pill{display:none}.logo .mark{width:32px;height:32px;font-size:10px}
  .seg button{padding:5px 10px;font-size:11.5px}.top select{max-width:120px;padding:5px}
  .wrap{padding:16px 14px 92px}.c-top h1{font-size:24px}.tabs{top:49px}
  .title-row h1{font-size:24px}.kpi-c b{font-size:22px}
}

/* ---------- help ---------- */
.help-btn{width:34px;height:34px;border-radius:50%;flex:none;border:1px solid #3a3e48;background:linear-gradient(180deg,#2a2d35,#121318);color:var(--nl-chrome);font-family:var(--font-d);font-weight:700;font-size:16px;display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 4px 12px rgba(0,0,0,.4);transition:.2s}
.help-btn:hover{border-color:#ff637b;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 14px rgba(201,0,37,.35)}
.help-btn:active{transform:scale(.95)}
.help-steps{list-style:none;margin:0;padding:0}
.help-steps li{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}.help-steps li:last-child{border:0}
.help-steps .hn{width:28px;height:28px;border-radius:8px;flex:none;display:grid;place-items:center;font-family:var(--font-d);font-weight:700;color:#fff;background:var(--chrome-red);border:1px solid #ff8da0;box-shadow:inset 0 1px 1px rgba(255,255,255,.45),inset 0 -2px 3px #330009}
.help-steps .ht{display:block;margin-bottom:2px;font-family:var(--font-d);text-transform:uppercase;letter-spacing:.04em;font-size:13px}
.help-steps b{color:#fff}
.kbd{display:inline-block;min-width:22px;padding:0 6px;border:1px solid #3a3e48;border-radius:6px;background:#0b0c10;text-align:center;font-weight:700}
.help-link{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:14px;padding:12px;border:1px solid #2a2d35;border-radius:12px;background:#0b0c10}

/* ---------- login / account ---------- */
.login-ov{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px;background:radial-gradient(900px 500px at 80% 0%,rgba(201,0,37,.18),transparent 60%),var(--nl-void);overflow:auto}
.login-card{width:100%;max-width:420px;border-radius:22px;overflow:hidden;border:1px solid #3a2d33;background:var(--ti-grad);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 80px rgba(0,0,0,.7);animation:nlModal .3s cubic-bezier(.2,.8,.2,1)}
.login-hero{height:150px;display:flex;align-items:flex-end;padding:18px 22px;background:linear-gradient(180deg,rgba(8,9,13,.15),rgba(8,9,13,.92)),url('../assets/liquid-chrome-wide.jpg') center 40%/cover;border-bottom:1px solid #743544}
.login-body{padding:22px}.login-body h1{font-size:26px}
.login-err{color:#FF8FA0;font-size:13px;min-height:18px;margin-top:10px}
.user-btn{font-size:12px;letter-spacing:.02em}
body.is-client .seg,body.is-client #asClient{display:none!important}
@supports(padding:max(0px)){.top-in{padding-top:max(10px,env(safe-area-inset-top))}}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .metal{transform:none!important}
}