/* ======================= «Заявка»: вид менеджера =======================
   Сотрудники (HR, владелец) видят тот же кабинет, что и в «Строке»: тёмное меню слева, оранжевый акцент.
   У менеджеров своё: тёмно-синяя шапка с разделами, бумажный фон, «талоны» заданий с перфорацией, плавающая панель на телефоне.
   Цвета — марка магазина: оранжевый #ff5a14 и синий #1f2c8f. Всё ниже действует только внутри body.is-author и на экране входа. */

body.is-author,body.is-bare{
  --bg:#f3f1ea;--surface:#fff;--fog:#e8e5db;
  --ink:#12163a;--ink-2:#4a4f6e;--ink-3:#7c809e;--line:rgba(18,22,58,.1);
  --accent:#ff5a14;--accent-2:#e84c0a;--accent-soft:#ffe6d9;
  --navy:#0f1b5c;--navy-2:#1f2c8f;--navy-3:#3446d1;
  --dark:#0f1b5c;--dark-2:#16226e;
  --ok:#0b7a53;--ok-soft:#dcf3e9;
  --shadow:0 1px 2px rgba(15,27,92,.05),0 16px 36px -16px rgba(15,27,92,.28);
  --r-card:22px;--r-panel:28px;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  background:var(--bg);
}
body.is-author{background:
  radial-gradient(1100px 420px at 100% -80px,rgba(31,44,143,.1),transparent 70%),
  linear-gradient(var(--bg),var(--bg))}
body.is-author h1,body.is-author h2,body.is-author .card-h h2{letter-spacing:-.03em}

/* ---------- шапка ---------- */
.zt{position:sticky;top:0;z-index:50;color:#fff;background:linear-gradient(180deg,#0f1b5c,#16226e);box-shadow:0 2px 0 var(--accent),0 10px 30px -14px rgba(15,27,92,.55)}
.zt-in{display:flex;align-items:center;gap:22px;max-width:1180px;margin:0 auto;padding:11px clamp(16px,3vw,40px)}
.zlogo{display:flex;align-items:center;gap:10px;color:#fff;flex:none}
.zlogo .logo-mark{width:30px;height:30px}
.zlogo .logo-mark .lm-b{fill:var(--accent)}
.zlogo b{font-size:21px;font-weight:800;letter-spacing:-.035em;line-height:1}
.zlogo small{display:block;font-size:10px;line-height:1.2;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.zlogo{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:10px;align-items:center}.zlogo .logo-mark{grid-row:1/3}.zlogo b{align-self:end}.zlogo small{align-self:start;margin-top:3px}
.znav{display:flex;gap:4px;flex:1;min-width:0;margin-left:6px}
.znav .nav-i{height:40px;padding:0 15px 0 12px;border-radius:999px;font-size:14.5px;font-weight:550;white-space:nowrap}
.znav .nav-i .ico{width:18px;height:18px}
.znav .nav-i.is-on{background:var(--accent);box-shadow:0 8px 20px -8px rgba(255,90,20,.8)}
.zme{display:flex;align-items:center;gap:10px;margin-left:auto;flex:none}
.zme .ava{width:36px;height:36px;font-size:14px}
.zme-t{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.zme-t b{font-size:13.5px;font-weight:600;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zme-t small{font-size:12px;color:rgba(255,255,255,.6)}
.zme .iconbtn{border-radius:50%}
.zdock{display:none}

.zmain{width:100%;max-width:1180px;margin:0 auto;padding:30px clamp(16px,3vw,40px) 80px}
body.is-author .top h1{font-size:clamp(28px,3.4vw,44px);font-weight:760;color:var(--navy);letter-spacing:-.04em}
body.is-author .sub{color:var(--ink-2)}
body.is-author .back{background:#fff}
body.is-author .card{box-shadow:0 0 0 1px var(--line),var(--shadow)}
body.is-author .card-h h2{font-weight:720;font-size:19px;color:var(--navy)}
body.is-author .btn-accent{background:var(--accent);box-shadow:0 12px 26px -12px rgba(255,90,20,.9)}
body.is-author .btn-accent:hover{background:var(--accent-2)}
body.is-author .btn-dark{background:var(--navy)}
body.is-author .btn-dark:hover{background:var(--navy-2)}
body.is-author .link{color:var(--navy-2);font-weight:600}
body.is-author .pill.is-on{background:var(--navy)}
body.is-author .bar{background:rgba(15,27,92,.1)}
body.is-author .num{font-family:var(--mono);letter-spacing:-.04em}

/* ---------- талон задания на «Сегодня» ---------- */
.stage{--pad:clamp(22px,3vw,36px);position:relative;overflow:hidden;border-radius:var(--r-panel);padding:var(--pad);color:#fff;display:flex;flex-direction:column;gap:18px;
  background-image:
    radial-gradient(circle at 92% 22%,transparent 0 58px,rgba(255,255,255,.1) 59px 61px,transparent 62px 86px,rgba(255,255,255,.07) 87px 88px,transparent 89px),
    linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px),
    radial-gradient(120% 150% at 100% 0%,#3446d1 0%,#1f2c8f 38%,#0f1b5c 100%);
  background-size:auto,30px 30px,30px 30px,auto;box-shadow:0 22px 50px -24px rgba(15,27,92,.7)}
.stage .eyebrow{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#ffb48f;opacity:1;margin:0 0 12px}
.stage h2{font-size:clamp(28px,4.2vw,50px);line-height:1.04;font-weight:800;letter-spacing:-.04em;max-width:18ch;text-wrap:balance}
.stage-sub{margin-top:12px;max-width:52ch;font-size:16.5px;line-height:1.5;color:rgba(255,255,255,.78)}
.stage .tmeta{margin-top:16px}
.stage .tmeta span{background:rgba(255,255,255,.12);color:#fff}
.stage-a{position:relative;margin:4px calc(var(--pad) * -1) calc(var(--pad) * -1);padding:calc(var(--pad) * .8) var(--pad) var(--pad);border-top:2px dashed rgba(255,255,255,.3);display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.stage-a::before,.stage-a::after{content:"";position:absolute;top:-13px;width:24px;height:24px;border-radius:50%;background:var(--bg)}
.stage-a::before{left:-12px}.stage-a::after{right:-12px}
.stage-a .check{color:#fff;align-items:center}.stage-a .check a{text-decoration:underline}
.meter{max-width:460px}
.meter .bar{background:rgba(255,255,255,.18);height:10px}
.meter small{font-size:13px;color:rgba(255,255,255,.75)}
.stage-ink{background-image:
    radial-gradient(circle at 92% 22%,transparent 0 58px,rgba(255,255,255,.08) 59px 61px,transparent 62px 86px,rgba(255,255,255,.05) 87px 88px,transparent 89px),
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    radial-gradient(120% 150% at 100% 0%,#1f2c8f 0%,#10196b 45%,#0a1040 100%)}
.stage-lock{background-image:
    repeating-linear-gradient(-45deg,var(--accent) 0 12px,#0f1b5c 12px 24px),
    radial-gradient(circle at 92% 22%,transparent 0 58px,rgba(255,255,255,.1) 59px 61px,transparent 62px),
    radial-gradient(120% 150% at 100% 0%,#3446d1 0%,#1f2c8f 38%,#0f1b5c 100%);
  background-size:100% 9px,auto,auto;background-repeat:no-repeat;background-position:0 0,0 0,0 0}
.stage-calm{color:var(--ink);background:#fff;background-image:none;box-shadow:0 0 0 1px var(--line),var(--shadow)}
.stage-calm::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--accent)}
.stage-calm .eyebrow{color:var(--accent-2)}
.stage-calm h2{color:var(--navy)}
.stage-calm .stage-sub{color:var(--ink-2)}
.stage-calm .meter .bar{background:rgba(15,27,92,.1)}
.stage-calm .meter small{color:var(--ink-3)}
.stage-calm .stage-a{border-top-color:var(--line)}
.stage-calm .stage-a::before,.stage-calm .stage-a::after{display:none}

.tmeta{display:flex;flex-wrap:wrap;gap:8px}
.tmeta span{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--fog);font-size:13.5px;font-weight:550;color:var(--ink-2)}
.tmeta .ico{width:15px;height:15px}
.tcard{padding:4px 2px 6px}
.tlead{font-size:clamp(17px,1.6vw,20px);line-height:1.5;color:var(--ink);max-width:70ch;margin-bottom:14px;font-weight:500}

/* водяной знак: номер задания на талоне */
.stage-no{position:absolute;right:clamp(14px,4vw,54px);top:50%;transform:translateY(-66%);font-family:inherit;font-weight:800;font-size:clamp(120px,17vw,230px);line-height:1;letter-spacing:-.07em;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.17);pointer-events:none;user-select:none}
.stage>.stage-t,.stage>.meter,.stage>.stage-a,.stage>.card{position:relative;z-index:1}

/* ---------- десять станций ---------- */
.rpath{display:flex;align-items:flex-start;gap:0;list-style:none;margin:6px 0 2px;padding:0}
.rp{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;text-align:center}
.rp + .rp::before{content:"";position:absolute;top:19px;right:50%;width:100%;border-top:2px dashed rgba(15,27,92,.22)}
.rp-done + .rp::before,.rp-done + .rp-now::before{border-top:2px solid var(--navy-2)}
.rp-n{position:relative;z-index:1;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 2px rgba(15,27,92,.18);font-family:var(--mono);font-weight:700;font-size:14px;color:var(--ink-3)}
.rp-n .ico{width:18px;height:18px}
.rp-done .rp-n{background:var(--navy-2);box-shadow:none;color:#fff}
.rp-sent .rp-n{background:#fff;box-shadow:inset 0 0 0 2px var(--accent);color:var(--accent-2)}
.rp-now .rp-n{background:var(--accent);box-shadow:0 0 0 5px rgba(255,90,20,.18);color:#fff}
.rp-t{font-size:12px;line-height:1.25;color:var(--ink-2);max-width:11ch}
.rpath-c .rp-n{width:34px;height:34px;font-size:13px}.rpath-c .rp + .rp::before{top:17px}

.tally{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tally>div{padding:18px 20px;border-radius:var(--r-card);background:#fff;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:4px}
.tally b{font-size:clamp(22px,2.4vw,30px);font-weight:760;color:var(--navy);letter-spacing:-.04em}
.tally b small{font-size:.55em;font-weight:600;color:var(--ink-3)}
.tally span{font-size:13px;color:var(--ink-3)}

/* ---------- список заданий ---------- */
.rtl{list-style:none;margin:0;padding:0}
.rt + .rt{border-top:1px solid var(--line)}
.rt a,.rt>div{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 4px}
.rt a:hover .rt-b b{color:var(--accent-2)}
.rt-n{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--fog);font-family:var(--mono);font-weight:700;color:var(--ink-2)}
.rt-now .rt-n{background:var(--accent);color:#fff}
.rt-done .rt-n{background:var(--navy-2);color:#fff}
.rt-b b{display:block;font-weight:680;font-size:16.5px;color:var(--navy)}
.rt-b small{display:block;margin-top:2px;color:var(--ink-3);font-size:13.5px;line-height:1.35}
.rt-r{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.rt-r b{font-size:15px;color:var(--ink)}
.rt-ahead{opacity:.62}

/* ---------- задание: слева что делать, справа работа ---------- */
.tgrid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:16px;align-items:start}
.tg-l,.tg-r{display:flex;flex-direction:column;gap:16px;min-width:0}
.steps-l{list-style:none;counter-reset:s;display:grid;gap:14px;padding:0;margin:0}
.steps-l li{counter-increment:s;display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:start;line-height:1.5}
.steps-l li::before{content:counter(s);display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--navy-2);color:#fff;font-family:var(--mono);font-weight:700;font-size:13px}
.sample{padding:14px 16px;border-radius:16px;background:var(--bg);border-left:4px solid var(--accent);font-size:15px;line-height:1.55;color:var(--ink-2)}
.fold summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;list-style:none;font-weight:650;padding:6px 0;color:var(--navy)}
.fold summary::-webkit-details-marker{display:none}
.fold summary .ico{width:18px;height:18px;transition:transform .25s}
.fold[open] summary .ico{transform:rotate(180deg)}
.fold + .fold{margin-top:6px;border-top:1px solid var(--line);padding-top:8px}
.fold h3{margin:14px 0 8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.card-fold{padding:14px 22px}
.nope{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.nope li{padding-left:24px;position:relative;line-height:1.45;font-size:14.5px}
.nope li::before{content:"✕";position:absolute;left:0;top:0;color:#c2331b;font-weight:700}
.lesson-links{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.lesson-links a{display:flex;align-items:center;gap:10px;padding:8px 2px;line-height:1.35}
.lesson-links .ico{width:18px;height:18px;flex:none;color:var(--navy-2)}
.lesson-links .ico.is-done{color:var(--ok)}
.pultgo{padding:18px;border-radius:18px;background:linear-gradient(135deg,#eef0ff,#fff3ec);box-shadow:inset 0 0 0 1px rgba(31,44,143,.14);display:flex;flex-direction:column;gap:10px}
.pultgo .btn{height:54px;font-size:16.5px}

.work-f{padding:22px;border-radius:var(--r-panel);background:#fff;box-shadow:0 0 0 1px var(--line),var(--shadow);display:flex;flex-direction:column;gap:18px}
.wf-h{display:flex;justify-content:space-between;align-items:center;gap:12px}
.wf-h h2{font-size:21px;font-weight:740;color:var(--navy)}
.saved{font-size:13px;color:var(--ok);display:inline-flex;align-items:center;gap:6px}
.saved::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.saved.is-bad{color:#c2331b}
.fld{display:flex;flex-direction:column;gap:8px}
.fl{font-weight:650;font-size:15px;color:var(--ink)}
.fh{color:var(--ink-3);font-size:13.5px;line-height:1.4}
.fld textarea,.fld input{width:100%;padding:13px 15px;border:0;border-radius:14px;background:var(--bg);font:inherit;line-height:1.55;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line);resize:vertical}
.fld textarea:focus,.fld input:focus{outline:0;background:#fff;box-shadow:inset 0 0 0 2px var(--navy-2)}
.cnt{align-self:flex-end;font-size:12.5px;color:var(--ink-3);font-family:var(--mono)}
.cnt.is-over{color:#c2331b}
.fchk{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:13.5px;color:#a8461a}
.fchk:empty{display:none}
.fchk li::before{content:"• "}
.fld.has-bad textarea{box-shadow:inset 0 0 0 1.5px rgba(255,90,20,.55)}
.selfc h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.crit{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.wf-a{display:flex;flex-direction:column;gap:10px}
.wf-a .muted{font-size:13px;text-align:center}

/* ---------- Выплаты, Помощь, обучение ---------- */
.tgc{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);margin-top:12px}
.tgc>.ico:first-child{width:28px;height:28px;color:var(--navy-2)}
.tgc span{flex:1;min-width:0}.tgc b{display:block}.tgc small{color:var(--ink-3)}
.msgs{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.msg-i{padding:14px 16px;border-radius:16px;background:var(--bg);display:grid;gap:4px}
.msg-i time{font-family:var(--mono);font-size:12px;color:var(--ink-3)}
.msg-i.is-new{box-shadow:inset 4px 0 0 var(--accent)}
.terms{display:grid;gap:12px;padding-left:22px;line-height:1.55}

@media (max-width:980px){
  .zt-in{gap:12px}
  .znav,.zme-t{display:none}
  .zme{margin-left:auto}
  .zdock{display:flex;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;padding:6px;gap:2px;border-radius:26px;
    background:linear-gradient(180deg,#16226e,#0f1b5c);box-shadow:0 18px 40px -12px rgba(15,27,92,.75),0 0 0 1px rgba(255,255,255,.08)}
  .zdock .nav-i{flex:1 1 0;min-width:0;flex-direction:column;gap:3px;height:54px;justify-content:center;padding:0;font-size:10.5px;letter-spacing:-.01em;border-radius:20px}
  .zdock .nav-i span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .zdock .nav-i.is-on{background:var(--accent)}
  .zmain{padding:18px 16px calc(96px + env(safe-area-inset-bottom))}
  .tgrid{grid-template-columns:minmax(0,1fr)}
  .rp-t{display:none}
}
@media (max-width:560px){
  .stage h2{font-size:30px}
  .stage-no{top:18px;transform:none;font-size:104px;right:12px;-webkit-text-stroke-width:1.5px}
  .stage-a{flex-direction:column;align-items:stretch}
  .stage-a .btn{width:100%}
  .tally{grid-template-columns:minmax(0,1fr)}
  .tally>div{flex-direction:row-reverse;justify-content:space-between;align-items:center}
  .rt a,.rt>div{grid-template-columns:auto minmax(0,1fr);gap:12px}
  .rt-r{grid-column:2;flex-direction:row;align-items:center;justify-content:space-between}
  .rp-n{width:30px;height:30px;font-size:12px;border-radius:10px}.rp + .rp::before{top:15px}
  .rpath-c .rp-n{width:28px;height:28px}.rpath-c .rp + .rp::before{top:14px}
}

/* ---------- справка магазина ---------- */
.gd{display:flex;flex-direction:column;gap:16px;min-width:0}
.gd-note{display:flex;gap:12px;align-items:flex-start;padding:14px 18px;border-radius:18px;background:linear-gradient(135deg,#eef0ff,#fff3ec);box-shadow:inset 0 0 0 1px rgba(31,44,143,.14);line-height:1.5;color:var(--ink-2)}
.gd-note .ico{width:22px;height:22px;flex:none;color:var(--navy-2);margin-top:1px}
.gd-nav{display:flex;flex-wrap:wrap;gap:8px}
.gd-nav a{padding:8px 14px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line);font-size:14px;font-weight:600;color:var(--navy);transition:background-color .2s,color .2s}
.gd-nav a:hover{background:var(--navy);color:#fff}
.gd-s{padding:clamp(18px,2.4vw,26px);border-radius:var(--r-card);background:#fff;box-shadow:0 0 0 1px var(--line),var(--shadow);scroll-margin-top:84px;min-width:0}
.gd-s h3{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:740;color:var(--navy);margin-bottom:14px}
.gd-s h3 .ico{width:34px;height:34px;padding:7px;border-radius:11px;background:var(--navy-2);color:#fff;flex:none}
.gd-s h4{margin:18px 0 8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.gd-l{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gd-l li{position:relative;padding-left:22px;line-height:1.55}
.gd-l li::before{content:"";position:absolute;left:3px;top:.62em;width:8px;height:8px;border-radius:2px;background:var(--accent);transform:rotate(45deg)}
.gd-p{line-height:1.55;margin-bottom:12px;color:var(--ink-2)}
.gd-tw{overflow-x:auto;margin:6px 0 14px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line)}
.gd-t{width:100%;border-collapse:collapse;font-size:14.5px}
.gd-t-wide{min-width:560px}
.gd-t td,.gd-t th{overflow-wrap:anywhere}
.gd-t th{padding:11px 14px;text-align:left;background:var(--bg);font-size:12.5px;font-weight:650;color:var(--ink-2);vertical-align:bottom}
.gd-t td{padding:11px 14px;border-top:1px solid var(--line);vertical-align:top;line-height:1.4}
.gd-t small{display:block;color:var(--ink-3);font-size:12.5px;font-weight:500;margin-top:2px}
.gd-t td b{font-family:var(--mono);letter-spacing:-.03em}
.gd-ex{margin-top:12px;padding:14px 16px;border-radius:14px;background:var(--bg);border-left:4px solid var(--accent);line-height:1.6;font-size:15px}

@media (max-width:640px){
  .gd-tw{box-shadow:none;overflow:visible;margin:4px 0 12px}
  .gd-t,.gd-t-wide{min-width:0}
  .gd-t thead{display:none}
  .gd-t,.gd-t tbody,.gd-t tr,.gd-t td{display:block}
  .gd-t tr{padding:12px 14px;border-radius:14px;background:var(--bg);margin-bottom:8px}
  .gd-t td{padding:3px 0;border:0}
  .gd-t td:first-child{font-weight:700;font-size:15.5px;color:var(--navy);padding-bottom:4px}
  .gd-t td[data-l]:not(:first-child)::before{content:attr(data-l);display:block;font-size:12px;color:var(--ink-3);margin-top:4px}
}