/* Lifetime Health hiring mini app. Tokens from the LifetimeHealth design system. */
:root {
  --navy: #2B3F6C; --blue: #3E6BFE; --blue-hover: #274BBF; --blue-press: #2242AA;
  --tint: #ECF1FF; --surface: #F5F8FE; --line: #E2ECF9; --muted: #6A7698;
  --orange: #FF8A00; --orange-text: #B35F00; --orange-tint: #FFF1DE;
  --green: #14915F; --green-tint: #E3FAF0; --pink: #C4134D; --pink-tint: #FFE8EF;
  --white: #FFFFFF; --ink-dark: #0F1A33;
  --r-sm: 8px; --r: 12px; --r-lg: 16px; --r-xl: 20px; --pill: 999px;
  --safe-b: env(safe-area-inset-bottom, 0px);
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--surface); color: var(--navy); font: 15px/1.45 Inter, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--blue); text-decoration: none; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
h1, h2, h3 { font-family: Raleway, Inter, sans-serif; margin: 0; }
h1 { font-size: 26px; font-weight: 800; line-height: 1.15; }
h2 { font-size: 18px; font-weight: 800; }

#app { max-width: 520px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }
.page { flex: 1; padding: 16px 20px calc(96px + var(--safe-b)); display: flex; flex-direction: column; gap: 14px; }
.page.bare { padding-bottom: calc(24px + var(--safe-b)); }
.muted { color: var(--muted); font-size: 13px; }
.small { font-size: 12px; }
.row { display: flex; gap: 10px; align-items: center; }
.grow { flex: 1; min-width: 0; }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.stack { display: flex; flex-direction: column; gap: 10px; }
.hscroll { display: flex; gap: 10px; overflow-x: auto; margin: 0 -20px; padding: 0 20px 4px; scrollbar-width: none; }
.hscroll > * { flex-shrink: 0; }

.top { display: flex; align-items: center; gap: 10px; }
.back { width: 44px; height: 44px; margin-left: -12px; border: 0; background: none; color: var(--navy); display: grid; place-items: center; border-radius: var(--r); }
.logo { width: 30px; height: 30px; color: var(--blue); flex-shrink: 0; }

.hero { margin: -16px -20px 0; padding: 22px 20px 22px; border-radius: 0 0 24px 24px; color: var(--white); background: linear-gradient(160deg, #4D7BFF, #2F5FF6); display: flex; flex-direction: column; gap: 8px; }
.hero.green { background: linear-gradient(165deg, #14915F, #0E7049); }
.hero .pill { align-self: flex-start; background: rgba(255,255,255,.2); padding: 5px 10px; border-radius: var(--pill); font-size: 12px; font-weight: 700; }
.hero p { margin: 0; opacity: .92; font-size: 14px; }

.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 14px; }
.card.dark { background: var(--navy); color: var(--white); border: 0; }
a.card, button.card { display: flex; align-items: center; gap: 12px; color: var(--navy); text-align: left; width: 100%; }
.stat { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 12px; }
.stat b { display: block; font: 800 26px/1.1 Raleway, sans-serif; }
.stat.hot { background: var(--blue); color: var(--white); border-color: var(--blue); }

.avatar { width: 42px; height: 42px; border-radius: var(--pill); background: var(--tint); color: var(--blue); display: grid; place-items: center; font-weight: 800; flex-shrink: 0; }
.avatar.lg { width: 56px; height: 56px; font-size: 18px; }
.badge { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 4px; background: var(--tint); color: var(--blue); white-space: nowrap; }
.badge.warn { background: var(--orange-tint); color: var(--orange-text); }
.badge.ok { background: var(--green-tint); color: var(--green); }
.badge.bad { background: var(--pink-tint); color: var(--pink); }

.btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; padding: 0 18px; border-radius: var(--r); border: 0; background: var(--blue); color: var(--white); font-weight: 700; font-size: 16px; width: 100%; box-shadow: 0 8px 20px rgba(62,107,254,.3); transition: transform .1s, background .2s; }
.btn:active { transform: scale(.98); background: var(--blue-press); }
.btn:disabled { background: #9CB2F8; box-shadow: none; }
.btn.soft { background: var(--tint); color: var(--navy); box-shadow: none; }
.btn.danger { background: var(--pink-tint); color: var(--pink); box-shadow: none; }
.btn.success { background: var(--green); box-shadow: 0 8px 20px rgba(20,145,95,.3); }
.btn.big { min-height: 64px; font-size: 17px; border-radius: var(--r-lg); }
.actions { position: sticky; bottom: calc(84px + var(--safe-b)); background: linear-gradient(transparent, var(--surface) 30%); padding-top: 12px; margin-top: auto; display: flex; gap: 10px; }
.page.bare .actions { bottom: calc(12px + var(--safe-b)); }

label.f { display: block; font-size: 12px; font-weight: 600; color: var(--muted); margin-bottom: 6px; }
input.f, textarea.f, select.f { width: 100%; min-height: 52px; border-radius: var(--r); border: 1px solid var(--line); background: var(--white); padding: 0 14px; font: 600 16px Inter, sans-serif; color: var(--navy); }
textarea.f { padding: 12px 14px; min-height: 80px; resize: vertical; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { min-height: 42px; padding: 0 14px; border-radius: var(--pill); border: 1px solid var(--line); background: var(--white); color: var(--navy); font-weight: 600; font-size: 14px; }
.chip.on { background: var(--blue); border-color: var(--blue); color: var(--white); }
.seg { display: grid; gap: 6px; }
.seg button { min-height: 46px; border-radius: var(--r); border: 1px solid var(--line); background: var(--surface); color: var(--navy); font-weight: 700; }
.seg button.on { background: var(--blue); border-color: var(--blue); color: var(--white); }
.check { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--white); text-align: left; width: 100%; color: var(--navy); }
.check i { width: 26px; height: 26px; border-radius: var(--r-sm); border: 2px solid var(--blue); flex-shrink: 0; display: grid; place-items: center; font-style: normal; color: var(--white); }
.check.on i { background: var(--blue); }

.timeline { display: flex; flex-direction: column; }
.tl { display: flex; gap: 12px; }
.tl .dot { width: 28px; height: 28px; border-radius: var(--pill); display: grid; place-items: center; font-size: 12px; font-weight: 800; flex-shrink: 0; background: var(--white); color: var(--muted); box-shadow: inset 0 0 0 2px var(--line); }
.tl .rail { width: 2px; flex: 1; min-height: 12px; background: var(--line); margin: 0 auto; }
.tl.done .dot { background: var(--blue); color: var(--white); box-shadow: none; }
.tl.done .rail { background: var(--blue); }
.tl.now .dot { background: var(--orange); color: var(--white); box-shadow: 0 0 0 5px rgba(255,138,0,.2); }
.tl .body { padding-bottom: 12px; flex: 1; }

.bar { height: 10px; background: var(--tint); border-radius: var(--pill); overflow: hidden; }
.bar > i { display: block; height: 100%; background: var(--blue); border-radius: var(--pill); }

.nav { position: fixed; left: 0; right: 0; bottom: 0; background: var(--white); border-top: 1px solid var(--line); padding: 8px 4px calc(10px + var(--safe-b)); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); z-index: 10; }
.nav a { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; color: var(--muted); min-height: 52px; justify-content: center; }
.nav a span { width: 52px; height: 30px; border-radius: var(--pill); display: grid; place-items: center; }
.nav a.on { color: var(--blue); font-weight: 700; }
.nav a.on span { background: var(--tint); }
@media (min-width: 560px) { .nav { left: 50%; transform: translateX(-50%); width: 520px; } }

.story { position: fixed; inset: 0; z-index: 20; color: var(--white); display: flex; flex-direction: column; padding: 16px 20px calc(24px + var(--safe-b)); }
.story .bars { display: grid; grid-auto-flow: column; gap: 4px; }
.story .bars i { height: 4px; border-radius: var(--pill); background: rgba(255,255,255,.3); }
.story .bars i.on { background: var(--white); }
.story .pt { display: flex; gap: 14px; align-items: center; background: rgba(255,255,255,.14); border-radius: var(--r-lg); padding: 14px 16px; }
.story .pt b { font: 800 22px Raleway, sans-serif; min-width: 70px; }

.video-tile { width: 220px; }
.video-tile .v { height: 124px; border-radius: var(--r-lg); background: linear-gradient(160deg, var(--blue), var(--blue-press)); display: grid; place-items: center; position: relative; overflow: hidden; }
.video-tile video { width: 100%; height: 100%; object-fit: cover; }
.play { width: 46px; height: 46px; border-radius: var(--pill); background: rgba(255,255,255,.92); display: grid; place-items: center; }

.boot { flex: 1; display: grid; place-items: center; min-height: 100vh; }
.spinner { width: 34px; height: 34px; border-radius: 50%; border: 4px solid var(--tint); border-top-color: var(--blue); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
#toast { position: fixed; left: 50%; bottom: calc(100px + var(--safe-b)); transform: translateX(-50%) translateY(20px); background: var(--navy); color: var(--white); padding: 12px 18px; border-radius: var(--r); font-weight: 600; font-size: 14px; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 30; max-width: 90vw; }
#toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
#toast.err { background: var(--pink); }
.empty { text-align: center; padding: 40px 10px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
.sheet-bg { position: fixed; inset: 0; background: rgba(15,26,51,.45); z-index: 50; display: flex; align-items: flex-end; justify-content: center; }
.sheet { background: var(--white); width: 100%; max-width: 520px; border-radius: 24px 24px 0 0; padding: 18px 20px calc(24px + var(--safe-b)); display: flex; flex-direction: column; gap: 12px; max-height: 90vh; overflow-y: auto; }
.daytabs { display: flex; gap: 8px; overflow-x: auto; }
.slot-time { font: 800 15px Inter, sans-serif; color: var(--blue); min-width: 52px; }

/* HR home: let the document own scrolling inside Telegram's changing mobile viewport. */
html, body { min-height: 100%; }
#app { min-height: 100vh; min-height: 100dvh; }
.page.hr-home {
  flex: 0 0 auto;
  min-height: 0;
  height: auto;
  overflow: visible;
  padding-bottom: calc(112px + var(--safe-b));
}
@supports (-webkit-touch-callout: none) {
  .page.hr-home { -webkit-overflow-scrolling: touch; }
}

/* HR queue: keep every section at its natural height and let the page scroll. */
#app { min-height: 100vh; min-height: 100dvh; }
.page.hr-home {
  flex: 0 0 auto;
  min-height: 0;
  height: auto;
  overflow: visible;
  padding-bottom: calc(118px + var(--safe-b));
}
.page.hr-home > * { flex-shrink: 0; }
.page.apply-confirmation {
  flex: 0 0 auto;
  min-height: 0;
  padding-bottom: calc(28px + var(--safe-b));
}
.page.apply-confirmation .hero { gap: 12px; }
.page.apply-confirmation .card p { margin: 0; }
.page.apply-confirmation .card .row { align-items: flex-start; }
.page.apply-confirmation a { font-weight: 700; }

/* HR dashboard: action tiles intentionally inherit the same .grid3 and .stat styles as the summary tiles. */
.chips .chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  vertical-align: middle;
}
.leads-view-all {
  box-sizing: border-box;
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}


/* Center only the Add lead label within its existing tile. */
.hr-actions > .hr-add-lead {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}


/* Scores: center the Open label inside its existing pill. */
.scores-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  vertical-align: middle;
}

/* ==========================================================================
   Lifetime Health · Official Brand Layer v2.0 (UI only) — Hiring app
   Aligns the remaining values with the official LifetimeHealth Design System
   and the status colours of LTH Admin DS v1.0. No behaviour changes.
   ========================================================================== */
:root{
  --navy:#2B3F6C;--blue:#3E6BFE;--blue-hover:#274BBF;--blue-press:#2242AA;
  --tint:#ECF1FF;--surface:#F5F8FE;--line:#E2ECF9;--muted:#6A7698;
  --orange:#FF8A00;--orange-text:#A85B00;--orange-tint:#FFF3E6;
  --green:#197E57;--green-tint:#EAFBF4;--pink:#D50045;--pink-tint:#FFE9F0;
  --r-sm:6px;--r:12px;--r-lg:8px;--r-xl:20px;
}
html,body{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:#FFFFFF}
h1{font-family:"Raleway",-apple-system,sans-serif;font-weight:700;letter-spacing:-.01em}
h2,h3{font-family:"Raleway",-apple-system,sans-serif;font-weight:600}
/* Page header: the same official brand gradient header as the Stock and Attendance bots */
.hero,.lt-hero{background:linear-gradient(180deg,#4D7BFF 0%,#2F5FF6 100%);color:#FFFFFF;margin:-16px -20px 0;padding:calc(16px + env(safe-area-inset-top,0px)) 20px 24px;border-radius:0 0 24px 24px;box-shadow:0 8px 24px rgba(47,95,246,.18)}
.lt-hero{display:flex;flex-direction:column;gap:6px}
.lt-hero.lt-main{min-height:150px}
.hero h1,.lt-hero h1{font-family:"Raleway",-apple-system,sans-serif;font-weight:700;font-size:28px;line-height:1.15;color:#FFFFFF;margin:6px 0 0}
.hero p,.lt-hero p,.lt-hero .muted{color:rgba(255,255,255,.88)}
.lt-hero .top b,.lt-hero .top{color:#FFFFFF}
.lt-hero .back,.hero .back{color:#FFFFFF}
.lt-logo{display:block;height:24px;width:auto;max-width:180px;object-fit:contain;object-position:left center;flex:none}
.lt-hero .top .lt-logo+div{margin-left:auto;text-align:right}
.hero .pill{font-weight:600;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28)}
/* Cards and tiles: 8px radius, hairline, no heavy shadow */
.card,.stat,.check,.video-tile .v{border-radius:8px}
.stat b{font:700 26px/1.1 "Inter",-apple-system,sans-serif;font-variant-numeric:tabular-nums}
/* Buttons: official large size 52px, 12px radius, Inter 600 */
.btn{min-height:52px;font-weight:600;border-radius:12px;box-shadow:0 8px 24px rgba(62,107,254,.28)}
.btn:hover{background:var(--blue-hover)}
.btn.soft{background:var(--surface);color:var(--navy)}
.btn.big{min-height:52px;border-radius:12px}
.btn.success{background:var(--green);box-shadow:none}
/* Inputs: pale-blue fill */
input.f,textarea.f,select.f{background:var(--surface);font-weight:500}
/* Bottom navigation: active = navy label + blue icon, no pill */
.nav a{font-weight:500;color:var(--muted)}
.nav a.on{color:var(--navy);font-weight:600}
.nav a.on span{background:transparent;color:var(--blue)}
/* Toast and sheet */
#toast.err{background:var(--pink)}
.sheet{border-radius:20px 20px 0 0}

/* Home screens: one tile style, one main action, secondary actions side by side */
.lt-kpis .stat,.lt-kpis .stat.hot{background:#FFFFFF;color:var(--navy);border:1px solid var(--line);min-height:84px;display:flex;flex-direction:column;justify-content:flex-start;gap:4px;padding:12px;text-align:left}
.lt-kpis .stat b{font:700 24px/28px "Inter",-apple-system,sans-serif;color:var(--navy)}
.lt-kpis .stat .small{font:500 12px/16px "Inter",-apple-system,sans-serif;color:var(--muted)}
.lt-actions .btn{min-height:44px;font-size:14px;box-shadow:none}

/* 17. Standard KPI tiles (Stock board style) — same on every bot: icon chip, optional tag, label, number, note */
html body .lt-tiles{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin:0 0 12px!important}
html body .lt-tile,html body .lt-tile.lt-x{position:relative;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:2px!important;min-height:112px!important;padding:14px!important;background:#FFFFFF!important;border:1px solid #E2ECF9!important;border-radius:8px!important;box-shadow:none!important;text-align:left!important;color:#2B3F6C!important;text-decoration:none!important}
html body .lt-tile-ico{display:grid!important;place-items:center!important;width:32px!important;height:32px!important;border-radius:8px!important;background:#F5F8FE!important;color:#3E6BFE!important;margin-bottom:8px!important}
html body .lt-tile-ico svg{width:18px!important;height:18px!important}
html body .lt-tile-tag{position:absolute;top:14px;right:14px;font:500 11px/1 "Inter",sans-serif;padding:5px 8px;border-radius:4px;background:#ECF1FF;color:#3E6BFE}
html body .lt-tile-label{font:500 12px/16px "Inter",sans-serif!important;color:#6A7698!important}
html body .lt-tile-value{font:700 24px/28px "Inter",sans-serif!important;color:#2B3F6C!important;font-variant-numeric:tabular-nums}
html body .lt-tile-value.ok{color:#197E57!important}html body .lt-tile-value.warn{color:#A85B00!important}html body .lt-tile-value.bad{color:#D50045!important}
html body .lt-tile-note{font:400 12px/16px "Inter",sans-serif!important;color:#6A7698!important}
/* 16. Standard button sizes on every bot: 44px buttons, 36px chips and action-bar buttons */
html body .btn,html body button.primary,html body button.secondary,html body button.ghost,html body button.ok,html body button.bad,html body button.warn,html body .refresh,html body .hero-refresh,html body button.action,html body .row>button{min-height:44px!important;border-radius:12px!important;font:600 15px/1.2 "Inter",sans-serif!important;padding:0 16px!important}
html body .chip,html body .tabs button,html body .catalogue-tabs button,html body .lt-actionbar button,html body .lt-actionbar a{min-height:36px!important;font-size:13px!important}

html body .btn.big{min-height:44px!important}
html body .seg button{min-height:40px}

:root{--lt-grad:linear-gradient(180deg,#4D7BFF 0%,#2F5FF6 100%);--lt-ui:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--lt-display:"Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--lt-navy:#2B3F6C;--lt-blue:#3E6BFE;--lt-tint:#ECF1FF;--lt-surface:#F5F8FE;--lt-text2:#6A7698}
/* 3. STANDARD HEADER v3 — strict brand, one fixed size on every page of every bot
   Height 120px (+ phone safe area) · padding 12/16/12 · radius 0 0 20 20 · brand navy #2B3F6C → brand blue #3E6BFE (135deg), no decoration
   Row 1 (24px): [back] white horizontal logo 20px · · · one pill (role / status / timer)
   Row 2 (fixed slots): eyebrow Inter 500 11/14 · title Raleway 700 22/26 (one line) · subtitle Inter 400 12/16 (one line)
   Long titles: Raleway 18/22 on two lines, no subtitle. Extra controls sit in the action bar below. */
html body{--lt-h:120px}
html body .hero,html body header.lth-hero,html body>header,html body .lt-hero{background:linear-gradient(135deg,#2B3F6C 0%,#3E6BFE 100%)!important;color:#FFFFFF!important;border:0!important;border-radius:0 0 20px 20px!important;box-shadow:0 4px 16px rgba(43,63,108,.18)!important;box-sizing:border-box!important;height:calc(var(--lt-h) + env(safe-area-inset-top,0px))!important;min-height:0!important;max-height:none!important;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;overflow:hidden!important;position:relative!important;gap:8px!important}
html body .hero:after,html body .hero:before,html body header.lth-hero:after,html body>header:after,html body .lt-hero:after{display:none!important}
html body .lt-built{margin:-16px -14px 12px!important}
html body .lt-empty{display:none!important}
html body .lt-h-row{display:flex!important;align-items:center!important;gap:8px!important;height:24px!important;min-width:0!important;margin:0!important;padding:0!important}
html body .lt-h-row .lt-h-sp{flex:1 1 auto}
html body .lt-h-row img{display:block!important;height:20px!important;width:auto!important;max-width:150px!important;object-fit:contain!important;object-position:left center!important;flex:none!important;margin:0!important}
html body .lt-h-pill{display:inline-flex!important;align-items:center!important;gap:4px!important;flex:none;max-width:55%!important;height:24px!important;padding:0 10px!important;margin:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;background:rgba(255,255,255,.18)!important;border:1px solid rgba(255,255,255,.28)!important;border-radius:999px!important;color:#FFFFFF!important;font:600 11px/1 var(--lt-ui)!important;box-shadow:none!important;min-height:0!important}
html body .lt-h-pill *{color:#FFFFFF!important;font:600 11px/1 var(--lt-ui)!important;display:inline!important;margin:0!important;opacity:1!important}
html body .lt-h-back{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;height:24px!important;min-height:0!important;min-width:24px!important;padding:0 8px!important;margin:0 0 0 -4px!important;background:rgba(255,255,255,.18)!important;border:0!important;border-radius:999px!important;color:#FFFFFF!important;font:600 11px var(--lt-ui)!important;box-shadow:none!important;flex:none}
html body .lt-h-back svg,html body .lt-h-back .lth-icon{color:#FFFFFF!important;width:14px!important;height:14px!important}
html body .lt-h-body{display:flex!important;flex-direction:column!important;justify-content:center!important;flex:1 1 auto!important;grid-template-rows:14px 26px 16px!important;grid-template-columns:minmax(0,1fr)!important;row-gap:2px!important;gap:2px!important;min-width:0!important;margin:0!important;padding:0!important}
html body .lt-h-body>.lt-h-eyebrow{grid-row:1!important}html body .lt-h-body>.lt-h-title{grid-row:2!important}html body .lt-h-body>.lt-h-sub{grid-row:3!important;align-self:start!important}
html body .lt-h-eyebrow{display:block!important;font:500 11px/14px var(--lt-ui)!important;color:rgba(255,255,255,.8)!important;margin:0!important;padding:0!important;letter-spacing:0!important;opacity:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body .lt-h-title{display:block!important;font:700 22px/26px var(--lt-display)!important;color:#FFFFFF!important;margin:0!important;padding:0!important;letter-spacing:-.01em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body .lt-h-sub{display:block!important;white-space:nowrap!important;text-overflow:ellipsis!important;overflow:hidden!important;font:400 12px/16px var(--lt-ui)!important;color:rgba(255,255,255,.88)!important;margin:0!important;padding:0!important;opacity:1!important;max-height:16px!important}
html body .lt-h-rest{display:none!important}
html body .lt-h-body.lt-long{gap:2px!important}
html body .lt-h-body.lt-long>.lt-h-title{font-size:18px!important;line-height:22px!important;white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;text-overflow:clip!important}
html body .lt-h-body.lt-long>.lt-h-sub{display:none!important}
/* Action bar: the header's extra controls, directly below it, same on every bot */
html body .lt-actionbar{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important;margin:12px 16px 0!important;color:var(--lt-text2)}
html body .lt-actionbar .hero-actions,html body .lt-actionbar .hero-meta,html body .lt-actionbar .hero-line{display:contents!important}
html body .lt-actionbar button,html body .lt-actionbar a{display:inline-flex!important;align-items:center!important;gap:6px!important;width:auto!important;min-height:36px!important;padding:0 14px!important;margin:0!important;border-radius:12px!important;background:var(--lt-surface)!important;color:var(--lt-navy)!important;border:0!important;box-shadow:none!important;font:600 13px var(--lt-ui)!important;text-align:left!important}
html body .lt-actionbar button,html body .lt-actionbar a{white-space:nowrap!important}
html body .lt-actionbar .primary{background:var(--lt-blue)!important;color:#FFFFFF!important}
html body .lt-actionbar svg,html body .lt-actionbar [data-icon]{color:inherit!important}
html body .lt-actionbar .date,html body .lt-actionbar .hchip,html body .lt-actionbar .pill,html body .lt-actionbar .status-pill{display:inline-flex!important;align-items:center!important;height:28px!important;padding:0 10px!important;margin:0!important;background:var(--lt-tint)!important;color:var(--lt-blue)!important;border:0!important;border-radius:999px!important;font:600 12px var(--lt-ui)!important;box-shadow:none!important}
html body .lt-actionbar .hero-updated{font:400 12px var(--lt-ui)!important;color:var(--lt-text2)!important;margin:0!important}

/* 18 · Number boxes v3 (decision 04.11.2026): no icon on number boxes, compact Hiring-HR size everywhere.
   Icons stay only on boxes you tap to do something (quick actions, entries, list rows). */
html body .lt-tile-ico,html body .metric>.ico,html body .metric-top>.ico,html body .metric .metric-icon{display:none!important}
html body .lt-tile,html body .metric{min-height:0!important;height:auto!important;padding:12px 14px!important;display:flex!important;flex-direction:column!important;gap:2px!important}
html body .lt-tile .lt-tile-label,html body .metric .label{margin-top:0!important}
html body .metric>.metric-top{display:none!important}
html body .lt-tiles.lt-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
html body .metric .metric-label{padding-right:22px!important}
/* 19 · Bottom bar v3 (decision 04.11.2026): 4 tabs, floating glass bar like the Lifetime Health customer app.
   Bar: 12px from the sides, 10px above the safe area, 64px tall, fully rounded, white 72% + blur.
   Active tab = soft navy pill, blue icon. The cart floats just above it in the same glass. */
html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav,nav.nav[aria-label=Main]){position:fixed!important;left:12px!important;right:12px!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;top:auto!important;transform:none!important;width:auto!important;max-width:560px!important;margin:0 auto!important;height:64px!important;min-height:0!important;padding:6px!important;grid-auto-flow:column!important;grid-auto-columns:minmax(0,1fr)!important;grid-template-columns:none!important;gap:2px!important;align-items:stretch!important;background:rgba(255,255,255,.8)!important;-webkit-backdrop-filter:blur(20px) saturate(180%)!important;backdrop-filter:blur(20px) saturate(180%)!important;border:1px solid rgba(226,236,249,.95)!important;border-radius:32px!important;box-shadow:0 8px 28px rgba(43,63,108,.14)!important;z-index:60!important}
html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav,nav.nav[aria-label=Main])>:is(button,a){position:relative;min-height:0!important;height:auto!important;min-width:0!important;margin:0!important;padding:4px 2px!important;border-radius:26px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;background:transparent!important;border:0!important;box-shadow:none!important;color:#2B3F6C!important;font:500 11px/13px var(--lt-ui)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav,nav.nav[aria-label=Main])>:is(button,a) :is(svg,.nav-icon,.nav-ico,[data-icon],.lth-icon,.lthu-svg){color:#6A7698!important}
html body nav.nav[aria-label=Main] a span{width:auto!important;height:auto!important;background:transparent!important}
html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav)>button.active,html body nav.nav[aria-label=Main]>a.on{background:rgba(43,63,108,.08)!important;color:#2B3F6C!important;font-weight:600!important}
html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav)>button.active :is(svg,.nav-icon,.nav-ico,[data-icon],.lth-icon,.lthu-svg),html body nav.nav[aria-label=Main]>a.on :is(svg,span){color:#3E6BFE!important}
html body .cart-dock{position:fixed!important;left:12px!important;right:12px!important;width:auto!important;max-width:560px!important;margin:0 auto!important;transform:none!important;bottom:calc(84px + env(safe-area-inset-bottom,0px))!important;top:auto!important;z-index:59!important;gap:10px!important;padding:6px 6px 6px 18px!important;background:rgba(255,255,255,.8)!important;-webkit-backdrop-filter:blur(20px) saturate(180%)!important;backdrop-filter:blur(20px) saturate(180%)!important;border:1px solid rgba(226,236,249,.95)!important;border-radius:28px!important;box-shadow:0 8px 28px rgba(43,63,108,.14)!important;color:#2B3F6C!important}
html body .cart-dock>div,html body .cart-dock>div *{color:#2B3F6C!important}
html body .cart-dock>div :is(small,.meta){color:#6A7698!important}
html body .cart-dock button{min-height:44px!important;padding:0 18px!important;border-radius:22px!important;background:rgba(62,107,254,.88)!important;color:#FFFFFF!important;border:0!important;box-shadow:0 4px 14px rgba(62,107,254,.25)!important}
html body .cart-dock button *{color:#FFFFFF!important}

html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav)>button :is(.nav-icon,.nav-ico,[data-icon]){background:transparent!important;box-shadow:none!important}
html body :is(.admin-bottom-nav,.bottom-nav,nav.bottom,.bottomnav)>button.lt-nav-folded{display:none!important}
html body .bottom-nav:has(>[data-tab~=batch].active)>[data-tab~=production],html body .bottom-nav:has(>[data-branch-tab~=eod].active)>[data-branch-tab~=home],html body nav.bottom:has(>[data-page~=equipment].active)>[data-page~=stock]{background:rgba(43,63,108,.08)!important}
html body:has(.cart-dock) :is(main,.main,.app,.page,#app,.shell){padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))!important}
html body.lt-slide-on :is(main,.main,.app,.page,#app,.shell){padding-bottom:calc(236px + env(safe-area-inset-bottom,0px))!important}
/* 20 · Slide to place order (Stock staff + branch): blue glass bar above the tabs, white knob, cart summary floats above it */
html body .lt-slide{position:fixed;left:12px;right:12px;max-width:560px;margin:0 auto;bottom:calc(84px + env(safe-area-inset-bottom,0px));height:56px;border-radius:28px;background:rgba(62,107,254,.9);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:0 8px 24px rgba(62,107,254,.32);z-index:61;display:none;align-items:center;justify-content:center;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:pan-y}
html body.lt-slide-on .lt-slide{display:flex}
html body .lt-slide-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(43,63,108,.28);border-radius:28px}
html body .lt-slide-text{position:relative;padding-left:44px;color:#FFFFFF;font:600 15px/20px var(--lt-ui);letter-spacing:0;pointer-events:none;white-space:nowrap}
html body .lt-slide-knob{position:absolute!important;left:4px!important;top:4px!important;width:48px!important;height:48px!important;min-height:0!important;min-width:0!important;padding:0!important;margin:0!important;border:0!important;border-radius:24px!important;background:#FFFFFF!important;color:#3E6BFE!important;font:700 22px/48px var(--lt-ui)!important;box-shadow:0 2px 10px rgba(43,63,108,.25)!important;touch-action:none;cursor:grab;z-index:2}
html body .lt-slide:not(.dragging) .lt-slide-knob,html body .lt-slide:not(.dragging) .lt-slide-fill{transition:transform .25s ease,width .25s ease}
html body .lt-slide.done .lt-slide-text{padding-left:0;padding-right:44px}
html body.lt-slide-on .cart-dock{bottom:calc(148px + env(safe-area-inset-bottom,0px))!important;min-height:0!important;padding:4px 4px 4px 18px!important}
html body.lt-slide-on .cart-dock button{background:transparent!important;color:#3E6BFE!important;box-shadow:none!important;min-height:36px!important;padding:0 12px!important}
html body.lt-slide-on .cart-dock button *{color:#3E6BFE!important}
html body.lt-placing #sheet{visibility:hidden!important}
/* 21 · v3.1 shared helpers: inline branch dot, mini bars, week columns, action grid, view-as bar */
html body .lt-office-inline{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
html body .lt-mini-bar{height:6px;border-radius:3px;background:#ECF1FF;overflow:hidden}html body .lt-mini-bar i{display:block;height:100%;border-radius:3px}
html body .lt-weeks{display:grid;grid-template-columns:repeat(4,48px);gap:4px;text-align:right;font:500 12px/16px var(--lt-ui)}
html body .lt-weeks span.ok{color:#197E57}html body .lt-weeks span.warn{color:#A85B00}html body .lt-weeks span.bad{color:#D50045}
html body .lt-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
html body .lt-actions-grid button{min-height:44px!important;font:600 13px/16px var(--lt-ui)!important;justify-content:flex-start!important;text-align:left!important;padding:0 12px!important}
html body #lt-va-bar{position:sticky;top:0;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:#FFF3E6;color:#A85B00;font:600 13px/18px var(--lt-ui);border-bottom:1px solid #FFD9B0}
html body #lt-va-bar button{min-height:32px!important;padding:0 14px!important;border-radius:16px!important;background:#FFFFFF!important;color:#A85B00!important;font:600 13px var(--lt-ui)!important;border:1px solid #FFD9B0!important;width:auto!important}
html body.lt-owner .lt-dash-tabs,html body.lt-owner .lt-dash-back{display:none!important}
/* 22 · v3.1 stock: section headings SemiBold, two button sizes, request cards on phones, branch dots inline */
html body :is(main,.main,.page,section,.section) :is(h2,.section-title){font-family:var(--lt-display)!important;font-weight:600!important;letter-spacing:-.01em!important}
html body :is(.section-actions,.section-head,.panel-head,.filters,.table-wrap,.lt-compact) :is(button,a.btn,.secondary,.primary,.danger){min-height:36px!important;height:auto!important;padding:0 12px!important;font:600 13px/16px var(--lt-ui)!important;border-radius:10px!important;width:auto!important;white-space:nowrap!important}
html body .section-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
html body .lt-office{white-space:nowrap!important;display:inline-flex!important;align-items:center!important}
html body td.lt-office{display:table-cell!important}
@media (max-width:640px){
 html body #activeRequestsPanel .table-wrap,html body #archiveListPanel .table-wrap{overflow:visible!important}
 html body #activeRequestsPanel table,html body #archiveListPanel table{min-width:0!important;width:100%!important}
 html body #activeRequestsPanel thead,html body #archiveListPanel thead{display:none!important}
 html body #activeRequestsPanel tbody tr,html body #archiveListPanel tbody tr{display:grid!important;grid-template-columns:1fr auto;grid-template-areas:"id st" "br br" "by dt" "ac ac";gap:4px 12px;padding:12px 14px!important;border-bottom:1px solid var(--lt-line)!important}
 html body :is(#activeRequestsPanel,#archiveListPanel) tbody td{display:block!important;padding:0!important;border:0!important;font:400 13px/18px var(--lt-ui)!important;color:var(--lt-text2)!important;min-width:0}
 html body :is(#activeRequestsPanel,#archiveListPanel) tbody td:nth-child(1){grid-area:id;color:var(--lt-navy)!important;font-size:15px!important}
 html body #activeRequestsPanel tbody td:nth-child(2),html body #archiveListPanel tbody td:nth-child(2){grid-area:br;color:var(--lt-navy)!important}
 html body #activeRequestsPanel tbody td:nth-child(3),html body #archiveListPanel tbody td:nth-child(3){grid-area:by}
 html body #activeRequestsPanel tbody td:nth-child(4),html body #archiveListPanel tbody td:nth-child(4){grid-area:st;justify-self:end}
 html body #activeRequestsPanel tbody td:nth-child(5),html body #archiveListPanel tbody td:nth-child(5){grid-area:dt;justify-self:end}
 html body #activeRequestsPanel tbody td:nth-child(6){grid-area:ac;margin-top:6px!important}
 html body #archiveListPanel tbody td:nth-child(6){display:none!important}
 html body #archiveListPanel tbody td:nth-child(7){grid-area:ac;margin-top:6px!important}
 html body :is(#activeRequestsPanel,#archiveListPanel) tbody td[colspan]{grid-column:1/-1;grid-area:auto;text-align:center}
 html body :is(#activeRequestsPanel,#archiveListPanel) .actions{display:flex!important;gap:8px!important;flex-direction:row!important}
 html body :is(#activeRequestsPanel,#archiveListPanel) td button{flex:0 0 auto}
}
/* branch picker chips (replace a branch dropdown on phones) */
html body .lt-branch-chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
html body .lt-branch-chips button{min-height:36px!important;padding:0 12px!important;border-radius:18px!important;border:1px solid var(--lt-line)!important;background:#FFFFFF!important;color:var(--lt-navy)!important;font:500 13px/16px var(--lt-ui)!important;display:inline-flex!important;align-items:center!important;gap:6px!important;width:auto!important;box-shadow:none!important}
html body .lt-branch-chips button i{width:8px;height:8px;border-radius:50%;display:inline-block}
html body .lt-branch-chips button.on{background:#ECF1FF!important;border-color:#3E6BFE!important;color:#3E6BFE!important}
html body .lt-branch-chips button :is([data-icon],.lth-icon,svg){display:none!important}
/* 23 · v3.1 navigation: Telegram back arrow replaces the in-header back (logo stays put), no header flash, soft page entry */
html.lt-tg-back body .lt-h-back{display:none!important}
html body :is(.hero,header.lth-hero,.lt-hero):not(.lt-std){visibility:hidden;animation:lt-show 0s linear .4s forwards}
@keyframes lt-show{to{visibility:visible}}
@keyframes lt-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
html body .lt-enter{animation:lt-in .2s ease-out}
@media (prefers-reduced-motion:reduce){html body .lt-enter{animation:none}}

/* v3.1 hiring: one button look across all bots (no glow), positive actions in brand blue, headers never run off the screen */
html body .btn,html body .btn.big,html body .btn.success{box-shadow:none!important}
html body .btn.success{background:#3E6BFE!important;color:#FFFFFF!important}
html body .btn.danger{background:#FFE9F0!important;color:#D50045!important}
html body .lt-h-body{min-width:0!important;max-width:100%!important;overflow:hidden!important}
html body .lt-h-sub,html body .lt-h-title{max-width:100%!important;min-width:0!important;letter-spacing:0!important;font-stretch:normal!important}
html body .actions{bottom:var(--safe-b)!important;background:var(--surface)!important;padding-bottom:12px!important;z-index:5}
html body:has(nav.nav) .actions{bottom:calc(84px + var(--safe-b))!important}
html body .lt-tick .lt-tick-box{background:#FFFFFF!important;border:2px solid #E2ECF9!important;color:#FFFFFF!important;font-weight:700}
html body .lt-tick.on .lt-tick-box{background:#197E57!important;border-color:#197E57!important}
html body .lt-tick.on b{color:#6A7698}
/* ===== Hiring app v3.2 ===== */
/* rating and score sheets sit above the bottom bar (the bar hides while a sheet is open) */
html body .sheet-bg{z-index:200!important}
html body:has(.sheet-bg) nav.nav{display:none!important}
html body .sheet{max-height:88vh!important;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))!important}
html body .sheet .chip[data-x=close]{min-height:34px!important;padding:0 14px!important}
/* action buttons sit at the end of the page, never floating over content */
html body .actions{position:static!important;bottom:auto!important;background:none!important;padding:8px 0 0!important;margin-top:8px!important;z-index:auto!important}
html body .page{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))!important}
html body .page.bare{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))!important}
/* candidate record: role row under the header */
html body .lt-subrow{display:flex!important;align-items:center!important;gap:10px!important;padding:2px 2px 6px!important}
html body .lt-subrow .chip{min-height:32px!important;padding:0 12px!important;font:600 13px/16px var(--lt-ui)!important;background:#FFFFFF!important;color:#3E6BFE!important;border:1px solid #CFDCFF!important}
/* grouped rows (pending sheets, lesson trainees) */
html body .lt-trow{display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;min-height:0!important;padding:10px 12px!important;margin:0!important;text-align:left!important;background:#F5F8FE!important;border:0!important;border-radius:10px!important;color:var(--lt-navy)!important;font:500 14px/19px var(--lt-ui)!important;box-shadow:none!important;white-space:normal!important}
html body .lt-trow b{font-weight:600!important}
html body .lt-pend{gap:6px!important}
html body .lt-group{gap:8px!important}
/* scores */
html body .lt-num{display:flex!important;flex-direction:column!important;align-items:flex-end!important;min-width:56px;font-size:15px}
html body .lt-num small{font:400 11px/14px var(--lt-ui);color:#6A7698}
html body .lt-days{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important}
html body .lt-day{display:flex!important;flex-direction:column!important;gap:1px;background:#F5F8FE;border-radius:8px;padding:6px 8px;min-width:0}
html body .lt-day span{font:400 11px/14px var(--lt-ui);color:#6A7698}
html body .lt-day b{font:600 14px/18px var(--lt-ui);color:var(--lt-navy)}
html body .lt-day.empty b{font-weight:400;color:#929AB5;font-size:12px}
html body .lt-day small{font:400 11px/14px var(--lt-ui);color:#6A7698;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* chips and tabs: one line, swipe sideways */
html body :is(.chips,.daytabs){display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:8px!important;scrollbar-width:none;padding-bottom:2px}
html body :is(.chips,.daytabs)::-webkit-scrollbar{display:none}
html body :is(.chips,.daytabs)>.chip{flex:0 0 auto!important;white-space:nowrap!important;min-height:34px!important;padding:0 12px!important;font:500 13px/16px var(--lt-ui)!important;border-radius:17px!important}
html body .lt-filter>.chip{background:#FFFFFF!important;color:var(--lt-navy)!important;border:1px solid #E2ECF9!important;min-width:0!important;box-shadow:none!important}
html body .lt-filter>.chip.on{background:#ECF1FF!important;color:#3E6BFE!important;border-color:#3E6BFE!important}
/* compact buttons inside cards and rows */
html body .card :is(.chip,.btn.soft):not(.lt-trow){min-height:34px!important;padding:0 12px!important;font:600 13px/16px var(--lt-ui)!important;border-radius:10px!important;white-space:nowrap!important}
html body .card .chip.on{background:#3E6BFE!important;color:#FFFFFF!important;border-color:#3E6BFE!important}
html body .card.row>.chip,html body .card .row>.chip{flex:none!important}
/* long text boxes grow instead of cutting text */
html body textarea.lt-auto{resize:none!important;overflow:hidden!important;min-height:44px!important;line-height:20px!important;padding-top:11px!important;padding-bottom:11px!important}
/* show more */
html body .lt-hide{display:none!important}
html body button.lt-more{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:40px!important;min-height:40px!important;margin:8px 0!important;padding:0 14px!important;background:#ECF1FF!important;color:#3E6BFE!important;border:0!important;border-radius:12px!important;font:600 14px/16px var(--lt-ui)!important;box-shadow:none!important}