:root{
  /* Uppercase micro-labels. Two values, not fifteen: the old tracking bore no
     relation to font-size — every one of the fifteen values appeared on labels
     spanning the same .56-.85rem band — so it was noise, not an optical scale.
     .07em and .14em are the frequency-weighted means of the two clusters, which
     keeps total visual movement to a minimum. */
  --ls-caps:.07em;--ls-caps-wide:.14em;
  --lp:#2b3a67;--lp-d:#1e2a4d;--lp-m:#3b4f86;--lp-t:rgba(43,58,103,.07);
  --lo:#d65d86;--lo-h:#c04971;--lo-l:rgba(214,93,134,.13);--lo-p:rgba(214,93,134,.06);
  --bg:#f5f6fb;--wh:#fff;--g100:#eef0f7;--g200:#d8dcea;--g400:#8f96b0;--g600:#5c6485;
  --tx:#131726;--txs:#4f566e;--txm:#676e86;--bdr:#dfe2ee;/* --txm darkened from #8f96b0 to meet WCAG AA (~4.7:1) on --bg; dark mode overrides it below */
  --ok:#16a34a;--ok-l:#dcfce7;--er:#dc2626;--er-l:#fee2e2;
  --wa:#d97706;--wa-l:#fef3c7;--inf:#2563eb;--inf-l:#dbeafe;
  --fd:'Playfair Display',Georgia,serif;--fb:'Nunito',system-ui,sans-serif;--heading:var(--lp);
  --r:10px;--rs:6px;--rl:16px;
  --sh:0 2px 12px rgba(43,58,103,.09);--shm:0 4px 20px rgba(43,58,103,.13);--shl:0 8px 32px rgba(43,58,103,.17);
  /* Z-INDEX SCALE — single source of truth. Each layer leaves room above
     for related elements (e.g. a popover sitting on top of its modal).
     Use these custom properties for new components instead of raw numbers. */
  --z-base:1;
  --z-sticky:1040;       /* main nav, sticky tab bars */
  --z-dropdown:1100;     /* nav submenu */
  --z-fab:2000;          /* floating action elements */
  --z-mob-nav:9000;      /* bottom mobile nav */
  --z-a11y:9998;         /* a11y settings widget */
  --z-toast:9999;        /* toast notifications */
  --z-modal:10000;       /* modal overlays, level-up, search */
  --z-modal-popover:10001; /* popovers/menus inside a modal */
  --z-boot-error:99999;  /* last-resort boot failure dialog */
}
*,*::before,*::after{box-sizing:border-box}
/* color-scheme tells the browser what mode native UI (form controls, scrollbars,
   the open dropdown list of <select> elements) should match. Default to light;
   the body.liq-dark rule below remaps to dark when the in-app dark-mode toggle
   is on. Without this, native UI follows the OS preference, which can look
   inconsistent with the app's theme — and on Chrome with Auto Dark Mode for
   Web Contents enabled, the browser may aggressively re-process page colors
   on user interaction, producing the "theme flips on dropdown selection"
   perception. */
:root{color-scheme:light}
body{font-family:var(--fb);background:var(--bg);color:var(--tx);font-size:1rem;line-height:1.65}
h1,h2,h3,h4,h5{font-family:var(--fd);line-height:1.22}
a{color:var(--lo);text-decoration:none}a:hover{color:var(--lo-h)}
.liq-page{display:none}.liq-page.active{display:block}

/* NAV */
.lnav{background:var(--lp);border-bottom:3px solid var(--lo);position:sticky;top:0;z-index:var(--z-sticky)}
.lnav .navbar-brand{font-family:var(--fd);font-size:1.2rem;color:#fff!important;gap:.6rem;display:flex;align-items:center}
.lbmark{background:var(--lo);color:#fff;border-radius:var(--rs);width:2.1rem;height:2.1rem;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;font-family:var(--fd);flex-shrink:0}
.lnav .nav-link{color:rgba(255,255,255,.70)!important;font-weight:700;font-size:.88rem;padding:.5rem .9rem!important;border-radius:var(--rs);transition:all .2s}
.lnav .nav-link:hover,.lnav .nav-link.active{color:#fff!important;background:rgba(214,93,134,.18)}
.lnav .dropdown-menu{background:var(--lp-m);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);box-shadow:var(--shl);padding:.4rem}.dd-tier-item{position:relative}.dd-tier-item>.dropdown-item{display:flex;align-items:center;justify-content:space-between}.dd-tier-item>.dropdown-item .dd-tier-arrow{font-size:.65rem;opacity:.55;margin-left:.4rem;transition:transform .15s}.dd-submenu{display:none;position:absolute;left:100%;top:-4px;min-width:260px;background:var(--lp-m);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);box-shadow:var(--shl);padding:.4rem;z-index:var(--z-dropdown)}.dd-tier-item:hover>.dd-submenu{display:block}.dd-tier-item:hover>.dropdown-item{background:rgba(255,255,255,.1);color:#fff}.dd-tier-item:hover>.dropdown-item .dd-tier-arrow{transform:rotate(0deg)}.dd-submenu-header{font-size:.6rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;color:rgba(255,255,255,.4);padding:.4rem .9rem .25rem}.dd-submenu .dropdown-item{font-size:.82rem}.dd-pillar-header{font-size:.62rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:rgba(255,255,255,.55);padding:.45rem .9rem .35rem;display:flex;align-items:center;list-style:none}
.lnav .dropdown-item{color:rgba(255,255,255,.75);font-size:.85rem;font-weight:600;border-radius:var(--rs);padding:.55rem .9rem;display:flex;align-items:center;gap:.6rem;transition:all .2s}
.lnav .dropdown-item:hover{background:rgba(214,93,134,.2);color:#fff}
.lnav .dropdown-item .di{color:var(--lo);width:1.2rem;text-align:center;flex-shrink:0}
.navbar-toggler{border-color:rgba(255,255,255,.3)}.navbar-toggler-icon{filter:invert(1)}
.nav-xp{display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.08);border-radius:2rem;padding:.3rem .7rem;cursor:pointer}
.nav-xp:hover{background:rgba(255,255,255,.14)}
.nav-xp-bar{width:60px;height:5px;background:rgba(255,255,255,.15);border-radius:99px;overflow:hidden}
.nav-xp-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .6s ease}
.nav-xp-lbl{font-size:.78rem;font-weight:700;color:rgba(255,255,255,.85);white-space:nowrap}

/* HERO */
.hero-main{background:var(--lp-d);color:#fff;padding:5rem 0 4.5rem;position:relative;overflow:hidden}
.hero-main::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 65% 90% at 95% 50%,rgba(214,93,134,.10) 0%,transparent 65%),radial-gradient(ellipse 40% 60% at 5% 80%,rgba(74,34,85,.6) 0%,transparent 60%);pointer-events:none}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:var(--lo-l);border:1px solid rgba(214,93,134,.35);color:var(--lo);font-size:.75rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;padding:.3rem .9rem;border-radius:2rem;margin-bottom:1.5rem}
.hero-main h1{font-size:clamp(2.1rem,5.5vw,3.7rem);font-weight:700;color:#fff}
.hero-main h1 em{color:var(--lo);font-style:italic}
.hero-main p.lead{color:rgba(255,255,255,.65);font-size:1.1rem;max-width:560px}
.section-hero{background:var(--lp);color:#fff;padding:2.5rem 0 2rem}
.section-hero h1,.daily-hero h1{font-family:var(--fd);font-size:clamp(1.6rem,4vw,2.4rem);color:#fff;margin-bottom:.4rem}
.section-hero p,.daily-hero p{color:rgba(255,255,255,.65);max-width:620px;margin:0;font-size:.95rem}
.back-btn{display:inline-flex;align-items:center;gap:.35rem;color:var(--lo);font-size:.83rem;font-weight:700;cursor:pointer;border:none;background:none;padding:0;margin-bottom:1rem}
.back-btn:hover{color:var(--lo-h)}
.stats-bar{background:var(--lp);padding:1.4rem 0}
.stat-num{font-family:var(--fd);font-size:2rem;font-weight:700;color:var(--lo);display:block}
.stat-lbl{font-size:.8rem;font-weight:700;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:var(--ls-caps)}

/* BUTTONS */
.btn-liq{font-family:var(--fb);font-weight:700;font-size:.92rem;border-radius:var(--rs);padding:.65rem 1.5rem;display:inline-flex;align-items:center;gap:.45rem;cursor:pointer;border:2px solid transparent;transition:all .2s;text-decoration:none;white-space:nowrap}
.btn-or{background:var(--lo);color:#fff;border-color:var(--lo)}.btn-or:hover{background:var(--lo-h);border-color:var(--lo-h);color:#fff}
.btn-pu{background:var(--lp);color:#fff;border-color:var(--lp)}.btn-pu:hover{background:var(--lp-m);color:#fff}
.btn-se{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.2)}.btn-se:hover{background:rgba(255,255,255,.22);color:#fff}
.btn-sm{font-size:.82rem;padding:.4rem 1rem}
.btn-ok{background:var(--ok);color:#fff;border-color:var(--ok)}.btn-ok:hover{background:#15803d;color:#fff}
.btn-out{background:transparent;color:var(--txs);border-color:var(--bdr)}.btn-out:hover{border-color:var(--g400);color:var(--tx)}

/* CARDS */
.liq-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);box-shadow:var(--sh)}
.liq-card-body{padding:1.75rem}
.feat-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.75rem;height:100%;display:flex;flex-direction:column;cursor:pointer;transition:all .2s}
.feat-card:hover{box-shadow:var(--shl);transform:translateY(-3px);border-color:var(--lo)}
.feat-icon{width:3rem;height:3rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1.1rem;flex-shrink:0}
.fi-pu{background:var(--lp-t);color:var(--lp-m)}.fi-or{background:var(--lo-l);color:var(--lo-h)}.fi-gn{background:rgba(22,163,74,.1);color:#16a34a}.fi-bl{background:rgba(37,99,235,.1);color:#2563eb}
.feat-card h3{font-size:1.15rem;margin-bottom:.4rem}
.feat-card p{color:var(--txs);font-size:.93rem;flex:1;margin-bottom:1rem}
.feat-cta{display:inline-flex;align-items:center;gap:.3rem;font-size:.88rem;font-weight:700;color:var(--lo);margin-top:auto}
.why-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:2rem 1.75rem;height:100%;border-top:4px solid var(--lo)}
.progress-snap{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.5rem;border-left:5px solid var(--lo)}

/* ACADEMY — one pillar at a time, tiers as shelves, track as the card.
   Replaces the pillar/tier/track/module accordion stack. Four structural
   levels now differ by SIZE, WEIGHT, COLOUR and POSITION rather than by
   font-weight alone. The tier is still the smallest by size — that is
   deliberate. It is now read as structural through uppercase, the --tx colour
   and the accent rule rather than by out-sizing the levels it contains:

     pillar   26px serif, in the pillar accent          (the place you are in)
     shelf    12px 800 uppercase, +2px accent rule      (the tier)
     track    17px serif on a bordered card             (the container)
     module   15px in a side panel                      (the contents)

   The old page inverted this. Measured here with everything expanded at
   1440x900: 17,313px of scroll (19.2 screens), 2,090 elements, 371 icons and
   424 metadata pips, with type at 27.2 / 10.4 / 15.2 / 15.2px — the tier was
   10.4px with nothing else marking it, so it read as incidental rather than
   as structural level two; track and module
   were identical but for font weight; left edges ran 168 / 116 / 140 / 163px
   so depth was not readable from position either; and the tier was the only
   level with no card treatment at all. */

/* -- level 1: the pillar bar ------------------------------------------- */
.acx-pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));
  gap:.35rem;padding:.5rem;background:var(--g100);border:1px solid var(--bdr);
  border-radius:var(--rl);margin-bottom:1.5rem}
.acx-pbtn{display:flex;flex-direction:column;gap:.2rem;min-width:0;padding:.7rem .9rem;
  border:1px solid transparent;border-radius:var(--r);background:transparent;cursor:pointer;
  font-family:inherit;text-align:left;color:var(--txs);transition:background .16s,border-color .16s}
.acx-pbtn:hover{background:var(--wh);border-color:var(--bdr)}
.acx-pb-top{display:flex;align-items:center;gap:.5rem;min-width:0}
.acx-pb-top i{color:var(--pa-text,var(--pa));font-size:1rem;flex:none}
.acx-pb-name{font-family:var(--fd);font-size:1.02rem;line-height:1.2;color:var(--tx);
  overflow-wrap:break-word;min-width:0}
.acx-pb-meta{font-size:.75rem;font-weight:600;color:var(--txm);font-variant-numeric:tabular-nums}
.acx-pbtn[aria-selected="true"]{background:var(--wh);border-color:var(--bdr);
  box-shadow:inset 0 2px 0 0 var(--pa),var(--sh)}
.acx-pbtn[aria-selected="true"] .acx-pb-name{color:var(--pa-text,var(--pa))}
@media (max-width:620px){
  .acx-pillars{grid-template-columns:1fr}
  .acx-pbtn{flex-direction:row;align-items:center;justify-content:space-between;gap:.75rem;min-height:46px}
  .acx-pb-meta{flex:none;white-space:nowrap}
}

/* -- the pillar accent AS TEXT ----------------------------------------- */
/* --pa is the pillar's identity colour and drives the objects: the shelf rule,
   the card edge, the open-card border, the progress ring and the pillar-bar
   indicator. Those are non-text uses where WCAG asks 3:1, and where changing
   the colour would restyle the Academy. --pa is left exactly as it was.

   SIX places turn the same accent into TEXT — the context heading, the
   pillar-bar glyph, the selected pillar's label, the panel eyebrow, a card's
   pillar label and its path step — and five of those are 11-16px, so their
   threshold is 4.5:1, not 3:1. On the dark card (#1e1530) the raw accents
   measured 2.11-3.54:1, the worst readings in the Academy on the smallest type
   in it. All six read --pa-text.

   In light mode these ARE the accents, so nothing moves. In dark they are
   hue- and saturation-preserved lifts, each cleared to ~4.7:1 on the card so a
   rounding difference between engines cannot drop one under. The fallback means
   a pillar without a token still renders in the accent rather than in nothing.

   The search strip is deliberately absent: it sets --pa:var(--lo) and its only
   consumer is the 26px heading, whose threshold is 3:1. */
:root{--pt-regulations:#7b358f;--pt-care:#0e7490;--pt-leadership:#a16207}
body.liq-dark{--pt-regulations:#b269c7;--pt-care:#1190b3;--pt-leadership:#be7408}

/* -- the context strip: always says where you are ---------------------- */
.acx-context{display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap;margin-bottom:.5rem}
.acx-context h2{font-family:var(--fd);font-size:clamp(1.4rem,3vw,1.65rem);margin:0;
  color:var(--pa-text,var(--pa));line-height:1.2}
.acx-cprog{font-size:.8rem;font-weight:700;color:var(--txm);font-variant-numeric:tabular-nums}
.acx-csub{flex-basis:100%;font-size:.87rem;color:var(--txs);margin:.1rem 0 0;max-width:66ch;line-height:1.55}

/* -- level 2: the tier shelf ------------------------------------------- */
/* Shelf spacing is doing real work in this app: Leadership & Administration
   carries FIVE shelves, three of which hold a single track (lt2, lt3, lt5).
   The 1.6rem lead-in plus the accent rule is what makes a one-card shelf read
   as a deliberate section rather than a list that ran out. */
.acx-body{margin-top:.5rem}
.acx-shelf{padding-top:1.6rem;scroll-margin-top:90px;border-radius:var(--rl)}
.acx-shelf-hd{display:flex;align-items:center;gap:.7rem;margin-bottom:.9rem}
.acx-rule{width:22px;height:2px;background:var(--pa);border-radius:2px;flex:none}
.acx-sh-lbl{font-size:.75rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;
  color:var(--tx);min-width:0;overflow-wrap:break-word}
.acx-sh-count{margin-left:auto;flex:none;white-space:nowrap;font-size:.75rem;color:var(--txm);
  font-variant-numeric:tabular-nums}

/* -- level 3: the track card ------------------------------------------- */
/* 240px, not 258. Bootstrap's .container gets NARROWER crossing its 576px
   breakpoint (100% wide below it, then capped at 540px), so a 258px minimum
   gave two columns at 560px and one at 640px — the grid appeared to lose a
   column as the window got wider. min() keeps it from demanding more width
   than the column has on very narrow phones. */
/* The rack is capped to the number of cards the shelf actually holds. Measured
   on the real page: no tier in this curriculum has more than THREE tracks
   (12 shelves: four hold 1, six hold 2, two hold 3), but an uncapped auto-fill
   grid offers five 240px columns at 1440px. Every shelf therefore ended
   left-aligned in a rack two-to-four slots too wide, and the four single-track
   tiers read as a card that had failed to load rather than a tier with one
   track in it. Capping to --n makes the row end where the content ends: the
   card width stays a consistent ~300px, and a lone card reads as deliberate.
   The cap never binds below ~640px, so the responsive column counts are
   unchanged. --n defaults to 4 so a shelf rendered without it degrades to the
   old behaviour rather than collapsing to one column. */
.acx-grid{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));max-width:calc(var(--n,4) * 300px + (var(--n,4) - 1) * .85rem)}
.acx-card{position:relative;display:flex;flex-direction:column;gap:.5rem;text-align:left;
  padding:1rem 1.05rem 1.05rem;background:var(--wh);border:1px solid var(--bdr);
  border-radius:var(--r);cursor:pointer;font-family:inherit;color:inherit;width:100%;
  transition:border-color .16s,transform .16s,box-shadow .16s}
.acx-card::before{content:'';position:absolute;left:0;top:14px;bottom:14px;width:2px;
  background:var(--pa);border-radius:2px;opacity:.5;transition:opacity .16s,top .16s,bottom .16s}
.acx-card:hover{border-color:var(--g200);transform:translateY(-1px);box-shadow:var(--shm)}
.acx-card:hover::before{opacity:1;top:8px;bottom:8px}
.acx-card[aria-expanded="true"]{border-color:var(--pa)}
.acx-card[aria-expanded="true"]::before{opacity:1;top:8px;bottom:8px}
.acx-card.locked{cursor:default;opacity:.72}
.acx-card-top{display:flex;align-items:flex-start;gap:.75rem}
.acx-card-name{font-family:var(--fd);font-size:1.06rem;line-height:1.25;margin:0;color:var(--tx);
  font-weight:700;flex:1;text-wrap:balance}
.acx-card-sub{margin:0;font-size:.8rem;line-height:1.5;color:var(--txs);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.acx-card-foot{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:auto;
  padding-top:.35rem;font-size:.74rem;color:var(--txm);font-variant-numeric:tabular-nums}
.acx-dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.5;flex:none}
.acx-done{color:var(--ok);font-weight:700}
.acx-inprog{color:var(--lo);font-weight:700}
.acx-step{color:var(--pa-text,var(--pa));font-weight:700}
.acx-card-pillar{font-weight:700;color:var(--pa-text,var(--pa))}
.acx-lock{color:var(--txm);font-size:.9rem;flex:none}
.acx-card-lockmsg{font-size:.76rem;color:var(--txs);background:var(--g100);border-radius:var(--rs);
  padding:.45rem .6rem;line-height:1.45}
/* Compact — drop the description so more tracks fit. */
#academy-content.acx-compact .acx-card-sub{display:none}

/* progress ring — ONE object per track, replacing the old per-module pip rows */
.acx-ring{position:relative;flex:none;width:34px;height:34px}
.acx-ring svg{width:34px;height:34px;transform:rotate(-90deg)}
.acx-ring circle{fill:none;stroke-width:3.5}
.acx-ring .bg{stroke:var(--g200)}
.acx-ring .fg{stroke:var(--pa);stroke-linecap:round;transition:stroke-dasharray .5s ease}
.acx-ring>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:.62rem;font-weight:800;color:var(--txs);font-variant-numeric:tabular-nums}
.acx-ring>span .bi{color:var(--ok);font-size:.85rem}

/* -- level 4: the detail panel ----------------------------------------- */
.acx-scrim{position:fixed;inset:0;background:rgba(13,8,18,.5);opacity:0;pointer-events:none;
  transition:opacity .22s;z-index:calc(var(--z-modal) - 1)}
.acx-scrim.on{opacity:1;pointer-events:auto}
.acx-panel{position:fixed;top:0;right:0;height:100dvh;width:min(560px,92vw);background:var(--wh);
  border-left:1px solid var(--bdr);box-shadow:var(--shl);z-index:var(--z-modal);
  transform:translateX(101%);transition:transform .28s cubic-bezier(.32,.72,0,1);
  display:flex;flex-direction:column}
.acx-panel.on{transform:translateX(0)}
body.acx-panel-open{overflow:hidden}
.acx-pn-hd{padding:1.4rem 1.5rem 1.1rem;border-bottom:1px solid var(--bdr);position:relative}
.acx-pn-eyebrow{display:flex;align-items:center;gap:.5rem;font-size:.7rem;font-weight:800;
  letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--pa-text,var(--pa));margin-bottom:.5rem}
.acx-pn-hd h3{font-family:var(--fd);font-size:1.5rem;margin:0 0 .4rem;color:var(--heading);
  line-height:1.2;padding-right:2.5rem;text-wrap:balance}
.acx-pn-hd p{margin:0;font-size:.86rem;color:var(--txs);line-height:1.55}
.acx-pn-stats{display:flex;gap:1.25rem;flex-wrap:wrap;row-gap:.6rem;align-items:flex-end;
  margin-top:.9rem;font-size:.74rem;color:var(--txm);font-variant-numeric:tabular-nums}
.acx-pn-stats b{display:block;font-size:1.05rem;color:var(--tx);font-weight:800;line-height:1.2}
.acx-pn-cheat{margin-left:auto;border:1px solid var(--bdr);background:var(--wh);color:var(--lp);
  font-size:.74rem;font-weight:700;border-radius:2rem;padding:.35rem .8rem;cursor:pointer;
  font-family:inherit;white-space:nowrap}
.acx-pn-cheat:hover{background:var(--g100);border-color:var(--lp)}
.acx-pn-close{position:absolute;top:1.2rem;right:1.2rem;width:30px;height:30px;border-radius:var(--rs);
  border:1px solid var(--bdr);background:var(--wh);color:var(--txs);cursor:pointer;font-size:.85rem;
  display:flex;align-items:center;justify-content:center;line-height:1}
.acx-pn-close:hover{background:var(--g100);color:var(--tx)}
.acx-pn-body{overflow-y:auto;flex:1;padding:.35rem 0 2rem}

/* a module is a LINE, with two pieces of metadata */
.acx-mrow{display:flex;align-items:center;gap:.85rem;width:100%;text-align:left;
  padding:.8rem 1.5rem;background:transparent;border:0;border-bottom:1px solid var(--bdr);
  cursor:pointer;font-family:inherit;color:inherit;transition:background .14s}
.acx-mrow:hover:not(:disabled){background:var(--g100)}
.acx-mrow:disabled{cursor:default;opacity:.55}
.acx-mnum{flex:none;width:24px;font-size:.78rem;font-weight:800;color:var(--txm);
  font-variant-numeric:tabular-nums}
.acx-mrow.done .acx-mnum{color:var(--ok)}
.acx-mrow.inprog .acx-mnum{color:var(--lo)}
.acx-mbody{flex:1;min-width:0}
.acx-mt{display:block;font-size:.93rem;color:var(--tx);line-height:1.35}
.acx-mm{display:block;font-size:.74rem;color:var(--txm);margin-top:.12rem;font-variant-numeric:tabular-nums}
.acx-mnote{color:var(--lo);margin-left:.15rem}
.acx-mprog{flex:none;width:34px;height:3px;border-radius:2px;background:var(--g200);overflow:hidden}
.acx-mprog>span{display:block;height:100%;background:var(--lo)}

/* connected landmark cases, relocated into the panel */
.acx-cases{padding:1.1rem 1.5rem 0}
.acx-cases-hd{display:flex;align-items:center;gap:.45rem;font-size:.72rem;font-weight:800;
  text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.6rem}
.acx-cases-hd i{color:var(--lo)}
.acx-cases-list{display:flex;flex-wrap:wrap;gap:.4rem}
.acx-case{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .7rem;border-radius:2rem;
  background:var(--g100);border:1px solid var(--bdr);font-size:.78rem;font-weight:600;color:var(--tx);
  cursor:pointer;font-family:inherit;line-height:1.3;text-align:left}
.acx-case:hover{background:var(--wh);border-color:var(--lp)}
.acx-case-yr{font-size:.68rem;font-weight:800;color:var(--cat);font-variant-numeric:tabular-nums}

@media (max-width:620px){
  .acx-panel{width:100vw;top:auto;bottom:0;height:88dvh;border-left:0;border-top:1px solid var(--bdr);
    border-radius:var(--rl) var(--rl) 0 0;transform:translateY(101%)}
  .acx-panel.on{transform:translateY(0)}
  .acx-pn-hd{padding:1.15rem 1.15rem .95rem}
  .acx-pn-hd h3{font-size:1.3rem}
  .acx-mrow,.acx-cases{padding-left:1.15rem;padding-right:1.15rem}
}

/* -- list view: the deliberate "show me everything" mode --------------- */
/* List view is full-width rows, so the card-count cap must not apply. */
.acx-body.acx-list .acx-grid{grid-template-columns:1fr;gap:1rem;max-width:none}
.acx-row{border:1px solid var(--bdr);border-radius:var(--r);background:var(--wh);overflow:hidden}
.acx-row.locked{opacity:.72}
.acx-row-hd{display:flex;align-items:baseline;gap:.75rem;padding:.8rem 1.1rem;
  border-bottom:1px solid var(--bdr);background:var(--g100)}
.acx-row-name{font-family:var(--fd);font-size:1.02rem;font-weight:700;color:var(--tx);flex:1;min-width:0}
.acx-row-meta{font-size:.76rem;color:var(--txm);font-variant-numeric:tabular-nums;white-space:nowrap}
.acx-row-mods .acx-mrow{padding-left:1.1rem;padding-right:1.1rem}
.acx-row-mods .acx-mrow:last-child{border-bottom:0}

/* -- empty state ------------------------------------------------------- */
.acx-empty{text-align:center;padding:2.5rem 1.5rem;color:var(--txm);font-style:italic;
  background:var(--wh);border:1px dashed var(--bdr);border-radius:var(--rl);margin-top:1.5rem}
.acx-empty i{display:block;font-size:1.4rem;margin-bottom:.5rem;opacity:.6;font-style:normal}
/* A real <button> that reads as a link — used where a sentence has to offer the
   control that will actually help (e.g. "the filter is hiding 4 — show all"). */
.acx-inline-link{background:none;border:0;padding:0;font:inherit;font-style:normal;
  color:var(--lo);font-weight:700;text-decoration:underline;cursor:pointer}
.acx-inline-link:hover{color:var(--lo-h)}
.acx-inline-link:focus-visible{outline:2px solid var(--lo);outline-offset:2px;border-radius:2px}

/* -- limited-preview sample list --------------------------------------- */
.acx-preview-list{border:1px solid var(--bdr);border-radius:var(--r);background:var(--wh);overflow:hidden}
.acx-preview-list .acx-mrow:last-child{border-bottom:0}
.acx-preview-list .acx-mrow{padding-left:1.1rem;padding-right:1.1rem}

/* -- flash target for the nav's goToTier / goToTrack ------------------- */
.tier-section-flash{background:rgba(214,93,134,.08);box-shadow:0 0 0 3px rgba(214,93,134,.25);
  animation:tier-section-flash-anim 1.6s ease-out}
@keyframes tier-section-flash-anim{
  0%{background:rgba(214,93,134,.16);box-shadow:0 0 0 6px rgba(214,93,134,.35)}
  100%{background:rgba(214,93,134,0);box-shadow:0 0 0 0 rgba(214,93,134,0)}
}

/* -- dark mode --------------------------------------------------------- */
body.liq-dark .acx-pillars{background:var(--g100);border-color:var(--bdr)}
body.liq-dark .acx-pbtn:hover,
body.liq-dark .acx-pbtn[aria-selected="true"]{background:var(--wh)}
body.liq-dark .acx-scrim{background:rgba(0,0,0,.6)}
/* Top row — wraps the Continue Learning + Spaced Review cards so they sit
   side-by-side on wider screens. Stacks below 900px. The row’s margin-
   bottom replaces the cards’ individual margins (overridden to 0 inside
   the row). When only one card is present, it takes full width naturally
   via flex:1 1 0 on the single child. */
.acad-top-row{display:flex;gap:1.4rem;margin-bottom:1.4rem;align-items:stretch;flex-wrap:wrap}
.acad-top-row > .cl-card,
.acad-top-row > .rev-card{flex:1 1 0;margin-bottom:0;min-width:0}
@media (max-width:900px){
  .acad-top-row{flex-direction:column;gap:1rem;margin-bottom:1.2rem}
  .acad-top-row > .cl-card,
  .acad-top-row > .rev-card{flex:1 1 auto}
}
/* Continue Learning card — sits above the search/filter bar (after the
   path banner and review card if those are present). Shows up to 3
   in-progress modules with a Resume button, OR up to 2 recommended
   starting modules for brand-new users. Hidden when the user has
   completed everything. */
.cl-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);margin-bottom:1.4rem;box-shadow:var(--sh);overflow:hidden}
.cl-card-header{display:flex;align-items:center;gap:.5rem;padding:.85rem 1.2rem;border-bottom:1px solid var(--bdr);font-weight:700;font-size:.85rem;color:var(--tx);background:linear-gradient(135deg,color-mix(in srgb,var(--lo) 10%,transparent),transparent);letter-spacing:-.005em}
.cl-card-header i{color:var(--lo);font-size:1rem}
.cl-card-body{padding:.2rem 0}
.cl-item{display:flex;align-items:center;gap:1rem;padding:.85rem 1.2rem;cursor:pointer;transition:background .15s}
.cl-item:hover{background:var(--g100)}
.cl-item:not(:last-child){border-bottom:1px solid var(--bdr)}
.cl-item-num{width:2.4rem;height:2.4rem;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.95rem;flex-shrink:0}
.cl-item-info{flex:1;min-width:0}
.cl-item-title{font-weight:700;font-size:.95rem;color:var(--tx);line-height:1.3;margin-bottom:.15rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-item-meta{display:flex;align-items:center;gap:.6rem;font-size:.75rem;color:var(--txm);flex-wrap:wrap}
.cl-item-meta-track{font-weight:600;color:var(--tx)}
.cl-item-meta i{color:var(--lo);font-size:.7rem;margin-right:.15rem}
.cl-item-progress{height:4px;background:var(--g100);border-radius:2px;margin-top:.45rem;overflow:hidden;max-width:280px}
.cl-item-progress-fill{height:100%;border-radius:2px;transition:width .25s}
.cl-item-btn{flex-shrink:0;padding:.5rem .95rem;background:var(--lp);color:#fff;border:none;border-radius:2rem;font-size:.8rem;font-weight:700;cursor:pointer;transition:background .15s,transform .15s;display:flex;align-items:center;gap:.3rem;white-space:nowrap}
.cl-item-btn:hover{background:var(--lp-m);transform:translateX(2px)}
@media (max-width:600px){
  .cl-item{padding:.7rem .9rem;gap:.7rem}
  .cl-item-num{width:2rem;height:2rem;font-size:.85rem}
  .cl-item-btn{padding:.4rem .7rem;font-size:.75rem}
  .cl-item-meta{gap:.4rem}
  .cl-item-title{font-size:.88rem}
}
/* 320px. A flex item's default min-width is `auto`, i.e. its content — so on
   the narrowest phone the number chip + title + a no-wrap "Resume ->" button
   added up to more than the row could give, and because .cl-item-btn is
   flex-shrink:0 the surplus became page-wide horizontal scroll rather than a
   squeezed button. Below 430px the row wraps and the button takes its own
   full-width line, which also makes it a comfortable tap target. min-width:0
   on the card and body stops the same overflow propagating upward. */
.cl-card,.cl-card-body{min-width:0}
@media (max-width:430px){
  .cl-item{flex-wrap:wrap;row-gap:.55rem}
  .cl-item-info{flex:1 1 60%;min-width:0}
  .cl-item-btn{flex:1 1 100%;justify-content:center;padding:.55rem .7rem;min-width:0}
  .cl-item-title{white-space:normal;overflow:visible}
}
body.liq-dark .cl-item:hover{background:rgba(255,255,255,.04)}
/* Compact view — tightens module-card density inside expanded tracks.
   Hides module subtitles, reduces padding, and shrinks the tag pips so
   the visible information is module number + title + status icons +
   duration/XP. Toggled via the .acad-compact class on .acad-content,
   persisted in localStorage as liq_acad_compact. */
/* Search box — sits above the filter bar. Filters tracks/modules by name,
   sub, and tags. Auto-expands tiers and tracks containing matches. */
.acad-search-wrap{position:relative;margin-bottom:.85rem;max-width:560px}
.acad-search-input{width:100%;padding:.65rem 2.6rem .65rem 2.6rem;border:1.5px solid var(--bdr);border-radius:2rem;background:var(--wh);font-size:.92rem;color:var(--tx);transition:border-color .15s,box-shadow .15s;font-family:inherit}
.acad-search-input:focus{outline:none;border-color:var(--lp);box-shadow:0 0 0 3px color-mix(in srgb,var(--lp) 20%,transparent)}
.acad-search-input::placeholder{color:var(--txm);opacity:.75}
.acad-search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--txm);font-size:1rem;pointer-events:none}
.acad-search-clear{position:absolute;right:.55rem;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--txm);font-size:1.05rem;cursor:pointer;padding:.3rem .45rem;border-radius:50%;display:none;line-height:1;transition:background .15s,color .15s}
.acad-search-clear:hover{background:var(--g100);color:var(--tx)}
.acad-search-input:not(:placeholder-shown) ~ .acad-search-clear{display:block}
/* Search match highlight — wraps the matched substring inside any
   .hl-target element while the search input has a non-empty query. */
.acad-search-mark{background:color-mix(in srgb,var(--lo) 28%,transparent);color:inherit;padding:.05em .15em;border-radius:3px;font-weight:inherit}
body.liq-dark .acad-search-mark{background:color-mix(in srgb,var(--lo) 38%,transparent);color:#fff}
/* Filter bar */
.acad-filter-bar{display:flex;align-items:center;gap:.5rem;margin-bottom:1.8rem;flex-wrap:wrap}
.filter-btn{padding:.35rem .85rem;border-radius:2rem;border:1.5px solid var(--bdr);background:var(--wh);font-size:.8rem;font-weight:600;color:var(--txm);cursor:pointer;transition:all .18s}
.filter-btn:hover{border-color:var(--lp);color:var(--lp)}
.filter-btn.active{background:var(--lp);border-color:var(--lp);color:#fff}
/* Hides tracks that don't match filter or search. Both classes hide the
   element via display:none; either condition is sufficient. */
.prog-bar{height:4px;background:var(--g100);border-radius:99px;overflow:hidden;margin-top:.35rem}
.prog-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .4s}
.acad-xp-bar{background:var(--lp);border-top:1px solid rgba(255,255,255,.1);padding:1rem 0}
.xp-bar-wrap{height:8px;background:rgba(255,255,255,.15);border-radius:99px;overflow:hidden;margin:.35rem 0}
.xp-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .8s cubic-bezier(.4,0,.2,1)}

/* MODULE VIEWER */
.mod-tabs{display:flex;background:var(--g100);border-radius:var(--r) var(--r) 0 0;border:1px solid var(--bdr);border-bottom:none;padding:.3rem .3rem 0}
.mod-tab{flex:1;border:none;background:transparent;font-family:var(--fb);font-size:.87rem;font-weight:700;padding:.6rem .5rem;border-radius:var(--rs) var(--rs) 0 0;cursor:pointer;color:var(--txs);display:flex;align-items:center;justify-content:center;gap:.35rem;transition:all .2s}
.mod-tab:hover{background:rgba(255,255,255,.7)}.mod-tab.active{background:var(--wh);color:var(--lp)}
.mod-tab .ck{color:var(--ok);font-size:.8rem}
.mod-panel{display:none;background:var(--wh);border:1px solid var(--bdr);border-radius:0 0 var(--rl) var(--rl);padding:1.75rem}
.mod-panel.active{display:block}
/* ── Reading layout: two-column on large screens ─── */
.reading-layout{display:block}
.reading-toc{display:none}
.reading-prose{width:100%}
@media(min-width:992px){
  .reading-layout{display:grid;grid-template-columns:190px 1fr;gap:2.5rem;align-items:start}
  .reading-toc{display:block;position:sticky;top:5rem}
  .reading-prose{max-width:700px}
}
.toc-label{font-size:.63rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--txm);margin-bottom:.65rem;padding-bottom:.4rem;border-bottom:1px solid var(--bdr)}
.toc-item{display:flex;align-items:flex-start;gap:.4rem;padding:.3rem 0 .3rem .55rem;font-size:.78rem;color:var(--txm);cursor:pointer;transition:color .15s,border-color .15s;line-height:1.35;border-left:2px solid transparent;margin-left:-.55rem}
.toc-item:hover{color:var(--lp)}
.toc-item.active{color:var(--lp);font-weight:700;border-left-color:var(--lo)}
.toc-num{font-weight:800;color:var(--lo);flex-shrink:0;font-size:.7rem;margin-top:.08rem}
/* ── Reading prose typography ── */
.read-sec{margin-bottom:2rem;scroll-margin-top:5.5rem}
.read-sec h4{font-family:var(--fd);font-size:1.12rem;color:var(--lp);margin:0 0 .9rem;padding-bottom:.5rem;border-bottom:2px solid var(--lo-l);line-height:1.4}
.read-sec p{color:var(--txs);font-size:.95rem;line-height:1.8;margin-bottom:.9rem}
.read-sec p:last-of-type{margin-bottom:0}
.read-sec strong{color:var(--lp);font-weight:700}
.read-sec ol,.read-sec ul{font-size:.95rem;line-height:1.8;color:var(--txs);padding-left:1.4rem;margin-bottom:.9rem}
.read-sec li{margin-bottom:.3rem}
.read-sec em{font-style:italic}
.read-divider{border:none;border-top:1px solid var(--bdr);margin:2rem 0}
.takeaway-box{background:var(--lp-t);border:1px solid rgba(43,58,103,.12);border-radius:var(--r);padding:1rem 1.3rem;margin-top:1.1rem}
.takeaway-box h6{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lp-m);margin-bottom:.6rem}
.tak-item{display:flex;gap:.55rem;align-items:flex-start;margin-bottom:.4rem;font-size:.87rem;line-height:1.55}
.tak-item i{color:var(--lo);flex-shrink:0;margin-top:.2rem;font-size:.8rem}
body.liq-dark .read-sec strong{color:var(--lo)}
.scen-setup{background:rgba(43,58,103,.05);border-radius:var(--r);padding:1.2rem;margin-bottom:1.2rem;font-size:.94rem;color:var(--txs)}
.scen-setup strong{color:var(--tx)}
.scen-q{font-family:var(--fd);font-size:1.12rem;color:var(--lp);margin-bottom:1rem;font-weight:700;line-height:1.45}
.scen-opt{width:100%;text-align:left;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--r);padding:.85rem 1rem;font-family:var(--fb);font-size:.92rem;cursor:pointer;transition:all .2s;margin-bottom:.6rem;color:var(--tx);display:flex;align-items:flex-start;gap:.65rem}
.scen-opt:hover{border-color:var(--lo);background:var(--lo-p)}
.scen-opt.correct{border-color:var(--ok);background:var(--ok-l)}.scen-opt.wrong{border-color:var(--er);background:var(--er-l)}
.opt-ltr{width:1.65rem;height:1.65rem;border-radius:50%;background:var(--g100);color:var(--txs);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.77rem;flex-shrink:0;transition:all .2s}
.scen-opt.correct .opt-ltr{background:var(--ok);color:#fff}.scen-opt.wrong .opt-ltr{background:var(--er);color:#fff}
.scen-fb{display:none;border-radius:var(--r);padding:1rem;margin-top:.7rem;font-size:.91rem}
.scen-fb.show{display:block}.scen-fb.fb-ok{background:var(--ok-l);border-left:4px solid var(--ok)}.scen-fb.fb-er{background:var(--er-l);border-left:4px solid var(--er)}
/* ── QUIZ ─── */
.quiz-q-txt{font-family:var(--fd);font-size:1.05rem;color:var(--lp);margin-bottom:.9rem;font-weight:700;line-height:1.45}
body.liq-dark .quiz-q-txt{color:var(--heading)}
/* Progress pip bar */
.qprog{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem}
.qpip-row{display:flex;gap:.4rem;flex:1}
.qpip{flex:1;height:5px;border-radius:99px;background:var(--g200);transition:background .25s}
.qpip-active{background:var(--lo)}
.qpip-ok{background:var(--ok)}
.qpip-er{background:var(--er)}
.qprog-lbl{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);white-space:nowrap;flex-shrink:0}
/* Options */
.quiz-opt{width:100%;text-align:left;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--rs);padding:.62rem .92rem;font-family:var(--fb);font-size:.9rem;cursor:pointer;transition:all .2s;margin-bottom:.42rem;color:var(--tx);display:flex;align-items:center;gap:.55rem}
.quiz-opt:hover:not(:disabled){border-color:var(--lo);background:var(--lo-p)}
.quiz-opt.sel{border-color:var(--lo);background:var(--lo-p)}
.quiz-opt.ok{border-color:var(--ok);background:var(--ok-l)}
.quiz-opt.er{border-color:var(--er);background:var(--er-l)}
.quiz-radio{width:.95rem;height:.95rem;border-radius:50%;border:2px solid var(--bdr);flex-shrink:0;transition:all .2s}
.quiz-opt.sel .quiz-radio{border-color:var(--lo);background:var(--lo)}
.quiz-opt.ok .quiz-radio{border-color:var(--ok);background:var(--ok)}
.quiz-opt.er .quiz-radio{border-color:var(--er);background:var(--er)}

/* ── Certification Exam ─────────────────────────────────────── */
.btn-liq.btn-lg{padding:.7rem 1.5rem;font-size:1rem}
.exam-hero{text-align:center;padding:1.2rem 1rem .4rem}
.exam-hero-icon{width:64px;height:64px;border-radius:50%;background:var(--lo-l);color:var(--lo);display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto .7rem}
.exam-hero-title{font-family:var(--fd);color:var(--heading);font-size:1.7rem;margin:0 0 .3rem}
.exam-hero-sub{color:var(--txs);font-size:.95rem;max-width:44ch;margin:0 auto}
.exam-best{display:inline-block;margin-top:.7rem;background:var(--g100);color:var(--txs);border-radius:2rem;padding:.2rem .8rem;font-size:.82rem;font-weight:700}
.exam-certified{display:flex;gap:.6rem;align-items:flex-start;background:var(--ok-l);border:1px solid var(--ok);border-radius:var(--r);padding:.8rem 1rem;margin:1rem 0;color:#14532d}
.exam-certified i{color:var(--ok);font-size:1.2rem;flex-shrink:0}
.exam-rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem;margin:1.1rem 0}
.exam-rule{display:flex;gap:.7rem;align-items:flex-start;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem .9rem;box-shadow:var(--sh)}
.exam-rule i{color:var(--lo);font-size:1.25rem;flex-shrink:0;margin-top:.05rem}
.exam-rule strong{display:block;color:var(--heading);font-size:.92rem}
.exam-rule span{display:block;color:var(--txs);font-size:.82rem;margin-top:.1rem}
.exam-readiness{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem;margin-bottom:1.1rem;box-shadow:var(--sh)}
.exam-readiness-bar-label{font-size:.86rem;color:var(--txs);margin-bottom:.45rem}
.exam-readiness-bar{height:9px;background:var(--g100);border-radius:2rem;overflow:hidden}
.exam-readiness-fill{height:100%;background:var(--lo);border-radius:2rem;transition:width .4s}
.exam-readiness-note{font-size:.82rem;color:var(--txm);margin:.55rem 0 0}
.exam-readiness-note.exam-ready{color:var(--ok)}
.exam-start-actions{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap;margin:1.3rem 0 .5rem}
.exam-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding-bottom:.6rem;border-bottom:1px solid var(--bdr);margin-bottom:.8rem}
.exam-bar-title{font-family:var(--fd);color:var(--heading);font-size:1.1rem}
.exam-bar-title i{color:var(--lo)}
.exam-bar-meta{font-size:.84rem;color:var(--txs);font-weight:700}
.exam-grid{display:flex;flex-wrap:wrap;gap:.32rem}
.exam-pip{width:30px;height:30px;border-radius:var(--rs);border:1.5px solid var(--bdr);background:var(--wh);color:var(--txm);font-size:.78rem;font-weight:700;cursor:pointer;transition:all .15s}
.exam-pip:hover{border-color:var(--lo)}
.exam-pip-done{background:var(--lo-p);border-color:var(--lo);color:var(--lo-h)}
.exam-pip-active{background:var(--lp);border-color:var(--lp);color:#fff}
.exam-nav{display:flex;justify-content:space-between;align-items:center;margin-top:1.1rem;gap:.7rem}
.exam-submit-row{text-align:center;margin-top:.9rem}
.exam-submit-link{background:none;border:none;color:var(--txm);font-size:.84rem;font-weight:700;cursor:pointer;text-decoration:underline}
.exam-submit-link:hover{color:var(--lo)}
.exam-result-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.4rem}
.exam-rev-src{display:block;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lp-m);margin-bottom:.3rem}
/* Exam catalogue */
.exam-cat-intro{color:var(--txs);font-size:.92rem;margin-bottom:1rem;text-align:center;max-width:60ch;margin-left:auto;margin-right:auto}
.exam-final-card{background:var(--wh);border:1px solid var(--bdr);border-top:3px solid var(--lo);border-radius:var(--rl);padding:1rem 1.1rem 1.3rem;box-shadow:var(--shm);margin-bottom:1.6rem}
.exam-cat-section{font-family:var(--fd);color:var(--heading);font-size:1.2rem;margin:1.6rem 0 .3rem;display:flex;align-items:center}
.exam-cat-section i{color:var(--lo)}
.exam-cat-subhead{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin:.9rem 0 .5rem}
.exam-card-list{display:flex;flex-direction:column;gap:.6rem}
.exam-card{display:flex;align-items:center;gap:.85rem;background:var(--wh);border:1px solid var(--bdr);border-left:4px solid var(--lo);border-radius:var(--r);padding:.75rem .9rem;box-shadow:var(--sh)}
.exam-card-icon{font-size:1.5rem;flex-shrink:0;width:2rem;text-align:center}
.exam-card-body{flex:1;min-width:0}
.exam-card-title{font-weight:800;color:var(--heading);font-size:.95rem;line-height:1.25}
.exam-card-meta{font-size:.78rem;color:var(--txs);margin:.15rem 0 .35rem}
.exam-card-start{flex-shrink:0}
.exam-status{display:inline-block;font-size:.74rem;font-weight:700;border-radius:2rem;padding:.1rem .55rem}
.exam-status-pass{background:var(--ok-l);color:#14532d}
.exam-status-try{background:var(--wa-l);color:#92400e}
.exam-status-new{background:var(--g100);color:var(--txm)}
.exam-card-actions{display:flex;flex-direction:column;gap:.35rem;flex-shrink:0}
.exam-card-cert{white-space:nowrap}
.exam-card-passed{background:linear-gradient(0deg,var(--ok-l),var(--wh) 55%)}
@media(max-width:560px){.exam-card{flex-wrap:wrap}.exam-card-actions{width:100%;flex-direction:row;margin-top:.2rem}.exam-card-actions .btn-liq{flex:1}}
/* Exam badges */
.exam-badges-strip{background:linear-gradient(135deg,var(--lo-p),var(--lp-t));border:1px solid var(--bdr);border-radius:var(--rl);padding:.9rem 1rem;margin-bottom:1.4rem}
.exam-badges-title{font-weight:800;color:var(--heading);font-size:.9rem;margin-bottom:.75rem;display:flex;align-items:center}
.exam-badges-title i{color:var(--lo)}
.exam-badges-count{background:var(--lo);color:#fff;border-radius:2rem;padding:.02rem .5rem;font-size:.72rem;margin-left:.45rem}
.exam-badges{display:flex;flex-wrap:wrap;gap:.9rem}
.exam-badge{width:86px;text-align:center}
.exam-badge-medallion{width:54px;height:54px;border-radius:50%;margin:0 auto .35rem;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#fff;background:var(--bcol,var(--lo));box-shadow:var(--sh);border:3px solid rgba(255,255,255,.7)}
.exam-badge-label{font-size:.7rem;font-weight:700;color:var(--tx);line-height:1.15;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.exam-badge-score{font-size:.68rem;color:var(--txm);font-weight:700;margin-top:.05rem}
/* Explanation */
.quiz-exp{display:none;font-size:.87rem;color:var(--txs);background:var(--g100);border-radius:var(--rs);padding:.75rem 1rem;margin-top:.6rem;line-height:1.6}
.quiz-exp.show{display:block}
.quiz-exp-hdr{display:flex;align-items:center;gap:.45rem;font-weight:800;font-size:.85rem;margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--bdr)}
.exp-ok{color:var(--ok)}.exp-er{color:var(--er)}
.quiz-retry-note{color:var(--txm);font-size:.8rem;margin-top:.5rem}
/* Results header */
.qrev-header{display:flex;align-items:flex-start;gap:1.25rem;padding:1.5rem;background:var(--g100);border-radius:var(--r);margin-bottom:1.5rem;flex-wrap:wrap}
.qrev-summary{flex:1;min-width:200px}
/* Score ring (kept from before) */
.score-ring{width:88px;height:88px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:6px solid;font-family:var(--fd);flex-shrink:0}
.score-ring .sn{font-size:1.7rem;font-weight:700;line-height:1}
.score-ring .sd{font-size:.68rem;font-weight:700}
.score-ring.s-ok{border-color:var(--ok);color:var(--ok)}
.score-ring.s-or{border-color:var(--lo);color:var(--lo)}
.score-ring.s-er{border-color:var(--er);color:var(--er)}
/* Question review section */
.qrev-section{margin-top:.5rem}
.qrev-title{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.85rem;display:flex;align-items:center}
.qrev-item{border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem;margin-bottom:.75rem;border-left-width:4px}
.qrev-ok{border-left-color:var(--ok)}
.qrev-er{border-left-color:var(--er)}
.qrev-hdr{display:flex;align-items:flex-start;gap:.65rem;margin-bottom:.65rem}
.qrev-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:800;padding:.2rem .55rem;border-radius:2rem;flex-shrink:0;margin-top:.08rem}
.qrev-badge-ok{background:var(--ok-l);color:var(--ok)}
.qrev-badge-er{background:var(--er-l);color:var(--er)}
.qrev-q{font-size:.9rem;font-weight:700;color:var(--tx);line-height:1.45;flex:1}
.qrev-opts{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.7rem}
.qrev-opt{display:flex;align-items:flex-start;gap:.55rem;font-size:.85rem;color:var(--txm);padding:.35rem .55rem;border-radius:var(--rs)}
.qrev-correct{background:var(--ok-l);color:var(--ok);font-weight:700}
.qrev-wrong{background:var(--er-l);color:var(--er);font-weight:700;text-decoration:line-through}
.qrev-explain{font-size:.84rem;color:var(--txs);background:var(--g100);border-radius:var(--rs);padding:.6rem .85rem;line-height:1.6}
/* ── Module Notes Panel ─── */
.mod-notes-panel{margin-top:.9rem;border:1.5px solid var(--bdr);border-radius:var(--r);background:var(--wh);overflow:hidden}
.mod-notes-hdr{display:flex;align-items:center;justify-content:space-between;padding:.72rem 1rem;cursor:pointer;user-select:none;gap:.75rem;transition:background .15s}
.mod-notes-hdr:hover{background:var(--g100)}
.mod-notes-hdr-left{display:flex;align-items:center;gap:.5rem;font-size:.88rem;font-weight:700;color:var(--tx)}
.mod-notes-hdr-left i{color:var(--lo);font-size:.95rem}
.mod-notes-count{font-size:.7rem;font-weight:800;background:var(--lo-l);color:var(--lo-h);border-radius:99px;padding:.1rem .48rem;white-space:nowrap}
.mod-notes-prompt{font-size:.72rem;font-weight:600;color:var(--txm)}
.mod-notes-chev{color:var(--txm);font-size:.82rem;flex-shrink:0;transition:transform .2s}
.mod-notes-body{border-top:1px solid var(--bdr);padding:.8rem 1rem 1rem}
.mod-notes-ta{width:100%;min-height:130px;border:1.5px solid var(--bdr);border-radius:var(--rs);background:var(--g100);color:var(--tx);font-family:var(--fb);font-size:.88rem;line-height:1.65;padding:.7rem .85rem;resize:vertical;outline:none;transition:border-color .18s,background .18s,box-shadow .18s;box-sizing:border-box}
.mod-notes-ta:focus{border-color:var(--lo);background:var(--wh);box-shadow:0 0 0 2px var(--lo);outline:none}
.mod-notes-ta::placeholder{color:var(--txm)}
/* ── Quiz struggle hint banner ── */
.quiz-struggle-banner{display:flex;align-items:flex-start;gap:.6rem;background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.25);border-radius:var(--r);padding:.72rem .95rem;margin-bottom:1.1rem;font-size:.85rem;color:var(--tx);line-height:1.45}
.quiz-struggle-banner i{color:#2563eb;font-size:1.05rem;flex-shrink:0;margin-top:.1rem}
.quiz-struggle-banner strong{color:#2563eb}
.liq-dark .quiz-struggle-banner{background:rgba(96,165,250,.12);border-color:rgba(96,165,250,.3)}
.liq-dark .quiz-struggle-banner i,.liq-dark .quiz-struggle-banner strong{color:#93c5fd}
.mod-notes-footer{display:flex;align-items:center;justify-content:space-between;margin-top:.45rem;min-height:1.4rem}
.mod-notes-status{font-size:.74rem;color:var(--txm);transition:color .3s}
.mod-notes-status.saved{color:var(--ok)}
.mod-notes-clear{background:none;border:none;color:var(--er);font-size:.74rem;font-weight:700;cursor:pointer;padding:0;outline:none;line-height:1}
.mod-notes-clear:hover{text-decoration:underline}
.mod-note-ind{font-size:.7rem;color:var(--lo-h);background:var(--lo-l);border-radius:3px;padding:.08rem .32rem;font-weight:700;flex-shrink:0}
.done-banner{display:none;background:linear-gradient(135deg,var(--lp-d),var(--lp-m));color:#fff;border-radius:var(--rl);padding:2rem;text-align:center;margin-top:1.2rem}
.done-banner.show{display:block}
/* Without this, Bootstrap's fluid h3 (calc(1.3rem + .6vw)) sized this
   heading; 1.5rem matches .acx-pn-hd h3, the app's own h3 scale. */
.done-banner h3{font-size:1.5rem}
.done-next-card{margin-top:1.5rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:var(--r);padding:1.1rem 1.25rem;text-align:left}
.done-next-label{font-size:.62rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:.5rem}
.done-next-track{font-size:.72rem;font-weight:700;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:.4rem;margin-bottom:.3rem}
.done-next-title{font-family:var(--fd);font-size:1rem;font-weight:700;color:#fff;margin-bottom:.85rem;line-height:1.35}
.done-next-btn{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:var(--r);padding:.5rem 1.1rem;font-size:.87rem;font-weight:700;cursor:pointer;transition:background .2s}
.done-next-btn:hover{background:rgba(255,255,255,.28)}
/* ── Saved Tools ─── */
.sv-empty{color:var(--txm);font-size:.9rem;padding:.5rem 0}
.sv-item{display:flex;align-items:flex-start;gap:.85rem;padding:.9rem 0;border-bottom:1px solid var(--bdr)}
.sv-item:last-child{border-bottom:none}
.sv-ico{width:2.3rem;height:2.3rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.05rem}
.sv-badge{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--txm);margin-bottom:.15rem}
.sv-title{font-size:.9rem;font-weight:700;color:var(--tx);margin-bottom:.15rem;line-height:1.35}
.sv-sum{font-size:.78rem;color:var(--txs);margin-bottom:.42rem}
.sv-date{font-size:.68rem;color:var(--txm)}
.sv-actions{display:flex;gap:.45rem;flex-wrap:wrap;margin-top:.5rem}
.sv-btn{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:700;padding:.28rem .72rem;border-radius:var(--rs);cursor:pointer;border:1px solid var(--bdr);background:var(--wh);color:var(--tx);transition:all .18s}
.sv-btn:hover{border-color:var(--lo);color:var(--lo)}
.sv-btn.sv-del{color:var(--er)}
.sv-btn.sv-del:hover{border-color:var(--er);background:var(--er-l)}
.tool-save-row{display:flex;justify-content:center;margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--bdr)}
.bm-btn{display:inline-flex;align-items:center;gap:.38rem;background:none;border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.32rem .78rem;font-size:.8rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .18s;line-height:1}
.bm-btn:hover{border-color:var(--lo);color:var(--lo)}
.bm-btn.active{border-color:var(--lo);color:var(--lo);background:var(--lo-p)}
.bm-btn.active i{color:var(--lo)}
.bm-btn-hero{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.25);border-radius:var(--rs);padding:.38rem .9rem;font-size:.82rem;font-weight:700;color:rgba(255,255,255,.85);cursor:pointer;transition:all .18s}
.bm-btn-hero:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5);color:#fff}
.bm-btn-hero.active{background:rgba(214,93,134,.25);border-color:var(--lo);color:var(--lo)}
/* Bookmarks section on profile */
.bm-section-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.bm-tab{background:var(--g100);border:1px solid var(--bdr);border-radius:var(--rs);padding:.3rem .85rem;font-size:.8rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .18s}
.bm-tab.active{background:var(--lp);color:#fff;border-color:var(--lp)}
.bm-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 0;border-bottom:1px solid var(--bdr);cursor:pointer;transition:opacity .15s}
.bm-item:last-child{border-bottom:none}
.bm-item:hover{opacity:.8}
.bm-item-icon{width:2rem;height:2rem;border-radius:.4rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.88rem}
.bm-item-name{font-weight:700;font-size:.88rem;color:var(--tx);line-height:1.3}
.bm-item-sub{font-size:.75rem;color:var(--txm);margin-top:.1rem}
.bm-empty{color:var(--txm);font-size:.88rem;padding:.5rem 0}
.done-xp{display:inline-flex;align-items:center;gap:.35rem;background:var(--lo);color:#fff;font-weight:800;font-size:1rem;padding:.3rem 1rem;border-radius:2rem;margin:.6rem 0}

/* LEXICON */
.lex-search{position:relative}
.lex-search i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--txm);font-size:1rem}
.lex-inp{width:100%;border:2px solid var(--bdr);border-radius:var(--r);padding:.68rem 1rem .68rem 2.55rem;font-family:var(--fb);font-size:.96rem;font-weight:600;color:var(--tx);background:var(--wh);outline:none;transition:border-color .2s,box-shadow .2s}
.lex-inp:focus{border-color:var(--lo);box-shadow:0 0 0 2px var(--lo);outline:none}.lex-inp::placeholder{color:var(--txm);font-weight:400}
.cat-tabs{display:flex;gap:.35rem;flex-wrap:wrap;margin:.85rem 0}
.cat-tab{border:2px solid var(--bdr);background:var(--wh);border-radius:2rem;padding:.27rem .78rem;font-family:var(--fb);font-size:.77rem;font-weight:700;cursor:pointer;color:var(--txs);transition:all .2s}
.cat-tab:hover{border-color:var(--lo);color:var(--lo-h)}.cat-tab.active{background:var(--lp);border-color:var(--lp);color:#fff}
.term-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);margin-bottom:.6rem;overflow:hidden;transition:box-shadow .2s}
.term-card:hover{box-shadow:var(--sh)}
.term-card-hdr{display:flex;align-items:center;gap:.75rem;padding:.9rem 1.15rem;cursor:pointer}
.term-name{font-weight:700;font-size:.97rem;color:var(--tx);flex:1}
.term-prev{font-size:.79rem;color:var(--txm);margin-top:.07rem}
.expand-ico{color:var(--txm);transition:transform .2s;flex-shrink:0}
.term-card.open .expand-ico{transform:rotate(180deg)}
/* max-height:0 hides a panel from the eye and from nothing else: the text stays
   in the accessibility tree, so a screen reader met the whole Lexicon as one
   wall of prose — every definition of every term, read out in full, with no
   way to skip one. visibility:hidden takes it out of the tree as well, and the
   0s delay lets it stay readable for the .35s the collapse is animating. */
.term-body{max-height:0;overflow:hidden;visibility:hidden;transition:max-height .35s ease,padding .3s,visibility 0s linear .35s}
.term-card.open .term-body{max-height:900px;padding:0 1.15rem 1.15rem;visibility:visible;transition:max-height .35s ease,padding .3s,visibility 0s linear 0s}
.term-card-hdr{cursor:pointer}
.term-card-hdr:focus-visible{outline:2px solid var(--lo);outline-offset:2px;border-radius:var(--rs)}
.lex-mod-link{display:flex;align-items:center;gap:.7rem;background:var(--lp-t);border:1px solid rgba(43,58,103,.15);border-radius:var(--rs);padding:.52rem .9rem;margin-top:.8rem;cursor:pointer;transition:all .18s}
.lex-mod-link:hover{background:var(--lp-m);border-color:var(--lp);box-shadow:var(--shm)}
.lex-mod-icon{width:1.7rem;height:1.7rem;background:var(--lp);border-radius:.35rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.8rem;color:var(--lo)}
.lex-mod-text{flex:1;min-width:0}
.lex-mod-cta{font-size:.63rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lp);line-height:1;margin-bottom:.18rem}
.lex-mod-title{font-size:.82rem;font-weight:700;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.lex-mod-arrow{color:var(--lo);font-size:.85rem;flex-shrink:0}
body.liq-dark .lex-mod-link{background:rgba(214,93,134,.07);border-color:rgba(214,93,134,.18)}
body.liq-dark .lex-mod-link:hover{background:rgba(214,93,134,.16);border-color:rgba(214,93,134,.4)}
body.liq-dark .lex-mod-cta{color:var(--lo)}
.term-def{font-size:.92rem;color:var(--txs);line-height:1.7;margin-bottom:.85rem}
.leg-tag{display:inline-flex;align-items:center;background:var(--lp-t);border:1px solid rgba(43,58,103,.15);color:var(--lp-m);font-size:.67rem;font-weight:700;padding:.13rem .48rem;border-radius:3px;margin:.13rem}
.rel-chip{display:inline-flex;align-items:center;background:var(--lo-l);color:var(--lo-h);font-size:.69rem;font-weight:700;padding:.13rem .48rem;border-radius:3px;cursor:pointer;margin:.13rem;transition:background .2s}
.rel-chip:hover{background:rgba(214,93,134,.22)}
.tod-card{background:linear-gradient(135deg,var(--lp-d),var(--lp-m));border-radius:var(--rl);padding:1.35rem;color:#fff;margin-bottom:1rem}
.tod-lbl{font-size:.7rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo);margin-bottom:.35rem}
.tod-term{font-family:var(--fd);font-size:1.35rem;margin-bottom:.35rem}
.tod-def{font-size:.86rem;color:rgba(255,255,255,.7);line-height:1.6;margin:0}
.lex-xp-row{display:flex;align-items:center;gap:.7rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.65rem 1rem;margin-bottom:.85rem}
.lex-xp-bar{flex:1;height:5px;background:var(--g100);border-radius:99px;overflow:hidden}
.lex-xp-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .5s}

/* TOOLS */
.tool-tabs{display:flex;background:var(--g100);border-radius:var(--r) var(--r) 0 0;border:1px solid var(--bdr);border-bottom:none;padding:.3rem .3rem 0}
.tool-tab{flex:1;border:none;background:transparent;font-family:var(--fb);font-size:.84rem;font-weight:700;padding:.6rem .5rem;border-radius:var(--rs) var(--rs) 0 0;cursor:pointer;color:var(--txs);display:flex;align-items:center;justify-content:center;gap:.35rem;transition:all .2s}
.tool-tab:hover{background:rgba(255,255,255,.7)}.tool-tab.active{background:var(--wh);color:var(--lp)}
.tool-panel{display:none;background:var(--wh);border:1px solid var(--bdr);border-radius:0 0 var(--rl) var(--rl);padding:1.75rem}
.tool-panel.active{display:block}
.diag-wrap{max-width:620px;margin:0 auto}
.diag-q{font-family:var(--fd);font-size:1.18rem;color:var(--lp);margin-bottom:1.15rem;text-align:center;font-weight:700;line-height:1.45}
.diag-opts{display:flex;flex-direction:column;gap:.55rem}
/* LTC decision-tool option list (CIS Reportability Triage etc.) */
.cis-opts{display:flex;flex-direction:column;gap:.5rem}
.cis-opt{width:100%;text-align:left;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--r);padding:.7rem .9rem;font-family:var(--fb);font-size:.88rem;font-weight:600;cursor:pointer;color:var(--tx);display:flex;align-items:flex-start;gap:.6rem;transition:all .2s}
.cis-opt>i{color:var(--g400);font-size:1.05rem;flex-shrink:0;margin-top:.05rem}
.cis-opt:hover{border-color:var(--lo);background:var(--lo-p)}
.cis-opt.sel{border-color:var(--lo);background:var(--lo-l)}
.cis-opt.sel>i{color:var(--lo-h)}
.cis-steps{margin:.2rem 0 0 0;padding-left:1.15rem;font-size:.86rem;color:var(--tx)}
.cis-steps li{margin-bottom:.3rem}
/* LOC Funding-Envelope Calculator */
.fc-env{background:var(--wh);border:1.5px solid var(--bdr);border-radius:var(--r);padding:.7rem .85rem;margin-bottom:.7rem}
.fc-env-name{font-weight:700;font-size:.9rem;color:var(--tx);margin-bottom:.4rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.fc-tag{font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.1rem .4rem;border-radius:.3rem}
.fc-tag.fc-flow{background:rgba(220,38,38,.12);color:#dc2626}
.fc-tag.fc-keep{background:rgba(22,163,74,.12);color:#16a34a}
.fc-result-card{background:var(--wh);border:1.5px solid var(--bdr);border-radius:var(--r);padding:.4rem .85rem}
.fc-line{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--bdr)}
.fc-line:last-child{border-bottom:none}
.fc-line-name{font-weight:600;font-size:.86rem;color:var(--tx)}
.fc-line-treat{font-weight:700;font-size:.84rem;text-align:right}
.diag-btn{width:100%;text-align:left;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--r);padding:.82rem 1rem;font-family:var(--fb);font-size:.91rem;font-weight:600;cursor:pointer;color:var(--tx);display:flex;align-items:center;gap:.65rem;transition:all .2s}
.diag-btn:hover{border-color:var(--lo);background:var(--lo-p);transform:translateX(4px)}
.diag-ico{width:2rem;height:2rem;background:var(--g100);border-radius:var(--rs);display:flex;align-items:center;justify-content:center;color:var(--lp-m);flex-shrink:0}
.diag-yesno{display:flex;gap:.9rem;justify-content:center;margin-top:.5rem}
.d-yn{padding:.72rem 2rem;border-radius:var(--r);border:2px solid;font-family:var(--fb);font-weight:700;font-size:.95rem;cursor:pointer;display:flex;align-items:center;gap:.45rem;transition:all .2s}
.d-yn-y{border-color:var(--ok);color:var(--ok);background:var(--ok-l)}.d-yn-y:hover{background:var(--ok);color:#fff}
.d-yn-n{border-color:var(--er);color:var(--er);background:var(--er-l)}.d-yn-n:hover{background:var(--er);color:#fff}
.d-yn-y.sel{background:var(--ok);color:#fff}.d-yn-n.sel{background:var(--er);color:#fff}
.diag-back{display:flex;align-items:center;gap:.32rem;background:none;border:none;font-family:var(--fb);font-size:.82rem;font-weight:700;color:var(--txm);cursor:pointer;margin-top:1rem;padding:0}
.diag-back:hover{color:var(--txs)}
.diag-prog{display:flex;gap:.38rem;align-items:center;justify-content:center;margin-bottom:1.15rem}
.d-dot{width:8px;height:8px;border-radius:50%;background:var(--g200);transition:background .2s}
.d-dot.done{background:var(--g400)}.d-dot.active{background:var(--lo)}
.diag-res{max-width:520px;margin:0 auto;text-align:center}
.diag-res-ico{width:3.4rem;height:3.4rem;background:var(--lo-l);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.55rem;color:var(--lo);margin:0 auto .9rem}
.diag-res-title{font-family:var(--fd);font-size:1.3rem;color:var(--lp);margin-bottom:.6rem}
.diag-res-body{color:var(--txs);font-size:.93rem;margin-bottom:1.25rem;line-height:1.7}
.ck-item{display:flex;gap:.65rem;align-items:flex-start;padding:.75rem .92rem;border:1px solid var(--bdr);border-radius:var(--rs);margin-bottom:.48rem;cursor:pointer;transition:all .2s;background:var(--wh)}
.ck-item:hover{border-color:var(--lo);background:var(--lo-p)}.ck-item.chk{border-color:var(--ok);background:var(--ok-l)}
.ck-box{width:1.2rem;height:1.2rem;border:2px solid var(--bdr);border-radius:3px;flex-shrink:0;margin-top:.1rem;display:flex;align-items:center;justify-content:center;transition:all .2s}
.ck-item.chk .ck-box{background:var(--ok);border-color:var(--ok);color:#fff}
.ck-txt{font-size:.9rem;font-weight:600;color:var(--tx)}
.ck-sub{font-size:.77rem;color:var(--txm);font-weight:400;margin-top:.13rem}
.bld-step{padding:1.05rem;border:1px solid var(--bdr);border-radius:var(--r);margin-bottom:.68rem;transition:all .2s}
.bld-step.done{border-color:var(--ok);background:var(--ok-l)}
.bld-hdr{display:flex;align-items:center;gap:.75rem;cursor:pointer}
.bld-num{width:2rem;height:2rem;border-radius:50%;background:var(--g100);color:var(--txs);font-weight:800;font-size:.82rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.bld-step.done .bld-num{background:var(--ok);color:#fff}
.bld-title{font-weight:700;font-size:.93rem;flex:1}
.bld-body{display:none;padding-top:.8rem}
.bld-step.open .bld-body{display:block}
.bld-body p{font-size:.89rem;color:var(--txs);margin-bottom:.7rem}
.bld-inp{width:100%;border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.48rem .78rem;font-family:var(--fb);font-size:.89rem;color:var(--tx);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:.55rem}
.bld-inp:focus{border-color:var(--lo);box-shadow:0 0 0 2px var(--lo);outline:none}

/* PROFILE */
.lvl-card{background:linear-gradient(135deg,var(--lp-d),var(--lp-m));border-radius:var(--rl);padding:2rem;color:#fff;text-align:center}
/* Streak card on My Progress */
.streak-card{background:linear-gradient(135deg,#1a0d00,#3d1f00);border-radius:var(--rl);padding:1.6rem;color:#fff;height:100%;border:1px solid rgba(214,93,134,.25)}
.streak-card-flame{font-size:2.4rem;filter:drop-shadow(0 2px 8px rgba(214,93,134,.6));line-height:1;margin-bottom:.35rem}
.streak-card-num{font-size:3rem;font-weight:700;color:var(--lo);line-height:1;font-family:var(--fd)}
.streak-card-label{font-size:.78rem;color:rgba(255,255,255,.55);text-transform:uppercase;letter-spacing:var(--ls-caps);font-weight:700;margin-bottom:1.1rem}
.streak-stat-row{display:flex;gap:.5rem;margin-bottom:.5rem}
.streak-stat{flex:1;background:rgba(255,255,255,.07);border-radius:var(--rs);padding:.6rem .7rem;text-align:center}
.streak-stat-val{font-size:1.25rem;font-weight:800;color:#fff;line-height:1}
.streak-stat-lbl{font-size:.63rem;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-top:.2rem}
.streak-freeze-row{display:flex;align-items:center;gap:.5rem;background:rgba(59,79,134,.18);border:1px solid rgba(59,79,134,.38);border-radius:var(--rs);padding:.5rem .75rem;margin-top:.55rem;font-size:.8rem;color:rgba(255,255,255,.7)}
/* Freeze stays deliberately COOL (ice), but in LTC IQ's navy rather than the
   inherited Labour IQ indigo — it reads as the cold end of the navy->rose ramp. */
.streak-freeze-ico{font-size:1rem;color:#9fb2e0}
.streak-tip{font-size:.73rem;color:rgba(255,255,255,.35);margin-top:.65rem;line-height:1.4;text-align:center}
/* Tier completion badges */
.tier-badge-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}
.tier-badge-card{border-radius:var(--rl);padding:1.4rem 1.2rem;border:2px solid;position:relative;overflow:hidden;transition:transform .2s}
.tier-badge-card.earned{cursor:default}
.tier-badge-card.locked{opacity:.55;filter:grayscale(.4)}
.tier-badge-card::before{content:'';position:absolute;inset:0;opacity:.06;pointer-events:none}
.tier-badge-icon{font-size:2.2rem;margin-bottom:.5rem;line-height:1}
.tier-badge-name{font-family:var(--fd);font-size:1rem;font-weight:700;margin-bottom:.2rem}
.tier-badge-sub{font-size:.75rem;opacity:.7;margin-bottom:.7rem;line-height:1.4}
.tier-badge-progress{height:5px;border-radius:99px;background:rgba(255,255,255,.18);overflow:hidden;margin-bottom:.5rem}
.tier-badge-fill{height:100%;border-radius:99px;background:rgba(255,255,255,.7);transition:width .6s}
.tier-badge-count{font-size:.72rem;opacity:.65;font-weight:700}
.tier-badge-earned-stamp{position:absolute;top:.7rem;right:.8rem;background:rgba(255,255,255,.18);border-radius:2rem;padding:.15rem .55rem;font-size:.65rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;display:flex;align-items:center;gap:.3rem}
.streak-done-today{display:inline-flex;align-items:center;gap:.35rem;background:rgba(74,222,128,.15);border:1px solid rgba(74,222,128,.35);border-radius:2rem;padding:.22rem .7rem;font-size:.75rem;font-weight:700;color:#4ade80;margin-bottom:.8rem}
.streak-pending-today{display:inline-flex;align-items:center;gap:.35rem;background:rgba(214,93,134,.15);border:1px solid rgba(214,93,134,.35);border-radius:2rem;padding:.22rem .7rem;font-size:.75rem;font-weight:700;color:var(--lo);margin-bottom:.8rem;cursor:pointer}
.streak-pending-today:hover{background:rgba(214,93,134,.25)}
.lvl-icon-big{font-size:2.75rem;margin-bottom:.4rem}
.lvl-name{font-family:var(--fd);font-size:1.65rem;font-weight:700}
.lvl-sub{color:rgba(255,255,255,.6);font-size:.86rem;margin-bottom:1.05rem}
/* Career-ladder vs prestige band chip. The card is already a navy gradient, so
   the career chip is a quiet tint of it and prestige takes the rose accent. */
.lvl-band{display:inline-flex;align-items:center;gap:.25rem;margin-left:.5rem;padding:.1rem .5rem;border-radius:2rem;
  font-size:.66rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;vertical-align:middle;
  background:rgba(255,255,255,.14);color:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.2)}
.lvl-band-prestige{background:rgba(214,93,134,.28);color:#ffd9e5;border-color:rgba(214,93,134,.65)}
.lvl-band-note{margin:-.55rem auto 1.05rem;max-width:34ch;font-size:.76rem;line-height:1.45;color:rgba(255,255,255,.62)}
/* Ranks are named after real LTC roles, so the card says plainly what they are
   not. Quieter than .lvl-band-note — it is a standing caveat, not news. */
.lvl-rank-note{margin:-.7rem auto 1.05rem;max-width:36ch;font-size:.7rem;line-height:1.45;color:rgba(255,255,255,.5)}
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:.6rem}
.ach-badge{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.95rem;text-align:center;transition:box-shadow .2s}
.ach-badge.unlocked{border-color:var(--lo)}.ach-badge.unlocked:hover{box-shadow:var(--shm)}
.ach-badge.locked{opacity:.5;filter:grayscale(.5)}
.ach-ico{font-size:1.85rem;margin-bottom:.38rem}
.ach-ico.u{color:var(--lo)}.ach-ico.l{color:var(--g400)}
.ach-name{font-size:.81rem;font-weight:800;color:var(--tx);margin-bottom:.13rem}
.ach-desc{font-size:.71rem;color:var(--txm)}
body.liq-dark .ach-desc{color:var(--txs)}
.ach-xp{font-size:.69rem;font-weight:700;color:var(--lo);margin-top:.28rem}
.ach-filter-bar{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem}
.ach-fbtn{padding:.28rem .72rem;border-radius:2rem;border:1.5px solid var(--bdr);background:var(--wh);font-size:.75rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .18s;white-space:nowrap}
.ach-fbtn:hover{border-color:var(--lp);color:var(--lp)}
.ach-fbtn.active{background:var(--lp);border-color:var(--lp);color:#fff}
.ach-unlock-btn{padding:.28rem .72rem;border-radius:2rem;border:1.5px solid var(--bdr);background:var(--wh);font-size:.75rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .18s;white-space:nowrap}
.ach-unlock-btn:hover{border-color:var(--ok);color:var(--ok)}
.ach-unlock-btn.active{background:var(--ok);border-color:var(--ok);color:#fff}
.ach-badge.ach-hidden{display:none!important}
.ach-empty-msg{grid-column:1/-1;text-align:center;padding:2rem 1rem;color:var(--txm);font-size:.9rem}
body.liq-dark .ach-fbtn{background:var(--g100);color:var(--txs)}
body.liq-dark .ach-fbtn.active{background:var(--lp-m);border-color:var(--lp-m);color:#fff}
body.liq-dark .ach-unlock-btn{background:var(--g100);color:var(--txs)}
body.liq-dark .ach-unlock-btn.active{background:var(--ok);border-color:var(--ok);color:#fff}
.act-item{display:flex;gap:.75rem;align-items:flex-start;padding:.62rem 0;border-bottom:1px solid var(--bdr);font-size:.86rem}
.act-item:last-child{border-bottom:none}
.act-ico{width:1.85rem;height:1.85rem;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.86rem}
.act-lbl{color:var(--tx);font-weight:600}.act-time{color:var(--txm);font-size:.74rem}
.act-xp{color:var(--lo);font-weight:700;font-size:.79rem;white-space:nowrap;margin-left:auto;padding-left:.5rem}
.act-item.act-hidden{display:none}
.act-show-more{display:block;text-align:center;font-size:.8rem;font-weight:700;color:var(--lo);cursor:pointer;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--bdr);transition:color .2s}
.act-show-more:hover{color:var(--lo-h)}
body.liq-dark .act-show-more{color:var(--lo)}
.trk-bar{height:7px;background:var(--g100);border-radius:99px;overflow:hidden;margin-top:.32rem}
.trk-fill{height:100%;border-radius:99px;transition:width .6s}

/* TOAST + LEVEL-UP */
.toast-box{position:fixed;bottom:1.5rem;right:1.5rem;z-index:var(--z-toast);display:flex;flex-direction:column;gap:.42rem}
/* Mobile bottom nav */
.mob-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:var(--z-mob-nav);background:var(--wh);border-top:1px solid var(--bdr);box-shadow:0 -2px 12px rgba(0,0,0,.08)}
.mob-nav-inner{display:flex;align-items:stretch;height:3.6rem}
.mob-nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.18rem;border:none;background:none;cursor:pointer;color:var(--txm);transition:color .15s;padding:0;font-size:.58rem;font-weight:700;letter-spacing:var(--ls-caps);text-transform:uppercase;position:relative}
.mob-nav-btn i{font-size:1.18rem;line-height:1}
.mob-nav-btn.active{color:var(--lp)}
.mob-nav-btn.active i{color:var(--lo)}
.mob-nav-badge{position:absolute;top:.45rem;right:calc(50% - .9rem);background:var(--er);color:#fff;font-size:.55rem;font-weight:800;border-radius:9px;padding:.06rem .32rem;min-width:1rem;text-align:center;line-height:1.3;pointer-events:none}
body.has-mob-nav .liq-page{padding-bottom:3.6rem}
body.has-mob-nav .a11y-wrap{bottom:5.2rem}
body.has-mob-nav .toast-box{bottom:5.2rem}
@media(max-width:991px){.mob-nav{display:block}body{padding-bottom:0}}
.ltoast{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);box-shadow:var(--shl);padding:.88rem 1.05rem;display:flex;align-items:center;gap:.75rem;min-width:265px;max-width:330px;animation:tIn .35s cubic-bezier(.4,0,.2,1) both}
.ltoast.out{animation:tOut .3s ease both}
@keyframes tIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
@keyframes tOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(40px)}}
.ltoast-ico{font-size:1.25rem;flex-shrink:0}.ltoast-lbl{font-size:.85rem;font-weight:700;color:var(--tx)}.ltoast-sub{font-size:.77rem;color:var(--txm)}
.lu-overlay{display:none;position:fixed;inset:0;background:rgba(31,14,37,.85);z-index:var(--z-modal);align-items:center;justify-content:center}
.lu-overlay.show{display:flex}
.lu-card{background:linear-gradient(135deg,var(--lp-d),var(--lp-m));border-radius:var(--rl);padding:2.5rem 2.2rem;text-align:center;color:#fff;max-width:390px;width:90%;animation:popIn .45s cubic-bezier(.4,0,.2,1) both}
@keyframes popIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
.lu-ico{font-size:3.4rem;margin-bottom:.6rem}.lu-ttl{font-size:.77rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo);margin-bottom:.38rem}
.lu-name{font-family:var(--fd);font-size:1.9rem;font-weight:700;margin-bottom:.38rem}.lu-sub{color:rgba(255,255,255,.65);font-size:.91rem;margin-bottom:1.4rem}
/* MISC */
.callout{display:flex;gap:.75rem;padding:.9rem 1.05rem;border-radius:var(--r);font-size:.9rem;margin-bottom:.9rem;align-items:flex-start}
.callout i{flex-shrink:0;margin-top:.15rem}
.cl-info{background:var(--inf-l);border-left:4px solid var(--inf)}.cl-info i{color:var(--inf)}
.cl-warn{background:var(--wa-l);border-left:4px solid var(--wa)}.cl-warn i{color:var(--wa)}
.cl-er{background:var(--er-l);border-left:4px solid var(--er)}.cl-er i{color:var(--er)}
.cl-ok{background:var(--ok-l);border-left:4px solid var(--ok)}.cl-ok i{color:var(--ok)}
.s-lbl{font-size:.71rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--lo);display:block;margin-bottom:.33rem}
.s-title{font-size:clamp(1.4rem,3.5vw,2rem);color:var(--lp);margin-bottom:.38rem}
.s-sub{color:var(--txs);max-width:540px;font-size:.94rem;margin:0}
.liq-footer{background:var(--lp-d);color:rgba(255,255,255,.6);padding:2.5rem 0 1.5rem;margin-top:4rem}
.footer-brand{font-family:var(--fd);font-size:1.2rem;color:#fff;font-weight:700;margin-bottom:.33rem}
.footer-link{color:rgba(255,255,255,.5);font-size:.82rem;display:block;margin-bottom:.28rem;transition:color .2s}
.footer-link:hover{color:var(--lo)}
.footer-disc{font-size:.74rem;color:rgba(255,255,255,.3);border-top:1px solid rgba(255,255,255,.08);padding-top:1rem;margin-top:1.65rem}
@media(max-width:768px){.hero-main{padding:3.5rem 0 3rem}.nav-xp{display:none!important}.ach-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.mod-tab{font-size:.77rem;padding:.5rem .3rem}}

/* ── ACCESSIBILITY PANEL ────────────────────────────────── */
.a11y-wrap{position:fixed;bottom:1.5rem;left:1.5rem;z-index:var(--z-a11y)}
.a11y-btn{width:3.1rem;height:3.1rem;border-radius:50%;background:var(--lp);border:3px solid var(--lo);color:var(--lo);font-size:1.3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shl);transition:all .2s;outline:none}
.a11y-btn:hover{background:var(--lp-m);transform:scale(1.08)}
.a11y-btn:focus-visible{outline:3px solid var(--lo);outline-offset:3px}
.a11y-panel{position:absolute;bottom:calc(100% + .75rem);left:0;width:282px;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);box-shadow:var(--shl);overflow:hidden;opacity:0;transform:translateY(10px) scale(.97);pointer-events:none;transition:opacity .22s ease,transform .22s ease}
.a11y-panel.show{opacity:1;transform:translateY(0) scale(1);pointer-events:all}
.a11y-panel-hdr{background:var(--lp);color:#fff;padding:.85rem 1.1rem;display:flex;align-items:center;justify-content:space-between}
.a11y-panel-title{font-family:var(--fd);font-size:1rem;font-weight:700;display:flex;align-items:center;gap:.5rem}
.a11y-close{background:none;border:none;color:rgba(255,255,255,.7);font-size:1.3rem;cursor:pointer;line-height:1;padding:0;transition:color .15s}
.a11y-close:hover{color:#fff}
.a11y-body{padding:.85rem 1rem}
.a11y-row{display:flex;align-items:center;justify-content:space-between;padding:.55rem 0;border-bottom:1px solid var(--bdr)}
.a11y-row:last-of-type{border-bottom:none}
.a11y-row-lbl{font-size:.87rem;font-weight:700;color:var(--tx);display:flex;align-items:center;gap:.5rem}
.a11y-row-lbl i{color:var(--lo);font-size:.95rem}
/* Toggle switch */
.a11y-toggle{width:2.8rem;height:1.55rem;border-radius:99px;border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0;outline:none}
.a11y-toggle:focus-visible{outline:3px solid var(--lo);outline-offset:2px}
.a11y-toggle.off{background:var(--g200)}
.a11y-toggle.on{background:var(--lo)}
.a11y-toggle::after{content:'';position:absolute;top:.18rem;left:.18rem;width:1.2rem;height:1.2rem;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.a11y-toggle.on::after{transform:translateX(1.25rem)}
/* Step controls (font/zoom) */
.a11y-step{display:flex;align-items:center;gap:.5rem}
.a11y-step-btn{width:1.9rem;height:1.9rem;border-radius:50%;border:2px solid var(--bdr);background:var(--wh);cursor:pointer;font-weight:800;font-size:.95rem;display:flex;align-items:center;justify-content:center;color:var(--tx);transition:all .15s;line-height:1;padding:0;outline:none}
.a11y-step-btn:hover{border-color:var(--lo);color:var(--lo);background:var(--lo-p)}
.a11y-step-btn:disabled{opacity:.35;cursor:not-allowed}
.a11y-step-btn:focus-visible{outline:3px solid var(--lo);outline-offset:2px}
.a11y-step-val{font-size:.82rem;font-weight:800;color:var(--txs);min-width:2.6rem;text-align:center}
.a11y-reset{width:100%;margin-top:.75rem;border:1.5px solid var(--bdr);background:transparent;border-radius:var(--rs);padding:.5rem;font-family:var(--fb);font-size:.82rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .2s;outline:none}
.a11y-reset:hover{border-color:var(--er);color:var(--er);background:var(--er-l)}
.a11y-reset:focus-visible{outline:3px solid var(--lo);outline-offset:2px}
/* Font picker */
.a11y-font-row{flex-direction:column;align-items:flex-start;gap:.45rem;padding-bottom:.6rem}
.a11y-font-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:.32rem;width:100%}
.a11y-font-chip{border:1.5px solid var(--bdr);border-radius:var(--rs);background:var(--wh);font-size:.78rem;font-weight:700;color:var(--txs);cursor:pointer;padding:.42rem .25rem;text-align:center;transition:all .18s;line-height:1.25;outline:none}
.a11y-font-chip:hover{border-color:var(--lo);color:var(--lo);background:var(--lo-p)}
.a11y-font-chip.active{border-color:var(--lp);background:var(--lp);color:#fff}
.a11y-font-chip:focus-visible{outline:3px solid var(--lo);outline-offset:2px}

/* ── DARK MODE ───────────────────────────────────────────── */
/* Generic dark-mode <option> fallback. body.liq-dark sets color-scheme:dark
   below, which makes Firefox + most Chromium versions render the open
   dropdown list with dark-themed colors automatically. This rule is the
   defensive layer for any browser/version that doesn't fully respect
   color-scheme for option list rendering — it explicitly sets dark
   surface + light text on every <option> when the page is in dark mode.
   Placed BEFORE the per-class option rules so those (which use the same
   colors anyway) override only on specificity grounds, not value. */
body.liq-dark select option{background-color:#1e1530;color:#e8e0f2}

body.liq-dark{
  /* Native UI (dropdown lists, form controls, scrollbars) should match the
     app's dark theme — overrides the :root default and prevents Chrome's
     Auto Dark Mode for Web Contents from second-guessing the page. */
  color-scheme:dark;
  --heading:#e8e0f2;
  --bg:#100b16;--wh:#1e1530;--g100:#271c33;--g200:#362848;--g400:#7a6a8a;--g600:#9a8aaa;
  --tx:#e8e0f2;--txs:#c0b0d0;--txm:#8878a0;--bdr:#362848;
  --ok-l:rgba(22,163,74,.18);--er-l:rgba(220,38,38,.18);--wa-l:rgba(217,119,6,.18);--inf-l:rgba(37,99,235,.18);
  --lo-l:rgba(214,93,134,.20);--lo-p:rgba(214,93,134,.10);--lp-t:rgba(214,93,134,.08);
  --sh:0 2px 12px rgba(0,0,0,.35);--shm:0 4px 20px rgba(0,0,0,.4);--shl:0 8px 32px rgba(0,0,0,.5);
}
body.liq-dark .hero-main,
body.liq-dark .section-hero,
body.liq-dark .lnav,
body.liq-dark .stats-bar,
body.liq-dark .acad-xp-bar,
body.liq-dark .liq-footer{filter:none}
/* Headings that use --lp as text colour need to lighten in dark mode */
body.liq-dark .s-title,
body.liq-dark .read-sec h4,
body.liq-dark .quiz-q-txt,
body.liq-dark .scen-q,
body.liq-dark .diag-q,
body.liq-dark .diag-res-title,
body.liq-dark .track-hdr h3,
body.liq-dark .mod-info h5,
body.liq-dark .why-card h4,
body.liq-dark .feat-card h3,
body.liq-dark .bld-title,
body.liq-dark .term-name,
body.liq-dark .ach-name { color: var(--tx); }
/* Additional heading/text elements using color:var(--lp) */
body.liq-dark .read-sec h4,
body.liq-dark .scen-q,
body.liq-dark .quiz-q-txt,
body.liq-dark .diag-q,
body.liq-dark .diag-res-title,
body.liq-dark .s-title { color: var(--heading) !important; }
body.liq-dark .mod-tab.active,
body.liq-dark .tool-tab.active { color: var(--tx); }
body.liq-dark .lex-inp,
body.liq-dark .bld-inp{background:var(--wh);color:var(--tx);border-color:var(--bdr)}
body.liq-dark .ltoast{background:var(--wh);border-color:var(--bdr)}
body.liq-dark .lu-card{background:linear-gradient(135deg,#0d0812,#2a1540)}
body.liq-dark input::placeholder{color:var(--txm)}
/* Lexicon element fixes */
body.liq-dark .leg-tag{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.13);color:var(--txs)}
body.liq-dark .term-def{color:var(--txs)}
/* ── Dark mode: elements using var(--lp) that need contrast fixes ── */
/* Expand/collapse + filter bar interactive text */
body.liq-dark body.liq-dark body.liq-dark .filter-btn{color:var(--txs);border-color:var(--bdr)}
body.liq-dark .filter-btn:hover{border-color:var(--lo);color:var(--lo)}
body.liq-dark .filter-btn.active{background:var(--lo);border-color:var(--lo);color:#fff}
/* Tier labels and progress text */
body.liq-dark .tier-progress-text{color:var(--txm)}
/* Purple button */
body.liq-dark .btn-pu{background:var(--lp-m);border-color:var(--lp-m)}
/* Lexicon category tab active state */
body.liq-dark .cat-tab.active{background:var(--lp-m);border-color:var(--lp-m)}
body.liq-dark .term-prev{color:var(--txm)}
body.liq-dark .term-notes{color:var(--txs);background:var(--g100);border-left-color:var(--g400)}
body.liq-dark .tod-def{color:rgba(255,255,255,.7)}
/* Sidebar stat numbers that use inline color:var(--lp) */
body.liq-dark #lex-stat-v,
body.liq-dark #lex-stat-t{color:var(--tx)!important}
/* Profile page stat box numbers that use color:var(--lp) */
body.liq-dark .prof-stat-num{color:var(--tx)!important}
/* Profile page track names in curriculum progress */
body.liq-dark .prof-track-name{color:var(--tx)!important}
/* Category sidebar labels */
body.liq-dark #lex-cat-counts span{color:var(--txs)}
/* Lexicon XP tracker label */
body.liq-dark .lex-xp-row span{color:var(--txs)}

/* ── HIGH CONTRAST ───────────────────────────────────────── */
/* High contrast is toggled INDEPENDENTLY of dark mode (js/18-a11y.js), and the
   default theme is LIGHT (--bg #f5f6fb). The old rule set --tx:#ffffff for both
   themes, so switching high contrast on WITHOUT dark mode painted white text on a
   near-white page — the accessibility feature made the app unreadable. Scoped per
   theme now: darken on light, lighten on dark, so contrast increases either way.
   The palette is also LTC IQ's navy/rose; the previous values (violet #f0e8ff /
   #ccbbee / #7755cc and an orange #ffaa44 accent) were Labour IQ's. */
body.liq-hc{                    /* light theme + high contrast */
  --tx:#000000;--txs:#12172a;--txm:#2b3a67;--bdr:#2b3a67;
  --lo:#a32d55;--lo-h:#87203f;--lo-l:rgba(163,45,85,.16);
}
body.liq-dark.liq-hc{           /* dark theme + high contrast */
  --tx:#ffffff;--txs:#ffeaf1;--txm:#f3c4d6;--bdr:#d65d86;
  --lo:#ff9ebb;--lo-h:#ffb8ce;--lo-l:rgba(255,158,187,.25);
}
body.liq-hc .mod-card,body.liq-hc .term-card,body.liq-hc .liq-card,
body.liq-hc .feat-card,body.liq-hc .why-card{border-width:2px}
body.liq-hc a{text-decoration:underline}

/* ── REDUCE MOTION ───────────────────────────────────────── */
body.liq-reduced-motion *,body.liq-reduced-motion *::before,body.liq-reduced-motion *::after{
  animation-duration:.01ms!important;animation-iteration-count:1!important;
  transition-duration:.01ms!important;scroll-behavior:auto!important;
}


/* ── LOGO SVGs ──────────────────────────────────────────── */
.ltciq-logo       { height: 36px; width: auto; display: block; }
.ltciq-logo-login { height: 58px; width: auto; display: block; margin: 0 auto; }

/* ── Inspection-Readiness self-audit rows ───────────────── */
.ir-list{display:flex;flex-direction:column;gap:.5rem}
.ir-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.6rem .85rem;flex-wrap:wrap}
.ir-row-lbl{font-size:.86rem;color:var(--tx);flex:1;min-width:180px;line-height:1.35}
.ir-seg{display:inline-flex;gap:.25rem;flex-shrink:0}
.ir-seg-btn{font-size:.76rem;font-weight:700;border:1px solid var(--bdr);background:var(--wh);color:var(--txs);border-radius:var(--rs);padding:.25rem .6rem;cursor:pointer;transition:all .15s}
.ir-seg-btn:hover{border-color:var(--lo)}
.ir-on-ok{background:var(--ok-l);border-color:var(--ok);color:#14532d}
.ir-on-er{background:var(--er-l);border-color:var(--er);color:#7f1d1d}
.ir-on-na{background:var(--g100);border-color:var(--g400);color:var(--txs)}


/* ── TOOL CARD GRID ─────────────────────────────────────── */
.tools-wrap{display:block}
.tool-sidebar{display:none}
.tools-right{flex:1;min-width:0}
@media(min-width:992px){
  .tools-wrap{display:flex;gap:1.5rem;align-items:flex-start}
  .tool-sidebar{display:block;width:220px;flex-shrink:0;position:sticky;top:5rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:.6rem}
  .tool-grid{display:none!important}
  .tool-mobile-bar{display:none!important}
}
.tools-wrap.has-tool .tool-grid{display:none}
.tool-sb-cat{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);padding:.6rem .55rem .18rem;margin-top:.25rem}
.tool-sb-cat:first-child{margin-top:0}
.tool-sb-divider{height:1px;background:var(--bdr);margin:.4rem .2rem}
.tool-sb-item{display:flex;align-items:center;gap:.55rem;padding:.42rem .55rem;border-radius:var(--rs);cursor:pointer;transition:all .15s;border:1px solid transparent;margin-bottom:.06rem}
.tool-sb-item:hover{background:var(--g100);border-color:var(--bdr)}
.tool-sb-item.active{background:var(--lp-t);border-color:var(--lp)}
body.liq-dark .tool-sb-item.active{background:rgba(214,93,134,.1);border-color:var(--lo)}
.tool-sb-icon{width:1.65rem;height:1.65rem;border-radius:.3rem;display:flex;align-items:center;justify-content:center;font-size:.77rem;flex-shrink:0}
.tool-sb-name{font-size:.79rem;font-weight:700;color:var(--tx);line-height:1.25;flex:1;min-width:0}
.tool-sb-item.active .tool-sb-name{color:var(--lp)}
body.liq-dark .tool-sb-item.active .tool-sb-name{color:var(--tx)}
.tool-sb-start{font-size:.56rem;font-weight:800;letter-spacing:var(--ls-caps);background:var(--lo-p);color:var(--lo-h);padding:.06rem .32rem;border-radius:2px;flex-shrink:0;text-transform:uppercase}
.tool-mobile-bar{display:none;align-items:center;gap:.7rem;padding:.65rem .9rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);margin-bottom:1rem}
.tools-wrap.has-tool .tool-mobile-bar{display:flex}
.tool-mobile-back{display:inline-flex;align-items:center;gap:.32rem;font-size:.78rem;font-weight:700;color:var(--txm);background:var(--g100);border:1px solid var(--bdr);border-radius:var(--rs);padding:.3rem .65rem;cursor:pointer;transition:all .15s;flex-shrink:0;white-space:nowrap}
.tool-mobile-back:hover{border-color:var(--lo);color:var(--lo)}
.tool-mobile-bar-icon{width:1.9rem;height:1.9rem;border-radius:.35rem;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0}
.tool-mobile-bar-name{font-size:.9rem;font-weight:800;color:var(--tx);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:.8rem;margin-bottom:1.5rem}
.tool-card{background:var(--wh);border:2px solid var(--bdr);border-radius:var(--rl);padding:1.2rem;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;gap:.45rem}
.tool-card:hover{border-color:var(--lo);box-shadow:var(--shm);transform:translateY(-2px)}
.tool-card.active{border-color:var(--lp);background:var(--lp-t)}
body.liq-dark .tool-card.active{background:rgba(214,93,134,.08);border-color:var(--lo)}
.tool-card-icon{width:2.4rem;height:2.4rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:1.15rem}
.tool-card-name{font-weight:800;font-size:.87rem;color:var(--tx);line-height:1.3}
.tool-card.active .tool-card-name{color:var(--lp)}
body.liq-dark .tool-card.active .tool-card-name{color:var(--tx)}
.tool-card-desc{font-size:.73rem;color:var(--txm);line-height:1.5}
.tool-content{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:2rem;min-height:200px}
/* ── JUST CAUSE ASSESSMENT ──────────────────────────────── */
.jca-bar{display:flex;gap:0;margin-bottom:1.6rem;border-radius:var(--r);overflow:hidden;border:1px solid var(--bdr)}
.jca-seg{flex:1;height:6px;background:var(--g100);transition:background .25s}
.jca-seg.s-done{background:var(--ok)}.jca-seg.s-on{background:var(--lo)}.jca-seg.s-risk{background:var(--er)}
.jca-q{font-family:var(--fd);font-size:1.13rem;color:var(--heading);margin-bottom:.35rem;font-weight:700;line-height:1.45}
.jca-ctx{font-size:.85rem;color:var(--txs);line-height:1.6;background:var(--g100);border-radius:var(--r);padding:.78rem 1rem;margin-bottom:1.1rem}
.jca-opt{border:2px solid var(--bdr);background:var(--wh);border-radius:var(--r);padding:.78rem 1rem;cursor:pointer;font-family:var(--fb);font-size:.9rem;font-weight:600;color:var(--tx);display:flex;align-items:center;gap:.65rem;transition:all .2s;margin-bottom:.48rem;width:100%;text-align:left}
.jca-opt:hover{border-color:var(--lo);background:var(--lo-p)}
.jca-opt.a-yes{border-color:var(--ok);background:var(--ok-l)}
.jca-opt.a-partial{border-color:var(--wa);background:var(--wa-l)}
.jca-opt.a-no{border-color:var(--er);background:var(--er-l)}
.jca-pip{width:1.45rem;height:1.45rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;flex-shrink:0;font-weight:800;background:var(--g200);color:var(--g400)}
.p-yes{background:var(--ok);color:#fff}.p-partial{background:var(--wa);color:#fff}.p-no{background:var(--er);color:#fff}
.jca-res-row{display:flex;align-items:flex-start;gap:.75rem;padding:.62rem 0;border-bottom:1px solid var(--bdr)}
.jca-res-row:last-child{border-bottom:none}
.jca-dot{width:.85rem;height:.85rem;border-radius:50%;flex-shrink:0;margin-top:.22rem}
.d-ok{background:var(--ok)}.d-wa{background:var(--wa)}.d-er{background:var(--er)}
.jca-verdict{border-radius:var(--r);padding:1.2rem 1.4rem;text-align:center;margin-bottom:1.4rem}
.v-go{background:var(--ok-l);border:2px solid var(--ok)}
.v-warn{background:var(--wa-l);border:2px solid var(--wa)}
.v-stop{background:var(--er-l);border:2px solid var(--er)}

/* ── SHARED PLANNER ─────────────────────────────────────── */
.plnr-steps{display:flex;position:relative;margin-bottom:1.6rem}
.plnr-steps::before{content:'';position:absolute;top:.92rem;left:5%;right:5%;height:2px;background:var(--bdr);z-index:0}
.plnr-step{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;z-index:1;cursor:pointer}
.plnr-circle{width:1.85rem;height:1.85rem;border-radius:50%;border:2px solid var(--bdr);background:var(--wh);display:flex;align-items:center;justify-content:center;font-size:.74rem;font-weight:800;color:var(--txm);transition:all .2s}
.plnr-step.done .plnr-circle{background:var(--ok);border-color:var(--ok);color:#fff}
.plnr-step.active .plnr-circle{background:var(--lo);border-color:var(--lo);color:#fff}
.plnr-lbl{font-size:.61rem;font-weight:700;color:var(--txm);margin-top:.28rem;text-align:center;line-height:1.3;max-width:62px}
.plnr-step.active .plnr-lbl{color:var(--lo)}.plnr-step.done .plnr-lbl{color:var(--ok)}
.plnr-title{font-family:var(--fd);font-size:1.1rem;color:var(--heading);margin-bottom:.25rem}
.plnr-sub{font-size:.83rem;color:var(--txs);margin-bottom:1.1rem}
.pf{margin-bottom:.85rem}
.pf label{display:block;font-size:.8rem;font-weight:700;color:var(--txs);margin-bottom:.22rem}
.pi{width:100%;border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.48rem .8rem;font-family:var(--fb);font-size:.87rem;color:var(--tx);outline:none;transition:border-color .2s,box-shadow .2s;background:var(--wh)}
.pi:focus{border-color:var(--lo);box-shadow:0 0 0 2px var(--lo);outline:none}.pi::placeholder{color:var(--txm);font-weight:400}
.pi-ta{min-height:70px;resize:vertical}
.pi-sel{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239b8faa' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .72rem center;padding-right:2rem}
body.liq-dark .pi{background-color:var(--wh);color:var(--tx);border-color:var(--bdr)}
/* iOS Safari zooms in on focus when font-size < 16px. Bump up on touch devices
   to prevent the jarring zoom-on-tap on every form input across the app. */
@media (max-width:767px){
  .pi,.lex-inp,input[type="text"],input[type="number"],input[type="email"],input[type="password"],input[type="search"],input[type="tel"],input[type="url"],input[type="date"],textarea,select{font-size:16px}
}
/* Touch-target minimums — Apple HIG / WCAG 2.5.5 recommend 44×44px. Bump small
   interactive controls up on phone so tapping isn't a precision exercise. */
@media (max-width:767px){
  .az-btn{min-width:2.5rem;height:2.5rem;font-size:.85rem}
  .filter-btn{padding:.55rem 1rem;font-size:.85rem;min-height:2.5rem}
  .cat-tab{padding:.55rem 1rem;font-size:.82rem;min-height:2.5rem}
  .esa-tab{padding:.6rem 1rem;font-size:.88rem;min-height:2.5rem}
  .mod-tab{padding:.7rem .6rem;font-size:.88rem;min-height:2.75rem}
  .tool-mobile-back{padding:.55rem .9rem;font-size:.85rem;min-height:2.5rem}
  .tool-mobile-bar-icon{width:2.5rem;height:2.5rem;font-size:1rem}
}
/* Modal mobile fixes — prevent the fixed bottom mobile-nav from clipping the
   sticky modal footer. Cap modal max-height below 100vh and lock background
   scroll while a modal is open so the user can't accidentally scroll the
   page underneath. Uses :has() (Safari 15.4+, Chrome 105+, Firefox 121+). */
@media (max-width:991px){
  .admin-modal,.dl-modal,.cf-modal{max-height:calc(100dvh - 5rem);padding-bottom:1.5rem}
  .search-overlay{padding:3vh 1rem 5rem}
  .search-modal{max-height:calc(100dvh - 7rem)}
  .admin-modal-overlay{padding-bottom:4.5rem}
}
/* Body-scroll lock when a modal is open. The :has() form works on modern
   browsers (Chrome 105+, Safari 15.4+, Firefox 121+); the .modal-open
   fallback is toggled by a MutationObserver in 06-nav-router.js for
   older browsers. Either selector triggers the lock. */
body:has(.admin-modal-overlay.open),body:has(.search-overlay.open),body.modal-open{overflow:hidden;touch-action:none}
/* Narrow-phone polish — components that need to reflow under ~480px so the
   3-column daily card stops cramping, the call bubble doesn't overflow on
   long words/URLs, and the tool grid uses a clean single column. */
@media (max-width:480px){
  .daily-home-card{flex-direction:column;align-items:stretch;gap:.85rem;padding:1.1rem 1.2rem;text-align:center}
  .daily-home-card>div:first-child{display:flex;align-items:center;justify-content:center;gap:.6rem}
  .daily-home-card .daily-streak-flame{font-size:1.4rem}
  .daily-home-card .daily-streak-count{font-size:1.4rem;display:inline}
  .daily-home-card .daily-streak-lbl{display:inline}
  .daily-home-info{text-align:left}
  .tool-grid{grid-template-columns:1fr;gap:.6rem}
  .daily-call-bubble-msg{word-break:break-word;hyphens:auto;-webkit-hyphens:auto}
  .daily-call-bubble-hd{flex-wrap:wrap}
  .daily-stats-cta::before,.daily-stats-cta::after{display:none}
}

/* ── ACCOMMODATION OPTIONS ──────────────────────────────── */
.acc-opt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.42rem;margin:.42rem 0 .82rem}
.acc-chip{border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.42rem .68rem;cursor:pointer;font-family:var(--fb);font-size:.8rem;font-weight:600;color:var(--txs);display:flex;align-items:center;gap:.38rem;transition:all .2s;background:var(--wh)}
.acc-chip:hover{border-color:var(--lo);color:var(--lo-h)}.acc-chip.on{border-color:var(--ok);background:var(--ok-l);color:var(--ok)}

/* ── INVESTIGATION ──────────────────────────────────────── */
.wit-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:.42rem;align-items:start;margin-bottom:.42rem}
.wit-del{background:none;border:1.5px solid var(--bdr);border-radius:var(--rs);width:1.9rem;height:2.1rem;cursor:pointer;color:var(--er);display:flex;align-items:center;justify-content:center;transition:all .2s}
.wit-del:hover{background:var(--er-l);border-color:var(--er)}
.wit-add{border:1.5px dashed var(--bdr);background:transparent;border-radius:var(--rs);padding:.42rem .88rem;font-family:var(--fb);font-size:.8rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.35rem;margin-top:.22rem}
.wit-add:hover{border-color:var(--lo);color:var(--lo-h);background:var(--lo-p)}
.inv-badge{display:inline-flex;align-items:center;gap:.35rem;border:2px solid var(--bdr);border-radius:var(--rs);padding:.42rem .95rem;cursor:pointer;font-family:var(--fb);font-size:.85rem;font-weight:700;color:var(--txs);transition:all .2s;background:var(--wh);margin:.18rem}
.inv-badge:hover{border-color:var(--lo)}
.inv-badge.fb-yes{border-color:var(--ok);background:var(--ok-l);color:var(--ok)}
.inv-badge.fb-partial{border-color:var(--wa);background:var(--wa-l);color:var(--wa)}
.inv-badge.fb-no{border-color:var(--er);background:var(--er-l);color:var(--er)}


/* ── DOCUMENT TEMPLATE LIBRARY ─────────────────────────── */
.tmpl-nav{display:flex;gap:.42rem;flex-wrap:wrap;margin-bottom:1.35rem}
.tmpl-btn{border:1.5px solid var(--bdr);background:var(--wh);border-radius:var(--rs);padding:.38rem .82rem;font-family:var(--fb);font-size:.79rem;font-weight:700;color:var(--txs);cursor:pointer;transition:all .2s}
.tmpl-btn:hover{border-color:var(--lo);color:var(--lo-h)}
.tmpl-btn.active{background:var(--lp);border-color:var(--lp);color:#fff}
.tmpl-header{background:var(--lp-t);border:1px solid rgba(43,58,103,.12);border-radius:var(--r);padding:1rem 1.2rem;margin-bottom:1.1rem}
.tmpl-header h5{font-family:var(--fd);font-size:1.05rem;color:var(--heading);margin-bottom:.22rem}
.tmpl-header p{font-size:.82rem;color:var(--txs);margin:0}
.tmpl-guidance{font-size:.82rem;color:var(--txs);background:var(--wa-l);border-left:3px solid var(--wa);border-radius:0 var(--rs) var(--rs) 0;padding:.65rem .9rem;margin-bottom:1rem;line-height:1.55}
.tmpl-body{background:var(--g100);border:1px solid var(--bdr);border-radius:var(--r);padding:1.4rem 1.65rem;font-family:Georgia,serif;font-size:.9rem;line-height:1.85;color:var(--tx);white-space:pre-wrap;word-break:break-word}
body.liq-dark .tmpl-body{background:var(--g100);color:var(--tx)}
.tmpl-placeholder{background:rgba(214,93,134,.18);color:var(--lo-h);border-radius:2px;padding:0 .18rem;font-style:normal}
.tmpl-copy-bar{display:flex;align-items:center;justify-content:space-between;margin-top:.85rem;flex-wrap:wrap;gap:.5rem}
.tmpl-note{font-size:.76rem;color:var(--txm)}

/* ── RETURN-TO-WORK PLANNER ─────────────────────────────── */
.rtw-phase-row{display:grid;grid-template-columns:auto 1fr 1fr auto;gap:.45rem;align-items:start;margin-bottom:.45rem}
.rtw-phase-lbl{font-size:.79rem;font-weight:700;color:var(--txs);padding-top:.52rem;white-space:nowrap}
.rtw-del{background:none;border:1.5px solid var(--bdr);border-radius:var(--rs);width:1.85rem;height:2.1rem;cursor:pointer;color:var(--er);display:flex;align-items:center;justify-content:center;transition:all .2s}
.rtw-del:hover{background:var(--er-l);border-color:var(--er)}
.rtw-add{border:1.5px dashed var(--bdr);background:transparent;border-radius:var(--rs);padding:.4rem .85rem;font-family:var(--fb);font-size:.79rem;font-weight:700;color:var(--txm);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.35rem;margin-top:.2rem}
.rtw-add:hover{border-color:var(--lo);color:var(--lo-h);background:var(--lo-p)}

/* ── STRIKE PREPAREDNESS ────────────────────────────────── */
.strike-cat{margin-bottom:1.6rem}
.strike-cat-hdr{display:flex;align-items:center;gap:.65rem;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:2px solid var(--bdr)}
.strike-cat-icon{width:2.1rem;height:2.1rem;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.strike-cat-title{font-family:var(--fd);font-size:1rem;color:var(--heading)}
.strike-item{border:1px solid var(--bdr);border-radius:var(--rs);margin-bottom:.42rem;overflow:hidden;background:var(--wh)}
.strike-item.done{border-color:var(--ok);background:var(--ok-l)}
.strike-item-top{display:flex;align-items:flex-start;gap:.65rem;padding:.72rem .92rem;cursor:pointer}
.strike-item.done .strike-item-top{background:var(--ok-l)}
.strike-check{width:1.1rem;height:1.1rem;border:2px solid var(--bdr);border-radius:3px;flex-shrink:0;margin-top:.18rem;display:flex;align-items:center;justify-content:center;transition:all .2s}
.strike-item.done .strike-check{background:var(--ok);border-color:var(--ok);color:#fff}
.strike-item-text{flex:1}
.strike-item-label{font-size:.89rem;font-weight:700;color:var(--tx)}
.strike-item-sub{font-size:.77rem;color:var(--txm);margin-top:.1rem}
.strike-notes-wrap{display:none;padding:.45rem .92rem .72rem 2.65rem}
.strike-item.open .strike-notes-wrap{display:block}
.strike-progress{display:flex;align-items:center;gap:.65rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.65rem 1rem;margin-bottom:1.25rem}
.strike-prog-bar{flex:1;height:7px;background:var(--g100);border-radius:99px;overflow:hidden}
.strike-prog-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .4s}


/* ── WSIB TOOL ───────────────────────────────────────────── */
.wsib-phase-tabs{display:flex;gap:0;background:var(--g100);border-radius:var(--r) var(--r) 0 0;border:1px solid var(--bdr);border-bottom:none;padding:.3rem .3rem 0;margin-bottom:0}
.wsib-phase-tab{flex:1;border:none;background:transparent;font-family:var(--fb);font-size:.84rem;font-weight:700;padding:.62rem .5rem;border-radius:var(--rs) var(--rs) 0 0;cursor:pointer;color:var(--txs);display:flex;align-items:center;justify-content:center;gap:.38rem;transition:all .2s}
.wsib-phase-tab:hover{background:rgba(255,255,255,.7)}
.wsib-phase-tab.active{background:var(--wh);color:var(--lp)}
body.liq-dark .wsib-phase-tab.active{color:var(--tx)}
.wsib-phase-panel{display:none;background:var(--wh);border:1px solid var(--bdr);border-radius:0 0 var(--rl) var(--rl);padding:1.75rem}
.wsib-phase-panel.active{display:block}
.wsib-fact-card{background:var(--lp);color:#fff;border-radius:var(--r);padding:1.1rem 1.3rem;margin-bottom:1.25rem}
.wsib-fact-card-title{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lo);margin-bottom:.65rem}
.wsib-fact-row{display:flex;gap:.65rem;align-items:flex-start;margin-bottom:.42rem;font-size:.83rem;color:rgba(255,255,255,.85);line-height:1.5}
.wsib-fact-row i{color:var(--lo);flex-shrink:0;margin-top:.15rem}
.wsib-timed-section{margin-bottom:1.5rem}
.wsib-timed-label{display:inline-flex;align-items:center;gap:.42rem;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.22rem .65rem;border-radius:2rem;margin-bottom:.72rem}
.wt-immed{background:var(--er-l);color:var(--er)}
.wt-24h{background:var(--wa-l);color:var(--wa)}
.wt-72h{background:var(--inf-l);color:var(--inf)}
.wt-ongoing{background:var(--ok-l);color:var(--ok)}
.wsib-check-item{border:1px solid var(--bdr);border-radius:var(--rs);margin-bottom:.38rem;background:var(--wh);overflow:hidden}
.wsib-check-item.done{border-color:var(--ok)}
.wsib-check-top{display:flex;align-items:flex-start;gap:.62rem;padding:.68rem .88rem;cursor:pointer}
.wsib-check-item.done .wsib-check-top{background:var(--ok-l)}
.wsib-cbox{width:1.1rem;height:1.1rem;border:2px solid var(--bdr);border-radius:3px;flex-shrink:0;margin-top:.18rem;display:flex;align-items:center;justify-content:center;transition:all .2s}
.wsib-check-item.done .wsib-cbox{background:var(--ok);border-color:var(--ok);color:#fff}
.wsib-check-item-text{flex:1}
.wsib-check-label{font-size:.88rem;font-weight:700;color:var(--tx)}
.wsib-check-sub{font-size:.76rem;color:var(--txm);margin-top:.08rem;line-height:1.45}
.wsib-check-expand{display:none;padding:.45rem .88rem .68rem 2.6rem}
.wsib-check-item.open .wsib-check-expand{display:block}
.wsib-objection-ground{border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.72rem .92rem;margin-bottom:.48rem;cursor:pointer;transition:all .2s;background:var(--wh)}
.wsib-objection-ground:hover{border-color:var(--lo);background:var(--lo-p)}
.wsib-objection-ground.selected{border-color:var(--lp);background:var(--lp-t)}
.wsib-objection-ground-title{font-size:.88rem;font-weight:700;color:var(--tx);display:flex;align-items:center;gap:.5rem}
.wsib-objection-ground.selected .wsib-objection-ground-title{color:var(--lp)}
.wsib-objection-ground-desc{font-size:.78rem;color:var(--txm);margin-top:.2rem;line-height:1.5;display:none}
.wsib-objection-ground.selected .wsib-objection-ground-desc{display:block;color:var(--txs)}
.wsib-deadline-banner{background:var(--er-l);border:2px solid var(--er);border-radius:var(--r);padding:.85rem 1.1rem;display:flex;align-items:center;gap:.75rem;margin-bottom:1.1rem}
.wsib-deadline-banner i{color:var(--er);font-size:1.25rem;flex-shrink:0}
.wsib-deadline-text{font-size:.87rem;font-weight:700;color:var(--er)}
.wsib-deadline-sub{font-size:.77rem;color:var(--txs);font-weight:400}
.wsib-progress-row{display:flex;align-items:center;gap:.62rem;padding:.55rem 0;border-bottom:1px solid var(--bdr)}
.wsib-progress-row:last-child{border-bottom:none}
.wsib-prog-dot{width:.75rem;height:.75rem;border-radius:50%;flex-shrink:0}
.wp-done{background:var(--ok)}.wp-pend{background:var(--g200)}.wp-risk{background:var(--er)}


/* ── A-Z LETTER BAR ─────────────────────────────────────── */
.az-bar{display:flex;gap:.22rem;flex-wrap:wrap;margin:.65rem 0 .55rem;align-items:center}
.az-btn{min-width:1.9rem;height:1.9rem;border:1.5px solid var(--bdr);background:var(--wh);border-radius:var(--rs);font-family:var(--fb);font-size:.77rem;font-weight:800;cursor:pointer;color:var(--txs);display:flex;align-items:center;justify-content:center;transition:all .15s;padding:0;line-height:1;position:relative}
.az-btn:hover:not(.az-empty){border-color:var(--lo);color:var(--lo-h);background:var(--lo-p)}
.az-btn.az-active{background:var(--lp);border-color:var(--lp);color:#fff}
.az-btn.az-empty{opacity:.28;cursor:default;pointer-events:none}
.az-btn .az-count{position:absolute;top:-5px;right:-5px;background:var(--lo);color:#fff;font-size:.55rem;font-weight:800;border-radius:99px;min-width:.95rem;height:.95rem;display:none;align-items:center;justify-content:center;padding:0 .18rem;line-height:1}
.az-btn:hover .az-count{display:flex}
.az-sep{width:1px;height:1.1rem;background:var(--bdr);margin:0 .12rem;flex-shrink:0}
.az-all-btn{padding:0 .65rem;min-width:auto;font-size:.72rem;letter-spacing:.04em}

/* ── ACTIVE FILTER SUMMARY ──────────────────────────────── */
.lex-filters{display:none;align-items:center;gap:.38rem;flex-wrap:wrap;margin-bottom:.65rem;padding:.48rem .75rem;background:var(--lo-p);border:1px solid var(--lo-l);border-radius:var(--rs)}
.lex-filters.show{display:flex}
.lex-filter-pill{display:inline-flex;align-items:center;gap:.3rem;background:var(--wh);border:1px solid var(--lo);border-radius:2rem;padding:.18rem .55rem .18rem .65rem;font-size:.75rem;font-weight:700;color:var(--lo-h)}
.lex-filter-pill-x{background:none;border:none;cursor:pointer;color:var(--lo);font-size:.85rem;line-height:1;padding:0;margin-left:.1rem;display:flex;align-items:center}
.lex-filter-pill-x:hover{color:var(--lo-h)}
.lex-filter-clear{background:none;border:none;cursor:pointer;font-size:.75rem;font-weight:700;color:var(--txm);text-decoration:underline;padding:0;margin-left:auto}
.lex-filter-clear:hover{color:var(--tx)}
.lex-filter-label{font-size:.75rem;font-weight:700;color:var(--txm);white-space:nowrap}

/* ── LETTER SECTION DIVIDERS ────────────────────────────── */
.lex-letter-div{display:flex;align-items:center;gap:.75rem;margin:1.1rem 0 .55rem;cursor:pointer}
.lex-letter-div:hover .lex-letter-badge{background:var(--lo);border-color:var(--lo);color:#fff}
.lex-letter-badge{width:2.1rem;height:2.1rem;border-radius:50%;background:var(--lp);border:2px solid var(--lp);color:#fff;font-family:var(--fd);font-size:1rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.lex-letter-div-line{flex:1;height:1px;background:var(--bdr)}
.lex-letter-count{font-size:.75rem;font-weight:700;color:var(--txm);white-space:nowrap}

/* ── RECENTLY VIEWED ────────────────────────────────────── */
.lex-recent{margin-bottom:1rem}
.lex-recent-title{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.65rem}
.lex-recent-item{display:flex;align-items:center;gap:.55rem;padding:.42rem 0;border-bottom:1px solid var(--bdr);cursor:pointer;transition:color .15s}
.lex-recent-item:last-child{border-bottom:none}
.lex-recent-item:hover .lex-recent-name{color:var(--lo-h)}
.lex-recent-name{font-size:.84rem;font-weight:600;color:var(--tx);flex:1;transition:color .15s}
.lex-recent-cat{font-size:.66rem;font-weight:700;padding:.1rem .38rem;border-radius:2px}

/* ── SEARCH KEYBOARD HINT ───────────────────────────────── */
.lex-search-hint{position:absolute;right:.9rem;top:50%;transform:translateY(-50%);background:var(--g100);border:1px solid var(--bdr);border-radius:3px;font-size:.68rem;font-weight:700;color:var(--txm);padding:.1rem .38rem;pointer-events:none}
body.liq-dark .lex-search-hint{background:var(--g200)}


/* ── TERMINATION TOOL ───────────────────────────────────── */
.term-tool-tabs{display:flex;gap:0;background:var(--g100);border-radius:var(--r) var(--r) 0 0;border:1px solid var(--bdr);border-bottom:none;padding:.3rem .3rem 0;margin-bottom:0}
.term-tool-tab{flex:1;border:none;background:transparent;font-family:var(--fb);font-size:.83rem;font-weight:700;padding:.62rem .5rem;border-radius:var(--rs) var(--rs) 0 0;cursor:pointer;color:var(--txs);display:flex;align-items:center;justify-content:center;gap:.38rem;transition:all .2s}
.term-tool-tab:hover{background:rgba(255,255,255,.7)}
.term-tool-tab.active{background:var(--wh);color:var(--lp)}
body.liq-dark .term-tool-tab.active{color:var(--tx)}
.term-tool-panel{display:none;background:var(--wh);border:1px solid var(--bdr);border-radius:0 0 var(--rl) var(--rl);padding:1.75rem}
.term-tool-panel.active{display:block}
.term-fact-card{background:var(--lp);color:#fff;border-radius:var(--r);padding:1.1rem 1.3rem;margin-bottom:1.25rem}
.term-fact-title{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lo);margin-bottom:.65rem}
.term-fact-row{display:flex;gap:.65rem;align-items:flex-start;margin-bottom:.42rem;font-size:.83rem;color:rgba(255,255,255,.85);line-height:1.5}
.term-fact-row i{color:var(--lo);flex-shrink:0;margin-top:.15rem}
.term-timed-label{display:inline-flex;align-items:center;gap:.42rem;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.22rem .65rem;border-radius:2rem;margin-bottom:.72rem}
.tt-immed{background:var(--er-l);color:var(--er)}
.tt-24h{background:var(--wa-l);color:var(--wa)}
.tt-5d{background:var(--inf-l);color:var(--inf)}
.tt-ongoing{background:var(--ok-l);color:var(--ok)}
.term-section-title{font-family:var(--fd);font-size:1rem;color:var(--heading);margin-bottom:.25rem;margin-top:1.25rem}
.term-section-title:first-child{margin-top:0}
.term-section-sub{font-size:.82rem;color:var(--txs);margin-bottom:.85rem}
.term-dont-item{display:flex;gap:.65rem;align-items:flex-start;padding:.55rem .75rem;background:var(--er-l);border-radius:var(--rs);margin-bottom:.38rem;font-size:.86rem;color:var(--tx)}
.term-dont-item i{color:var(--er);flex-shrink:0;margin-top:.15rem}
.term-do-item{display:flex;gap:.65rem;align-items:flex-start;padding:.55rem .75rem;background:var(--ok-l);border-radius:var(--rs);margin-bottom:.38rem;font-size:.86rem;color:var(--tx)}
.term-do-item i{color:var(--ok);flex-shrink:0;margin-top:.15rem}


/* ── LOGIN PAGE ──────────────────────────────────────────── */
.liq-login-page{
  min-height:100vh;background:#0d0812;
  display:flex;align-items:center;justify-content:center;
  padding:2rem 1rem;position:relative;overflow:hidden;
}
/* WebGL constellation canvas — full-bleed, behind the card (js/46). */
.login-fx-canvas{
  position:absolute;inset:0;width:100%;height:100%;display:block;
  z-index:0;pointer-events:none;
}
/* Framing vignette so the card reads clearly over the animated field. */
.liq-login-page::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 40%,rgba(13,8,18,.55) 100%);
}
.login-wrap{width:100%;max-width:440px;position:relative;z-index:2}
.login-logo-row{text-align:center;margin-bottom:2rem}
.login-card{
  background:rgba(22,14,34,.62);
  border:1px solid rgba(255,255,255,.12);
  border-radius:1.25rem;padding:2.25rem 2.25rem 2rem;
  box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
}
.login-title{
  font-family:'Playfair Display',Georgia,serif;
  font-size:1.55rem;font-weight:700;color:#e8e0f2;
  text-align:center;margin-bottom:.35rem;
}
.login-sub{font-size:.88rem;color:rgba(255,255,255,.45);text-align:center;margin-bottom:1.75rem}
.login-field{margin-bottom:1.1rem}
.login-label{display:block;font-size:.8rem;font-weight:700;color:rgba(255,255,255,.82);margin-bottom:.35rem;letter-spacing:.04em}
.login-inp{
  width:100%;background:rgba(255,255,255,.055);border:1.5px solid rgba(255,255,255,.12);
  border-radius:.65rem;padding:.72rem 1rem;
  font-family:'Nunito',system-ui,sans-serif;font-size:.95rem;
  color:#e8e0f2;outline:none;transition:border-color .2s,box-shadow .2s,background .2s;
}
.login-inp:hover{border-color:rgba(255,255,255,.22)}
.login-inp:focus{border-color:#d65d86;box-shadow:0 0 0 3px rgba(214,93,134,.28);background:rgba(255,255,255,.08);outline:none}
.login-inp::placeholder{color:rgba(255,255,255,.5);font-weight:400}
.login-btn{
  width:100%;background:#d65d86;border:none;border-radius:.65rem;
  padding:.82rem;font-family:'Nunito',system-ui,sans-serif;
  font-size:1rem;font-weight:800;color:#fff;cursor:pointer;
  transition:all .2s;margin-top:.35rem;
  display:flex;align-items:center;justify-content:center;gap:.5rem;
}
.login-btn{box-shadow:0 8px 24px rgba(214,93,134,.32);animation:login-btn-glow 3.4s ease-in-out infinite}
.login-btn:hover{background:#c04971;transform:translateY(-1px);box-shadow:0 12px 32px rgba(214,93,134,.5)}
.login-btn:active{transform:translateY(0)}
.login-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;animation:none}
@keyframes login-btn-glow{0%,100%{box-shadow:0 8px 24px rgba(214,93,134,.28)}50%{box-shadow:0 10px 30px rgba(214,93,134,.5)}}
body.liq-reduced-motion .login-btn{animation:none}
.login-error{
  background:rgba(220,38,38,.18);border:1px solid rgba(220,38,38,.4);
  border-radius:.5rem;padding:.65rem .9rem;font-size:.86rem;
  color:#fca5a5;margin-bottom:.9rem;display:none;
  align-items:center;gap:.5rem;
}
.login-error.show{display:flex}
.login-admin-box{
  background:rgba(214,93,134,.1);border:1px solid rgba(214,93,134,.25);
  border-radius:.75rem;padding:1rem 1.15rem;margin-top:1.5rem;
}
.login-admin-title{
  font-size:.72rem;font-weight:800;text-transform:uppercase;
  letter-spacing:var(--ls-caps);color:#d65d86;margin-bottom:.55rem;
  display:flex;align-items:center;gap:.4rem;
}
.login-admin-row{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:.28rem;
}
.login-admin-row:last-child{margin-bottom:0}
.login-admin-key{font-size:.8rem;color:rgba(255,255,255,.45)}
.login-admin-val{
  font-size:.82rem;font-weight:700;color:#e8e0f2;
  font-family:monospace;background:rgba(255,255,255,.07);
  border-radius:4px;padding:.12rem .45rem;cursor:pointer;
  transition:background .15s;
}
.login-admin-val:hover{background:rgba(214,93,134,.2)}
.login-admin-hint{font-size:.73rem;color:rgba(255,255,255,.3);margin-top:.6rem}
.login-divider{border-color:rgba(255,255,255,.08);margin:1.5rem 0}

/* ── NAV AUTH AREA ───────────────────────────────────────── */
.nav-login-btn{
  display:flex;align-items:center;gap:.4rem;
  background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);
  border-radius:2rem;padding:.38rem 1.05rem;
  font-family:'Nunito',system-ui,sans-serif;font-size:.85rem;
  font-weight:700;color:#fff;cursor:pointer;transition:all .2s;
  white-space:nowrap;
}
.nav-login-btn:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.38)}

/* ── NAV USER DROPDOWN ───────────────────────────────────── */
.nav-user-wrap{position:relative;display:flex;align-items:center}
.nav-user-wrap .nav-xp{cursor:pointer}
.nav-user-dropdown{
  position:absolute;top:calc(100% + .25rem);right:0;
  background:#fff;border:1px solid var(--bdr);border-radius:var(--rl);
  box-shadow:var(--shl);min-width:240px;
  opacity:0;transform:translateY(-6px) scale(.97);
  pointer-events:none;transition:opacity .18s ease,transform .18s ease;
  z-index:var(--z-fab);overflow:hidden;padding-bottom:.25rem;
}
/* Invisible bridge fills the gap so the mouse doesn't leave the hover zone */
.nav-user-wrap::after{
  content:'';position:absolute;top:100%;left:0;right:0;height:.75rem;
}
.nav-user-wrap:hover .nav-user-dropdown,
.nav-user-wrap.open .nav-user-dropdown{
  opacity:1;transform:translateY(0) scale(1);pointer-events:all;
}
body.liq-dark .nav-user-dropdown{background:var(--wh);border-color:var(--bdr)}
.nav-user-header{
  padding:.82rem 1rem .7rem;border-bottom:1px solid var(--bdr);
}
.nav-user-name{font-size:.92rem;font-weight:800;color:var(--tx);line-height:1.25}
.nav-user-email{font-size:.74rem;color:var(--txm);margin-top:.12rem;word-break:break-all}
.nav-user-role{display:inline-block;font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.18rem .55rem;border-radius:99px;margin-top:.45rem;background:var(--g100);color:var(--txs)}
.nav-user-role.role-admin{background:var(--lp);color:#fff}
.nav-user-role.role-manager{background:var(--lo);color:#fff}
.nav-user-role.role-hr{background:#2563eb;color:#fff}
.nav-user-role.role-supervisor{background:#7c3aed;color:#fff}
.nav-user-role.role-learner{background:var(--ok);color:#fff}
.nav-user-section{padding:.4rem 0 .25rem;border-top:1px solid var(--bdr)}
.nav-user-section:first-of-type{border-top:none;padding-top:.25rem}
.nav-user-section-foot{border-top:1px solid var(--bdr);padding-top:.25rem;margin-top:.1rem}
.nav-user-section-hdr{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--g600);padding:.4rem 1rem .25rem}
body.liq-dark .nav-user-section-hdr{color:var(--g400)}
.nav-user-item{
  display:flex;align-items:center;gap:.62rem;
  padding:.55rem 1rem;font-size:.86rem;font-weight:600;
  color:var(--tx);cursor:pointer;transition:background .15s;border:none;
  background:transparent;width:100%;text-align:left;font-family:var(--fb);
}
.nav-user-item:hover{background:var(--g100)}
.nav-user-item i{color:var(--txm);font-size:.95rem;width:1rem;text-align:center;flex-shrink:0}
.nav-user-item.danger{color:var(--er)}
.nav-user-item.danger i{color:var(--er)}
.nav-user-item.danger:hover{background:var(--er-l)}
.nav-user-divider{border-color:var(--bdr);margin:0}


/* ── CASE LIBRARY ───────────────────────────────────────── */
.case-cat-tag{display:inline-flex;align-items:center;gap:.32rem;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.18rem .52rem;border-radius:3px}
/* Category tags — colour driven by --cat, contrast-safe in both modes via color-mix.
   Light: darken the hue for contrast on the pale tint. Dark: lighten toward white. */
.case-cat-tag,.lex-recent-cat,.lex-cat-chip{
  background:color-mix(in srgb, var(--cat, var(--lo)) 14%, transparent);
  color:color-mix(in srgb, var(--cat, var(--lo)) 70%, #140a1c);
}
body.liq-dark .case-cat-tag,body.liq-dark .lex-recent-cat,body.liq-dark .lex-cat-chip{
  background:color-mix(in srgb, var(--cat, var(--lo)) 26%, transparent);
  color:color-mix(in srgb, var(--cat, var(--lo)) 45%, #ffffff);
}
.case-diff{display:inline-flex;gap:.22rem;align-items:center;margin-left:.4rem}
.case-diff-dot{width:.52rem;height:.52rem;border-radius:50%;background:var(--g200)}
.case-diff-dot.on{background:var(--lo)}
.case-card-c{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.3rem 1.4rem;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;gap:.6rem;height:100%}
.case-card-c:hover{border-color:var(--lo);box-shadow:var(--shm);transform:translateY(-2px)}
.case-card-c.done{border-color:var(--ok)}
.case-card-year{font-size:.73rem;font-weight:700;color:var(--txm)}
.case-card-title{font-family:var(--fd);font-size:.98rem;color:var(--tx);line-height:1.4;font-weight:700}
.case-card-sum{font-size:.81rem;color:var(--txs);line-height:1.55;flex:1}
.case-card-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
.case-xp-chip{font-size:.72rem;font-weight:800;background:var(--lo-l);color:var(--lo-h);border-radius:3px;padding:.12rem .42rem}
.case-xp-chip.earned{background:var(--ok-l);color:var(--ok)}
/* ── CASES FILTER BAR — three-zone redesign ────────────────────
   Zone 1: Hero search (full-width, prominent)
   Zone 2: Quick-preset chips on left + Sort dropdown on right
   Zone 3: Boxed filter panel with 6 uniform dropdowns + active-filter bar
   Goal: clear hierarchy, consistent visual language (chips for shortcuts,
   dropdowns for filters), single landing place for the eye. */
.case-filter-bar{display:flex;flex-direction:column;gap:.85rem;margin-bottom:1.5rem;width:100%}

/* ── Zone 1 — Hero search (larger, more prominent) ── */
.case-search-wrap{position:relative;width:100%;max-width:640px}
.case-search-ico{position:absolute;left:1.05rem;top:50%;transform:translateY(-50%);color:var(--txm);font-size:1.05rem;pointer-events:none}
.case-search-input{width:100%;border:1.5px solid var(--bdr);background:var(--wh);border-radius:2rem;padding:.72rem 2.6rem .72rem 2.7rem;font-family:var(--fb);font-size:.94rem;color:var(--tx);transition:border-color .15s,box-shadow .15s,background-color .15s;font-weight:500}
.case-search-input:hover{border-color:var(--g400)}
.case-search-input:focus{outline:none;border-color:var(--lo);box-shadow:0 0 0 4px rgba(214,93,134,.15)}
.case-search-input::placeholder{color:var(--txm);font-weight:400}
.case-search-clear{position:absolute;right:.65rem;top:50%;transform:translateY(-50%);background:transparent;border:0;padding:.28rem .45rem;color:var(--txm);cursor:pointer;border-radius:50%;font-size:.82rem;transition:background .15s,color .15s}
.case-search-clear:hover{background:var(--g100);color:var(--tx)}

/* ── Zone 2 — Quick presets + Sort row ── */
.case-quickrow{display:flex;align-items:flex-start;gap:.85rem;flex-wrap:wrap;justify-content:space-between}
.case-presets-row{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;flex:1;min-width:0}
.case-presets-empty{display:none}
.case-sort-wrap{display:flex;align-items:center;gap:.45rem;flex-shrink:0}
.case-sort-ico{color:var(--txm);font-size:.92rem}
.case-sort-select{min-width:170px}

/* ── Zone 3 — Filter panel (boxed) ── */
.case-filter-panel{background:var(--g100);border:1px solid var(--bdr);border-radius:var(--rl);padding:.85rem 1rem}
.case-filter-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.5rem}
.case-filter-active{margin-top:.7rem;padding-top:.65rem;border-top:1px dashed var(--bdr);display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
.case-filter-active-lbl{font-size:.78rem;font-weight:700;color:var(--lo-h);display:inline-flex;align-items:center;gap:.35rem}
.case-filter-active-lbl>i{font-size:.85rem}
.case-filter-clearall{background:transparent;border:1.5px solid var(--er);color:var(--er);font-family:var(--fb);font-size:.76rem;font-weight:700;padding:.28rem .75rem;border-radius:2rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:.3rem}
.case-filter-clearall:hover{background:var(--er-l);color:var(--er)}
.case-filter-clearall>i{font-size:.85rem}

/* Uniform dropdown styling — used by all filter selects + the sort
   select. Native <select> for keyboard a11y; visual weight matches
   the chips above. */
.case-filter-select{
  width:100%;border:1.5px solid var(--bdr);background-color:var(--wh);
  border-radius:2rem;padding:.42rem 2.1rem .42rem 1rem;
  font-family:var(--fb);font-size:.82rem;font-weight:600;color:var(--tx);
  cursor:pointer;transition:border-color .15s,box-shadow .15s;
  /* Tell the browser the closed control matches the page's color scheme,
     so the OPEN dropdown list (which is browser-native) renders with the
     same light/dark scheme as the rest of the page. Without this hint,
     Chrome/Edge sometimes pick the OS preference instead of the app's
     theme, causing the dropdown list to flash light when the page is
     dark (the bug that looked like "theme reverts after selection"). */
  color-scheme:light;
  /* Custom dropdown chevron — single source so all selects look identical
     across browsers. Light-mode SVG (brand purple chevron); dark-mode
     override below uses a lighter version so it remains visible against
     the dark dropdown surface. */
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%235a4866'><path d='M3.204 5.04 8 9.836l4.796-4.796.708.708L8 11.252 2.496 5.748z'/></svg>");
  background-repeat:no-repeat;background-position:right .7rem center;background-size:.85rem;
}
.case-filter-select:hover{border-color:var(--g400)}
.case-filter-select:focus{outline:none;border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.15)}
/* Visual hint when a select has been changed away from default — softer
   colored border so the eye picks out which filters are set without
   needing to read each value. */
.case-filter-select.is-active{border-color:var(--lo);background-color:var(--lo-p)}
/* Dark-mode chevron + color-scheme. Without these, the open dropdown
   list inherits the system preference instead of the app's dark theme,
   producing the "theme flips on selection" perception. Explicit
   background-color + color overrides act as defense in depth in case
   any browser auto-dark-mode override is interfering. */
body.liq-dark .case-filter-select{
  color-scheme:dark;
  background-color:var(--wh);
  color:var(--tx);
  border-color:var(--bdr);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23c0b0d0'><path d='M3.204 5.04 8 9.836l4.796-4.796.708.708L8 11.252 2.496 5.748z'/></svg>");
}
/* Explicit <option> styling for the OPEN dropdown list. Some browsers
   (Chrome 122+) honour these, and Firefox always has — together with
   color-scheme this makes the open list render the same dark surface as
   the closed control. */
body.liq-dark .case-filter-select option{
  background-color:#1e1530;
  color:#e8e0f2;
}
body.liq-dark .case-filter-select.is-active{
  background-color:rgba(214,93,134,.18);
  border-color:var(--lo);
}

/* Legacy pill-button class kept for any straggler callers; unused after
   the three-zone redesign but left to avoid breakage if referenced
   elsewhere. */
.case-filter-btn{border:1.5px solid var(--bdr);background:var(--wh);border-radius:2rem;padding:.32rem .82rem;font-family:var(--fb);font-size:.78rem;font-weight:700;color:var(--txs);cursor:pointer;transition:all .2s}
.case-filter-btn:hover{border-color:var(--lo);color:var(--lo-h)}
.case-filter-btn.active{background:var(--lp);border-color:var(--lp);color:#fff}

@media (max-width:600px){
  .case-quickrow{flex-direction:column;align-items:stretch}
  .case-sort-wrap{justify-content:flex-end}
  .case-filter-panel{padding:.7rem .75rem}
  .case-filter-row{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.4rem}
}
/* Download Brief PDF button — sits in the case detail meta line. Pushed to
   the right via margin-left:auto so it floats opposite the category/year
   chips. Subtle until hover; the orange icon hints at the brand-anchored
   download action. */
.case-brief-btn{margin-left:auto;display:inline-flex;align-items:center;gap:.4rem;background:transparent;border:1.5px solid var(--bdr);color:var(--txs);font-family:var(--fb);font-size:.78rem;font-weight:700;padding:.32rem .85rem;border-radius:2rem;cursor:pointer;transition:all .15s;white-space:nowrap}
.case-brief-btn:hover{border-color:var(--lo);color:var(--lo-h);background:var(--lo-l)}
.case-brief-btn i{color:var(--lo);font-size:.92rem}
@media (max-width:560px){.case-brief-btn{margin-left:0;width:100%;justify-content:center;margin-top:.4rem}}
/* Track-level connected-cases panel inside the Academy track expansion.
   Sits below the modules list with the track's accent colour as a left
   border, so the panel reads as belonging to its track without competing
   with the modules visually. */
.track-cases-panel{margin:.5rem .85rem 1rem;background:var(--bg);border-radius:var(--rs);padding:.7rem .9rem;border-left:3px solid var(--lo)}
.track-cases-hdr{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.78rem;font-weight:700;color:var(--txs);margin-bottom:.55rem}
.track-cases-hdr>i{color:var(--lo);font-size:.95rem}
.track-cases-viewall{margin-left:auto;font-size:.74rem;color:var(--lo);font-weight:700;text-decoration:none;white-space:nowrap}
.track-cases-viewall:hover{color:var(--lo-h);text-decoration:underline}
.track-case-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.track-case-chip{display:inline-flex;align-items:center;gap:.4rem;background:var(--wh);border:1px solid var(--bdr);border-radius:2rem;padding:.22rem .65rem .22rem .35rem;font-size:.76rem;font-weight:700;color:var(--tx);cursor:pointer;transition:border-color .15s,box-shadow .15s;max-width:100%}
.track-case-chip:hover{border-color:var(--lo);box-shadow:0 1px 4px rgba(214,93,134,.18)}
.track-case-chip-yr{display:inline-block;font-size:.66rem;font-weight:800;letter-spacing:.04em;padding:.1rem .42rem;border-radius:99px}
@media (max-width:600px){
  .track-cases-panel{margin:.4rem .55rem .85rem;padding:.6rem .7rem}
  .track-cases-viewall{margin-left:0}
}
.liq-dark .track-cases-panel{background:var(--g100)}
.liq-dark .track-case-chip{background:var(--wh)}

/* ── Quick-filter preset chips ─────────────────────────────────
   Saved-search shortcuts above the dropdown row. Active state uses the
   brand purple background to telegraph "this is set". Clear button only
   visible when a preset is active. */
.case-presets-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.6rem;align-items:center}
.case-preset-chip{display:inline-flex;align-items:center;gap:.35rem;border:1.5px solid var(--bdr);background:var(--wh);color:var(--txs);font-family:var(--fb);font-size:.78rem;font-weight:700;padding:.32rem .85rem;border-radius:2rem;cursor:pointer;transition:all .15s;white-space:nowrap}
.case-preset-chip:hover{border-color:var(--lo);color:var(--lo-h)}
.case-preset-chip.active{background:var(--lp);border-color:var(--lp);color:#fff}
.case-preset-chip i{font-size:.86rem}
.case-preset-chip.active i{color:var(--lo)}
.case-preset-clear{background:transparent;border:0;color:var(--er);font-size:.74rem;font-weight:700;padding:.32rem .65rem;cursor:pointer;border-radius:2rem;display:inline-flex;align-items:center;gap:.3rem}
.case-preset-clear:hover{background:var(--er-l)}

/* ── Citation copy button ─────────────────────────────────────
   Sits inline at the end of the citation text. Subtle by default; the
   hover treatment hints it's interactive. Clipboard icon flashes briefly
   on click via the toast feedback. */
.case-detail-citation{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.case-cite-text{flex:1;min-width:0}
.case-cite-copy{background:transparent;border:0;color:var(--txm);cursor:pointer;padding:.2rem .45rem;border-radius:var(--rs);transition:background .15s,color .15s;font-size:.85rem;flex-shrink:0}
.case-cite-copy:hover{background:var(--g100);color:var(--lo-h)}

/* ── Recommended next case panel ──────────────────────────────
   Shown below the Connected To section after the user has decided a case.
   Strong orange accent + clear CTA so the engagement loop continues. */
.case-next-rec{margin:1.1rem 0;background:linear-gradient(135deg,var(--wh) 0%,var(--lo-p) 100%);border:1.5px solid var(--lo);border-radius:var(--rl);padding:1rem 1.2rem;cursor:pointer;transition:transform .15s,box-shadow .15s;position:relative}
.case-next-rec:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(214,93,134,.18)}
.case-next-eyebrow{display:flex;align-items:center;gap:.4rem;font-family:var(--fd);font-size:.74rem;font-weight:700;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo-h);margin-bottom:.55rem}
.case-next-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.4rem}
.case-next-yr{font-size:.74rem;color:var(--txm);font-weight:700}
.case-next-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);line-height:1.3;margin-bottom:.3rem}
.case-next-sum{font-size:.85rem;color:var(--txs);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:.65rem}
.case-next-cta{font-size:.83rem;font-weight:700;color:var(--lo-h);display:inline-flex;align-items:center;gap:.3rem}
.case-next-rec:hover .case-next-cta{color:var(--lo)}

/* ── Card status indicators ───────────────────────────────────
   Coloured left border at-a-glance status. Priority: correct (green) >
   wrong-but-studied (orange) > bookmarked-only (purple) > unread (subtle).
   Status badge in top-right replaces the previous bare check icon and
   carries an icon that distinguishes correct vs studied-wrong. */
.case-card-c{border-left:4px solid var(--bdr);transition:border-color .15s,box-shadow .15s}
.case-card-c.case-card-correct{border-left-color:var(--ok)}
.case-card-c.case-card-wrong{border-left-color:var(--lo)}
.case-card-c.case-card-bm{border-left-color:var(--lp)}
.case-card-c.case-card-unread{border-left-color:var(--bdr)}
.case-card-status{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:50%;font-size:.72rem;flex-shrink:0}
.case-card-status-ok{background:var(--ok-l);color:var(--ok)}
.case-card-status-wrong{background:var(--lo-l);color:var(--lo-h)}

/* ── Print-friendly view ──────────────────────────────────────
   When the user prints a case-detail page (Ctrl+P), strip all chrome and
   present a clean printable brief. The Download Brief PDF button produces
   a professional product; this is the quick browser-print fallback that
   still produces something usable. */
@media print{
  /* Hide global chrome */
  .lnav,.a11y-wrap,.toast-box,.mob-nav,.lu-overlay,.sm-overlay,
  .search-overlay,.admin-modal-overlay,.cs-grid,.case-spotlight,
  .case-related-chip,.case-brief-btn,.case-cite-copy,.bm-btn,
  .case-decision-opt,.case-reveal,.back-btn,.daily-stats-cta,
  /* hide list-view chrome when printing the detail */
  .case-filter-bar,#cases-list-view,
  /* hide notes panel toggle UI */
  .mod-notes-hdr,.case-next-rec{display:none!important}
  /* Force the detail page open and remove background tints */
  body{background:white!important;color:#000!important}
  .liq-page{display:block!important}
  .liq-page:not(.active){display:none!important}
  .case-detail-wrap{max-width:100%!important;margin:0!important}
  .case-section{background:white!important;border:0!important;box-shadow:none!important;padding:.75rem 0!important;page-break-inside:avoid}
  .case-section-label{color:#000!important;font-weight:800;border-bottom:1px solid #999;padding-bottom:.25rem;margin-bottom:.45rem}
  .case-detail-title{color:#000!important}
  .case-section-body{color:#000!important}
  .case-detail-citation{color:#666!important}
  /* Avoid orphaned headings */
  .case-section-label,.case-detail-hdr{page-break-after:avoid}
  /* Disable the section's "locked" notice — only printed when not done */
  a{color:#000!important;text-decoration:none!important}
}
/* Case Spotlight — reverse cross-link from a module reader or tool back into
   the Case Library. Shows the landmark cases that illustrate the doctrine
   the user is currently studying. Two tonal variants distinguish module
   placement (orange, learning context) from tool placement (purple, applied
   context) without affecting either parent's primary palette. */
.case-spotlight{margin:1.5rem 0;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.1rem 1.3rem;box-shadow:var(--sh)}
.case-spotlight.cs-tone-spotlight{border-left:4px solid var(--lo)}
.case-spotlight.cs-tone-applied{border-left:4px solid #7c3aed}
.cs-eyebrow{font-family:var(--fd);font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--lp);margin-bottom:.7rem;display:flex;align-items:center;gap:.4rem}
.cs-tone-applied .cs-eyebrow{color:#7c3aed}
.cs-tone-spotlight .cs-eyebrow{color:var(--lo-h)}
.cs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem}
.cs-item{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);padding:.75rem .85rem;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.cs-item:hover{border-color:var(--lo);box-shadow:var(--sh);transform:translateY(-1px)}
.cs-item-meta{display:flex;align-items:center;gap:.45rem;margin-bottom:.35rem;flex-wrap:wrap}
.cs-item-year{font-size:.7rem;color:var(--txm);font-weight:700}
.cs-item-title{font-family:var(--fd);font-size:.92rem;font-weight:700;color:var(--heading);line-height:1.3;margin-bottom:.25rem}
.cs-item-sum{font-size:.78rem;color:var(--txs);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cs-more{margin-top:.7rem;text-align:right;font-size:.8rem}
.cs-more a{color:var(--lo);font-weight:700}
.cs-more a:hover{color:var(--lo-h)}
.tool-case-spotlight-mount{margin-top:1rem}
.liq-dark .case-spotlight{background:var(--wh)}
.liq-dark .cs-item{background:var(--g100)}

/* Case detail */
.case-detail-wrap{max-width:820px;margin:0 auto}
.case-detail-hdr{margin-bottom:1.5rem}
.case-detail-title{font-family:var(--fd);font-size:1.55rem;color:var(--heading);margin-bottom:.35rem;line-height:1.3}
.case-detail-meta{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;margin-bottom:.65rem}
.case-detail-citation{font-size:.82rem;color:var(--txm);font-style:italic}
.case-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.5rem;margin-bottom:1rem}
.case-section-label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--lo);margin-bottom:.6rem;display:flex;align-items:center;gap:.38rem}
.case-section-body{font-size:.93rem;color:var(--tx);line-height:1.75}
.case-decision-opt{border:2px solid var(--bdr);background:var(--wh);border-radius:var(--r);padding:.88rem 1.1rem;cursor:pointer;font-family:var(--fb);font-size:.92rem;color:var(--tx);display:flex;gap:.75rem;transition:all .2s;margin-bottom:.52rem;text-align:left;width:100%;align-items:flex-start}
.case-decision-opt:hover{border-color:var(--lo);background:var(--lo-p)}
.case-decision-opt.selected-correct{border-color:var(--ok);background:var(--ok-l)}
.case-decision-opt.selected-wrong{border-color:var(--er);background:var(--er-l)}
.case-decision-opt.reveal-correct{border-color:var(--ok);background:var(--ok-l)}
.case-decision-opt.locked{cursor:default;pointer-events:none}
.case-opt-id{width:1.65rem;height:1.65rem;border-radius:50%;background:var(--g100);border:1.5px solid var(--bdr);font-size:.78rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.08rem;transition:all .2s}
.case-decision-opt.selected-correct .case-opt-id{background:var(--ok);border-color:var(--ok);color:#fff}
.case-decision-opt.selected-wrong .case-opt-id{background:var(--er);border-color:var(--er);color:#fff}
.case-decision-opt.reveal-correct .case-opt-id{background:var(--ok);border-color:var(--ok);color:#fff}
.case-reveal{border-radius:var(--r);padding:1.1rem 1.3rem;margin-top:.75rem;display:none}
.case-reveal.show{display:block}
.case-reveal-correct{background:var(--ok-l);border:2px solid var(--ok)}
.case-reveal-wrong{background:var(--er-l);border:2px solid var(--er)}
.case-related-chip{display:inline-flex;align-items:center;gap:.38rem;background:var(--g100);border:1px solid var(--bdr);border-radius:var(--rs);padding:.32rem .72rem;font-size:.79rem;font-weight:700;color:var(--txs);cursor:pointer;transition:all .2s;margin:.2rem}
.case-related-chip:hover{border-color:var(--lo);color:var(--lo-h);background:var(--lo-p)}
.cases-empty{text-align:center;padding:3rem;color:var(--txm)}


/* ── CASE LIBRARY ADDITIONS ─────────────────────────────── */
.case-reveal-correct{background:var(--ok-l);border:1.5px solid var(--ok);border-radius:var(--r);padding:.9rem 1.1rem;margin-top:.85rem}
.case-reveal-wrong{background:var(--er-l);border:1.5px solid var(--er);border-radius:var(--r);padding:.9rem 1.1rem;margin-top:.85rem}
.case-verdict{border-radius:var(--r);padding:1.1rem 1.3rem;margin-bottom:1.25rem}
.case-verdict-go{background:var(--ok-l);border:2px solid var(--ok)}
.case-verdict-warn{background:var(--wa-l);border:2px solid var(--wa)}
.case-verdict-stop{background:var(--er-l);border:2px solid var(--er)}

body.liq-dark .case-section-label{color:var(--lo)!important}
body.liq-dark .case-detail-title{color:var(--tx)}
body.liq-dark .case-section-body{color:var(--txs)}


/* ── PERSONALISED HOME DASHBOARD ────────────────────────── */
.home-greeting{padding:2rem 0 0}
.home-greeting-name{font-family:var(--fd);font-size:1.75rem;color:var(--heading);font-weight:700;margin-bottom:.15rem}
.home-greeting-sub{font-size:.93rem;color:var(--txs)}

/* Dashboard cards */
.hd-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.4rem 1.5rem;height:100%}
.hd-streak-card{border:1px solid;border-radius:var(--rl);padding:1.4rem 1.5rem;height:100%;cursor:pointer;transition:filter .25s,box-shadow .25s;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.hd-streak-card:hover{filter:brightness(1.12);box-shadow:0 0 0 3px rgba(255,255,255,.08)}
.hd-streak-flame{font-size:2rem;line-height:1;margin-bottom:.2rem}
.hd-streak-num{font-size:2.6rem;font-weight:700;line-height:1;font-family:var(--fd)}
.hd-streak-label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:rgba(255,255,255,.45);margin-bottom:.65rem}
.hd-streak-divider{width:100%;height:1px;background:rgba(255,255,255,.08);margin-bottom:.65rem}
.hd-streak-done{font-size:.78rem;font-weight:700;color:#4ade80;display:flex;align-items:center;gap:.35rem}
.hd-streak-pending{font-size:.78rem;font-weight:700;padding:.28rem .75rem;background:rgba(255,255,255,.08);border-radius:2rem;border:1px solid}
.hd-streak-best{font-size:.68rem;color:rgba(255,255,255,.3);margin-top:.5rem}
/* ── Tier animations ── */
/* Palette matches STREAK_TIERS in js/01: navy (--lp #2b3a67) warming into rose
   (--lo #d65d86). Previously violet/purple/electric-blue/indigo/gold — Labour
   IQ's world, inherited with the engine and never re-skinned. */
/* t1: soft navy breathe */
@keyframes skt1-breathe{0%,100%{filter:drop-shadow(0 0 4px rgba(111,134,201,.4))}50%{filter:drop-shadow(0 0 10px rgba(111,134,201,.9))}}
.skt-1 .hd-streak-flame{animation:skt1-breathe 3s ease-in-out infinite}
/* t2: pulsing navy glow */
@keyframes skt2-pulse{0%,100%{filter:drop-shadow(0 0 6px rgba(143,164,224,.5))}50%{filter:drop-shadow(0 0 16px rgba(143,164,224,1)) drop-shadow(0 0 28px rgba(143,164,224,.4))}}
.skt-2 .hd-streak-flame{animation:skt2-pulse 2.5s ease-in-out infinite}
/* t3: rose flicker — the accent takes over from the navy */
@keyframes skt3-flicker{0%,100%{filter:drop-shadow(0 0 6px rgba(214,93,134,.6))}25%{filter:drop-shadow(0 0 18px rgba(214,93,134,1)) drop-shadow(0 0 34px rgba(214,93,134,.4))}50%{filter:drop-shadow(0 0 4px rgba(214,93,134,.3))}75%{filter:drop-shadow(0 0 20px rgba(214,93,134,.9))}}
.skt-3 .hd-streak-flame{animation:skt3-flicker 1.8s ease-in-out infinite}
/* t4: rose arc — lightning cycling */
@keyframes skt4-arc{0%{filter:drop-shadow(0 0 8px rgba(214,93,134,.7)) drop-shadow(-3px 0 6px rgba(214,93,134,.4))}33%{filter:drop-shadow(0 0 22px rgba(214,93,134,1)) drop-shadow(3px 0 12px rgba(240,167,192,.6)) drop-shadow(0 0 40px rgba(214,93,134,.3))}66%{filter:drop-shadow(0 0 6px rgba(214,93,134,.4)) drop-shadow(-2px 2px 8px rgba(214,93,134,.5))}100%{filter:drop-shadow(0 0 8px rgba(214,93,134,.7)) drop-shadow(3px 0 6px rgba(214,93,134,.4))}}
@keyframes skt4-bg{0%,100%{box-shadow:inset 0 0 30px rgba(214,93,134,.04)}50%{box-shadow:inset 0 0 50px rgba(214,93,134,.12)}}
.skt-4 .hd-streak-flame{animation:skt4-arc 1.4s linear infinite}
.skt-4{animation:skt4-bg 2.8s ease-in-out infinite}
/* t5: Super IQ — rose supernova with a white-hot core */
@keyframes skt5-saiyan{0%{filter:drop-shadow(0 0 10px rgba(255,158,187,.8)) drop-shadow(0 0 20px rgba(214,93,134,.5))}20%{filter:drop-shadow(0 0 26px rgba(255,158,187,1)) drop-shadow(0 0 52px rgba(214,93,134,.8)) drop-shadow(0 0 70px rgba(255,255,255,.3))}40%{filter:drop-shadow(0 0 6px rgba(255,158,187,.5))}60%{filter:drop-shadow(0 0 22px rgba(255,158,187,.9)) drop-shadow(0 0 44px rgba(214,93,134,.7)) drop-shadow(2px 0 16px rgba(255,255,255,.2))}80%{filter:drop-shadow(0 0 8px rgba(255,158,187,.4))}100%{filter:drop-shadow(0 0 10px rgba(255,158,187,.8)) drop-shadow(0 0 20px rgba(214,93,134,.5))}}
@keyframes skt5-bg{0%,100%{box-shadow:inset 0 0 40px rgba(214,93,134,.05)}50%{box-shadow:inset 0 0 70px rgba(214,93,134,.18),0 0 24px rgba(214,93,134,.08)}}
.skt-5 .hd-streak-flame{animation:skt5-saiyan .9s ease-in-out infinite}
.skt-5{animation:skt5-bg 1.8s ease-in-out infinite}
.skt-5:hover{box-shadow:0 0 0 3px rgba(214,93,134,.25)!important}
.hd-card-label{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--txm);margin-bottom:.55rem}
.hd-level-icon{font-size:2.4rem;line-height:1;margin-bottom:.4rem}
.hd-level-name{font-family:var(--fd);font-size:1.18rem;font-weight:700;color:var(--heading);margin-bottom:.12rem}
.hd-level-sub{font-size:.8rem;color:var(--txm);margin-bottom:.75rem}
.hd-xp-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.3rem}
.hd-xp-label{font-size:.78rem;color:var(--txs);font-weight:600}
.hd-xp-val{font-size:.78rem;font-weight:800;color:var(--lo)}
.hd-xp-bar{height:7px;background:var(--g100);border-radius:4px;overflow:hidden}
.hd-xp-fill{height:100%;background:linear-gradient(90deg,var(--lp),var(--lo));border-radius:4px;transition:width .4s ease}
.hd-ach-row{margin-top:.8rem;font-size:.8rem;color:var(--txs)}
.hd-ach-row span{font-weight:800;color:var(--tx)}

/* Continue learning card */
.hd-continue-mod{background:var(--g100);border-radius:var(--r);padding:.85rem 1rem;margin-bottom:.55rem}
.hd-mod-track{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.2rem}
.hd-mod-title{font-size:.93rem;font-weight:700;color:var(--tx);margin-bottom:.18rem;line-height:1.4}
.hd-mod-meta{font-size:.77rem;color:var(--txm)}
.hd-next-suggestion{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.52rem .75rem;margin-top:.5rem;background:var(--g100);border:1px solid var(--bdr);border-radius:var(--rs);cursor:pointer;transition:border-color .15s}
.hd-next-suggestion:hover{border-color:var(--lo)}
.hd-complete-badge{display:inline-flex;align-items:center;gap:.4rem;background:var(--ok-l);color:var(--ok);font-size:.81rem;font-weight:700;padding:.42rem .75rem;border-radius:2rem}

/* Cases progress card */
.hd-cases-prog{display:flex;align-items:center;gap:1rem;margin-top:.5rem}
.hd-cases-circle{position:relative;width:72px;height:72px;flex-shrink:0}
.hd-cases-circle svg{transform:rotate(-90deg)}
.hd-cases-circle-inner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column}
.hd-cases-num{font-size:1.2rem;font-weight:800;color:var(--tx);line-height:1}
.hd-cases-denom{font-size:.65rem;color:var(--txm);font-weight:600}
.hd-cases-right{flex:1}
.hd-cases-title{font-size:.9rem;font-weight:700;color:var(--tx);margin-bottom:.2rem}
.hd-cases-sub{font-size:.8rem;color:var(--txs)}
/* Case of the Week — replaces the static Case Library card. Spotlights one
   featured case (rotated by week index) with a clickable preview and CTA. */
.hd-cotw-card{background:var(--wh);border:1px solid var(--bdr);border-left:4px solid var(--lo);border-radius:var(--rl);padding:1.05rem 1.25rem;cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .15s;height:100%;display:flex;flex-direction:column;gap:.45rem}
.hd-cotw-card:hover{border-color:var(--lo);box-shadow:var(--shm)}
.hd-cotw-eyebrow{font-family:var(--fd);font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--lo-h)}
.hd-cotw-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.hd-cotw-year{font-size:.74rem;color:var(--txm);font-weight:700}
.hd-cotw-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);line-height:1.3}
.hd-cotw-sum{font-size:.84rem;color:var(--txs);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hd-cotw-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;margin-top:auto}
.hd-cotw-progress{font-size:.72rem;color:var(--txm);font-weight:700}
.hd-cotw-progress a{color:var(--lo);font-weight:700}
.liq-dark .hd-cotw-card{background:var(--wh)}

/* Track progress */
.hd-track-row{display:flex;align-items:center;gap:.75rem;margin-bottom:.85rem}
.hd-track-row:last-child{margin-bottom:0}
.hd-track-icon{width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.88rem}
.hd-track-info{flex:1;min-width:0}
.hd-track-name{font-size:.83rem;font-weight:700;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.2rem}
.hd-track-bar{height:5px;background:var(--g100);border-radius:3px;overflow:hidden}
.hd-track-fill{height:100%;border-radius:3px;transition:width .4s ease}
.hd-track-count{font-size:.75rem;font-weight:700;color:var(--txm);flex-shrink:0;min-width:2.5rem;text-align:right}

/* Activity feed */
.hd-activity-item{display:flex;align-items:flex-start;gap:.65rem;padding:.55rem 0;border-bottom:1px solid var(--bdr)}
.hd-activity-item:last-child{border-bottom:none}
.hd-activity-dot{width:8px;height:8px;border-radius:50%;background:var(--lo);flex-shrink:0;margin-top:.38rem}
.hd-activity-label{flex:1;font-size:.84rem;color:var(--tx);line-height:1.4}
.hd-activity-xp{font-size:.75rem;font-weight:700;color:var(--ok);white-space:nowrap}
.hd-activity-time{font-size:.72rem;color:var(--txm);white-space:nowrap}
.hd-empty{text-align:center;padding:1.5rem 1rem;color:var(--txm);font-size:.88rem}

/* Welcome state (no data yet) */
.hd-welcome-card{background:linear-gradient(135deg,var(--lp),#5b2d8e);border-radius:var(--rl);padding:2rem 2.25rem;color:#fff;margin-bottom:1.5rem}
.hd-welcome-title{font-family:var(--fd);font-size:1.35rem;font-weight:700;margin-bottom:.4rem}
.hd-welcome-sub{font-size:.9rem;color:rgba(255,255,255,.75);margin-bottom:1.25rem;line-height:1.6}
.hd-welcome-steps{display:flex;flex-direction:column;gap:.55rem;margin-bottom:1.5rem}
.hd-welcome-step{display:flex;align-items:center;gap:.75rem;font-size:.88rem;color:rgba(255,255,255,.85)}
.hd-welcome-step-num{width:1.6rem;height:1.6rem;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;flex-shrink:0}


/* ── GLOBAL SEARCH ──────────────────────────────────────── */
.search-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(3px);
  z-index:var(--z-modal);display:none;align-items:flex-start;justify-content:center;
  padding:6vh 1rem 2rem;
}
.search-overlay.open{display:flex}
.search-modal{
  width:100%;max-width:640px;background:var(--wh);
  border-radius:var(--rl);box-shadow:0 32px 80px rgba(0,0,0,.3);
  overflow:hidden;display:flex;flex-direction:column;max-height:80vh;
}
.search-input-row{
  display:flex;align-items:center;gap:.75rem;
  padding:.9rem 1.15rem;border-bottom:1px solid var(--bdr);
}
.search-input-icon{color:var(--txm);font-size:1.1rem;flex-shrink:0}
.search-input{
  flex:1;border:none;outline:none;background:transparent;
  font-family:var(--fb);font-size:1rem;color:var(--tx);
}
.search-input::placeholder{color:var(--txm)}
.search-kbd{
  font-size:.7rem;font-family:monospace;background:var(--g100);
  border:1px solid var(--bdr);border-radius:4px;padding:.12rem .38rem;
  color:var(--txm);white-space:nowrap;cursor:pointer;flex-shrink:0;
}
.search-results{overflow-y:auto;flex:1}
.search-group-label{
  font-size:.67rem;font-weight:800;text-transform:uppercase;
  letter-spacing:var(--ls-caps-wide);color:var(--txm);
  padding:.7rem 1.15rem .3rem;background:var(--g100);
  border-bottom:1px solid var(--bdr);position:sticky;top:0;z-index:1;
}
.search-result-item{
  display:flex;align-items:center;gap:.85rem;
  padding:.75rem 1.15rem;cursor:pointer;transition:background .12s;
  border-bottom:1px solid var(--bdr);
}
.search-result-item:last-child{border-bottom:none}
.search-result-item:hover,.search-result-item.active{background:var(--g100)}
.search-result-icon{
  width:2.1rem;height:2.1rem;border-radius:.5rem;
  display:flex;align-items:center;justify-content:center;
  font-size:.9rem;flex-shrink:0;
}
.sri-module{background:rgba(37,99,235,.1);color:#2563eb}
.sri-lexicon{background:rgba(245,158,11,.1);color:#d97706}
.sri-case{background:rgba(124,58,237,.1);color:#7c3aed}
.sri-tool{background:rgba(22,163,74,.1);color:#16a34a}
.search-result-body{flex:1;min-width:0}
.search-result-title{
  font-size:.9rem;font-weight:700;color:var(--tx);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  margin-bottom:.12rem;
}
.search-result-sub{
  font-size:.78rem;color:var(--txs);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.search-result-sub em{font-style:normal;color:var(--lo);font-weight:700}
.search-result-badge{
  font-size:.67rem;font-weight:700;padding:.15rem .45rem;
  border-radius:2rem;white-space:nowrap;flex-shrink:0;
}
.srb-module{background:rgba(37,99,235,.1);color:#2563eb}
.srb-lexicon{background:rgba(245,158,11,.1);color:#d97706}
.srb-case{background:rgba(124,58,237,.1);color:#7c3aed}
.srb-tool{background:rgba(22,163,74,.1);color:#16a34a}
.search-empty{
  text-align:center;padding:2.5rem 1rem;color:var(--txm);
}
.search-empty i{font-size:1.8rem;display:block;margin-bottom:.5rem;opacity:.4}
.search-empty strong{display:block;font-size:.9rem;color:var(--txs);margin-bottom:.25rem}
.search-empty span{font-size:.82rem}
.search-footer{
  padding:.55rem 1.15rem;border-top:1px solid var(--bdr);
  display:flex;gap:1rem;align-items:center;
  background:var(--g100);flex-shrink:0;
}
.search-footer-hint{display:flex;align-items:center;gap:.3rem;font-size:.72rem;color:var(--txm)}
.search-footer-hint kbd{
  font-size:.65rem;font-family:monospace;background:var(--wh);
  border:1px solid var(--bdr);border-radius:3px;padding:.08rem .28rem;color:var(--txs);
}
/* Nav search button */
.nav-search-btn{
  display:flex;align-items:center;gap:.4rem;
  background:rgba(255,255,255,.1);border:none;border-radius:.5rem;
  padding:.38rem .65rem;color:rgba(255,255,255,.75);
  cursor:pointer;transition:all .15s;font-size:.82rem;font-family:var(--fb);
}
.nav-search-btn:hover{background:rgba(255,255,255,.18);color:#fff}
.nav-search-btn kbd{
  font-family:monospace;font-size:.67rem;background:rgba(255,255,255,.15);
  border-radius:3px;padding:.08rem .28rem;color:rgba(255,255,255,.6);
  line-height:1.3;
}
body.liq-dark .search-modal{background:var(--wh)}


/* ── CERTIFICATE ─────────────────────────────────────────── */
.cert-banner{
  background:linear-gradient(135deg,#2b3a67 0%,#5b2d8e 60%,#d65d86 100%);
  border-radius:var(--rl);padding:2.25rem 2.5rem;margin-bottom:1.5rem;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1.5rem;
}
.cert-banner-left{}
.cert-banner-badge{
  display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(255,255,255,.15);border:1.5px solid rgba(255,255,255,.3);
  border-radius:2rem;padding:.3rem .85rem;font-size:.75rem;font-weight:700;
  color:rgba(255,255,255,.85);letter-spacing:var(--ls-caps);text-transform:uppercase;
  margin-bottom:.75rem;
}
.cert-banner-title{
  font-family:'Playfair Display',Georgia,serif;font-size:1.6rem;
  font-weight:700;color:#fff;margin-bottom:.4rem;
}
.cert-banner-sub{font-size:.92rem;color:rgba(255,255,255,.75);margin-bottom:1.25rem;line-height:1.6}
.cert-banner-code{
  font-family:monospace;font-size:.82rem;color:rgba(255,255,255,.55);
  letter-spacing:.08em;
}
.cert-banner-code span{color:rgba(255,255,255,.85);font-weight:700}
/* The limit on what the code shows, next to the code itself. On the banner the
   learner reads before downloading, not only on the admin panel they never
   see. Sits under the code and deliberately quieter than it. */
.cert-banner-note{font-size:.76rem;color:rgba(255,255,255,.62);line-height:1.55;
  margin-top:.4rem;max-width:52ch}
.cert-dl-btn{
  background:#d65d86;border:none;border-radius:.75rem;
  padding:.85rem 1.75rem;font-family:'Nunito',system-ui,sans-serif;
  font-size:.95rem;font-weight:800;color:#fff;cursor:pointer;
  transition:all .2s;display:flex;align-items:center;gap:.55rem;
  white-space:nowrap;flex-shrink:0;
}
.cert-dl-btn:hover{background:var(--lo-h);transform:translateY(-1px);box-shadow:0 6px 24px rgba(214,93,134,.4)}
.cert-dl-btn:active{transform:translateY(0)}
.cert-dl-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}


/* ── ADMIN PANEL ─────────────────────────────────────────── */
.admin-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);margin-bottom:1.5rem;overflow:hidden}
.admin-section-hdr{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.4rem;border-bottom:1px solid var(--bdr);background:var(--g100);flex-wrap:wrap;gap:.5rem}
.admin-section-title{font-family:var(--fd);font-size:1rem;font-weight:700;color:var(--heading);display:flex;align-items:center;gap:.5rem}
.admin-section-body{padding:1.4rem}
.admin-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;margin-bottom:1.5rem}
.admin-stat-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1.1rem 1.25rem;text-align:center}
.admin-stat-num{font-family:var(--fd);font-size:1.8rem;font-weight:700;color:var(--lp);line-height:1}
.admin-stat-lbl{font-size:.75rem;color:var(--txm);font-weight:600;margin-top:.25rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
body.liq-dark .admin-stat-num{color:var(--lo)}
.admin-table{width:100%;border-collapse:collapse;font-size:.88rem}
.admin-table th{background:var(--g100);padding:.65rem 1rem;text-align:left;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);border-bottom:1px solid var(--bdr)}
.admin-table td{padding:.72rem 1rem;border-bottom:1px solid var(--bdr);vertical-align:middle;color:var(--tx)}
.admin-table tr:last-child td{border-bottom:none}
.admin-table tr:hover td{background:var(--g100)}
.admin-role-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:800;padding:.2rem .55rem;border-radius:2rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.role-admin{background:rgba(124,58,237,.12);color:#7c3aed}
.role-manager{background:rgba(37,99,235,.12);color:#2563eb}
.role-hr{background:rgba(22,163,74,.12);color:#16a34a}
.role-supervisor{background:rgba(217,119,6,.12);color:#d97706}
.role-learner{background:rgba(100,100,100,.1);color:var(--txm)}
.admin-action-btn{border:none;background:transparent;cursor:pointer;padding:.28rem .45rem;border-radius:.35rem;font-size:.88rem;transition:background .15s;color:var(--tx)}
.admin-action-btn:hover{background:var(--g100)}
.admin-action-btn.danger:hover{background:var(--er-l);color:var(--er)}
.admin-status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:.4rem}
.dot-active{background:var(--ok)}
.dot-inactive{background:var(--bdr)}
.dot-archived{background:var(--wa)}
.perm-role-hdr{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);text-align:center;padding:.5rem .25rem}
.perm-check{width:20px;height:20px;border-radius:4px;border:1.5px solid var(--bdr);display:inline-flex;align-items:center;justify-content:center;font-size:.72rem}
.perm-check.on{background:var(--ok);border-color:var(--ok);color:#fff}
.perm-check.off{background:var(--wh);color:var(--bdr)}
.perm-check.locked{background:var(--g100);border-color:var(--bdr);color:var(--txm)}
.admin-log-item{display:flex;align-items:flex-start;gap:.75rem;padding:.6rem 0;border-bottom:1px solid var(--bdr)}
.admin-log-item:last-child{border-bottom:none}
.admin-log-user{font-size:.82rem;font-weight:700;color:var(--tx);min-width:120px;flex-shrink:0}
.admin-log-label{flex:1;font-size:.82rem;color:var(--txs)}
.admin-log-xp{font-size:.75rem;font-weight:700;color:var(--ok);white-space:nowrap}
.admin-log-time{font-size:.72rem;color:var(--txm);white-space:nowrap;min-width:60px;text-align:right}
/* ── ESA Quick-Calcs ── */
.esa-tabs{display:flex;gap:.3rem;margin-bottom:1rem;border-bottom:1px solid var(--bdr);padding-bottom:.55rem;flex-wrap:wrap}
.esa-tab{display:inline-flex;align-items:center;gap:.4rem;background:var(--wh);border:1px solid var(--bdr);color:var(--txs);font-size:.85rem;font-weight:700;padding:.45rem .85rem;border-radius:99px;cursor:pointer;font-family:var(--fb);transition:all .15s ease}
.esa-tab:hover{border-color:var(--lo);color:var(--lo)}
.esa-tab.active{background:var(--lp);border-color:var(--lp);color:#fff}
body.liq-dark .esa-tab{background:rgba(255,255,255,.04)}
body.liq-dark .esa-tab.active{background:var(--lo);border-color:var(--lo)}
.esa-intro{background:var(--g100);border-left:4px solid var(--lo);border-radius:6px;padding:.7rem .9rem;font-size:.85rem;color:var(--txs);line-height:1.55;margin-bottom:.85rem}
body.liq-dark .esa-intro{background:rgba(255,255,255,.04)}
.esa-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:.75rem;margin-bottom:.85rem}
.esa-field{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.7rem .85rem}
body.liq-dark .esa-field{background:rgba(255,255,255,.04)}
.esa-lbl{display:block;font-size:.78rem;font-weight:700;color:var(--heading);margin-bottom:.35rem}
.esa-help{font-size:.72rem;color:var(--txm);margin-top:.3rem;line-height:1.4}
.esa-result{background:linear-gradient(135deg,var(--ok-l),rgba(255,255,255,.7));border:2px solid var(--ok);border-radius:var(--r);padding:1rem 1.1rem;margin-top:1rem}
body.liq-dark .esa-result{background:rgba(22,163,74,.12)}
.esa-result-hd{display:flex;align-items:center;gap:.4rem;font-family:var(--fd);font-size:1rem;font-weight:700;color:var(--ok);margin-bottom:.85rem}
.esa-result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;margin-bottom:.85rem}
.esa-result-cell{background:var(--wh);border-radius:var(--r);padding:.65rem .85rem;text-align:center}
body.liq-dark .esa-result-cell{background:rgba(255,255,255,.06)}
.esa-result-num{font-family:var(--fd);font-size:1.3rem;font-weight:700;color:var(--lp);line-height:1.1}
.esa-result-num.esa-num-big{font-size:1.7rem;color:var(--ok)}
body.liq-dark .esa-result-num{color:var(--lo)}
body.liq-dark .esa-result-num.esa-num-big{color:#4ade80}
.esa-result-lbl{font-size:.7rem;font-weight:700;color:var(--txm);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-top:.25rem;line-height:1.3}
.esa-result-cell.esa-cell-highlight{background:var(--wa-l);border:1px solid var(--wa)}
.esa-result-cell.esa-cell-highlight .esa-result-num{color:var(--wa)}
.esa-result-detail{background:var(--wh);border-radius:var(--r);padding:.7rem .9rem;font-size:.83rem;color:var(--txs);line-height:1.55}
body.liq-dark .esa-result-detail{background:rgba(255,255,255,.04)}
.esa-detail-line{margin-bottom:.4rem}
.esa-detail-line:last-child{margin-bottom:0}
.esa-aux{background:var(--g100);border-radius:var(--r);padding:.7rem .9rem}
body.liq-dark .esa-aux{background:rgba(255,255,255,.04)}
.esa-aux-title{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.45rem}
.esa-aux-opts{display:flex;flex-direction:column;gap:.4rem}
.esa-aux-opt{font-size:.82rem;color:var(--txs);line-height:1.5}
.esa-foot{margin-top:.85rem;padding-top:.7rem;border-top:1px solid var(--bdr)}
/* ── Discipline Letter Generator ── */
.dl-modal{max-width:760px;width:100%;max-height:88vh;overflow-y:auto;padding:1.5rem 1.75rem 1.25rem}
.dl-modal-sub{font-size:.78rem;color:var(--txs);margin-top:-.4rem;margin-bottom:1rem;padding-bottom:.85rem;border-bottom:1px solid var(--bdr)}
.dl-type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.45rem}
.dl-type-card{display:flex;align-items:center;gap:.5rem;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--r);padding:.6rem .75rem;cursor:pointer;transition:all .15s ease}
.dl-type-card:hover{border-color:var(--lo)}
.dl-type-card input{margin:0;flex-shrink:0;accent-color:var(--lo)}
.dl-type-card.active{border-color:var(--lo);background:var(--lo-l)}
.dl-type-name{font-size:.82rem;font-weight:700;color:var(--tx);line-height:1.3}
body.liq-dark .dl-type-card{background:rgba(255,255,255,.04)}
body.liq-dark .dl-type-card.active{background:rgba(214,93,134,.16)}
/* Severity color stripe on left edge */
.dl-type-card.dl-sev-light{border-left:5px solid #16a34a}
.dl-type-card.dl-sev-moderate{border-left:5px solid #d97706}
.dl-type-card.dl-sev-serious{border-left:5px solid #dc2626}
.dl-type-card.dl-sev-critical{border-left:5px solid #7c0a0a}
.dl-type-card.dl-sev-critical .dl-type-name{color:#7c0a0a}
.dl-prefilled{font-size:.7rem;font-weight:600;color:var(--lo);text-transform:none;letter-spacing:0;margin-left:.4rem}
.dl-termination-warn{margin:.55rem 0 .85rem;border-left-width:5px}
.dl-badge{display:inline-flex;align-items:center;gap:.32rem;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);background:var(--lo-l);color:var(--lo-h);padding:.13rem .5rem;border-radius:99px;margin-left:.4rem;vertical-align:middle}
body.liq-dark .dl-badge{background:rgba(214,93,134,.18);color:var(--lo)}
.dl-badge i{font-size:.7rem}
.lib-act-btn.lib-act-dl{color:var(--lo-h)}
.lib-act-btn.lib-act-dl:hover{background:var(--lo);color:#fff;border-color:var(--lo)}
body.liq-dark .lib-act-btn.lib-act-dl{color:var(--lo)}
body.liq-dark .lib-act-btn.lib-act-dl:hover{background:var(--lo);color:#fff}
/* ── Case File modal + badge ── */
.cf-modal{max-width:720px;width:100%;max-height:88vh;overflow-y:auto;padding:1.5rem 1.75rem 1.25rem}
.cf-modal-sub{font-size:.78rem;color:var(--txs);margin-top:-.4rem;margin-bottom:1rem;padding-bottom:.85rem;border-bottom:1px solid var(--bdr)}
.cf-fieldgroup{background:var(--g100);border:1px solid var(--bdr);border-radius:var(--r);padding:.85rem 1rem;margin-bottom:.85rem}
body.liq-dark .cf-fieldgroup{background:rgba(255,255,255,.04)}
.cf-fg-title{font-family:var(--fb);font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lp);margin-bottom:.55rem;padding-bottom:.35rem;border-bottom:1px solid var(--bdr)}
body.liq-dark .cf-fg-title{color:var(--lo)}
.cf-lbl{display:block;font-size:.72rem;font-weight:700;color:var(--txm);margin-bottom:.2rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.cf-modal-foot{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;padding-top:1rem;margin-top:.3rem;border-top:1px solid var(--bdr);position:sticky;bottom:0;background:var(--wh);padding-bottom:.25rem;margin-bottom:-.5rem}
body.liq-dark .cf-modal-foot{background:var(--wh)}
/* Case-file badge that appears next to a snapshot once a case file has been generated */
.cf-badge{display:inline-flex;align-items:center;gap:.32rem;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);background:var(--lp-t);color:var(--lp);padding:.13rem .5rem;border-radius:99px;margin-left:.4rem;vertical-align:middle}
body.liq-dark .cf-badge{background:rgba(214,93,134,.18);color:var(--lo)}
.cf-badge i{font-size:.7rem}
/* Library item — case file button (purple to differentiate from Open/Delete) */
.lib-act-btn.lib-act-cf{color:var(--lp)}
.lib-act-btn.lib-act-cf:hover{background:var(--lp);color:#fff;border-color:var(--lp)}
body.liq-dark .lib-act-btn.lib-act-cf{color:var(--lo)}
body.liq-dark .lib-act-btn.lib-act-cf:hover{background:var(--lo);color:#fff;border-color:var(--lo)}
/* ── Track cheat-sheet button (Academy track header) ── */
.track-cheatsheet-btn{
  display:inline-flex;align-items:center;gap:.32rem;
  background:var(--lo-l);color:var(--lo-h);
  border:1px solid rgba(214,93,134,.35);border-radius:99px;
  font-size:.72rem;font-weight:700;font-family:var(--fb);
  padding:.22rem .65rem;cursor:pointer;
  margin-right:.4rem;white-space:nowrap;
  transition:background .15s,color .15s,border-color .15s;
}
.track-cheatsheet-btn:hover{background:var(--lo);color:#fff;border-color:var(--lo)}
.track-cheatsheet-btn i{font-size:.78rem}
body.liq-dark .track-cheatsheet-btn{background:rgba(214,93,134,.16);color:var(--lo);border-color:rgba(214,93,134,.4)}
body.liq-dark .track-cheatsheet-btn:hover{background:var(--lo);color:#fff}
@media (max-width:540px){
  /* On narrow screens hide the label, keep the icon — track header gets crowded */
  .track-cheatsheet-btn{padding:.28rem .45rem}
  .track-cheatsheet-btn i{font-size:.85rem}
  .track-cheatsheet-btn span,.track-cheatsheet-btn::after{display:none}
}
/* ── Lexicon "Also discussed in" chips (auto-derived) ── */
.lex-also-mods{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;margin-top:.7rem;padding-top:.6rem;border-top:1px dashed var(--bdr)}
.lex-also-lbl{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-right:.2rem}
.lex-also-chip{
  display:inline-flex;align-items:center;gap:.32rem;
  background:var(--g100);color:var(--lp);
  border:1px solid var(--bdr);border-radius:99px;
  font-size:.74rem;font-weight:700;
  padding:.18rem .55rem;cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;
}
.lex-also-chip:hover{background:var(--lo);color:#fff;border-color:var(--lo)}
.lex-also-chip i{font-size:.78rem}
body.liq-dark .lex-also-chip{background:rgba(255,255,255,.05);color:var(--lo)}
body.liq-dark .lex-also-chip:hover{background:var(--lo);color:#fff}
.lex-also-more{font-size:.72rem;color:var(--txm);font-weight:700;margin-left:.2rem}
/* ── Inline lexicon hover ── */
.lex-link{
  border-bottom:1px dotted var(--lo);
  cursor:help;
  color:inherit;
  transition:background .15s ease,border-color .15s ease;
  border-radius:2px;
  padding:0 1px;
}
.lex-link:hover,.lex-link:focus{
  background:var(--lo-l);
  border-bottom-color:var(--lo);
  border-bottom-style:solid;
  outline:none;
}
.lex-link:focus-visible{
  outline:2px solid var(--lo);
  outline-offset:2px;
}
body.liq-dark .lex-link:hover,body.liq-dark .lex-link:focus{
  background:rgba(214,93,134,.18);
}
.lex-popover{
  position:fixed;
  background:var(--wh);
  border:1px solid var(--bdr);
  border-radius:var(--r);
  box-shadow:0 8px 28px rgba(43,58,103,.16);
  padding:.85rem 1rem;
  max-width:360px;
  z-index:var(--z-mob-nav);
  font-family:var(--fb);
  line-height:1.5;
  animation:lexPopFade .14s ease-out;
}
body.liq-dark .lex-popover{background:var(--wh);border-color:var(--bdr);box-shadow:0 8px 28px rgba(0,0,0,.5)}
@keyframes lexPopFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.lex-pop-hd{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;flex-wrap:wrap}
.lex-pop-term{font-family:var(--fd);font-weight:700;color:var(--heading);font-size:.95rem;line-height:1.3;flex:1;min-width:0}
.lex-pop-cat{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.15rem .5rem;border-radius:99px}
.lex-pop-def{font-size:.85rem;color:var(--txs);line-height:1.55;margin-bottom:.55rem}
.lex-pop-foot{padding-top:.5rem;border-top:1px solid var(--bdr);text-align:right}
.lex-pop-cta{
  background:transparent;border:none;color:var(--lo);font-weight:700;font-size:.78rem;
  cursor:pointer;padding:.2rem .35rem;border-radius:4px;display:inline-flex;align-items:center;gap:.3rem;
}
.lex-pop-cta:hover{background:var(--lo-l);color:var(--lo-h)}
@media (max-width:639px){.lex-popover{max-width:calc(100vw - 24px)}}
/* ── User drill-down activity panel ── */
.user-activity-breakdown{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.6rem;padding-bottom:.55rem;border-bottom:1px solid var(--bdr)}
.user-activity-chip{display:inline-flex;align-items:center;gap:.32rem;font-size:.7rem;font-weight:800;padding:.18rem .55rem;border-radius:99px;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.user-activity-chip i{font-size:.78rem}
.user-activity-list{display:flex;flex-direction:column;gap:.18rem;margin-bottom:.55rem}
.user-activity-item{display:flex;align-items:flex-start;gap:.55rem;padding:.32rem 0;border-bottom:1px solid rgba(0,0,0,.04)}
.user-activity-item:last-child{border-bottom:none}
body.liq-dark .user-activity-item{border-bottom-color:rgba(255,255,255,.05)}
.user-activity-ico{width:1.5rem;height:1.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;flex-shrink:0;margin-top:.05rem}
.user-activity-bd{flex:1;min-width:0;display:flex;justify-content:space-between;align-items:flex-start;gap:.55rem;flex-wrap:wrap}
.user-activity-lbl{font-size:.81rem;color:var(--tx);line-height:1.4;flex:1;min-width:0;word-break:break-word}
.user-activity-time{font-size:.7rem;color:var(--txm);white-space:nowrap;flex-shrink:0}
.user-activity-foot{padding-top:.5rem;border-top:1px solid var(--bdr);text-align:center}
.user-activity-shown{display:block;font-size:.74rem;color:var(--txm);margin-bottom:.35rem}
/* ── Developer Tools (Settings tab) ── */
.dev-tools-group{margin-top:1.75rem;border:2px dashed var(--wa);border-radius:var(--rl);padding:1.1rem 1.25rem;background:linear-gradient(135deg,rgba(217,119,6,.04),rgba(214,93,134,.05))}
body.liq-dark .dev-tools-group{background:linear-gradient(135deg,rgba(217,119,6,.08),rgba(214,93,134,.08))}
.dev-tools-title{display:flex;align-items:center;gap:.45rem;color:var(--wa)!important}
.dev-tools-title i{font-size:1rem}
.dev-tools-badge{font-size:.62rem;font-weight:800;letter-spacing:.08em;background:var(--wa);color:#fff;padding:.18rem .55rem;border-radius:99px;margin-left:.4rem}
.dev-tools-warn{display:flex;align-items:flex-start;gap:.5rem;font-size:.8rem;color:var(--wa);background:var(--wa-l);border-radius:6px;padding:.55rem .8rem;margin:.55rem 0 1rem;line-height:1.5}
body.liq-dark .dev-tools-warn{background:rgba(217,119,6,.18)}
.dev-tools-section{margin-top:.85rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.85rem 1rem}
body.liq-dark .dev-tools-section{background:rgba(255,255,255,.04)}
.dev-tools-section-hdr{display:flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.6rem}
.dev-tools-section-hdr i{color:var(--lo);font-size:.9rem}
.dev-tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.5rem}
.dev-tools-grid .btn-liq{justify-content:flex-start;text-align:left;font-size:.83rem;padding:.5rem .8rem;display:flex;align-items:center;gap:.5rem}
.dev-tools-count{margin-left:auto;font-size:.7rem;font-weight:800;color:var(--txm);background:var(--g100);padding:.13rem .5rem;border-radius:99px;flex-shrink:0}
body.liq-dark .dev-tools-count{background:rgba(255,255,255,.06)}
.dev-tools-danger{color:var(--er)!important;border-color:var(--er-l)!important}
.dev-tools-danger:hover{background:var(--er-l)!important;color:var(--er)!important;border-color:var(--er)!important}
.dev-tools-nuke{background:var(--er)!important;color:#fff!important;border-color:var(--er)!important}
.dev-tools-nuke:hover{background:#b91c1c!important;border-color:#b91c1c!important}
.dev-tools-nuke .dev-tools-count{background:rgba(255,255,255,.2);color:#fff}
/* ── Audit Log actor filter ── */
.audit-actor-select{font-size:.82rem;padding:.32rem .65rem;max-width:240px;min-width:160px}
@media (max-width:767px){.audit-actor-select{max-width:none;width:100%}}
/* ── Path Templates summary card (Users tab) ── */
.tpl-summary-count{display:inline-block;font-family:var(--fb);font-size:.7rem;font-weight:800;background:var(--lp);color:#fff;padding:.13rem .5rem;border-radius:99px;margin-left:.4rem;text-transform:none;letter-spacing:0;line-height:1.4;vertical-align:middle}
body.liq-dark .tpl-summary-count{background:var(--lo)}
.tpl-summary-preview{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}
.tpl-summary-chip{display:inline-flex;align-items:center;background:var(--g100);color:var(--tx);font-size:.78rem;font-weight:600;padding:.32rem .65rem;border-radius:99px;border:1px solid var(--bdr)}
body.liq-dark .tpl-summary-chip{background:rgba(255,255,255,.05)}
.tpl-summary-more{font-size:.74rem;color:var(--txm);font-weight:700;padding:.22rem .55rem}
.tpl-summary-empty{display:flex;align-items:flex-start;gap:.7rem;color:var(--txs);font-size:.85rem;line-height:1.5}
.tpl-summary-empty i{font-size:1.3rem;color:var(--g400);flex-shrink:0;margin-top:.05rem}
/* ── Admin Users tab — search + sort polish ── */
.admin-search-wrap{position:relative;margin-bottom:.85rem}
.admin-search-input{width:100%;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.55rem 2.6rem .55rem 2.4rem;font-size:.9rem;font-family:var(--fb);color:var(--tx);transition:border-color .15s ease,box-shadow .15s ease}
.admin-search-input:focus{outline:none;border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.18)}
.admin-search-input::placeholder{color:var(--txm)}
body.liq-dark .admin-search-input{background:rgba(255,255,255,.04)}
.admin-search-ico{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--txm);font-size:.95rem;pointer-events:none}
.admin-search-clear{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);background:var(--g100);color:var(--txs);border:none;border-radius:50%;width:1.7rem;height:1.7rem;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.72rem;transition:all .15s ease}
.admin-search-clear:hover{background:var(--er);color:#fff}
/* Sortable column headers */
.admin-th-sortable{cursor:pointer;user-select:none;transition:background .15s ease}
.admin-th-sortable:hover{background:var(--g200)}
body.liq-dark .admin-th-sortable:hover{background:rgba(255,255,255,.06)}
.admin-th-active{color:var(--lp)!important;font-weight:800}
body.liq-dark .admin-th-active{color:var(--lo)!important}
.admin-sort-arrow{font-size:.7rem;margin-left:.18rem;color:var(--lp);vertical-align:.05em}
body.liq-dark .admin-sort-arrow{color:var(--lo)}
.admin-sort-arrow-inactive{color:var(--g400);opacity:.6}
.admin-th-sortable:hover .admin-sort-arrow-inactive{opacity:1}
/* Filter chips (search + site) */
.admin-filter-chip{display:inline-flex;align-items:center;font-size:.74rem;font-weight:700;color:var(--lo-h);background:var(--lo-l);border-radius:99px;padding:.18rem .55rem .18rem .65rem}
.admin-filter-chip-x{cursor:pointer;margin-left:.4rem;font-weight:800;font-size:.85rem;line-height:1;color:var(--lo-h);opacity:.7}
.admin-filter-chip-x:hover{opacity:1}
/* ── Onboarding 30-day plan ── */
.ob-banner{display:flex;align-items:center;gap:.85rem;background:linear-gradient(135deg,rgba(214,93,134,.1),rgba(43,58,103,.06));border:1.5px solid rgba(214,93,134,.4);border-radius:var(--r);padding:.85rem 1rem}
body.liq-dark .ob-banner{background:linear-gradient(135deg,rgba(214,93,134,.16),rgba(255,255,255,.03))}
.ob-banner-ico{width:2.4rem;height:2.4rem;border-radius:50%;background:var(--lo);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}
.ob-banner-body{flex:1;min-width:0}
.ob-banner-title{font-family:var(--fd);font-size:.98rem;font-weight:700;color:var(--heading);line-height:1.25}
.ob-banner-sub{font-size:.75rem;color:var(--txs);margin-top:.18rem}
.ob-banner-days{margin-left:.55rem;color:var(--lo);font-weight:700}
.ob-banner-bar{margin-top:.45rem;height:5px;background:rgba(0,0,0,.06);border-radius:99px;overflow:hidden;max-width:340px}
body.liq-dark .ob-banner-bar{background:rgba(255,255,255,.08)}
.ob-banner-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .4s ease}
.ob-banner-actions{display:flex;align-items:center;gap:.4rem;flex-shrink:0}
.ob-banner-dismiss{background:transparent;border:none;color:var(--txm);cursor:pointer;width:1.85rem;height:1.85rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:all .15s ease}
.ob-banner-dismiss:hover{background:rgba(0,0,0,.06);color:var(--tx)}
@media (max-width:639px){
  .ob-banner{flex-wrap:wrap}
  .ob-banner-actions{width:100%;justify-content:space-between}
}
.ob-prog-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.4rem 1.6rem;margin-bottom:1.5rem}
body.liq-dark .ob-prog-card{background:rgba(255,255,255,.04)}
.ob-prog-hd{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1rem;margin-bottom:.85rem}
.ob-prog-num{font-family:var(--fd);font-size:2rem;font-weight:700;color:var(--lp);line-height:1}
body.liq-dark .ob-prog-num{color:var(--lo)}
.ob-prog-denom{font-family:var(--fb);font-size:.95rem;font-weight:600;color:var(--txm)}
.ob-prog-pct{font-size:.85rem;color:var(--txs);margin-top:.3rem}
.ob-celebrate{font-family:var(--fd);font-size:1rem;font-weight:700;color:var(--ok);background:var(--ok-l);padding:.5rem .85rem;border-radius:99px;display:inline-flex;align-items:center;gap:.4rem}
.ob-prog-bar{height:8px;background:var(--g100);border-radius:99px;overflow:hidden;margin-bottom:1rem}
body.liq-dark .ob-prog-bar{background:rgba(255,255,255,.08)}
.ob-prog-fill{height:100%;background:linear-gradient(90deg,var(--lo),var(--lp));border-radius:99px;transition:width .4s ease}
.ob-prog-weeks{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem}
.ob-prog-week{padding:.5rem .75rem;background:var(--g100);border-radius:var(--r);text-align:center;border:1px solid transparent}
body.liq-dark .ob-prog-week{background:rgba(255,255,255,.04)}
.ob-prog-week-num{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm)}
.ob-prog-week-prog{font-size:.78rem;font-weight:700;color:var(--tx);margin-top:.2rem}
.ob-prog-week.ob-week-active{border-color:var(--lo);background:var(--lo-l)}
.ob-prog-week.ob-week-done{border-color:var(--ok);background:var(--ok-l)}
.ob-prog-week.ob-week-done .ob-prog-week-num,.ob-prog-week.ob-week-done .ob-prog-week-prog{color:var(--ok)}
.ob-week-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);overflow:hidden;margin-bottom:1.25rem}
body.liq-dark .ob-week-section{background:rgba(255,255,255,.04)}
.ob-week-section.ob-week-done{opacity:.85}
.ob-week-hdr{display:flex;align-items:center;gap:.85rem;padding:.95rem 1.25rem;background:var(--g100);border-bottom:1px solid var(--bdr);flex-wrap:wrap}
.ob-week-pill{font-family:var(--fb);font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:#fff;background:var(--lp);padding:.25rem .65rem;border-radius:99px}
body.liq-dark .ob-week-pill{background:var(--lo)}
.ob-week-section.ob-week-done .ob-week-pill{background:var(--ok)}
.ob-week-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);flex:1}
.ob-week-count{font-size:.85rem;font-weight:700;color:var(--txm)}
.ob-week-section.ob-week-done .ob-week-count{color:var(--ok)}
.ob-week-body{padding:.4rem .75rem .85rem}
.ob-step{display:flex;align-items:flex-start;gap:.85rem;padding:.95rem .75rem;border-bottom:1px solid var(--bdr)}
.ob-step:last-child{border-bottom:none}
.ob-step.done{opacity:.7}
.ob-step-ico{width:2.4rem;height:2.4rem;border-radius:50%;background:var(--lo-l);color:var(--lo-h);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0}
.ob-step.done .ob-step-ico{background:var(--ok-l);color:var(--ok)}
.ob-step-body{flex:1;min-width:0}
.ob-step-title{font-family:var(--fb);font-size:.98rem;font-weight:700;color:var(--heading);line-height:1.3}
.ob-step-desc{font-size:.83rem;color:var(--txs);line-height:1.55;margin-top:.25rem}
.ob-step-action{flex-shrink:0;align-self:center}
.ob-step-done{display:inline-flex;align-items:center;gap:.4rem;background:var(--ok-l);color:var(--ok);font-size:.78rem;font-weight:800;padding:.4rem .75rem;border-radius:99px}
@media (max-width:767px){
  .ob-step{flex-wrap:wrap}
  .ob-step-action{width:100%;margin-top:.4rem}
  .ob-step-cta,.ob-step-done{width:100%;justify-content:center}
  .ob-prog-weeks{grid-template-columns:repeat(2,1fr)}
}
.ob-footer-celebrate{text-align:center;padding:2.5rem 1.5rem;background:linear-gradient(135deg,var(--ok-l),rgba(255,255,255,.7));border:2px solid var(--ok);border-radius:var(--rl);margin-top:1rem}
body.liq-dark .ob-footer-celebrate{background:linear-gradient(135deg,rgba(22,163,74,.12),rgba(255,255,255,.04))}
.ob-celebrate-big{font-size:3.2rem;color:var(--ok);line-height:1;margin-bottom:.6rem}
.ob-celebrate-title{font-family:var(--fd);font-size:1.4rem;font-weight:700;color:var(--heading);margin-bottom:.4rem}
.ob-celebrate-sub{font-size:.9rem;color:var(--txs);max-width:520px;margin:0 auto;line-height:1.55}
.ob-footer-tip{margin-top:1rem;padding:.85rem 1.1rem;background:var(--g100);border-radius:var(--r);font-size:.83rem;color:var(--txs);line-height:1.55}
body.liq-dark .ob-footer-tip{background:rgba(255,255,255,.04)}
/* ── Home recommendation card — urgency tiers ── */
.hd-card-urgency-critical{border-color:var(--er);box-shadow:0 0 0 1px var(--er),0 6px 22px rgba(220,38,38,.13)}
.hd-card-urgency-critical .hd-card-label{color:var(--er)}
.hd-card-urgency-high{border-color:var(--er);box-shadow:0 6px 18px rgba(220,38,38,.08)}
.hd-card-urgency-high .hd-card-label{color:var(--er)}
.hd-card-urgency-medium{border-color:var(--wa);box-shadow:0 6px 18px rgba(217,119,6,.08)}
.hd-card-urgency-medium .hd-card-label{color:var(--wa)}
.hd-card-urgency-review{border-color:var(--lo);background:linear-gradient(135deg,rgba(214,93,134,.04),var(--wh))}
body.liq-dark .hd-card-urgency-review{background:linear-gradient(135deg,rgba(214,93,134,.08),rgba(255,255,255,.04))}
.hd-card-urgency-celebration{border-color:var(--ok);background:linear-gradient(135deg,var(--ok-l),var(--wh))}
body.liq-dark .hd-card-urgency-celebration{background:linear-gradient(135deg,rgba(22,163,74,.12),rgba(255,255,255,.04))}
.hd-rec-eyebrow{display:inline-block;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);margin-bottom:.4rem}
.hd-rec-due{display:inline-flex;align-items:center;font-size:.74rem;font-weight:800;letter-spacing:var(--ls-caps);padding:.22rem .65rem;border-radius:99px;margin-bottom:.5rem;text-transform:uppercase}
/* ── AMP Tracker ── */
.amp-empty{text-align:center;padding:3rem 1rem;background:var(--wh);border:1px dashed var(--bdr);border-radius:var(--rl);color:var(--txm)}
body.liq-dark .amp-empty{background:rgba(255,255,255,.04)}
.amp-empty-ico{font-size:3rem;color:var(--g400);margin-bottom:.6rem;line-height:1}
.amp-empty-title{font-family:var(--fd);font-size:1.1rem;font-weight:700;color:var(--heading);margin-bottom:.4rem}
.amp-empty-body{font-size:.88rem;color:var(--txs);max-width:480px;margin:0 auto 1rem;line-height:1.55}
.amp-list{display:flex;flex-direction:column;gap:.55rem}
.amp-row{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.4fr auto;gap:1rem;align-items:center;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.85rem 1rem;cursor:pointer;transition:all .15s ease}
.amp-row:hover{border-color:var(--lo);box-shadow:0 4px 14px rgba(43,58,103,.06);transform:translateY(-1px)}
body.liq-dark .amp-row{background:rgba(255,255,255,.04)}
.amp-row-archived{cursor:default}
.amp-row-archived:hover{transform:none;box-shadow:none;border-color:var(--bdr)}
.amp-row-name{min-width:0}
.amp-row-stat{min-width:0}
.amp-row-rec{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;padding:.4rem .65rem;border-radius:99px;line-height:1.3;justify-self:start}
@media (max-width:991px){
  .amp-row{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto}
  .amp-row-rec{grid-column:1 / span 2}
  .amp-row > .bi-chevron-right{display:none}
}
.amp-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.85rem;margin-bottom:1.25rem}
.amp-stat-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem;border-left:4px solid var(--g400)}
body.liq-dark .amp-stat-card{background:rgba(255,255,255,.04)}
.amp-stat-card.stat-er{border-left-color:var(--er)}
.amp-stat-card.stat-er-soft{border-left-color:#fca5a5}
.amp-stat-card.stat-wa-soft{border-left-color:#fcd34d}
.amp-stat-card.stat-inf-soft{border-left-color:#93c5fd}
.amp-stat-card.stat-ok{border-left-color:var(--ok)}
.amp-stat-num{font-family:var(--fd);font-size:1.7rem;font-weight:700;color:var(--lp);line-height:1}
body.liq-dark .amp-stat-num{color:var(--lo)}
.amp-stat-lbl{font-size:.7rem;color:var(--txm);font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);margin-top:.25rem}
.amp-stat-sub{font-size:.7rem;color:var(--txs);margin-top:.18rem}
.amp-rec{display:flex;align-items:flex-start;gap:.85rem;padding:1rem 1.1rem;border-radius:var(--r);margin-bottom:1rem;border:2px solid var(--g400)}
.amp-rec-ico{width:2.2rem;height:2.2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;flex-shrink:0}
.amp-rec-body{flex:1;min-width:0}
.amp-rec-title{font-family:var(--fd);font-size:1rem;font-weight:700;margin-bottom:.25rem}
.amp-rec-detail{font-size:.85rem;color:var(--txs);line-height:1.55}
.amp-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);margin-bottom:1rem;overflow:hidden}
body.liq-dark .amp-section{background:rgba(255,255,255,.04)}
.amp-section-hdr{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.1rem;background:var(--g100);border-bottom:1px solid var(--bdr);font-size:.85rem;font-weight:800;color:var(--heading);text-transform:uppercase;letter-spacing:var(--ls-caps)}
.amp-section-count{margin-left:auto;background:var(--lp);color:#fff;font-size:.7rem;font-weight:800;padding:.13rem .5rem;border-radius:99px;text-transform:none;letter-spacing:0}
body.liq-dark .amp-section-count{background:var(--lo)}
.amp-pattern{padding:.7rem 1.1rem;background:var(--g100);margin:.5rem 1rem}
body.liq-dark .amp-pattern{background:rgba(255,255,255,.06)}
.amp-pattern-title{font-size:.85rem;font-weight:700;margin-bottom:.2rem}
.amp-pattern-detail{font-size:.78rem;color:var(--txs);line-height:1.55}
.amp-abs-row{display:grid;grid-template-columns:90px 60px 130px 1fr auto;gap:.8rem;align-items:flex-start;padding:.65rem 1.1rem;border-bottom:1px solid var(--bdr)}
.amp-abs-row:last-child{border-bottom:none}
.amp-abs-date{min-width:0}
.amp-abs-day{font-size:.7rem;font-weight:800;color:var(--txm);text-transform:uppercase;letter-spacing:var(--ls-caps)}
.amp-abs-fdate{font-size:.85rem;font-weight:700;color:var(--tx)}
.amp-abs-dur{font-size:.85rem;color:var(--txs);font-weight:600;align-self:center}
.amp-abs-cls{min-width:0}
.amp-chip{display:inline-block;font-size:.7rem;font-weight:800;padding:.18rem .55rem;border-radius:99px;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.amp-abs-reason{min-width:0;font-size:.85rem}
.amp-row-del{background:var(--g100);border:1px solid var(--bdr);border-radius:6px;color:var(--txm);width:1.85rem;height:1.85rem;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.78rem;flex-shrink:0;align-self:center;transition:all .15s ease}
.amp-row-del:hover{background:var(--er);color:#fff;border-color:var(--er)}
body.liq-dark .amp-row-del{background:rgba(255,255,255,.04)}
@media (max-width:767px){
  .amp-abs-row{grid-template-columns:1fr auto;grid-template-rows:auto auto auto}
  .amp-abs-date{grid-column:1}
  .amp-abs-dur{grid-column:1;font-size:.78rem}
  .amp-abs-cls{grid-column:1 / span 2}
  .amp-abs-reason{grid-column:1 / span 2}
  .amp-row-del{grid-column:2;grid-row:1}
}
.amp-step-row{display:flex;align-items:center;gap:.85rem;padding:.7rem 1.1rem;border-bottom:1px solid var(--bdr)}
.amp-step-row:last-child{border-bottom:none}
.amp-step-num{width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:700;font-size:.95rem;color:#fff;flex-shrink:0}
.amp-step-num.step-1{background:#2563eb}
.amp-step-num.step-2{background:#d97706}
.amp-step-num.step-3{background:#dc2626}
.amp-step-num.step-4{background:#7c3aed}
/* ── Reasonable Notice Calculator ── */
.nc-form{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.25rem}
.nc-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem}
body.liq-dark .nc-section{background:rgba(255,255,255,.04)}
.nc-lbl-hdr{display:flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:800;color:var(--heading);margin-bottom:.6rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.nc-lbl-hdr i{color:var(--lo);font-size:.95rem}
.nc-lbl{display:block;font-size:.74rem;font-weight:700;color:var(--txm);margin-bottom:.25rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.nc-radio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.5rem}
.nc-radio{display:flex;align-items:flex-start;gap:.55rem;background:var(--g100);border:2px solid var(--bdr);border-radius:var(--r);padding:.7rem .85rem;cursor:pointer;transition:all .15s ease}
.nc-radio:hover{border-color:var(--lo)}
.nc-radio.active{border-color:var(--lo);background:var(--lo-p)}
.nc-radio input{margin-top:.18rem;flex-shrink:0;accent-color:var(--lo)}
.nc-radio-title{font-size:.88rem;font-weight:700;color:var(--tx);margin-bottom:.15rem}
.nc-radio-sub{font-size:.74rem;color:var(--txs);line-height:1.4}
body.liq-dark .nc-radio{background:rgba(255,255,255,.04)}
.nc-toggle{display:inline-flex;background:var(--g100);border-radius:99px;padding:.18rem;border:1px solid var(--bdr)}
.nc-toggle-btn{background:transparent;border:none;font-size:.78rem;font-weight:700;color:var(--txs);padding:.32rem .85rem;border-radius:99px;cursor:pointer}
.nc-toggle-btn.active{background:var(--lo);color:#fff}
.nc-checkbox{display:inline-flex;align-items:center;gap:.45rem;font-size:.85rem;color:var(--tx);cursor:pointer;font-weight:600}
.nc-checkbox input{accent-color:var(--lo);width:1rem;height:1rem;cursor:pointer}
.nc-results{margin-top:1.5rem}
.nc-summary-bar{display:flex;flex-wrap:wrap;gap:1rem;background:linear-gradient(135deg,var(--lp-t),rgba(214,93,134,.06));border:1px solid rgba(214,93,134,.25);border-radius:var(--r);padding:.85rem 1.1rem;margin-bottom:1rem}
.nc-summary-item{flex:1;min-width:120px}
.nc-summary-num{font-family:var(--fd);font-size:1.15rem;font-weight:700;color:var(--heading);line-height:1.2}
.nc-summary-lbl{font-size:.7rem;font-weight:700;color:var(--txm);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-top:.15rem}
body.liq-dark .nc-summary-num{color:var(--lo)}
.nc-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);overflow:hidden;margin-bottom:1rem}
body.liq-dark .nc-card{background:rgba(255,255,255,.04)}
.nc-card-hdr{display:flex;align-items:center;gap:.5rem;padding:.85rem 1.1rem;background:var(--g100);border-bottom:1px solid var(--bdr);font-family:var(--fd);font-size:.98rem;font-weight:700;color:var(--heading);flex-wrap:wrap}
.nc-card-sub{margin-left:auto;font-family:var(--fb);font-size:.72rem;font-weight:600;color:var(--txm);text-transform:none;letter-spacing:0}
.nc-card-body{padding:1rem 1.1rem}
.nc-row{display:flex;align-items:center;justify-content:space-between;gap:.65rem;padding:.55rem 0;border-bottom:1px solid var(--bdr);flex-wrap:wrap}
.nc-row:last-child{border-bottom:none}
.nc-row-lbl{font-size:.85rem;color:var(--txs);font-weight:600;flex:1;min-width:0}
.nc-row-val{font-size:.92rem;font-weight:700;color:var(--tx);text-align:right}
.nc-row.nc-total{margin-top:.25rem;padding-top:.7rem;border-top:2px solid var(--bdr);border-bottom:none}
.nc-row.nc-total .nc-row-lbl{font-weight:800;color:var(--heading);font-size:.9rem}
.nc-row.nc-total .nc-row-val{font-size:1.05rem;color:var(--lo)}
.nc-row.nc-row-na .nc-row-val{color:var(--txm);font-weight:600}
.nc-disq{display:flex;align-items:flex-start;gap:.6rem;font-size:.85rem;color:var(--txs);background:var(--g100);border-radius:var(--r);padding:.85rem 1rem;line-height:1.55}
.nc-disq i{font-size:1rem;flex-shrink:0;margin-top:.05rem}
.nc-factor-row{display:grid;grid-template-columns:160px 1fr 90px;gap:.6rem;align-items:center;padding:.45rem .6rem;border-radius:6px;margin-bottom:.3rem;background:var(--g100);font-size:.83rem}
.nc-factor-row.pos{background:var(--ok-l)}
.nc-factor-row.neg{background:var(--er-l)}
.nc-factor-lbl{font-weight:700;color:var(--tx)}
.nc-factor-detail{color:var(--txs);font-size:.78rem}
.nc-factor-delta{text-align:right;font-weight:800;font-size:.83rem;color:var(--txs)}
.nc-factor-row.pos .nc-factor-delta{color:var(--ok)}
.nc-factor-row.neg .nc-factor-delta{color:var(--er)}
@media (max-width:639px){
  .nc-factor-row{grid-template-columns:1fr 80px;grid-template-rows:auto auto}
  .nc-factor-detail{grid-column:1 / span 2;font-size:.76rem}
}
body.liq-dark .nc-factor-row{background:rgba(255,255,255,.06)}
body.liq-dark .nc-factor-row.pos{background:rgba(22,163,74,.18)}
body.liq-dark .nc-factor-row.neg{background:rgba(220,38,38,.18)}
/* ── Review Mode (Spaced Repetition) ── */
.rev-card{display:flex;align-items:flex-start;gap:1rem;background:linear-gradient(135deg,rgba(43,58,103,.04),rgba(214,93,134,.07));border:1.5px solid rgba(214,93,134,.3);border-radius:var(--r);padding:1.1rem 1.3rem;margin-bottom:1.25rem}
body.liq-dark .rev-card{background:linear-gradient(135deg,rgba(214,93,134,.08),rgba(214,93,134,.14));border-color:rgba(214,93,134,.4)}
.rev-card-ico{width:2.6rem;height:2.6rem;border-radius:50%;background:var(--lo);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
.rev-card-body{flex:1;min-width:0}
.rev-card-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);margin-bottom:.2rem;display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}
.rev-card-sub{font-size:.85rem;color:var(--txs);line-height:1.5;margin-bottom:.5rem}
.rev-card-meta{display:flex;flex-wrap:wrap;gap:.4rem .9rem;font-size:.74rem;color:var(--txm);font-weight:600;letter-spacing:.02em}
.rev-card-actions{flex-shrink:0;align-self:center}
.rev-card-weak{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);background:var(--er-l);color:var(--er);padding:.18rem .55rem;border-radius:99px;display:inline-flex;align-items:center;gap:.3rem}
.rev-card-cap{font-size:.74rem;color:var(--wa);background:var(--wa-l);border-radius:6px;padding:.4rem .6rem;margin-top:.55rem;display:flex;align-items:center;gap:.4rem}
@media (max-width:639px){
  .rev-card{flex-direction:column;gap:.7rem}
  .rev-card-actions{width:100%}
  .rev-card-actions .btn-liq{width:100%;justify-content:center}
}
.review-shell{max-width:760px;margin:0 auto}
.rev-q-meta{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;margin-bottom:.85rem}
.rev-q-source{font-size:.74rem;font-weight:700;color:var(--txm);background:var(--g100);border-radius:99px;padding:.22rem .65rem;display:inline-flex;align-items:center}
.rev-weak-badge{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);background:var(--er-l);color:var(--er);padding:.18rem .55rem;border-radius:99px;display:inline-flex;align-items:center;gap:.3rem}
.rev-end-card{background:var(--wh);border:2px solid var(--bdr);border-radius:var(--rl);padding:1.6rem 1.5rem;text-align:center;margin-bottom:1rem}
.rev-end-card.s-ok{border-color:var(--ok);background:linear-gradient(135deg,var(--ok-l),rgba(255,255,255,.7))}
.rev-end-card.s-or{border-color:var(--lo);background:linear-gradient(135deg,var(--lo-l),rgba(255,255,255,.7))}
.rev-end-card.s-er{border-color:var(--er);background:linear-gradient(135deg,var(--er-l),rgba(255,255,255,.7))}
body.liq-dark .rev-end-card{background:rgba(255,255,255,.04)}
body.liq-dark .rev-end-card.s-ok,body.liq-dark .rev-end-card.s-or,body.liq-dark .rev-end-card.s-er{background:rgba(255,255,255,.05)}
.rev-end-score-num{font-family:var(--fd);font-size:3.2rem;font-weight:700;color:var(--lp);line-height:1;margin-bottom:.2rem}
body.liq-dark .rev-end-score-num{color:var(--lo)}
.rev-end-score-pct{font-size:1.05rem;font-weight:800;color:var(--txs);letter-spacing:.04em;margin-bottom:.3rem}
.rev-end-score-msg{font-size:.92rem;color:var(--txs);max-width:480px;margin:0 auto .85rem;line-height:1.55}
.rev-end-xp{font-size:.95rem;font-weight:800;color:var(--lo);display:inline-flex;align-items:center;gap:.35rem}
.rev-xp-list{font-size:.78rem;color:var(--txs);text-align:left;max-width:380px;margin:.85rem auto 0;padding-left:1.2rem;line-height:1.7}
.rev-xp-list li{margin-bottom:.15rem}
.rev-weak-line{font-size:.85rem;background:var(--er-l);color:var(--er);border-radius:var(--r);padding:.65rem .9rem;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;font-weight:600}
.rev-weak-line.rev-weak-clear{background:var(--ok-l);color:var(--ok)}
.rev-result-item{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.85rem 1.1rem;margin-bottom:.6rem}
body.liq-dark .rev-result-item{background:rgba(255,255,255,.04)}
.rev-result-hd{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;font-size:.77rem;color:var(--txm);margin-bottom:.45rem}
.rev-result-num{background:var(--lp);color:#fff;border-radius:50%;width:1.5rem;height:1.5rem;display:inline-flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;flex-shrink:0}
body.liq-dark .rev-result-num{background:var(--lo)}
.rev-result-src{font-weight:700}
.rev-result-status{margin-left:auto;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.15rem .55rem;border-radius:99px}
.rev-result-status.ok{background:var(--ok-l);color:var(--ok)}
.rev-result-status.er{background:var(--er-l);color:var(--er)}
.rev-result-q{font-size:.92rem;font-weight:700;color:var(--tx);line-height:1.4;margin-bottom:.5rem}
.rev-result-opts{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.55rem}
/* .qrev-opt / .qrev-correct / .qrev-wrong are defined above in the module quiz section — reused as-is */
.rev-result-exp{font-size:.82rem;color:var(--txs);background:var(--g100);border-radius:var(--rs);padding:.55rem .75rem;line-height:1.55;border-left:3px solid var(--lo)}
body.liq-dark .rev-result-exp{background:rgba(255,255,255,.04)}
/* ── My Library ── */
.lib-tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.85rem;border-bottom:1px solid var(--bdr);padding-bottom:.85rem}
.lib-tab{display:inline-flex;align-items:center;gap:.4rem;background:var(--wh);border:1px solid var(--bdr);color:var(--txs);font-size:.83rem;font-weight:700;padding:.45rem .85rem;border-radius:99px;cursor:pointer;transition:all .15s ease;font-family:var(--fb)}
.lib-tab:hover{border-color:var(--lo);color:var(--lo)}
.lib-tab.active{background:var(--lp);border-color:var(--lp);color:#fff}
.lib-tab.active:hover{background:var(--lp-m);border-color:var(--lp-m);color:#fff}
.lib-tab i{font-size:.9rem}
.lib-tab-count{background:rgba(0,0,0,.08);color:inherit;font-size:.7rem;font-weight:800;padding:.1rem .45rem;border-radius:99px;min-width:1.4rem;text-align:center;line-height:1.4}
.lib-tab.active .lib-tab-count{background:rgba(255,255,255,.22)}
body.liq-dark .lib-tab{background:rgba(255,255,255,.04);color:var(--tx)}
body.liq-dark .lib-tab.active{background:var(--lo);border-color:var(--lo);color:#fff}
.lib-search-wrap{position:relative;margin-bottom:.85rem}
.lib-search{width:100%;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.65rem 2.6rem .65rem 2.4rem;font-size:.92rem;font-family:var(--fb);color:var(--tx);transition:border-color .15s ease}
.lib-search:focus{outline:none;border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.18)}
.lib-search::placeholder{color:var(--txm)}
.lib-search-ico{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--txm);font-size:1rem;pointer-events:none}
.lib-search-clear{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);background:var(--g100);color:var(--txs);border:none;border-radius:50%;width:1.7rem;height:1.7rem;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.75rem;transition:all .15s ease}
.lib-search-clear:hover{background:var(--er);color:#fff}
body.liq-dark .lib-search{background:rgba(255,255,255,.04)}
.lib-results-line{font-size:.78rem;color:var(--txm);margin-bottom:.85rem}
.lib-results-line strong{color:var(--lp);font-weight:800}
body.liq-dark .lib-results-line strong{color:var(--lo)}
.lib-list{display:flex;flex-direction:column;gap:.55rem}
.lib-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.85rem 1rem;cursor:pointer;transition:all .15s ease}
.lib-item:hover{border-color:var(--lo);box-shadow:0 4px 14px rgba(43,58,103,.06);transform:translateY(-1px)}
body.liq-dark .lib-item{background:rgba(255,255,255,.04)}
.lib-item-ico{width:2.4rem;height:2.4rem;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0}
.lib-item-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.18rem}
.lib-item-hd{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.lib-type-chip{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.13rem .45rem;border-radius:3px;line-height:1.3}
.lib-item-title{font-family:var(--fb);font-weight:700;font-size:.92rem;color:var(--tx);line-height:1.35;flex:1;min-width:0}
.lib-item-sub{font-size:.82rem;color:var(--txs);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lib-item-meta{font-size:.72rem;color:var(--txm);font-weight:600;letter-spacing:.02em}
.lib-item-actions{display:flex;flex-direction:column;gap:.35rem;flex-shrink:0;margin-left:.4rem}
.lib-act-btn{background:var(--g100);color:var(--txs);border:1px solid var(--bdr);border-radius:6px;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;font-size:.85rem;cursor:pointer;transition:all .15s ease}
.lib-act-btn:hover{background:var(--lo);color:#fff;border-color:var(--lo)}
.lib-act-btn.lib-act-danger:hover{background:var(--er);color:#fff;border-color:var(--er)}
body.liq-dark .lib-act-btn{background:rgba(255,255,255,.04)}
.lib-empty{text-align:center;padding:3rem 1rem;background:var(--wh);border:1px dashed var(--bdr);border-radius:var(--r);color:var(--txm)}
body.liq-dark .lib-empty{background:rgba(255,255,255,.02)}
.lib-empty-ico{font-size:2.6rem;color:var(--g400);margin-bottom:.6rem;line-height:1}
.lib-empty-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);margin-bottom:.3rem}
.lib-empty-body{font-size:.88rem;color:var(--txs);max-width:480px;margin:0 auto;line-height:1.55}
@media (max-width:767px){
  .lib-item{padding:.75rem .85rem;gap:.65rem}
  .lib-item-ico{width:2.1rem;height:2.1rem;font-size:.95rem}
  .lib-item-title{font-size:.88rem}
  .lib-item-sub{font-size:.78rem;-webkit-line-clamp:3}
  .lib-tab{font-size:.78rem;padding:.4rem .7rem}
}
/* ── Authorship / Attribution ──
   Created by Matt Laframboise — © 2026. Do not remove. */
.liq-attribution{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.5rem;font-size:.72rem;color:var(--txm);text-align:center;margin-top:1rem;letter-spacing:.02em}
.liq-attribution strong{color:var(--lp);font-weight:800}
.liq-attribution .liq-attr-mark{font-family:var(--fd);font-weight:700;color:var(--lp);letter-spacing:.04em}
.liq-attribution .liq-attr-sep{color:var(--g400);user-select:none}
body.liq-dark .liq-attribution strong,body.liq-dark .liq-attribution .liq-attr-mark{color:var(--lo)}
.liq-login-attribution{text-align:center;font-size:.74rem;color:rgba(255,255,255,.55);margin-top:1.5rem;letter-spacing:.04em;line-height:1.5}
.liq-login-attribution strong{color:rgba(255,255,255,.85);font-weight:800}
/* ── Admin Overview Dashboard ── */
.dash-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.85rem;margin-bottom:1.25rem}
.dash-kpi{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.95rem 1rem .85rem 1.15rem;display:flex;flex-direction:column;gap:.2rem;position:relative;overflow:hidden}
.dash-kpi::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--g200)}
.dash-kpi.kpi-ok::before{background:var(--ok)}
.dash-kpi.kpi-er::before{background:var(--er)}
.dash-kpi.kpi-wa::before{background:var(--wa)}
.dash-kpi.kpi-inf::before{background:var(--inf)}
.dash-kpi.kpi-lo::before{background:var(--lo)}
.dash-kpi.kpi-lp::before{background:var(--lp)}
.dash-kpi-hd{display:flex;align-items:center;gap:.4rem;font-size:.7rem;color:var(--txm);font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.dash-kpi-hd i{font-size:.85rem}
.dash-kpi-num{font-family:var(--fd);font-size:1.8rem;font-weight:700;color:var(--lp);line-height:1.05;margin-top:.1rem}
body.liq-dark .dash-kpi-num{color:var(--lo)}
.dash-kpi-sub{font-size:.7rem;color:var(--txs);margin-top:.05rem}
.dash-kpi-sub.s-er{color:var(--er);font-weight:700}
.dash-kpi-sub.s-wa{color:var(--wa);font-weight:700}
.dash-kpi-sub.s-ok{color:var(--ok);font-weight:700}
.dash-2col{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem;margin-bottom:1rem}
.dash-2col .admin-section{margin-bottom:0}
.dash-bars{padding:.4rem 0}
.dash-bar-row{display:grid;grid-template-columns:120px 1fr 50px;gap:.65rem;align-items:center;padding:.4rem 0}
.dash-bar-lbl{font-size:.82rem;color:var(--tx);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-bar-track{background:var(--g100);border-radius:99px;height:.6rem;overflow:hidden;position:relative}
.dash-bar-fill{background:var(--lo);height:100%;border-radius:99px;transition:width .4s ease;min-width:.35rem}
.dash-bar-val{font-size:.82rem;color:var(--txm);font-weight:700;text-align:right}
.dash-bar-empty{padding:1.4rem .25rem;text-align:center;color:var(--txm);font-size:.82rem}
.dash-stack{display:flex;height:1.4rem;border-radius:99px;overflow:hidden;background:var(--g100);margin:.4rem 0 .9rem}
.dash-stack-seg{height:100%}
/* Clickable bar segment — drills into the Users tab with a matching   */
/* path-status filter. Hover lifts brightness so the affordance is     */
/* obvious without changing the segment's color identity.               */
.dash-stack-seg-clickable{cursor:pointer;transition:filter .15s,transform .12s}
.dash-stack-seg-clickable:hover{filter:brightness(1.12);transform:translateY(-1px)}
.dash-stack-key{display:flex;flex-wrap:wrap;gap:.5rem .9rem;font-size:.74rem;color:var(--txs)}
/* Clickable key entry — same jump as the segment, useful when a       */
/* segment is too narrow to click reliably (e.g. the lone overdue user).*/
.dash-stack-key-clickable{cursor:pointer;border-radius:.3rem;padding:.1rem .35rem;margin:-.1rem -.35rem;transition:background .15s}
.dash-stack-key-clickable:hover{background:var(--g100)}
body.liq-dark .dash-stack-key-clickable:hover{background:var(--g200)}
.dash-stack-dot{width:.6rem;height:.6rem;border-radius:50%;display:inline-block;margin-right:.32rem;vertical-align:middle}
.dash-actv{padding:.1rem .15rem}
.dash-actv-item{display:flex;align-items:flex-start;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--bdr)}
.dash-actv-item:last-child{border-bottom:none}
.dash-actv-ico{width:1.55rem;height:1.55rem;border-radius:50%;background:var(--g100);display:flex;align-items:center;justify-content:center;font-size:.78rem;flex-shrink:0}
.dash-actv-bd{flex:1;min-width:0}
.dash-actv-lbl{font-size:.82rem;color:var(--tx);line-height:1.35;word-break:break-word}
.dash-actv-mt{font-size:.7rem;color:var(--txm);margin-top:.15rem}
.dash-qa-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem}
.dash-qa-grp{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.85rem 1rem}
.dash-qa-grp-hd{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.55rem}
.dash-qa-btns{display:flex;flex-direction:column;gap:.4rem}
.dash-qa-btns .btn-liq{justify-content:flex-start;text-align:left}
body.liq-dark .dash-kpi,body.liq-dark .dash-qa-grp{background:rgba(255,255,255,.04)}
.admin-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:var(--z-modal);display:none;align-items:center;justify-content:center;padding:1rem}
.admin-modal-overlay.open{display:flex}
.admin-modal{background:var(--wh);border-radius:var(--rl);padding:1.75rem;width:100%;max-width:480px;box-shadow:0 24px 64px rgba(0,0,0,.3)}
/* ── Assigned Path Feature ── */
.admin-modal.wide{max-width:600px}
.path-banner{background:linear-gradient(135deg,rgba(43,58,103,.06),rgba(214,93,134,.08));border:1.5px solid rgba(214,93,134,.3);border-radius:var(--r);padding:.85rem 1.1rem;margin-bottom:1.25rem;display:flex;align-items:flex-start;gap:.75rem}
.path-banner-overdue{background:linear-gradient(135deg,rgba(220,38,38,.06),rgba(220,38,38,.1));border-color:rgba(220,38,38,.4)}
.path-due-chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.7rem;font-weight:700;padding:.15rem .5rem;border-radius:2rem;margin-left:.5rem;vertical-align:middle;text-transform:none;letter-spacing:0}
.path-due-normal{background:rgba(100,100,120,.12);color:var(--txs);border:1px solid rgba(100,100,120,.2)}
.path-due-approaching{background:rgba(37,99,235,.1);color:#2563eb;border:1px solid rgba(37,99,235,.25)}
.path-due-soon{background:var(--wa-l);color:var(--wa);border:1px solid rgba(217,119,6,.3)}
.path-due-overdue{background:var(--er-l);color:var(--er);border:1px solid rgba(220,38,38,.4)}
.liq-dark .path-due-normal{background:rgba(200,200,220,.08);color:var(--tx);border-color:rgba(200,200,220,.18)}
.liq-dark .path-due-approaching{background:rgba(96,165,250,.15);color:#93c5fd;border-color:rgba(96,165,250,.3)}
.liq-dark .path-due-soon{background:rgba(217,119,6,.2);color:#fbbf24;border-color:rgba(217,119,6,.4)}
.liq-dark .path-due-overdue{background:rgba(220,38,38,.2);color:#fca5a5;border-color:rgba(220,38,38,.5)}
.path-banner-icon{font-size:1.2rem;flex-shrink:0;margin-top:.05rem}
.path-banner-body{flex:1;min-width:0}
.path-banner-title{font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--lo-h);margin-bottom:.25rem}
.path-banner-steps{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;margin-top:.4rem}
.path-step-chip{cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;background:var(--wh);border:1.5px solid var(--bdr);border-radius:2rem;padding:.18rem .6rem;font-size:.74rem;font-weight:700;color:var(--txs)}
.path-step-chip.done{border-color:var(--ok);color:var(--ok);background:var(--ok-l)}
.path-step-chip.active{border-color:var(--lo);color:var(--lo-h);background:var(--lo-l)}
.path-step-chip.locked{opacity:.55}
.path-step-arrow{color:var(--txm);font-size:.7rem}
.track-path-badge{display:inline-flex;align-items:center;gap:.28rem;font-size:.65rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;padding:.12rem .42rem;border-radius:2px;background:rgba(214,93,134,.15);color:var(--lo-h);margin-left:.4rem;flex-shrink:0}
.path-lock-msg{font-size:.78rem;color:var(--txm);padding:.6rem 1rem .8rem 1rem;font-style:italic;display:flex;align-items:center;gap:.4rem}
/* unlock-all badge in user table */
.unlock-badge{display:inline-flex;align-items:center;gap:.28rem;font-size:.68rem;font-weight:800;background:rgba(253,186,3,.15);color:#b45309;border-radius:2px;padding:.1rem .38rem}
/* path builder in modal */
.path-builder{border:1.5px solid var(--bdr);border-radius:var(--r);overflow:hidden;margin-top:.5rem}
.path-builder-hdr{background:var(--g100);padding:.52rem .85rem;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);display:flex;align-items:center;justify-content:space-between}
.path-track-row{display:flex;align-items:center;gap:.6rem;padding:.52rem .85rem;border-top:1px solid var(--bdr);background:var(--wh)}
.path-track-num{width:1.35rem;height:1.35rem;border-radius:50%;background:var(--lp);color:#fff;font-size:.68rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.path-track-name{flex:1;font-size:.83rem;font-weight:600;color:var(--tx)}
.path-track-del{background:none;border:none;color:var(--txm);cursor:pointer;font-size:.9rem;padding:.18rem .3rem;border-radius:3px;transition:all .15s;line-height:1}
.path-track-del:hover{color:var(--er);background:var(--er-l)}
.path-add-row{display:flex;gap:.5rem;padding:.6rem .85rem;border-top:1px solid var(--bdr);background:var(--g100)}
.path-add-sel{flex:1;border:1.5px solid var(--bdr);border-radius:var(--rs);background:var(--wh);font-family:var(--fb);font-size:.82rem;color:var(--tx);padding:.38rem 2rem .38rem .6rem;outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239b8faa' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .6rem center}
.path-add-sel:focus{border-color:var(--lo);box-shadow:0 0 0 2px var(--lo);outline:none}
.path-add-btn{border:1.5px solid var(--lo);background:var(--lo-l);color:var(--lo-h);border-radius:var(--rs);padding:.38rem .75rem;font-family:var(--fb);font-size:.82rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .15s}
.path-add-btn:hover{background:var(--lo);color:#fff}
.modal-section-label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin:1.1rem 0 .45rem;padding-top:.9rem;border-top:1px solid var(--bdr)}
/* ── Path Templates list ── */
.tpl-row{display:flex;align-items:flex-start;gap:.75rem;padding:.78rem .2rem;border-bottom:1px solid var(--bdr)}
.tpl-row:last-child{border-bottom:none}
.tpl-row-body{flex:1;min-width:0}
.tpl-row-name{font-size:.92rem;font-weight:700;color:var(--tx);display:flex;align-items:center;flex-wrap:wrap;gap:.2rem}
.tpl-row-actions{flex-shrink:0;display:flex;gap:.2rem;align-items:flex-start}
.liq-dark .tpl-row-name span[style*="background:var(--g100)"]{background:var(--g200)!important;color:var(--tx)!important}
/* ── Apply Template dropdown inside Edit User modal ── */
.apply-tpl-wrap{position:relative;display:inline-block;margin-top:.5rem}
.apply-tpl-btn{border:1.5px dashed var(--bdr);background:transparent;color:var(--txs);border-radius:var(--rs);padding:.38rem .78rem;font-family:var(--fb);font-size:.8rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.38rem;transition:all .15s}
.apply-tpl-btn:hover{border-color:var(--lo);color:var(--lo-h);background:var(--lo-p)}
.apply-tpl-menu{position:absolute;top:calc(100% + .3rem);left:0;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);box-shadow:var(--shm);min-width:240px;max-width:340px;max-height:240px;overflow-y:auto;z-index:var(--z-modal-popover);display:none}
.apply-tpl-menu.open{display:block}
.apply-tpl-item{padding:.55rem .85rem;cursor:pointer;border-bottom:1px solid var(--bdr);transition:background .12s}
.apply-tpl-item:last-child{border-bottom:none}
.apply-tpl-item:hover{background:var(--g100)}
.apply-tpl-item-name{font-size:.85rem;font-weight:700;color:var(--tx)}
.apply-tpl-item-meta{font-size:.7rem;color:var(--txm);margin-top:.1rem}
.apply-tpl-empty{padding:1rem;text-align:center;color:var(--txm);font-size:.8rem;font-style:italic}
.liq-dark .apply-tpl-menu{background:var(--wh);border-color:var(--g400)}
.admin-modal-title{font-family:var(--fd);font-size:1.1rem;color:var(--heading);margin-bottom:1.25rem;display:flex;align-items:center;justify-content:space-between}
.nav-admin-link{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:700;color:var(--lo);padding:.28rem .65rem;border-radius:.4rem;background:rgba(214,93,134,.12);border:1px solid rgba(214,93,134,.25);white-space:nowrap;cursor:pointer;transition:all .15s;text-decoration:none}
.nav-admin-link:hover{background:rgba(214,93,134,.2);color:var(--lo)}


/* ── ADMIN TABS ─────────────────────────────────────────── */
.admin-tabs{display:flex;gap:0;background:var(--g100);border-radius:var(--r) var(--r) 0 0;border:1px solid var(--bdr);border-bottom:none;padding:.3rem .3rem 0;margin-bottom:0;flex-wrap:wrap;position:sticky;top:60px;z-index:5;box-shadow:0 2px 8px rgba(0,0,0,.04)}
body.liq-dark .admin-tabs{box-shadow:0 2px 12px rgba(0,0,0,.25)}
/* Mobile bottom nav reduces available top space when present */
body.has-mob-nav .admin-tabs{top:60px}
@media (max-width:767px){.admin-tabs{top:56px}}
.admin-tab{flex:1;min-width:100px;border:none;background:transparent;font-family:var(--fb);font-size:.82rem;font-weight:700;padding:.62rem .5rem;border-radius:var(--rs) var(--rs) 0 0;cursor:pointer;color:var(--txs);display:flex;align-items:center;justify-content:center;gap:.38rem;transition:all .2s;white-space:nowrap}
.admin-tab:hover{background:rgba(255,255,255,.7);color:var(--tx)}
.admin-tab.active{background:var(--wh);color:var(--lp)}
body.liq-dark .admin-tab.active{color:var(--lo)}
.admin-tab-panel{display:none;background:var(--wh);border:1px solid var(--bdr);border-radius:0 0 var(--rl) var(--rl);padding:1.75rem}
.admin-tab-panel.active{display:block}
/* Settings */
.settings-group{margin-bottom:1.75rem}
.settings-group-title{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.85rem;padding-bottom:.45rem;border-bottom:1px solid var(--bdr)}
.settings-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;padding:.85rem 0;border-bottom:1px solid var(--bdr)}
.settings-row:last-child{border-bottom:none}
.settings-row-left{flex:1}
.settings-row-label{font-size:.9rem;font-weight:700;color:var(--tx);margin-bottom:.18rem}
.settings-row-desc{font-size:.8rem;color:var(--txs);line-height:1.5}
.settings-row-right{flex-shrink:0;padding-top:.1rem}
/* Toggle switch */
.toggle-wrap{position:relative;width:44px;height:24px;cursor:pointer}
.toggle-wrap input{opacity:0;width:0;height:0;position:absolute}
.toggle-slider{position:absolute;inset:0;background:var(--bdr);border-radius:24px;transition:.2s}
.toggle-slider:before{content:'';position:absolute;width:18px;height:18px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s}
.toggle-wrap input:checked+.toggle-slider{background:var(--ok)}
.toggle-wrap input:checked+.toggle-slider:before{transform:translateX(20px)}
/* Announcements */
.ann-item{background:var(--g100);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem;margin-bottom:.75rem;display:flex;align-items:flex-start;gap:.85rem}
.ann-item-body{flex:1;min-width:0}
.ann-item-text{font-size:.9rem;color:var(--tx);margin-bottom:.3rem;line-height:1.5}
.ann-item-meta{font-size:.75rem;color:var(--txm)}
.ann-type-badge{font-size:.68rem;font-weight:800;padding:.18rem .5rem;border-radius:2rem;text-transform:uppercase;letter-spacing:var(--ls-caps);flex-shrink:0;margin-top:.1rem}
.ann-info{background:rgba(37,99,235,.1);color:#2563eb}
.ann-warn{background:var(--wa-l);color:var(--wa)}
.ann-success{background:var(--ok-l);color:var(--ok)}
/* Content management */
.content-track-row{display:flex;align-items:center;gap:.85rem;padding:.75rem 0;border-bottom:1px solid var(--bdr)}
.content-track-row:last-child{border-bottom:none}
.content-track-icon{width:2.2rem;height:2.2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0}
.content-track-info{flex:1}
.content-track-name{font-size:.9rem;font-weight:700;color:var(--tx)}
.content-track-sub{font-size:.78rem;color:var(--txm)}
/* Audit log */
.audit-item{display:flex;align-items:flex-start;gap:.7rem;padding:.6rem 0;border-bottom:1px solid var(--bdr);font-size:.84rem}
.audit-item:last-child{border-bottom:none}
.audit-icon{width:1.8rem;height:1.8rem;border-radius:.4rem;display:flex;align-items:center;justify-content:center;font-size:.78rem;flex-shrink:0;margin-top:.05rem}
.audit-add{background:var(--ok-l);color:var(--ok)}
.audit-edit{background:rgba(37,99,235,.1);color:#2563eb}
.audit-delete{background:var(--er-l);color:var(--er)}
.audit-settings{background:rgba(124,58,237,.1);color:#7c3aed}
.audit-system{background:var(--g100);color:var(--txm)}
.audit-learner{background:rgba(214,93,134,.12);color:var(--lo-h)}
/* ── Audit filter bar ── */
.audit-filter-bar{display:flex;gap:.3rem;flex-wrap:wrap}
.audit-filter-btn{border:1.5px solid var(--bdr);background:var(--wh);border-radius:2rem;padding:.28rem .72rem;font-family:var(--fb);font-size:.78rem;font-weight:700;color:var(--txs);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:.35rem}
.audit-filter-btn:hover{border-color:var(--lo);color:var(--lo-h)}
.audit-filter-btn.active{background:var(--lp);border-color:var(--lp);color:#fff}
.liq-dark .audit-filter-btn.active{background:var(--lo);border-color:var(--lo);color:#fff}
.audit-filter-count{font-size:.66rem;font-weight:800;background:var(--g100);color:var(--txm);border-radius:99px;padding:.02rem .38rem;min-width:1.1rem;text-align:center}
.audit-filter-btn.active .audit-filter-count{background:rgba(255,255,255,.25);color:#fff}
.audit-body{flex:1}
.audit-label{color:var(--tx);line-height:1.4}
.audit-time{font-size:.72rem;color:var(--txm);white-space:nowrap}
/* User detail modal */
.user-detail-perm{display:flex;align-items:center;justify-content:space-between;padding:.45rem 0;border-bottom:1px solid var(--bdr);font-size:.86rem}
.user-detail-perm:last-child{border-bottom:none}
.perm-allowed{color:var(--ok);font-weight:700}
.perm-denied{color:var(--txm)}
/* Bulk select */
.admin-table .row-cb{width:1.2rem;height:1.2rem;cursor:pointer}
.bulk-bar{display:none;align-items:center;gap:.75rem;padding:.65rem 1rem;background:var(--lp);border-radius:var(--r);margin-bottom:.75rem;color:#fff;font-size:.88rem;font-weight:600}
.bulk-bar.show{display:flex}


/* ── DAILY CHALLENGE ─────────────────────────────────────── */
/* Term of the Day home widget */
.hd-tod-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1rem 1.3rem;margin-bottom:1rem;cursor:pointer;transition:border-color .18s,box-shadow .18s;border-left:4px solid var(--lp)}
.hd-tod-card:hover{border-color:var(--lp);box-shadow:var(--shm)}
.hd-tod-left{flex:1;min-width:0}
.hd-tod-lbl{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:var(--lp);margin-bottom:.22rem}
.hd-tod-term{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);margin-bottom:.18rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-tod-def{font-size:.8rem;color:var(--txs);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hd-tod-right{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:.4rem}
.hd-tod-cat{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.18rem .52rem;border-radius:3px}
.hd-tod-cta{font-size:.75rem;font-weight:700;color:var(--lp);white-space:nowrap}
.hd-tod-seen{font-size:.75rem;font-weight:700;color:var(--ok);display:flex;align-items:center;gap:.3rem;white-space:nowrap}
body.liq-dark .hd-tod-card{background:var(--wh);border-color:var(--bdr)}
body.liq-dark .hd-tod-card:hover{border-color:var(--lo)}
body.liq-dark .hd-tod-lbl{color:var(--lo)}
body.liq-dark .hd-tod-term{color:var(--tx)}
body.liq-dark .hd-tod-cta{color:var(--lo)}

/* Weekly Recap card — last-7-days snapshot. Compact 4-stat strip; card itself
   is hidden when all four metrics are zero (handled in JS). */
.hd-recap-card{background:linear-gradient(135deg,var(--lp) 0%,var(--lp-m) 100%);color:#fff;border-radius:var(--rl);padding:1.1rem 1.3rem;box-shadow:var(--sh);position:relative;overflow:hidden}
.hd-recap-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 100% 0%,rgba(214,93,134,.18) 0%,transparent 60%);pointer-events:none}
.hd-recap-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:.85rem;position:relative}
.hd-recap-label{font-family:var(--fd);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps-wide);color:rgba(255,255,255,.7)}
.hd-recap-streak{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:800;color:var(--lo);background:rgba(214,93,134,.18);padding:.22rem .55rem;border-radius:99px;letter-spacing:.04em}
.hd-recap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;position:relative}
.hd-recap-stat{text-align:center;padding:.2rem 0}
.hd-recap-num{font-family:var(--fd);font-size:1.7rem;font-weight:700;color:var(--lo);line-height:1}
.hd-recap-lbl{font-size:.7rem;font-weight:700;color:rgba(255,255,255,.65);letter-spacing:.04em;margin-top:.2rem}
@media (max-width:600px){
  .hd-recap-grid{grid-template-columns:repeat(2,1fr);gap:.85rem .6rem}
  .hd-recap-num{font-size:1.5rem}
}
.daily-home-card{background:linear-gradient(135deg,var(--lp-d) 0%,var(--lp-m) 100%);border-radius:var(--rl);padding:1.4rem 1.6rem;color:#fff;display:flex;align-items:center;gap:1.2rem;margin-bottom:1.2rem;border:2px solid rgba(214,93,134,.35);box-shadow:0 4px 24px rgba(0,0,0,.18);position:relative;overflow:hidden}
.daily-home-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 80% 50%,rgba(214,93,134,.12),transparent 60%);pointer-events:none}
.daily-home-done{border-color:rgba(74,222,128,.4)}
.daily-streak-flame{font-size:2.4rem;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 6px rgba(214,93,134,.5))}
.daily-home-info{flex:1;min-width:0}
.daily-home-label{font-size:.65rem;font-weight:800;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo);margin-bottom:.25rem}
.daily-home-title{font-family:var(--fd);font-size:1.1rem;font-weight:700;margin-bottom:.2rem}
.daily-home-meta{font-size:.8rem;color:rgba(255,255,255,.65)}
.daily-streak-count{font-size:2rem;font-weight:800;color:var(--lo);line-height:1;text-align:center;flex-shrink:0}
.daily-streak-lbl{font-size:.62rem;color:rgba(255,255,255,.5);text-align:center;line-height:1.2}
.daily-done-badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(74,222,128,.18);border:1px solid rgba(74,222,128,.4);border-radius:2rem;padding:.2rem .7rem;font-size:.78rem;font-weight:700;color:#4ade80;margin-top:.4rem}

/* Daily page */
.daily-hero{background:linear-gradient(135deg,var(--lp-d) 0%,#0d1a2e 100%);padding:2.2rem 0 1.8rem;position:relative;overflow:hidden}
.daily-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 70% 50%,rgba(214,93,134,.15),transparent 60%);pointer-events:none}
.daily-brief{font-size:1.05rem;color:rgba(255,255,255,.75);font-style:italic;margin-bottom:.9rem;line-height:1.55}
.daily-format-badge{display:inline-flex;align-items:center;gap:.45rem;border-radius:2rem;padding:.3rem .9rem;font-size:.72rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;margin-bottom:.75rem}
.fmt-case{background:rgba(37,99,235,.25);border:1px solid rgba(37,99,235,.5);color:#93c5fd}
.fmt-sprint{background:rgba(217,119,6,.25);border:1px solid rgba(217,119,6,.5);color:#fcd34d}
.fmt-call{background:rgba(5,150,105,.25);border:1px solid rgba(5,150,105,.5);color:#6ee7b7}
.daily-streak-bar{display:flex;align-items:center;gap:.65rem;background:rgba(255,255,255,.07);border-radius:var(--rs);padding:.55rem .9rem;margin-top:.75rem}
.daily-streak-fire{font-size:1.4rem;filter:drop-shadow(0 1px 4px rgba(214,93,134,.5))}
.daily-streak-info{font-size:.82rem;color:rgba(255,255,255,.8)}
.daily-streak-num{font-weight:800;color:var(--lo);font-size:1rem}
.daily-xp-pill{margin-left:auto;background:rgba(214,93,134,.2);border:1px solid rgba(214,93,134,.4);border-radius:2rem;padding:.2rem .65rem;font-size:.76rem;font-weight:700;color:var(--lo)}
.daily-freeze-pill{display:inline-flex;align-items:center;gap:.3rem;background:rgba(59,79,134,.24);border:1px solid rgba(59,79,134,.5);border-radius:2rem;padding:.18rem .6rem;font-size:.72rem;font-weight:700;color:#9fb2e0;margin-left:.5rem}
/* Next streak milestone — the target that fills the long gaps between
   celebrations. Rose (the accent) because it is something to reach for, unlike
   the freeze pill's cool navy. */
.daily-next-ms{display:inline-flex;align-items:center;background:rgba(214,93,134,.16);border:1px solid rgba(214,93,134,.42);border-radius:2rem;padding:.18rem .6rem;font-size:.72rem;font-weight:700;color:#f0a7c0;margin-left:.5rem}

/* Challenge card */
.daily-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.6rem;margin-bottom:1rem}
.daily-setup{font-size:.93rem;line-height:1.7;color:var(--tx);margin-bottom:1.2rem}
.daily-q{font-family:var(--fd);font-size:1.1rem;color:var(--lp);font-weight:700;margin-bottom:1rem;line-height:1.45}
body.liq-dark .daily-q{color:var(--heading)}
.daily-option{background:var(--g100);border:2px solid var(--bdr);border-radius:var(--r);padding:1rem 1.2rem;margin-bottom:.6rem;cursor:pointer;transition:all .2s;display:flex;align-items:flex-start;gap:.75rem;font-size:.9rem}
.daily-option:hover{border-color:var(--lo);background:var(--lo-p)}
.daily-option.selected-correct{border-color:var(--ok)!important;background:rgba(22,163,74,.08)!important}
.daily-option.selected-wrong{border-color:var(--er)!important;background:rgba(220,38,38,.08)!important}
.daily-option.reveal-correct{border-color:var(--ok)!important;background:rgba(22,163,74,.06)!important}
.daily-option.disabled{pointer-events:none;opacity:.65}
.daily-option.disabled .daily-opt-chev{display:none}
.daily-opt-letter{width:1.6rem;height:1.6rem;border-radius:50%;background:var(--lp-t);color:var(--lp);font-weight:800;font-size:.78rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.05rem}
.daily-opt-text{flex:1;min-width:0}
.daily-opt-chev{flex-shrink:0;color:var(--txm);opacity:.6;font-size:1rem;align-self:center;transition:transform .2s,opacity .2s}
.daily-option:hover .daily-opt-chev{color:var(--lo);opacity:1;transform:translateX(3px)}
.daily-option-clickable{position:relative}
.daily-option-clickable::before{content:'';position:absolute;inset:0;border-radius:var(--r);pointer-events:none;box-shadow:0 0 0 0 rgba(214,93,134,0);transition:box-shadow .2s}
.daily-option-clickable:hover::before{box-shadow:0 0 0 2px rgba(214,93,134,.18)}
.daily-action-hint{display:inline-flex;align-items:center;gap:.35rem;background:rgba(214,93,134,.1);color:var(--lo-h);font-size:.78rem;font-weight:700;padding:.35rem .75rem;border-radius:1rem;margin-bottom:.85rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
body.liq-dark .daily-action-hint{background:rgba(214,93,134,.18);color:#fcd34d}
.daily-feedback{background:var(--g100);border-left:4px solid var(--ok);border-radius:0 var(--rs) var(--rs) 0;padding:.85rem 1rem;font-size:.87rem;color:var(--tx);margin-top:.75rem;display:none}
.daily-feedback.show{display:block}
.daily-feedback.wrong-fb{border-color:var(--er)}

/* Sprint format */
.sprint-q-wrap{margin-bottom:1.2rem}
.sprint-q-num{font-size:.65rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--txm);margin-bottom:.5rem}
.sprint-q-text{font-family:var(--fd);font-size:1rem;color:var(--lp);font-weight:700;margin-bottom:.8rem;line-height:1.45}
body.liq-dark .sprint-q-text{color:var(--heading)}
.sprint-btns{display:flex;gap:.65rem}
.sprint-btn{flex:1;padding:.75rem;border-radius:var(--r);border:2px solid var(--bdr);background:var(--wh);font-weight:800;font-size:.95rem;cursor:pointer;transition:all .2s}
.sprint-btn:hover{border-color:var(--lo);color:var(--lo)}
.sprint-btn.correct{background:rgba(22,163,74,.12);border-color:var(--ok);color:var(--ok)}
.sprint-btn.wrong{background:rgba(220,38,38,.1);border-color:var(--er);color:var(--er)}
.sprint-progress{display:flex;gap:.4rem;margin-bottom:1.2rem}
.sprint-pip{height:4px;flex:1;border-radius:2px;background:var(--g200);transition:background .3s}
.sprint-pip.done-right{background:var(--ok)}
.sprint-pip.done-wrong{background:var(--er)}
.sprint-pip.active{background:var(--lo)}

/* My Daily — call-to-action button with radiating pulse animation */
.daily-stats-cta{position:relative;display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,var(--lo) 0%,#ff9b3d 100%);color:#fff;font-weight:800;font-size:.86rem;letter-spacing:.02em;padding:.55rem 1.15rem;border:0;border-radius:2rem;cursor:pointer;box-shadow:0 3px 10px rgba(214,93,134,.35),0 1px 3px rgba(0,0,0,.15);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;text-decoration:none;white-space:nowrap;z-index:0}
.daily-stats-cta:hover,.daily-stats-cta:focus{transform:translateY(-1px) scale(1.04);box-shadow:0 5px 16px rgba(214,93,134,.55),0 2px 5px rgba(0,0,0,.18);color:#fff;filter:brightness(1.08);outline:none}
.daily-stats-cta:active{transform:translateY(0) scale(1.01)}
.daily-stats-cta i{font-size:1rem}
.daily-stats-cta::before,.daily-stats-cta::after{content:'';position:absolute;inset:0;border-radius:2rem;border:2px solid var(--lo);pointer-events:none;animation:stats-cta-pulse 2.4s ease-out infinite;z-index:-1}
.daily-stats-cta::after{animation-delay:1.2s}
@keyframes stats-cta-pulse{
  0%{transform:scale(1);opacity:.85}
  60%{opacity:0}
  100%{transform:scale(1.55);opacity:0}
}
/* Smaller variant for inline use in tighter spots */
.daily-stats-cta.daily-stats-cta-sm{font-size:.78rem;padding:.4rem .85rem}
.daily-stats-cta.daily-stats-cta-sm::before,.daily-stats-cta.daily-stats-cta-sm::after{border-width:1.5px}
/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion:reduce){
  .daily-stats-cta::before,.daily-stats-cta::after{animation:none;opacity:0}
  .daily-stats-cta:hover,.daily-stats-cta:focus{transform:none}
}

/* My Daily — stats dashboard */
.md-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.75rem;margin-bottom:1.5rem}
.md-summary-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1rem 1.1rem;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.04)}
body.liq-dark .md-summary-card{background:var(--wh)}
.md-summary-num{font-family:var(--fd);font-size:2rem;font-weight:700;color:var(--lp);line-height:1.05;display:flex;align-items:baseline;justify-content:center;gap:.35rem}
body.liq-dark .md-summary-num{color:var(--heading)}
.md-summary-emoji{font-size:1.1rem}
.md-summary-lbl{font-size:.74rem;font-weight:700;color:var(--txm);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-top:.4rem;line-height:1.3}
.md-tiny{font-size:.62rem;font-weight:600;color:var(--txm);text-transform:none;letter-spacing:0}
.md-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.2rem 1.3rem;margin-bottom:1.2rem}
body.liq-dark .md-section{background:var(--wh)}
.md-section-hd{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.85rem}
.md-section-title{font-family:var(--fd);font-size:1.1rem;font-weight:700;color:var(--lp);margin:0}
body.liq-dark .md-section-title{color:var(--heading)}
.md-section-sub{font-size:.83rem;color:var(--txs);margin-bottom:.85rem;line-height:1.5}
.md-empty{font-size:.85rem;color:var(--txs);font-style:italic;margin:0}
.md-footer-note{font-size:.78rem;color:var(--txm);margin-top:1rem;line-height:1.55}
.md-bottom-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.75rem;margin-bottom:1rem}
/* Cases-needing-review block on My Daily — surfaces wrong-answered cases
   for re-attempt. Each row stacks meta/title/actions on mobile. */
.md-cases-review{display:flex;flex-direction:column;gap:.55rem}
.md-case-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.55rem .85rem;background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);padding:.65rem .85rem}
.md-case-meta{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;flex-shrink:0}
.md-case-year{font-size:.72rem;color:var(--txm);font-weight:700}
.md-case-title{flex:1;min-width:200px;font-family:var(--fd);font-size:.94rem;font-weight:700;color:var(--heading);line-height:1.3}
.md-case-actions{display:flex;gap:.4rem;flex-shrink:0}
@media (max-width:600px){
  .md-case-row{flex-direction:column;align-items:stretch}
  .md-case-actions{justify-content:flex-end}
}

/* Heatmap */
.md-heatmap-wrap{overflow-x:auto;padding-bottom:.5rem}
.md-heatmap-months{display:grid;grid-template-columns:repeat(53,minmax(11px,1fr));gap:2px;margin-left:30px;margin-bottom:.3rem;min-width:610px}
.md-heatmap-month{font-size:.66rem;color:var(--txm);font-weight:600;letter-spacing:.02em;grid-row:1}
.md-heatmap-body{display:flex;gap:4px;min-width:640px}
.md-heatmap-days{display:grid;grid-template-rows:repeat(7,minmax(11px,1fr));gap:2px;font-size:.66rem;color:var(--txm);width:26px;flex-shrink:0}
.md-heatmap-day{display:flex;align-items:center;height:11px;line-height:1}
.md-heatmap-grid{display:grid;grid-template-rows:repeat(7,minmax(11px,1fr));grid-auto-flow:column;grid-auto-columns:minmax(11px,1fr);gap:2px;flex:1}
.md-cell{width:100%;height:11px;border-radius:2px;background:var(--g200);transition:transform .15s,box-shadow .15s;cursor:default}
/* On phones, shrink the heatmap so the full year fits without horizontal
   scroll. Cells go from 11px to 6px and gaps tighten to 1px — still readable
   at a glance, no swiping required. */
@media (max-width:600px){
  .md-heatmap-wrap{overflow-x:hidden}
  .md-heatmap-months{min-width:0;grid-template-columns:repeat(53,minmax(6px,1fr));gap:1px;margin-left:18px;font-size:.55rem}
  .md-heatmap-month{font-size:.55rem}
  .md-heatmap-body{min-width:0;gap:2px}
  .md-heatmap-days{width:14px;font-size:.55rem;grid-template-rows:repeat(7,minmax(6px,1fr));gap:1px}
  .md-heatmap-day{height:6px}
  .md-heatmap-grid{grid-template-rows:repeat(7,minmax(6px,1fr));grid-auto-columns:minmax(6px,1fr);gap:1px}
  .md-cell{height:6px;border-radius:1px}
  .md-cell:hover{transform:scale(1.8)}
}
.md-cell:hover{transform:scale(1.4);box-shadow:0 0 0 1px var(--lo);z-index:1}
.md-cell-empty{background:rgba(0,0,0,.06)}
body.liq-dark .md-cell-empty{background:rgba(255,255,255,.05)}
.md-cell-future{background:transparent;border:1px dashed rgba(0,0,0,.05)}
body.liq-dark .md-cell-future{border-color:rgba(255,255,255,.04)}
.md-cell-wrong{background:rgba(217,119,6,.55)}
.md-cell-legacy{background:rgba(214,93,134,.45)}
.md-cell-correct{background:var(--lo)}
.md-cell-mastered{background:#10b981;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.md-cell-today{outline:1.5px solid var(--lp);outline-offset:1px}
body.liq-dark .md-cell-today{outline-color:#fcd34d}
.md-heatmap-legend{display:flex;align-items:center;gap:.3rem;font-size:.7rem;color:var(--txm)}
.md-legend-cell{width:11px;height:11px;border-radius:2px;display:inline-block}
.md-legend-cell.md-cell-empty{background:rgba(0,0,0,.06)}
body.liq-dark .md-legend-cell.md-cell-empty{background:rgba(255,255,255,.05)}
.md-legend-lbl{font-weight:600;letter-spacing:.04em}

/* Theme accuracy bars */
.md-themes{display:flex;flex-direction:column;gap:.55rem}
.md-theme-row{display:grid;grid-template-columns:140px 1fr 90px;gap:.75rem;align-items:center;font-size:.85rem}
.md-theme-name{font-weight:700;color:var(--tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.md-theme-bar-wrap{height:.7rem;background:var(--g200);border-radius:.4rem;overflow:hidden;position:relative}
body.liq-dark .md-theme-bar-wrap{background:rgba(255,255,255,.08)}
.md-theme-bar{height:100%;border-radius:.4rem;transition:width .4s}
.md-bar-strong{background:var(--ok)}
.md-bar-mid{background:var(--lo)}
.md-bar-weak{background:#dc2626}
.md-theme-pct{font-weight:700;color:var(--tx);text-align:right;font-size:.83rem}
@media (max-width:600px){
  .md-theme-row{grid-template-columns:1fr;gap:.2rem}
  .md-theme-pct{text-align:left}
}

/* Streak milestone celebration overlay — fires on 7/14/30/60/100/365-day
   streaks. Mirrors lu-overlay structure but adds a CSS-only confetti burst
   and a much bigger streak number for the "you just did something rare" feel. */
.sm-overlay{position:fixed;inset:0;background:rgba(20,12,32,.78);backdrop-filter:blur(4px);z-index:var(--z-modal-popover);display:none;align-items:center;justify-content:center;padding:1rem;animation:sm-overlay-in .35s ease-out}
.sm-overlay.show{display:flex}
@keyframes sm-overlay-in{0%{opacity:0;backdrop-filter:blur(0)}100%{opacity:1;backdrop-filter:blur(4px)}}
.sm-card{position:relative;background:linear-gradient(135deg,var(--lp-d) 0%,var(--lp-m) 60%,#5b1f6c 100%);border:2px solid rgba(214,93,134,.55);border-radius:var(--rl);padding:2rem 2rem 1.6rem;text-align:center;color:#fff;box-shadow:0 24px 70px rgba(0,0,0,.45),0 0 60px rgba(214,93,134,.25);max-width:420px;width:100%;z-index:2;animation:sm-card-pop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes sm-card-pop{0%{transform:scale(.6) translateY(20px);opacity:0}60%{transform:scale(1.06)}100%{transform:scale(1) translateY(0);opacity:1}}
.sm-flame{font-size:3rem;line-height:1;margin-bottom:.4rem;filter:drop-shadow(0 0 18px rgba(214,93,134,.7));animation:sm-flame-glow 1.6s ease-in-out infinite alternate}
@keyframes sm-flame-glow{0%{filter:drop-shadow(0 0 12px rgba(214,93,134,.5))}100%{filter:drop-shadow(0 0 26px rgba(214,93,134,.95))}}
.sm-num{font-family:var(--fd);font-size:5rem;font-weight:700;color:var(--lo);line-height:.95;margin:.1rem 0;text-shadow:0 0 30px rgba(214,93,134,.5),0 4px 0 rgba(0,0,0,.2)}
.sm-day-lbl{font-family:var(--fd);font-size:.8rem;font-weight:700;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:1rem}
.sm-title{font-family:var(--fd);font-size:1.5rem;font-weight:700;color:#fff;margin-bottom:.55rem;letter-spacing:.01em}
.sm-sub{font-size:.92rem;line-height:1.55;color:rgba(255,255,255,.78);margin-bottom:1.4rem}
.sm-card .btn-liq{font-size:.92rem;padding:.65rem 1.4rem}

/* CSS-only confetti burst — particles are positioned with inline styles
   (random left / delay / duration / rotation) and fall + drift via the
   shared keyframe. */
.sm-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.sm-conf{position:absolute;top:-24px;width:9px;height:14px;border-radius:1px;animation:sm-conf-fall 2.6s ease-in 1 forwards;transform-origin:center}
@keyframes sm-conf-fall{
  0%{transform:translate3d(0,0,0) rotate(var(--sm-rot,0deg));opacity:0}
  10%{opacity:1}
  100%{transform:translate3d(var(--sm-drift,0vw),105vh,0) rotate(calc(var(--sm-rot,0deg) + 720deg));opacity:.4}
}
@media (prefers-reduced-motion:reduce){
  .sm-overlay,.sm-card{animation:none}
  .sm-flame{animation:none}
  .sm-conf{display:none}
}
@media (max-width:480px){
  .sm-card{padding:1.5rem 1.2rem 1.2rem}
  .sm-num{font-size:4rem}
  .sm-flame{font-size:2.4rem}
  .sm-title{font-size:1.25rem}
  .sm-sub{font-size:.86rem}
}

/* Track completion celebration — reuses sm-overlay scaffolding (same backdrop,
   confetti, animation). Track-specific bits: trophy icon, accent ring around
   the track name, and a 2-stat strip (modules / XP earned). */
.tc-card{max-width:460px}
.tc-trophy{font-size:3.4rem;line-height:1;margin-bottom:.35rem;filter:drop-shadow(0 0 22px rgba(214,93,134,.55));animation:sm-flame-glow 2.2s ease-in-out infinite alternate}
.tc-track-eyebrow{font-family:var(--fd);font-size:.78rem;font-weight:700;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo);margin-bottom:.45rem}
.tc-track-name{font-family:var(--fd);font-size:1.7rem;font-weight:700;color:#fff;line-height:1.2;margin-bottom:.6rem;padding:.1rem .85rem;display:inline-block;border-bottom:2px solid rgba(214,93,134,.55)}
.tc-stats{display:flex;justify-content:center;gap:1.6rem;margin:1.1rem 0 1.3rem;padding:.85rem 0;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.tc-stat{text-align:center;min-width:80px}
.tc-stat-num{font-family:var(--fd);font-size:1.7rem;font-weight:700;color:var(--lo);line-height:1}
.tc-stat-lbl{font-size:.7rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:.18rem}
.tc-actions{display:flex;justify-content:center;gap:.55rem;flex-wrap:wrap}
.tc-card .btn-out{color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.22)}
.tc-card .btn-out:hover{color:#fff;border-color:rgba(255,255,255,.45)}
@media (max-width:480px){
  .tc-track-name{font-size:1.35rem}
  .tc-trophy{font-size:2.8rem}
  .tc-stats{gap:1rem}
}

/* "Why this matters" — module link card under the daily completion */
.daily-complete-learn-more{display:flex;align-items:center;gap:.85rem;background:linear-gradient(135deg,var(--wh) 0%,rgba(214,93,134,.06) 100%);border:1px solid var(--bdr);border-left:4px solid var(--lo);border-radius:var(--rl);padding:.85rem 1.05rem;margin-top:1rem;text-align:left;box-shadow:0 1px 4px rgba(0,0,0,.04)}
.daily-complete-learn-more>i{font-size:1.6rem;color:var(--lo);flex-shrink:0}
.daily-complete-learn-more>div{flex:1;min-width:0}
.daily-learn-more-eyebrow{font-size:.7rem;font-weight:800;color:var(--txm);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-bottom:.15rem}
.daily-learn-more-title{font-family:var(--fd);font-size:.96rem;font-weight:700;color:var(--lp);line-height:1.3;overflow:hidden;text-overflow:ellipsis}
body.liq-dark .daily-complete-learn-more{background:rgba(214,93,134,.08)}
body.liq-dark .daily-learn-more-title{color:var(--heading)}
@media (max-width:480px){
  .daily-complete-learn-more{flex-direction:column;align-items:stretch;text-align:center;gap:.5rem}
  .daily-complete-learn-more>i{font-size:1.4rem}
}

/* Spaced-repetition review queue */
.daily-review-banner{display:flex;align-items:flex-start;gap:.75rem;background:linear-gradient(135deg,rgba(214,93,134,.10),rgba(214,93,134,.04));border:1px solid var(--lo);border-left:5px solid var(--lo);border-radius:var(--r);padding:.75rem .95rem;margin-bottom:1rem;color:var(--tx)}
.daily-review-banner>i{color:var(--lo);font-size:1.4rem;flex-shrink:0;margin-top:.05rem}
.daily-review-banner-title{font-weight:800;color:var(--lo);font-size:.92rem;letter-spacing:.02em;margin-bottom:.1rem}
.daily-review-banner-sub{color:var(--txs);font-size:.82rem;line-height:1.5}
body.liq-dark .daily-review-banner{background:rgba(214,93,134,.12)}
body.liq-dark .daily-review-banner-title{color:#fcd34d}
.daily-review-pill{display:inline-flex;align-items:center;gap:.25rem;background:rgba(214,93,134,.18);color:var(--lo);font-size:.62rem;font-weight:800;padding:.18rem .5rem;border-radius:.6rem;margin-left:.4rem;letter-spacing:var(--ls-caps);text-transform:uppercase;vertical-align:middle}
.daily-home-card.daily-home-review{border-left:4px solid var(--lo)}
.daily-complete-review-strip{margin:0 auto 1rem;max-width:520px;padding:.7rem .95rem;border-radius:var(--r);font-size:.86rem;line-height:1.5;text-align:left;display:flex;align-items:flex-start;gap:.45rem}
.daily-complete-review-strip.is-mastered{background:rgba(22,163,74,.12);border:1px solid rgba(22,163,74,.4);color:var(--ok)}
.daily-complete-review-strip.is-new{background:rgba(214,93,134,.12);border:1px solid rgba(214,93,134,.4);color:var(--lo)}
.daily-complete-review-strip.is-rescheduled{background:rgba(217,119,6,.12);border:1px solid rgba(217,119,6,.4);color:#b45309}
body.liq-dark .daily-complete-review-strip.is-mastered{color:#4ade80}
body.liq-dark .daily-complete-review-strip.is-rescheduled{color:#fbbf24}

/* Practitioner's Call — staged conversational format */
.daily-call-stage{display:flex;align-items:center;gap:.5rem;margin:.5rem 0 .65rem;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm)}
.daily-call-stage-num{width:1.5rem;height:1.5rem;border-radius:50%;background:var(--lo);color:#fff;font-size:.72rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.daily-call-bubble{background:var(--g100);border-left:4px solid var(--lo);border-radius:0 var(--r) var(--r) 0;padding:.85rem 1rem;margin-bottom:1rem}
.daily-call-bubble.is-reply{border-left-color:#059669;background:rgba(5,150,105,.06)}
.daily-call-bubble-hd{display:flex;align-items:center;gap:.5rem;margin-bottom:.45rem;font-size:.85rem;flex-wrap:wrap}
.daily-call-bubble-name{font-weight:800;color:var(--lp)}
.daily-call-bubble-role{color:var(--txs);font-size:.78rem;font-weight:500}
.daily-call-bubble-msg{font-size:.92rem;line-height:1.65;color:var(--tx)}
.daily-call-bubble-msg p{margin-bottom:.7rem}
.daily-call-bubble-msg p:last-child{margin-bottom:0}
.daily-call-insight{background:rgba(214,93,134,.08);border-left:3px solid var(--lo);border-radius:0 var(--rs) var(--rs) 0;padding:.6rem .85rem;font-size:.83rem;color:var(--tx);margin:-.5rem 0 1rem;line-height:1.55}
.daily-call-insight strong{color:var(--lp)}
.daily-call-quality{display:inline-block;font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);padding:.18rem .55rem;border-radius:.75rem;margin-left:.4rem}
.daily-call-quality.q-best{background:rgba(22,163,74,.18);color:var(--ok)}
.daily-call-quality.q-acceptable{background:rgba(217,119,6,.18);color:#b45309}
.daily-call-quality.q-weak{background:rgba(220,38,38,.14);color:var(--er)}
.daily-call-quality.q-wrong{background:rgba(220,38,38,.22);color:var(--er)}
body.liq-dark .daily-call-bubble{background:rgba(255,255,255,.05)}
body.liq-dark .daily-call-bubble.is-reply{background:rgba(5,150,105,.10)}
body.liq-dark .daily-call-bubble-name{color:var(--heading)}
body.liq-dark .daily-call-insight{background:rgba(214,93,134,.12)}
body.liq-dark .daily-call-insight strong{color:var(--lo)}

/* Completion */
.daily-complete-card{background:linear-gradient(135deg,var(--lp-d),var(--lp-m));border-radius:var(--rl);padding:2.2rem;text-align:center;color:#fff}
.daily-complete-xp{font-size:3.5rem;font-weight:800;color:var(--lo);line-height:1;margin:.6rem 0}
.daily-complete-streak{font-size:1rem;color:rgba(255,255,255,.75);margin-bottom:1.5rem}
.daily-complete-msg{font-family:var(--fd);font-size:1.3rem;font-weight:700;margin-bottom:.4rem}

/* Dark mode */
body.liq-dark .daily-option{background:var(--g100);border-color:var(--bdr)}
body.liq-dark .sprint-btn{background:var(--wh);border-color:var(--bdr);color:var(--tx)}
body.liq-dark .daily-card{background:var(--wh)}
body.liq-dark .daily-feedback{background:var(--g100)}
/* Hide nav links when not logged in */
body.liq-logged-out .navbar-nav,
body.liq-logged-out .nav-search-btn,
body.liq-logged-out .navbar-toggler{display:none!important}
/* ── Edit User modal — dark mode ── */
/* Modal card: lift slightly above the page so it's a distinct surface */
.liq-dark .admin-modal{background:var(--g100);border:1px solid var(--g400)}
/* Modal title — clearer divider */
.liq-dark .admin-modal-title{color:var(--tx);border-bottom:1px solid var(--bdr);padding-bottom:.8rem}
/* Inputs inside modal: darker than card so they read as inset fields */
.liq-dark .admin-modal .pi{background-color:var(--wh);border-color:var(--g400);color:var(--tx)}
/* Dropdown arrow: bright stroke visible on dark background — use background-color (not shorthand)
   so we don't clobber the background-image from .pi-sel */
body.liq-dark .pi-sel{color-scheme:dark;background-color:var(--wh);color:var(--tx);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c0b0d0' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .72rem center}
body.liq-dark .pi-sel option{background-color:#1e1530;color:#e8e0f2}
/* Section label dividers */
.liq-dark .modal-section-label{color:var(--txs);border-top-color:var(--g400)}
/* Unlock All row */
.liq-dark .admin-modal .pf[style*="background:var(--g100)"]{background:var(--g200)!important}
/* Toggle: off-track brighter so it reads as interactive */
.liq-dark .toggle-slider{background:var(--g400)}
/* Path builder */
.liq-dark .path-builder{border-color:var(--g400)}
.liq-dark .path-builder-hdr{background:var(--g200);color:var(--txs)}
.liq-dark .path-track-row{background:var(--wh);border-top-color:var(--bdr)}
.liq-dark .path-track-num{background:var(--lo);color:#fff}
.liq-dark .path-track-name{color:var(--tx)}
.liq-dark .path-add-row{background:var(--g200);border-top-color:var(--bdr)}
.liq-dark .path-add-sel{color-scheme:dark;background-color:var(--wh);color:var(--tx);border-color:var(--g400);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c0b0d0' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .6rem center}
.liq-dark .path-add-sel option{background-color:#1e1530;color:#e8e0f2}
.liq-dark .path-add-btn{background:rgba(214,93,134,.25);border-color:var(--lo);color:var(--lo)}
.liq-dark .path-add-btn:hover{background:var(--lo);color:#fff}
/* Modal close button */
.liq-dark .admin-modal .admin-action-btn{color:var(--txs)}
.liq-dark .admin-modal .admin-action-btn:hover{color:var(--tx);background:var(--g200)}
/* ── Dark mode contrast fixes ── */
.liq-dark .toc-item.active{color:var(--lo)}
.liq-dark .toc-item:hover{color:var(--lo)}
.liq-dark .takeaway-box h6{color:var(--lo)}
.liq-dark .mob-nav-btn.active{color:var(--lo)}

/* ── TOOL HISTORY DASHBOARD ────────────────────────────────────
   Single-page dashboard listing every tool with current state:
   draft-in-progress / saved snapshots / last activity. */
.th-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:.85rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.1rem 1.4rem;margin-bottom:1.2rem;box-shadow:var(--sh)}
.th-sum-stat{text-align:center}
.th-sum-num{font-family:var(--fd);font-size:1.85rem;font-weight:700;color:var(--lo);line-height:1}
.th-sum-lbl{font-size:.75rem;font-weight:700;color:var(--txm);letter-spacing:var(--ls-caps);text-transform:uppercase;margin-top:.22rem}
.th-list{display:flex;flex-direction:column;gap:.85rem}
.th-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.05rem 1.25rem;box-shadow:var(--sh);transition:border-color .18s,box-shadow .18s}
.th-card:hover{border-color:var(--lo);box-shadow:var(--shm)}
.th-card-hdr{display:flex;align-items:center;gap:.95rem;flex-wrap:wrap}
.th-icon{width:2.4rem;height:2.4rem;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0}
.th-card-meta{flex:1;min-width:200px;display:flex;flex-direction:column;gap:.25rem}
.th-card-name{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);line-height:1.2}
.th-card-action{flex-shrink:0;margin-left:auto}
.th-pill{display:inline-flex;align-items:center;gap:.32rem;font-size:.72rem;font-weight:700;padding:.18rem .55rem;border-radius:99px;letter-spacing:.02em;width:fit-content}
.th-pill-draft{background:rgba(214,93,134,.13);color:var(--lo-h)}
.th-pill-saved{background:rgba(22,163,74,.12);color:var(--ok)}
.th-pill-empty{background:var(--g100);color:var(--txm)}
.th-meta{font-size:.78rem;color:var(--txs);margin-top:.7rem}
.th-meta-dim{color:var(--txm);font-style:italic}
.th-snap-list{margin-top:.75rem;border-top:1px solid var(--bdr);padding-top:.7rem;display:flex;flex-direction:column;gap:.4rem}
.th-snap-row{display:flex;justify-content:space-between;align-items:flex-start;gap:.7rem;background:var(--bg);border-radius:var(--rs);padding:.55rem .75rem;cursor:pointer;transition:background .15s}
.th-snap-row:hover{background:var(--g100)}
.th-snap-main{flex:1;min-width:0}
.th-snap-title{font-size:.85rem;font-weight:700;color:var(--tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.th-snap-summary{font-size:.76rem;color:var(--txs);margin-top:.18rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.th-snap-date{font-size:.72rem;color:var(--txm);font-weight:700;flex-shrink:0;white-space:nowrap}
.th-snap-more{margin-top:.45rem;font-size:.78rem;color:var(--txm);text-align:right}
.th-snap-more a{color:var(--lo);font-weight:700}
@media (max-width:600px){
  .th-summary{grid-template-columns:repeat(3,1fr);padding:.85rem 1rem;gap:.5rem}
  .th-sum-num{font-size:1.45rem}
  .th-sum-lbl{font-size:.65rem}
  .th-card-hdr{gap:.7rem}
  .th-card-action{margin-left:0;width:100%}
  .th-card-action .btn-liq{width:100%;justify-content:center}
}
.liq-dark .th-summary,.liq-dark .th-card{background:var(--wh);border-color:var(--bdr)}
.liq-dark .th-snap-row{background:var(--g100)}
.liq-dark .th-snap-row:hover{background:var(--g200)}

/* ── ATTENDANCE SCANNER ─────────────────────────────────────────
   Scanner-mode toggle, capture input, status banner, manual-search panel,
   selected-attendees rail, guest chips. All scoped under .att-* so they
   don't conflict with anything else in the modal. */
.att-input-toolbar{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0 .65rem;align-items:center}
.att-mode-btn{display:inline-flex;align-items:center;gap:.4rem;border:1.5px solid var(--bdr);background:var(--wh);color:var(--txs);font-family:var(--fb);font-size:.78rem;font-weight:700;padding:.32rem .85rem;border-radius:2rem;cursor:pointer;transition:all .15s;white-space:nowrap}
.att-mode-btn:hover{border-color:var(--lo);color:var(--lo-h)}
.att-mode-btn.active{background:var(--lo);border-color:var(--lo);color:#fff}
.att-mode-btn.active i{color:#fff}
.att-mode-btn-guest{margin-left:auto}
/* Scanner capture panel */
.att-scanner-panel{background:linear-gradient(135deg,rgba(214,93,134,.05) 0%,rgba(214,93,134,.12) 100%);border:1.5px solid rgba(214,93,134,.35);border-radius:var(--rl);padding:.75rem .9rem;margin-bottom:.6rem}
.att-scan-row{display:flex;align-items:center;gap:.55rem}
.att-scan-ico{font-size:1.4rem;color:var(--lo-h);flex-shrink:0;animation:att-scan-pulse 1.6s ease-in-out infinite}
@keyframes att-scan-pulse{0%,100%{opacity:1}50%{opacity:.45}}
.att-scan-input{flex:1;border:1.5px solid var(--bdr);background:var(--wh);border-radius:var(--rs);padding:.5rem .75rem;font-family:'Courier New',monospace;font-size:.92rem;color:var(--tx)}
.att-scan-input:focus{outline:none;border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.18)}
.att-scan-status{margin-top:.55rem;font-size:.82rem;font-weight:700;padding:.32rem .6rem;border-radius:var(--rs);transition:background-color .2s,color .2s}
.att-scan-status.att-scan-ready{background:var(--g100);color:var(--txs)}
.att-scan-status.att-scan-success{background:var(--ok-l);color:var(--ok)}
.att-scan-status.att-scan-duplicate{background:var(--wa-l);color:var(--wa)}
.att-scan-status.att-scan-error{background:var(--er-l);color:var(--er)}
/* Manual-add search panel */
.att-manual-panel{margin-bottom:.6rem;position:relative}
.att-manual-row{display:flex;align-items:center;gap:.55rem;background:var(--wh);border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.45rem .7rem}
.att-manual-row:focus-within{border-color:var(--lo)}
.att-manual-ico{color:var(--txm);font-size:.95rem}
.att-manual-input{flex:1;border:0;background:transparent;font-family:var(--fb);font-size:.86rem;color:var(--tx);outline:none}
.att-manual-results{margin-top:.3rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rs);box-shadow:var(--shm);max-height:240px;overflow-y:auto;position:absolute;top:100%;left:0;right:0;z-index:10}
.att-manual-result{display:flex;align-items:center;gap:.6rem;width:100%;background:transparent;border:0;padding:.5rem .75rem;text-align:left;cursor:pointer;border-bottom:1px solid var(--bdr)}
.att-manual-result:last-child{border-bottom:0}
.att-manual-result:hover{background:var(--lo-p)}
.att-manual-avatar{width:1.7rem;height:1.7rem;border-radius:50%;background:var(--lp);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:800;flex-shrink:0}
.att-manual-meta{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:.05rem}
.att-manual-name{font-size:.86rem;font-weight:700;color:var(--tx)}
.att-manual-sub{font-size:.74rem;color:var(--txm)}
.att-manual-empty{padding:.6rem .85rem;font-size:.82rem;color:var(--txm);font-style:italic}
/* Selected-attendees rail */
.att-selected-rail{background:var(--g100);border-radius:var(--rs);padding:.55rem .75rem;margin-bottom:.65rem}
.att-selected-hdr{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.4rem}
.att-selected-chips{display:flex;flex-wrap:wrap;gap:.35rem}
.att-sel-chip{display:inline-flex;align-items:center;gap:.4rem;background:var(--wh);border:1px solid var(--bdr);border-radius:2rem;padding:.18rem .65rem .18rem .25rem;font-size:.8rem;font-weight:700;color:var(--tx);max-width:100%}
.att-sel-chip.att-sel-guest{background:rgba(214,93,134,.1);border-color:rgba(214,93,134,.4);color:var(--lo-h)}
.att-sel-avatar{width:1.4rem;height:1.4rem;border-radius:50%;background:var(--ok);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:800;flex-shrink:0}
.att-sel-guest-avatar{background:var(--lo)}
.att-sel-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.att-sel-note{font-weight:400;color:var(--txm);font-size:.74rem}
.att-sel-guest-tag{font-size:.6rem;font-weight:800;letter-spacing:.06em;background:var(--lo);color:#fff;padding:.05rem .35rem;border-radius:99px;margin-left:.35rem}
.att-sel-x{background:transparent;border:0;color:var(--txm);cursor:pointer;padding:0 .25rem;font-size:.85rem;line-height:1;border-radius:50%}
.att-sel-x:hover{background:var(--er-l);color:var(--er)}
/* Collapsed user-list header so the full browse list reads as fallback */
.att-userlist-collapsed-hdr{display:flex;align-items:center;justify-content:space-between;padding:.4rem 0;font-size:.76rem;color:var(--txm);font-weight:700}
.att-userlist-count{font-size:.72rem;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.att-pending-pill{background:var(--lo-l);color:var(--lo-h);font-size:.62rem;font-weight:800;padding:.05rem .35rem;border-radius:2px;letter-spacing:var(--ls-caps);text-transform:uppercase;margin-left:.35rem}

/* ── Admin user-detail QR block ───────────────────────────────── */
.admin-qr-block{display:flex;align-items:center;gap:1rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rs);padding:.85rem 1rem;margin-bottom:1rem}
.admin-qr-block-svg{flex-shrink:0;width:96px;height:96px}
.admin-qr-block-svg svg{width:100%;height:100%;display:block}
.admin-qr-block-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:.4rem}
.admin-qr-block-id{font-family:'Courier New',monospace;font-size:.78rem;color:var(--txs);word-break:break-all}
.admin-qr-block-help{font-size:.78rem;color:var(--txm);line-height:1.4}
@media (max-width:600px){
  .admin-qr-block{flex-direction:column;align-items:stretch;text-align:center}
  .admin-qr-block-svg{align-self:center}
}

/* ── My QR Code card on the Profile page ──────────────────────── */
.my-qr-card{background:linear-gradient(135deg,var(--wh) 0%,var(--lo-p) 100%);border:1.5px solid var(--lo);border-radius:var(--rl);padding:1.4rem 1.6rem;display:grid;grid-template-columns:1fr auto;gap:1.4rem;align-items:center;box-shadow:var(--sh)}
.my-qr-card-error{display:block;background:var(--wa-l);border-color:var(--wa);text-align:center;padding:1.2rem}
.my-qr-card-eyebrow{font-family:var(--fd);font-size:.72rem;font-weight:700;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo-h);margin-bottom:.55rem;display:flex;align-items:center;gap:.25rem}
.my-qr-card-title{font-family:var(--fd);font-size:1.15rem;font-weight:700;color:var(--heading);line-height:1.3;margin-bottom:.4rem}
.my-qr-card-sub{font-size:.86rem;color:var(--txs);line-height:1.5;margin-bottom:.85rem}
.my-qr-card-qr{grid-row:1 / span 4;width:160px;height:160px;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--rs);padding:8px;align-self:start}
.my-qr-card-qr svg{width:100%;height:100%;display:block}
.my-qr-card-id{grid-column:1;font-family:'Courier New',monospace;font-size:.74rem;color:var(--txm);word-break:break-all;margin-bottom:.5rem}
.my-qr-card-actions{grid-column:1;display:flex;gap:.45rem;flex-wrap:wrap}
@media (max-width:560px){
  .my-qr-card{grid-template-columns:1fr;text-align:center}
  .my-qr-card-qr{grid-row:auto;justify-self:center;width:200px;height:200px}
  .my-qr-card-id,.my-qr-card-actions{grid-column:auto;justify-content:center}
}

.liq-dark .att-scanner-panel{background:linear-gradient(135deg,rgba(214,93,134,.08) 0%,rgba(214,93,134,.16) 100%)}
.liq-dark .my-qr-card{background:var(--wh)}
.liq-dark .my-qr-card-qr{background:#fff}

/* ── ADMIN SCANNER TAB ──────────────────────────────────────────
   Self-contained Set up / Test / Use / Troubleshoot panel. Sections
   are full-width cards with consistent padding. Test panel uses a
   2-column grid that stacks to 1 column on mobile. */
.scn-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:linear-gradient(135deg,var(--lp) 0%,var(--lp-m) 100%);color:#fff;border-radius:var(--rl);padding:1.4rem 1.6rem;margin-bottom:1.4rem;position:relative;overflow:hidden}
.scn-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 100% 0%,rgba(214,93,134,.18) 0%,transparent 60%);pointer-events:none}
.scn-eyebrow{font-family:var(--fd);font-size:.7rem;font-weight:700;letter-spacing:var(--ls-caps-wide);text-transform:uppercase;color:var(--lo);margin-bottom:.45rem;display:inline-flex;align-items:center;gap:.3rem}
.scn-title{font-family:var(--fd);font-size:1.4rem;font-weight:700;color:#fff;line-height:1.25;margin-bottom:.45rem;position:relative}
.scn-sub{font-size:.9rem;color:rgba(255,255,255,.78);line-height:1.55;margin:0;max-width:640px;position:relative}
.scn-hero-status{display:flex;flex-direction:column;align-items:flex-end;gap:.4rem;flex-shrink:0;position:relative}
.scn-badge{display:inline-flex;align-items:center;gap:.35rem;font-size:.74rem;font-weight:700;padding:.32rem .75rem;border-radius:99px;flex-shrink:0;position:relative;white-space:nowrap}
.scn-badge-ok{background:rgba(22,163,74,.18);color:#7ce39c}
.scn-badge-warn{background:rgba(217,119,6,.22);color:#fcd34d}
.scn-badge-err{background:rgba(220,38,38,.2);color:#ffb3b3}
.scn-badge-neutral{background:rgba(255,255,255,.12);color:rgba(255,255,255,.72)}
.scn-badge>i{font-size:.85rem}
@media (max-width:600px){
  .scn-hero-status{align-items:flex-start;width:100%}
}
.scn-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.2rem 1.4rem;margin-bottom:1.2rem;box-shadow:var(--sh)}
.scn-section-info{background:var(--g100);border-left:4px solid var(--lo)}
.scn-section-info p{font-size:.86rem;color:var(--txs);line-height:1.6;margin:0}
.scn-section-info code{font-family:'Courier New',monospace;background:var(--wh);border:1px solid var(--bdr);padding:.05rem .35rem;border-radius:3px;font-size:.82rem;color:var(--lp-d)}
.scn-section-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);margin-bottom:.85rem;display:flex;align-items:center;gap:.5rem}
.scn-section-title>i{font-size:1.2rem}
.scn-steps{margin:0;padding-left:1.4rem;color:var(--txs);line-height:1.7;font-size:.92rem}
.scn-steps li{margin-bottom:.5rem}
.scn-steps strong{color:var(--tx)}

/* Test panel grid */
.scn-test-grid{display:grid;grid-template-columns:1fr 240px;gap:1.2rem;margin-bottom:1rem}
.scn-test-row{display:flex;align-items:center;gap:.55rem;background:var(--g100);border:2px solid var(--bdr);border-radius:var(--rs);padding:.6rem .85rem;transition:border-color .15s,box-shadow .15s}
.scn-test-row:focus-within{border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.18);background:var(--wh)}
.scn-test-ico{font-size:1.3rem;color:var(--lo-h);flex-shrink:0;animation:att-scan-pulse 1.6s ease-in-out infinite}
.scn-test-input{flex:1;border:0;background:transparent;font-family:'Courier New',monospace;font-size:.92rem;color:var(--tx);outline:none}
.scn-test-result{margin-top:.85rem;padding:.7rem 1rem;border-radius:var(--rs);font-size:.86rem;line-height:1.5;border:1px solid transparent}
.scn-test-result code{font-family:'Courier New',monospace;background:var(--wh);border:1px solid var(--bdr);padding:.05rem .35rem;border-radius:3px;font-size:.78rem}
.scn-test-result.scn-test-idle{background:var(--g100);color:var(--txm);font-style:italic}
.scn-test-result.scn-test-success{background:var(--ok-l);color:#15803d;border-color:rgba(22,163,74,.3)}
.scn-test-result.scn-test-error{background:var(--er-l);color:#b91c1c;border-color:rgba(220,38,38,.3)}
.scn-test-result.scn-test-duplicate{background:var(--wa-l);color:#b45309;border-color:rgba(217,119,6,.3)}
/* Test panel right column — your QR card */
.scn-yourqr-card{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rl);padding:1rem;text-align:center}
.scn-yourqr-label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.55rem}
.scn-yourqr-img{width:160px;height:160px;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--rs);padding:8px;margin:0 auto .5rem}
.scn-yourqr-img svg{width:100%;height:100%;display:block}
.scn-yourqr-img-fail{display:flex;align-items:center;justify-content:center;color:var(--er);font-size:.8rem;font-weight:700;text-align:center;padding:.5rem}
.scn-yourqr-id{font-family:'Courier New',monospace;font-size:.7rem;color:var(--txm);word-break:break-all}
.scn-yourqr-hint{margin-top:.5rem;font-size:.74rem;color:var(--txs);background:var(--lo-l);border-left:3px solid var(--lo);border-radius:var(--rs);padding:.45rem .55rem;line-height:1.5;text-align:left}

/* Scan history list */
.scn-history-hdr{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin:.85rem 0 .4rem}
.scn-history{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);max-height:260px;overflow-y:auto}
.scn-history-empty{padding:1rem;text-align:center;color:var(--txm);font-style:italic;font-size:.84rem}
.scn-hist-row{display:flex;align-items:flex-start;gap:.6rem;padding:.55rem .75rem;border-bottom:1px solid var(--bdr)}
.scn-hist-row:last-child{border-bottom:0}
.scn-hist-row>i{flex-shrink:0;font-size:1rem;margin-top:.1rem}
.scn-hist-row.scn-hist-ok>i{color:var(--ok)}
.scn-hist-row.scn-hist-warn>i{color:var(--wa)}
.scn-hist-row.scn-hist-err>i{color:var(--er)}
.scn-hist-meta{flex:1;min-width:0}
.scn-hist-line{font-size:.85rem;font-weight:700;color:var(--tx)}
.scn-hist-raw{font-size:.72rem;color:var(--txm);margin-top:.15rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scn-hist-raw code{font-family:'Courier New',monospace;font-size:.7rem}
.scn-hist-time{font-size:.72rem;color:var(--txm);font-weight:700;flex-shrink:0;white-space:nowrap}

/* Audio test row */
.scn-audio-test{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;padding:.7rem .9rem;background:var(--g100);border-radius:var(--rs)}
.scn-audio-label{font-size:.78rem;font-weight:700;color:var(--txs);margin-right:.3rem}

/* Workflow steps */
.scn-workflow{display:flex;flex-direction:column;gap:.65rem}
.scn-workflow-step{display:flex;gap:.85rem;align-items:flex-start;padding:.7rem .9rem;background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs)}
.scn-workflow-num{width:1.7rem;height:1.7rem;border-radius:50%;background:var(--lp);color:#fff;font-size:.82rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.scn-workflow-step>div:last-child{font-size:.88rem;color:var(--txs);line-height:1.55}
.scn-workflow-step strong{color:var(--tx)}
.scn-workflow-step em{color:var(--lo-h);font-style:normal;font-weight:700}
.scn-workflow-cta{margin-top:.4rem;text-align:center}

/* Troubleshooting */
.scn-trouble{display:flex;flex-direction:column;gap:.4rem}
.scn-trouble-item{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);overflow:hidden}
.scn-trouble-item[open]{border-color:var(--lo)}
.scn-trouble-q{padding:.65rem .9rem;font-weight:700;font-size:.88rem;color:var(--tx);cursor:pointer;list-style:none;display:flex;align-items:center;gap:.45rem;user-select:none}
.scn-trouble-q::before{content:'\F282';font-family:'bootstrap-icons';font-size:.8rem;color:var(--txm);transition:transform .15s}
.scn-trouble-item[open] .scn-trouble-q::before{transform:rotate(90deg);color:var(--lo)}
.scn-trouble-q::-webkit-details-marker{display:none}
.scn-trouble-a{padding:0 .9rem .85rem 1.95rem;font-size:.86rem;color:var(--txs);line-height:1.6}
.scn-trouble-a code{font-family:'Courier New',monospace;background:var(--wh);border:1px solid var(--bdr);padding:.05rem .35rem;border-radius:3px;font-size:.8rem;color:var(--lp-d)}

@media (max-width:780px){
  .scn-test-grid{grid-template-columns:1fr}
  .scn-yourqr-card{order:-1}
}
.liq-dark .scn-section{background:var(--wh)}
.liq-dark .scn-yourqr-card,.liq-dark .scn-history,.liq-dark .scn-workflow-step,.liq-dark .scn-trouble-item{background:var(--g100)}
.liq-dark .scn-yourqr-img{background:#fff}

/* ── Pre-Session Check CTA card (Scanner tab) ──────────────────── */
.scn-precheck-cta{display:flex;align-items:center;gap:1rem;background:linear-gradient(135deg,var(--lo-p) 0%,var(--lo-l) 100%);border:2px solid var(--lo);border-radius:var(--rl);padding:1.1rem 1.4rem;margin-bottom:1.4rem;box-shadow:0 4px 14px rgba(214,93,134,.12)}
.scn-precheck-cta-icon{flex-shrink:0;width:3rem;height:3rem;border-radius:50%;background:var(--lo);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:0 4px 10px rgba(214,93,134,.32)}
.scn-precheck-cta-meta{flex:1;min-width:0}
.scn-precheck-cta-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--heading);line-height:1.3;margin-bottom:.2rem}
.scn-precheck-cta-sub{font-size:.86rem;color:var(--txs);line-height:1.5}
@media (max-width:600px){
  .scn-precheck-cta{flex-direction:column;text-align:center;padding:1rem}
  .scn-precheck-cta-icon{margin-bottom:.4rem}
  .scn-precheck-cta .btn-liq{width:100%;justify-content:center}
}

/* ── Pre-Session Check wizard modal ──────────────────────────────
   Reuses the att-modal scaffolding (backdrop + card + actions) for
   visual parity with Record Attendance and Session Roster. Adds a
   step indicator at top + a step-content body that can be either a
   2-column grid (step 1) or single-column block (steps 2/3). */
.ps-card{max-width:680px}
.ps-stepper{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.85rem 1.4rem 0;flex-wrap:wrap}
.ps-step-pip{display:flex;flex-direction:column;align-items:center;gap:.3rem;flex-shrink:0;min-width:72px}
.ps-step-num{width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem;background:var(--g100);color:var(--txm);border:2px solid var(--bdr);transition:background-color .2s,color .2s,border-color .2s}
.ps-step-pip-active .ps-step-num{background:var(--lo);color:#fff;border-color:var(--lo);box-shadow:0 0 0 4px var(--lo-l)}
.ps-step-pip-done .ps-step-num{background:var(--ok);color:#fff;border-color:var(--ok)}
.ps-step-pip .ps-step-label{font-size:.7rem;font-weight:700;color:var(--txm);letter-spacing:var(--ls-caps);text-transform:uppercase}
.ps-step-pip-active .ps-step-label{color:var(--lo-h)}
.ps-step-pip-done .ps-step-label{color:var(--ok)}
.ps-step-line{width:32px;height:2px;background:var(--bdr);margin-bottom:1.2rem}
.ps-body{padding:1.25rem 1.7rem 0}
.ps-step-title{font-family:var(--fd);font-size:1.1rem;font-weight:700;color:var(--heading);margin:0 0 .5rem}
.ps-step-sub{font-size:.9rem;color:var(--txs);line-height:1.55;margin:0 0 1rem}
.ps-step-block{padding:.5rem 0}
/* Step 1 grid — capture input on the left, sample QR on the right */
.ps-step-grid{display:grid;grid-template-columns:1fr 200px;gap:1.4rem;align-items:start}
.ps-step-left{min-width:0}
.ps-step-right{min-width:0}
.ps-scan-row{display:flex;align-items:center;gap:.55rem;background:var(--g100);border:2px solid var(--bdr);border-radius:var(--rs);padding:.55rem .85rem;transition:border-color .15s,box-shadow .15s;margin-bottom:.7rem}
.ps-scan-row:focus-within{border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.18);background:var(--wh)}
.ps-scan-ico{font-size:1.3rem;color:var(--lo-h);flex-shrink:0;animation:att-scan-pulse 1.6s ease-in-out infinite}
.ps-banner{padding:.6rem .85rem;border-radius:var(--rs);font-size:.85rem;line-height:1.5;display:flex;align-items:flex-start;gap:.5rem}
.ps-banner-info{background:var(--g100);color:var(--txs)}
.ps-banner-ok{background:var(--ok-l);color:#15803d;border:1px solid rgba(22,163,74,.3)}
.ps-banner-err{background:var(--er-l);color:#b91c1c;border:1px solid rgba(220,38,38,.3)}
.ps-banner>i{font-size:1.05rem;flex-shrink:0;margin-top:.05rem}
.ps-qr-card{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rl);padding:.9rem;text-align:center}
.ps-qr-card-label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.5rem}
.ps-qr-img{width:100%;background:var(--wh);border:2px solid var(--bdr);border-radius:var(--rs);padding:8px;margin:0}
.ps-qr-img svg{width:100%;height:auto;display:block}
.ps-qr-card-warn{background:var(--wa-l);border-color:var(--wa);color:var(--wa);font-size:.82rem;font-weight:700;line-height:1.5;display:flex;flex-direction:column;align-items:center;gap:.35rem}
.ps-qr-card-warn>i{font-size:1.4rem}

/* Step 2 — audio confirmation */
.ps-audio-action{margin:1rem 0;text-align:center}
.ps-audio-action .btn-liq{font-size:1rem;padding:.7rem 1.5rem}
.ps-audio-hint{font-size:.82rem;color:var(--txs);background:var(--g100);border-radius:var(--rs);padding:.55rem .8rem;margin-bottom:1rem;line-height:1.55}
.ps-audio-confirm{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);padding:.85rem 1rem}
.ps-audio-confirm-q{font-weight:700;font-size:.92rem;color:var(--tx);margin-bottom:.7rem;text-align:center}
.ps-audio-confirm-btns{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}
.ps-audio-no{color:var(--er);border-color:var(--er)}
.ps-audio-no:hover{background:var(--er-l);color:var(--er);border-color:var(--er)}

/* Step 3 — skipped/placeholder */
.ps-step-skip{display:flex;align-items:flex-start;gap:.7rem;background:var(--g100);border-left:3px solid var(--lo);border-radius:var(--rs);padding:.85rem 1rem;font-size:.88rem;color:var(--txs);line-height:1.6}
.ps-step-skip>i{color:var(--lo);font-size:1.2rem;flex-shrink:0;margin-top:.1rem}
.ps-step-skip strong{color:var(--tx)}

/* Final summary */
.ps-final{text-align:center;padding:1rem 0 .5rem}
.ps-final-icon{font-size:3rem;line-height:1;margin-bottom:.5rem}
.ps-final-ok .ps-final-icon{color:var(--ok)}
.ps-final-warn .ps-final-icon{color:var(--wa)}
.ps-final-title{font-family:var(--fd);font-size:1.35rem;font-weight:700;color:var(--heading);margin:0 0 .35rem}
.ps-final-sub{font-size:.92rem;color:var(--txs);line-height:1.55;margin:0 auto 1.2rem;max-width:460px}
.ps-summary-list{list-style:none;padding:0;margin:0 0 .5rem;text-align:left;display:flex;flex-direction:column;gap:.5rem}
.ps-summary-row{display:flex;align-items:flex-start;gap:.7rem;padding:.7rem .9rem;border-radius:var(--rs);border:1px solid var(--bdr)}
.ps-summary-row>i{flex-shrink:0;font-size:1.15rem;margin-top:.1rem}
.ps-summary-row .ps-row-ok{color:var(--ok)}
.ps-summary-row .ps-row-bad{color:var(--er)}
.ps-summary-row .ps-row-neutral{color:var(--txm)}
.ps-row-ok-bg{background:var(--ok-l);border-color:rgba(22,163,74,.3)}
.ps-row-bad-bg{background:var(--er-l);border-color:rgba(220,38,38,.3)}
.ps-row-neutral-bg{background:var(--g100)}
.ps-summary-row-label{font-size:.92rem;font-weight:700;color:var(--tx);margin-bottom:.15rem}
.ps-summary-row-sub{font-size:.82rem;color:var(--txs);line-height:1.5}

.ps-actions{padding:1.1rem 1.7rem 1.4rem;flex-wrap:wrap;justify-content:flex-end;display:flex;gap:.5rem}

@media (max-width:600px){
  .ps-step-grid{grid-template-columns:1fr}
  .ps-stepper{padding:.65rem .8rem 0}
  .ps-step-pip{min-width:60px}
  .ps-step-pip .ps-step-label{font-size:.62rem}
  .ps-step-line{width:18px}
  .ps-body{padding:1rem 1.2rem 0}
  .ps-actions{padding:.85rem 1.2rem 1rem;flex-direction:column-reverse}
  .ps-actions .btn-liq{width:100%;justify-content:center}
}
.liq-dark .scn-precheck-cta{background:linear-gradient(135deg,rgba(214,93,134,.13) 0%,rgba(214,93,134,.22) 100%)}

/* ── CAMERA SCANNING (attendance modal + scanner tab + pre-session check)
   Live video preview with target reticle overlay and a flash animation
   on successful decode. Shared between three contexts: the Attendance
   modal Camera mode, the Scanner-tab camera test, and the Pre-Session
   Check Step 3. */
.att-camera-panel{background:linear-gradient(135deg,rgba(214,93,134,.05) 0%,rgba(214,93,134,.12) 100%);border:1.5px solid rgba(214,93,134,.35);border-radius:var(--rl);padding:.75rem;margin-bottom:.6rem}
.cam-video-wrap{position:relative;width:100%;background:#000;border-radius:var(--rs);overflow:hidden;aspect-ratio:4/3}
.cam-video-wrap-test{max-width:380px;margin:.65rem 0}
.cam-video{display:block;width:100%;height:100%;object-fit:cover;background:#000}
/* Reticle — translucent white box in the center, hints at the scan zone */
.cam-reticle{position:absolute;top:50%;left:50%;width:55%;aspect-ratio:1/1;transform:translate(-50%,-50%);border:3px solid rgba(255,255,255,.6);border-radius:8px;pointer-events:none;box-shadow:0 0 0 9999px rgba(0,0,0,.18);animation:cam-reticle-pulse 2.4s ease-in-out infinite}
@keyframes cam-reticle-pulse{0%,100%{border-color:rgba(255,255,255,.6)}50%{border-color:rgba(214,93,134,.9)}}
/* Flash overlay — briefly tints the video on a successful decode */
.cam-flash{position:absolute;inset:0;background:rgba(22,163,74,.55);opacity:0;pointer-events:none;transition:opacity .15s}
.cam-flash.cam-flash-on{opacity:1}
/* Camera-specific status banner colors (mirror att-scan-status pattern) */
.cam-status-ready{background:var(--g100);color:var(--txs)}
.cam-status-success{background:var(--ok-l);color:var(--ok)}
.cam-status-duplicate{background:var(--wa-l);color:var(--wa)}
.cam-status-error{background:var(--er-l);color:var(--er)}

/* Scanner tab camera-test row */
.scn-camera-test{margin-top:.85rem;background:var(--g100);border-radius:var(--rs);padding:.85rem 1rem}
.scn-camera-test-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.scn-camera-test-meta{flex:1;min-width:200px}
.scn-camera-test-title{font-size:.92rem;font-weight:700;color:var(--tx);display:flex;align-items:center;gap:.4rem;margin-bottom:.2rem}
.scn-camera-test-sub{font-size:.8rem;color:var(--txs);line-height:1.5}
.scn-cam-panel{margin-top:.85rem}

/* Pre-Session Check step 3 — start prompt + active panel */
.ps-cam-prompt{display:flex;align-items:center;gap:.85rem;background:var(--g100);border-radius:var(--rs);padding:.85rem 1rem;flex-wrap:wrap}
.ps-cam-prompt>i{font-size:1.6rem;color:var(--lo);flex-shrink:0}
.ps-cam-prompt>div{flex:1;min-width:200px;font-size:.88rem;color:var(--txs);line-height:1.55}
.ps-cam-prompt strong{color:var(--tx)}
.ps-cam-wrap{padding:.4rem 0}
.liq-dark .att-camera-panel{background:linear-gradient(135deg,rgba(214,93,134,.08) 0%,rgba(214,93,134,.16) 100%)}
.liq-dark .scn-camera-test,.liq-dark .ps-cam-prompt{background:var(--g100)}

/* ── Live throughput stats strip (Attendance modal) ──────────────
   Compact dashboard above the selected-rail showing real-time scan
   counts + elapsed time. Only renders once any scan has occurred —
   keeps the modal clean before the session starts. Cells are colour-
   coded by outcome and fold gracefully on narrow widths. */
.att-stats-strip{display:flex;flex-wrap:wrap;gap:.45rem;background:var(--g100);border-radius:var(--rs);padding:.55rem;margin-bottom:.65rem}
.att-stats-cell{flex:1;min-width:64px;background:var(--wh);border-radius:var(--rs);padding:.4rem .55rem;text-align:center;border:1px solid var(--bdr);transition:transform .12s}
.att-stats-cell:hover{transform:translateY(-1px)}
.att-stats-num{font-family:var(--fd);font-size:1.25rem;font-weight:700;line-height:1;color:var(--tx)}
.att-stats-lbl{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-top:.2rem}
.att-stats-cell-ok .att-stats-num{color:var(--ok)}
.att-stats-cell-ok{background:var(--ok-l);border-color:rgba(22,163,74,.3)}
.att-stats-cell-guest .att-stats-num{color:var(--lo-h)}
.att-stats-cell-guest{background:var(--lo-l);border-color:rgba(214,93,134,.3)}
.att-stats-cell-warn .att-stats-num{color:var(--wa)}
.att-stats-cell-warn{background:var(--wa-l);border-color:rgba(217,119,6,.3)}
.att-stats-cell-err .att-stats-num{color:var(--er)}
.att-stats-cell-err{background:var(--er-l);border-color:rgba(220,38,38,.3)}
.att-stats-cell-time .att-stats-num{color:var(--lp);font-family:'Courier New',monospace;font-size:1.1rem;font-weight:700}
.att-stats-cell-time{background:var(--lp-t);border-color:rgba(43,58,103,.18)}
@media (max-width:520px){
  .att-stats-cell{min-width:0;flex:1 1 calc(50% - .45rem)}
  .att-stats-num{font-size:1.05rem}
  .att-stats-lbl{font-size:.58rem}
}

/* ── Attendance modal header actions (Help + Close) ────────────── */
.att-hdr-actions{display:flex;align-items:flex-start;gap:.45rem;flex-shrink:0}
.att-help-btn{background:transparent;border:1.5px solid var(--bdr);color:var(--txs);font-family:var(--fb);font-size:.78rem;font-weight:700;padding:.32rem .75rem;border-radius:2rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap}
.att-help-btn:hover{border-color:var(--lo);color:var(--lo-h);background:var(--lo-l)}
.att-help-btn i{font-size:.92rem}
@media (max-width:520px){
  .att-help-btn{font-size:.72rem;padding:.25rem .55rem}
  .att-help-btn span,.att-help-btn .att-help-text{display:none}
}

/* ── Attendee row pills (site / role / status) ─────────────────── */
.att-sess-attendee-pill{display:inline-flex;align-items:center;gap:.25rem;font-size:.66rem;font-weight:700;padding:.08rem .42rem;border-radius:99px;letter-spacing:.02em;white-space:nowrap}
.att-sess-pill-role{background:var(--lp-t);color:var(--lp-d)}
.att-sess-pill-site{background:rgba(8,145,178,.13);color:#0e7490}
.att-sess-pill-archived{background:var(--wa-l);color:var(--wa)}
.att-sess-pill-deleted{background:var(--er-l);color:var(--er)}
.att-sess-attendee-pill>i{font-size:.7rem}

/* ── Session-history pager ─────────────────────────────────────── */
.att-sess-pager{display:flex;align-items:center;justify-content:center;gap:.7rem;padding:.7rem 1rem;font-size:.8rem;color:var(--txm);border-top:1px solid var(--bdr);flex-wrap:wrap}
.att-sess-pager .btn-liq{font-size:.78rem;padding:.35rem .85rem}

/* ── Expanded session-history detail view ─────────────────────── */
.att-sess-details{padding:.65rem 1rem .85rem 2rem;background:var(--g100);border-bottom:1px solid var(--bdr)}
.att-sess-subhdr{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.25rem}
.att-sess-list{margin:0;padding-left:1.1rem;color:var(--tx);list-style:disc}
.att-sess-list-guests{list-style:none;padding-left:0}
.att-sess-attendee,.att-sess-guest{padding:.18rem 0;font-size:.82rem;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.att-sess-attendee-name{font-weight:600;color:var(--tx)}
.att-sess-attendee-email{color:var(--txm);font-size:.74rem}
.att-sess-remove-btn{background:transparent;border:0;color:var(--txm);cursor:pointer;padding:.05rem .35rem;border-radius:3px;font-size:.85rem;line-height:1;margin-left:auto;opacity:.45;transition:opacity .15s,background-color .15s,color .15s}
.att-sess-remove-btn:hover{opacity:1;background:var(--er-l);color:var(--er)}
.att-sess-empty{font-size:.78rem;color:var(--txm);font-style:italic;padding:.4rem 0}
.att-sess-guest-tag{font-size:.6rem;font-weight:800;letter-spacing:.05em;background:var(--lo);color:#fff;padding:.05rem .35rem;border-radius:99px;flex-shrink:0}
.att-sess-foot{margin-top:.7rem;padding-top:.55rem;border-top:1px solid var(--bdr);font-size:.74rem;color:var(--txm);display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
.att-sess-delete-btn{color:var(--er);border-color:rgba(220,38,38,.4);font-size:.74rem;flex-shrink:0}
.att-sess-delete-btn:hover{background:var(--er-l);border-color:var(--er);color:var(--er)}

/* ── Guest log section ─────────────────────────────────────────── */
.guest-log-list{display:flex;flex-direction:column;border-top:1px solid var(--bdr)}
.guest-log-row{display:flex;align-items:flex-start;gap:.85rem;padding:.65rem 1rem;border-bottom:1px solid var(--bdr)}
.guest-log-row:last-child{border-bottom:0}
.guest-log-name{display:flex;align-items:center;gap:.45rem;font-weight:700;font-size:.88rem;color:var(--tx);min-width:200px;flex-shrink:0}
.guest-log-meta{flex:1;min-width:0;font-size:.78rem;color:var(--txs);display:flex;flex-direction:column;gap:.15rem}
.guest-log-date{font-weight:700;color:var(--tx);font-size:.8rem}
.guest-log-note{color:var(--txs);font-style:italic}
.guest-log-sub{color:var(--txm);font-size:.74rem}
@media (max-width:600px){
  .guest-log-row{flex-direction:column;gap:.3rem}
  .guest-log-name{min-width:0}
}

/* ── Bulk QR print picker ──────────────────────────────────────── */
.bulkqr-filter-tag{display:inline-block;font-size:.74rem;font-weight:700;background:var(--lo-l);color:var(--lo-h);padding:.1rem .5rem;border-radius:99px;margin-left:.3rem}
.bulkqr-formats{display:flex;flex-direction:column;gap:.55rem;padding:0 1.7rem;margin-bottom:.5rem}
.bulkqr-format{display:flex;align-items:flex-start;gap:.85rem;padding:.85rem 1rem;background:var(--bg);border:2px solid var(--bdr);border-radius:var(--rs);cursor:pointer;transition:border-color .15s,background-color .15s}
.bulkqr-format:hover{border-color:var(--lo)}
.bulkqr-format.active{background:var(--lo-p);border-color:var(--lo);box-shadow:0 0 0 3px rgba(214,93,134,.15)}
.bulkqr-format input[type="radio"]{flex-shrink:0;margin-top:.25rem;accent-color:var(--lo)}
.bulkqr-format-icon{font-size:1.5rem;color:var(--lo-h);flex-shrink:0;margin-top:.1rem}
.bulkqr-format-meta{flex:1;min-width:0}
.bulkqr-format-title{font-family:var(--fd);font-size:.95rem;font-weight:700;color:var(--heading);line-height:1.3;margin-bottom:.25rem}
.bulkqr-format-desc{font-size:.8rem;color:var(--txs);line-height:1.5;margin-bottom:.45rem}
.bulkqr-format-out{font-size:.78rem;color:var(--tx);font-weight:600}
.bulkqr-format-out strong{color:var(--lp)}
.liq-dark .bulkqr-format{background:var(--g100)}
.liq-dark .bulkqr-format.active{background:var(--lo-p)}

/* Password strength meter — 4 segments + label, rendered by             */
/* _renderPasswordStrengthMeter(inputId, meterId) in js/14-auth-search.js */
.pwd-meter{display:none;margin-top:.4rem;font-size:.74rem}
.pwd-meter-bars{display:flex;gap:3px;margin-bottom:.2rem}
.pwd-meter-bar{flex:1;height:4px;border-radius:2px;background:var(--g200);transition:background .15s}
.pwd-meter-label{font-weight:600;line-height:1.4}

/* Welcome / empty-state panel — shown on Overview and Users tab when    */
/* no real users exist yet. Visual hierarchy puts this above the busy     */
/* dashboard so the new admin sees a path forward instead of zero KPIs.   */
.dash-welcome{display:flex;gap:1.25rem;align-items:flex-start;background:linear-gradient(135deg,rgba(214,93,134,.10),rgba(123,53,143,.06));border:1px solid rgba(214,93,134,.25);border-radius:var(--rl);padding:1.4rem 1.6rem;margin-bottom:1.1rem}
.dash-welcome-icon{flex-shrink:0;width:64px;height:64px;border-radius:50%;background:rgba(214,93,134,.18);display:flex;align-items:center;justify-content:center;font-size:1.85rem;color:var(--lo)}
.dash-welcome-body{flex:1;min-width:0}
.dash-welcome-body h2{font-family:var(--fd);font-size:1.25rem;color:var(--heading);margin:0 0 .35rem;line-height:1.3}
.dash-welcome-body p{font-size:.9rem;color:var(--tx);line-height:1.55;margin:0 0 .85rem;max-width:640px}
.dash-welcome-actions{display:flex;gap:.55rem;flex-wrap:wrap;margin-bottom:.65rem}
.dash-welcome-tip{font-size:.78rem;color:var(--txm);line-height:1.5}
body.liq-dark .dash-welcome{background:linear-gradient(135deg,rgba(214,93,134,.12),rgba(123,53,143,.10));border-color:rgba(214,93,134,.35)}
body.liq-dark .dash-welcome-icon{background:rgba(214,93,134,.22)}
@media (max-width:600px){
  .dash-welcome{flex-direction:column;gap:.85rem;padding:1.1rem 1.15rem}
  .dash-welcome-icon{width:50px;height:50px;font-size:1.4rem}
}

/* Capability override badge — small purple chip that appears under a    */
/* capability header when at least one user has an explicit override on  */
/* that capability. Tooltip lists names + grant/deny breakdown.           */
.cap-override-badge{display:inline-flex;align-items:center;gap:.25rem;font-size:.66rem;font-weight:800;background:var(--lo-l);color:var(--lo-h);border-radius:2rem;padding:.15rem .55rem;margin-top:.4rem;cursor:help;border:1px solid rgba(214,93,134,.25);text-transform:uppercase;letter-spacing:var(--ls-caps)}
.cap-override-badge i{font-size:.65rem}
body.liq-dark .cap-override-badge{background:rgba(214,93,134,.18);color:var(--lo);border-color:rgba(214,93,134,.4)}

/* ── ADMIN: MOBILE/TABLET RESPONSIVE ──────────────────────────────── */
/* Tablet and phone are realistic admin contexts — managers walk LTC sites */
/* with iPads. The wide tables and capabilities matrix break below ~768px  */
/* without these overrides. The transformations are CSS-only: the same DOM */
/* renders as a desktop table OR a stacked mobile card, picked by viewport.*/

/* Capabilities matrix — desktop default. Each role is wrapped in <details>  */
/* for mobile-collapse semantics; on desktop we hide the summary and force  */
/* the .cap-matrix-row visible (overrides UA `details > :not(summary)        */
/* {display:none}` rule via display:grid !important).                        */
.cap-role-card>summary{display:none}
.cap-role-card{display:contents}
.cap-role-card>.cap-matrix-row{display:grid !important}

@media (max-width:767px){
  /* ── Admin tabs: tighten spacing on small screens ───────────────── */
  .admin-tab{flex:1 1 auto;min-width:0;font-size:.74rem;padding:.55rem .35rem;gap:.25rem}
  .admin-tab i{font-size:.95rem}
  .admin-tab-panel{padding:1.1rem .85rem}

  /* ── Admin tables → stacked cards ───────────────────────────────── */
  /* Desktop has 7–9 columns of dense data; horizontal scroll on a phone  */
  /* is unusable. Each <tr> becomes a self-contained card; each <td>     */
  /* renders its data-label via ::before so the user still sees the      */
  /* column name without the table chrome.                                */
  .admin-table,.admin-table tbody{display:block}
  .admin-table thead{display:none}
  .admin-table tr{display:block;border:1px solid var(--bdr);border-radius:var(--rs);background:var(--wh);margin-bottom:.65rem;padding:.55rem .85rem;box-shadow:0 1px 2px rgba(0,0,0,.03)}
  .admin-table tr:hover td{background:transparent}
  .admin-table td{display:flex;justify-content:space-between;align-items:flex-start;gap:.85rem;padding:.35rem 0;border-bottom:1px dashed rgba(0,0,0,.06);text-align:right;color:var(--tx)}
  .admin-table td:last-child{border-bottom:none}
  .admin-table td::before{content:attr(data-label);font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);flex:0 0 auto;text-align:left;padding-top:.15rem;white-space:nowrap}
  /* Empty data-label = no label rendered (used for the checkbox cell)   */
  .admin-table td[data-label=""]::before{content:none}
  /* Checkbox cell — float top-right of the card without disturbing the  */
  /* Name row that follows. Made small + interactive-friendly.            */
  .admin-table td.adm-cb-cell{padding:0;position:absolute;top:.7rem;right:.85rem;border:none;justify-content:flex-end}
  .admin-table tr{position:relative}
  .admin-table td.adm-cb-cell:empty{display:none}
  /* Name row gets prominence — large and full-width, no label needed     */
  .admin-table td[data-label="Name"]{font-size:1.02rem;border-bottom:1px solid var(--bdr);padding-bottom:.5rem;margin-bottom:.25rem;padding-right:2.4rem}
  .admin-table td[data-label="Name"]::before{display:none}
  /* Actions footer — full-width row of buttons at the bottom            */
  .admin-table td.adm-actions-cell{justify-content:flex-end;border-top:1px solid var(--bdr);border-bottom:none;padding-top:.55rem;margin-top:.25rem;flex-wrap:wrap;gap:.4rem}
  .admin-table td.adm-actions-cell::before{flex:1;text-align:left}
  .admin-table td.adm-actions-cell .admin-action-btn{padding:.42rem .55rem;font-size:1rem}

  /* ── Bulk action bar: stack on small screens ────────────────────── */
  .bulk-bar{flex-wrap:wrap;align-items:stretch;gap:.5rem;padding:.55rem .75rem}
  .bulk-bar>.ms-auto{margin-left:0!important;order:99}
  .bulk-bar #bulk-role-select{flex:1 1 100%;max-width:none}

  /* ── Settings rows: stack the right-side input under the label ──── */
  .settings-row{flex-direction:column;align-items:stretch;gap:.55rem}
  .settings-row-right{padding-top:0;justify-content:flex-start!important}
  .settings-row-right .pi{width:100%}

  /* ── Capabilities matrix → collapsible role cards ──────────────── */
  /* Override the desktop display:contents wrapper so each <details>   */
  /* becomes its own card. Hide the matrix header (the column titles   */
  /* don't make sense in a vertical layout — each cell shows its own   */
  /* label via data-cap-label on a ::before pseudo).                    */
  .cap-matrix-wrap{overflow:visible!important;border:none!important;min-width:0!important;background:transparent}
  .cap-matrix-header{display:none!important}
  .cap-role-card{display:block!important;border:1px solid var(--bdr);border-radius:var(--rs);background:var(--wh);margin-bottom:.65rem;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.03)}
  /* Closed-by-default summary — admin taps to expand a role's capabilities */
  .cap-role-card>summary{display:flex!important;align-items:center;gap:.6rem;padding:.7rem .9rem;cursor:pointer;background:var(--g100);list-style:none;-webkit-tap-highlight-color:transparent;user-select:none}
  .cap-role-card>summary::-webkit-details-marker,
  .cap-role-card>summary::marker{display:none;content:''}
  .cap-summary-meta{font-size:.78rem;color:var(--txm);font-weight:600;margin-left:auto}
  .cap-summary-chevron{font-size:.95rem;color:var(--txm);transition:transform .18s;flex-shrink:0}
  .cap-role-card[open]>summary{border-bottom:1px solid var(--bdr);background:var(--wh)}
  .cap-role-card[open]>summary .cap-summary-chevron{transform:rotate(180deg)}
  /* Restore default <details> hide-when-closed behaviour by undoing the  */
  /* desktop !important rule. When closed, the row is hidden by the UA   */
  /* stylesheet — when open, it shows.                                    */
  .cap-role-card>.cap-matrix-row{display:block!important;padding:.45rem .9rem .85rem}
  .cap-role-card:not([open])>.cap-matrix-row{display:none!important}
  .cap-role-card .cap-role-cell{display:none}
  .cap-role-card .cap-cell{display:flex!important;justify-content:space-between;align-items:center;padding:.55rem 0!important;border-left:none!important;border-bottom:1px solid var(--bdr);gap:.85rem}
  .cap-role-card .cap-cell:last-child{border-bottom:none}
  .cap-role-card .cap-cell::before{content:attr(data-cap-label);font-size:.85rem;font-weight:600;color:var(--tx);flex:1;text-align:left}
  .cap-role-card .cap-cell .perm-check{flex-shrink:0;width:32px;height:32px;font-size:1rem}

  /* ── Path Templates summary card: tighten chip ribbon ─────────── */
  .tpl-summary-preview{flex-wrap:wrap}

  /* ── Admin section headers: stack title + button when narrow ──── */
  .admin-section-hdr{flex-wrap:wrap;gap:.5rem}
}

/* Dark mode adjustments — the mobile cards need explicit dark backgrounds  */
/* since the desktop-mode `tr:hover` stripe uses --g100 which is opaque.    */
@media (max-width:767px){
  body.liq-dark .admin-table tr{background:var(--g100);border-color:var(--g400)}
  body.liq-dark .cap-role-card{background:var(--g100);border-color:var(--g400)}
  body.liq-dark .cap-role-card>summary{background:var(--g200)}
  body.liq-dark .cap-role-card[open]>summary{background:var(--g100);border-bottom-color:var(--g400)}
  body.liq-dark .admin-table td{border-bottom-color:rgba(255,255,255,.08)}
  body.liq-dark .cap-role-card .cap-cell{border-bottom-color:var(--g400)}
}

/* ── HOME HERO — selectable animated dashboard centerpiece ───────────────
   Three interchangeable "views" the user switches via the corner control:
     • orbit  — 12-track orbit (completed rose, in-progress amber, current pings)
     • aurora — drifting indigo→rose light + floating motes behind the greeting
     • pulse  — a healthcare heartbeat sweeping across the band
   Dark indigo hero — reads on both light and dark themes. All motion is
   killed by body.liq-reduced-motion (global rule) + the media query below. */
.hd-hero{position:relative;border:2px solid rgba(214,93,134,.35);border-radius:var(--rl);overflow:hidden;color:#fff;
  padding:1.6rem 1.8rem;margin-bottom:1.2rem;box-shadow:0 6px 28px rgba(0,0,0,.20);min-height:236px}
.hd-hero-orbit{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:1rem;
  background:linear-gradient(135deg,var(--lp-d) 0%,var(--lp) 60%,var(--lp-m) 100%)}
.hd-hero-aurora{display:flex;align-items:center;justify-content:space-between;gap:1.4rem;background:var(--lp-d)}
.hd-hero-pulse{display:flex;align-items:center;background:linear-gradient(135deg,var(--lp-d),var(--lp))}
.hd-hero-orbit::before{content:'';position:absolute;inset:0;background:radial-gradient(120% 120% at 80% 50%,rgba(214,93,134,.12),transparent 55%);pointer-events:none}
.hd-hero-main{position:relative;z-index:2;min-width:0}

/* view switcher (top-right corner) */
.hd-hero-switch{position:absolute;top:11px;right:13px;z-index:6;display:flex;gap:5px}
.hd-hero-switch-btn{width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.28);
  background:rgba(255,255,255,.10);color:#fff;font-size:.78rem;cursor:pointer;display:flex;align-items:center;
  justify-content:center;transition:background .15s,border-color .15s,transform .15s;backdrop-filter:blur(3px)}
.hd-hero-switch-btn:hover{background:rgba(255,255,255,.22);transform:translateY(-1px)}
.hd-hero-switch-btn.active{background:var(--lo);border-color:#ffd3e2;box-shadow:0 2px 8px rgba(214,93,134,.5)}
.hd-hero-eyebrow{font-size:.74rem;font-weight:800;letter-spacing:var(--ls-caps);color:#e9b9cd;text-transform:uppercase;margin-bottom:.35rem}
.hd-hero-greet{font-family:var(--fd);font-size:2rem;font-weight:700;line-height:1.12}
.hd-hero-sub{font-size:.9rem;color:#cdbfe6;margin-top:.4rem}
.hd-hero-quest{display:inline-flex;align-items:center;gap:.7rem;margin-top:1.15rem;max-width:100%;
  background:var(--lo);color:#fff;border:none;border-radius:99px;padding:.6rem 1.1rem .6rem .9rem;cursor:pointer;
  text-align:left;box-shadow:0 6px 18px rgba(214,93,134,.42);transition:transform .15s,box-shadow .15s}
.hd-hero-quest:hover{transform:translateY(-2px);box-shadow:0 9px 24px rgba(214,93,134,.55)}
.hd-hero-quest>i:first-child{font-size:1.15rem;flex-shrink:0}
.hd-hero-quest-txt{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.hd-hero-quest-txt b{font-size:.86rem;font-weight:800}
.hd-hero-quest-txt small{font-size:.74rem;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:30ch}
.hd-hero-quest-go{margin-left:.2rem;flex-shrink:0;transition:transform .15s}
.hd-hero-quest:hover .hd-hero-quest-go{transform:translateX(3px)}
.hd-hero-quest.done{background:rgba(255,255,255,.14);border:1px solid rgba(214,93,134,.45);box-shadow:none}
.hd-hero-quest.done:hover{transform:none;box-shadow:none;background:rgba(255,255,255,.2)}

/* orbit */
.hd-hero-visual{position:relative;z-index:1;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem}
.hd-orbit-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem .8rem;margin-top:.65rem;font-size:.68rem;font-weight:600;color:#cdbfe6}
.hd-orbit-legend span{display:inline-flex;align-items:center;gap:.32rem;white-space:nowrap}
.hd-lgd{width:9px;height:9px;border-radius:50%;flex-shrink:0;display:inline-block}
.hd-lgd.done{background:var(--lo)}
.hd-lgd.started{background:#f2a935}
.hd-lgd.notstarted{background:#c3b8e0}
.hd-lgd.now{background:#fff;box-shadow:0 0 0 2px rgba(214,93,134,.6)}
/* Pillar legend — the three orbital shells; outline dots = rings, not statuses */
.hd-orbit-pillars{margin-top:.28rem;font-size:.64rem;color:#b7abcf;opacity:.92}
.hd-pill{width:9px;height:9px;border-radius:50%;flex-shrink:0;display:inline-block;background:transparent;border:2px solid #8f9fd6}
.hd-pill.reg{border-color:#8f9fd6}
.hd-pill.care{border-color:#e58bb0}
.hd-pill.lead{border-color:#d9a84e}
.hd-orbit{position:relative;width:260px;height:260px}
.hd-ring{position:absolute;top:50%;left:50%;border:1px solid rgba(255,255,255,.16);border-radius:50%;transform:translate(-50%,-50%)}
/* Ring diameters = 2×node-radius in _renderHeroOrbit; border tinted per pillar */
.hd-r1{width:108px;height:108px;border-color:rgba(140,159,214,.5)}
.hd-r2{width:176px;height:176px;border-color:rgba(214,93,134,.42)}
.hd-r3{width:244px;height:244px;border-color:rgba(217,168,78,.5)}
.hd-spin{position:absolute;top:50%;left:50%;width:0;height:0;transform-origin:0 0}
/* All shells rotate the same direction; inner fastest -> outer slowest (Kepler) */
.hd-o1{animation:hd-spin 24s linear infinite}
.hd-o2{animation:hd-spin 36s linear infinite}
.hd-o3{animation:hd-spin 52s linear infinite}
@keyframes hd-spin{to{transform:rotate(360deg)}}
/* Node states — all high-contrast on the dark indigo field:
   not started = light lavender · in progress = amber · done = rose · current = white ping */
.hd-orbit .node{position:absolute;width:13px;height:13px;border-radius:50%;transform:translate(-50%,-50%);
  background:#c3b8e0;border:1.5px solid #ece5fb;box-shadow:0 0 6px rgba(195,184,224,.5);cursor:default}
.hd-orbit .node.started{background:#f2a935;border-color:#ffdca0;box-shadow:0 0 9px rgba(242,169,53,.75)}
.hd-orbit .node.done{background:var(--lo);border-color:#ffd3e2;box-shadow:0 0 11px rgba(214,93,134,.9)}
.hd-orbit .node.now{background:#fff;border-color:var(--lo);box-shadow:0 0 0 0 rgba(255,255,255,.6);animation:hd-ping 2s ease-out infinite}
@keyframes hd-ping{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}100%{box-shadow:0 0 0 13px rgba(255,255,255,0)}}
.hd-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--fd);font-weight:700;font-size:.72rem;
  color:#fff;background:radial-gradient(circle at 35% 30%,var(--lp-m),var(--lp-d));border:1.5px solid rgba(214,93,134,.5);
  box-shadow:0 0 22px rgba(43,58,103,.9);line-height:1}
.hd-core::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(214,93,134,.35);animation:hd-pulsering 3.4s ease-out infinite}
@keyframes hd-pulsering{0%{transform:scale(.92);opacity:.8}100%{transform:scale(1.5);opacity:0}}

/* aurora view */
.hd-aurora-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hd-blob{position:absolute;border-radius:50%;filter:blur(42px);opacity:.55}
.hd-b1{width:300px;height:300px;background:var(--lp-m);left:-50px;top:-70px;animation:hd-drift1 15s ease-in-out infinite}
.hd-b2{width:260px;height:260px;background:var(--lo);right:-40px;top:0;animation:hd-drift2 18s ease-in-out infinite}
.hd-b3{width:220px;height:220px;background:#6a3d7a;left:42%;bottom:-90px;animation:hd-drift3 21s ease-in-out infinite}
@keyframes hd-drift1{50%{transform:translate(70px,45px) scale(1.15)}}
@keyframes hd-drift2{50%{transform:translate(-55px,35px) scale(1.1)}}
@keyframes hd-drift3{50%{transform:translate(45px,-35px) scale(1.2)}}
.hd-mote{position:absolute;bottom:0;width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.75);animation:hd-rise 9s linear infinite}
@keyframes hd-rise{0%{transform:translateY(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-240px);opacity:0}}

/* pulse view */
.hd-ekg{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.hd-ekg-line{fill:none;stroke:var(--lo);stroke-width:2.5;filter:drop-shadow(0 0 5px rgba(214,93,134,.7));
  stroke-dasharray:1500;stroke-dashoffset:1500;animation:hd-draw 4s linear infinite}
@keyframes hd-draw{to{stroke-dashoffset:-1500}}
.hd-ekg-dot{fill:#fff;filter:drop-shadow(0 0 6px #fff)}
.hd-pulse-cap{position:absolute;left:1.8rem;right:1.8rem;bottom:.85rem;z-index:2;text-align:center;font-size:.72rem;font-weight:600;color:#e6dcfa}
.hd-pulse-cap b{color:#fff;font-weight:800}
.hd-pulse-cap i{color:var(--lo);margin-right:.2rem}

/* aurora view — live stats panel */
.hd-aurora-stats{position:relative;z-index:2;display:flex;flex-direction:column;gap:.5rem;width:340px;max-width:44%;flex-shrink:0}
.hd-astat-wide{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.17);border-radius:12px;padding:.7rem .85rem;backdrop-filter:blur(4px)}
.hd-astat-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.4rem;gap:.5rem}
.hd-astat-lbl{font-weight:800;font-size:.92rem}
.hd-astat-sub{font-size:.68rem;color:#e9b9cd;font-weight:700;white-space:nowrap}
.hd-astat-bar{height:7px;border-radius:99px;background:rgba(255,255,255,.16);overflow:hidden}
.hd-astat-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--lo),#ff9bbb)}
.hd-astat-name{font-size:.7rem;color:#cdbfe6;margin-top:.35rem;font-weight:600}
.hd-astat-row{display:flex;gap:.5rem}
.hd-astat{flex:1;min-width:0;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.17);border-radius:12px;padding:.55rem .35rem;text-align:center;backdrop-filter:blur(4px)}
.hd-astat-num{font-family:var(--fd);font-size:1.5rem;font-weight:700;line-height:1}
.hd-astat-num span{font-size:.78rem;color:#cdbfe6;font-weight:700}
.hd-astat-cap{font-size:.6rem;color:#cdbfe6;text-transform:uppercase;letter-spacing:var(--ls-caps);margin-top:.25rem;font-weight:700}

@media (max-width:860px){
  .hd-hero-orbit{grid-template-columns:1fr}
  .hd-hero{text-align:center;padding:1.4rem 1.3rem;min-height:0}
  .hd-hero-aurora{flex-direction:column;justify-content:center}
  .hd-hero-pulse{justify-content:center}
  .hd-aurora-stats{width:100%;max-width:100%}
  .hd-astat-top{justify-content:center;gap:.6rem}
  .hd-pulse-cap{left:.8rem;right:.8rem}
  .hd-hero-quest{align-self:center}
  .hd-hero-greet{font-size:1.6rem}
  .hd-hero-visual{min-height:210px;margin-top:.5rem}
  /* Scale the whole orbit uniformly so rings + JS-positioned nodes stay aligned;
     negative margin trims the layout box the un-scaled 260px would reserve. */
  .hd-orbit{transform:scale(.78);margin:-28px 0}
}
@media (prefers-reduced-motion:reduce){
  .hd-o1,.hd-o2,.hd-o3,.hd-orbit .node.now,.hd-core::after,
  .hd-blob,.hd-mote,.hd-ekg-line,.hd-ekg-dot{animation:none}
  /* Streak-flame glow tiers + their card backgrounds were not covered */
  .hd-streak-flame,.skt-4,.skt-5{animation:none!important}
}
/* Keyboard focus ring for whole-card buttons made accessible in js/18-a11y */
[data-kbtn]:focus-visible{outline:2px solid var(--lo);outline-offset:2px;border-radius:10px}

body.liq-limited-guest #nav-home-item,body.liq-limited-guest #nav-daily-item,body.liq-limited-guest #nav-cases-item,body.liq-limited-guest #nav-tools-item,body.liq-limited-guest #nav-exam-item,
body.liq-limited-guest #nav-edpathway-item,body.liq-limited-guest #nav-capstone-item,body.liq-limited-guest #nav-walkthrough-item,
body.liq-limited-guest #mbn-home,body.liq-limited-guest #mbn-daily,body.liq-limited-guest #mbn-tools,body.liq-limited-guest #mbn-profile,
body.liq-limited-guest #nav-auth-mobile .nav-xp,
body.liq-limited-guest #nav-user-wrap-d .nav-xp{display:none!important}

/* ── Administrator Toolkit (downloadable templates) ── */
.tool-head{display:flex;align-items:center;gap:.8rem;margin-bottom:1rem}
.tool-head-icon{width:2.6rem;height:2.6rem;border-radius:.6rem;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0}
.tool-head-name{font-family:var(--fd);font-size:1.28rem;color:var(--heading);font-weight:700;line-height:1.2}
.tool-head-sub{font-size:.85rem;color:var(--txm);margin-top:.15rem}
.tk-grid{display:flex;flex-direction:column;gap:.6rem}
.tk-card{display:flex;align-items:center;gap:.9rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem 1rem}
.tk-card-icon{width:2.4rem;height:2.4rem;border-radius:.55rem;display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0}
.tk-card-body{flex:1;min-width:0}
.tk-card-name{font-weight:700;color:var(--heading);font-size:.95rem}
.tk-card-desc{font-size:.82rem;color:var(--txm);margin-top:.1rem}
@media(max-width:560px){.tk-card{flex-wrap:wrap}.tk-card .btn-liq{width:100%}}

/* ── ADMINISTRATOR CAPSTONE — guided reflection workbook ──────────────────── */
.cap-hero{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.6rem 1.7rem;margin-bottom:1.4rem;box-shadow:var(--sh)}
.cap-hero-eyebrow{display:inline-flex;align-items:center;font-size:.72rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--lo)}
.cap-hero-title{font-family:var(--fd);color:var(--heading);font-size:1.7rem;margin:.4rem 0 .5rem}
.cap-hero-sub{color:var(--txs);font-size:.95rem;line-height:1.6;margin:0 0 1.1rem;max-width:60ch}
.cap-prog{margin-bottom:1.1rem}
.cap-prog-bar{height:8px;background:var(--g100);border-radius:99px;overflow:hidden}
.cap-prog-fill{height:100%;background:var(--lo);border-radius:99px;transition:width .4s ease}
.cap-prog-txt{font-size:.78rem;font-weight:700;color:var(--txm);margin-top:.4rem}
.cap-actions{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.cap-save-ind{font-size:.8rem;font-weight:700;color:var(--ok);opacity:0;transition:opacity .3s}
.cap-save-ind .bi{color:var(--ok)}
.cap-section{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1.3rem 1.4rem;margin-bottom:1rem;box-shadow:var(--sh)}
.cap-section-head{display:flex;align-items:center;gap:.65rem;margin-bottom:1rem}
.cap-section-icon{width:2.1rem;height:2.1rem;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0}
.cap-section-title{font-family:var(--fd);font-size:1.12rem;font-weight:700;color:var(--heading)}
.cap-prompt{margin-bottom:1.1rem}
.cap-prompt:last-child{margin-bottom:0}
.cap-q{display:block;font-size:.92rem;font-weight:700;color:var(--tx);line-height:1.5;margin-bottom:.5rem}
.cap-textarea{width:100%;font-family:var(--fb);font-size:.92rem;line-height:1.55;color:var(--tx);background:var(--bg);border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.7rem .85rem;resize:vertical;min-height:5.5rem;transition:border-color .15s,box-shadow .15s}
.cap-textarea:focus{outline:none;border-color:var(--lo);box-shadow:0 0 0 3px var(--lo-l);background:var(--wh)}
.cap-textarea::placeholder{color:var(--txm)}

/* ── THE WALKTHROUGH — 3D inspection (v1) ─────────────────────────────────── */
.wt-hero{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--rl);padding:1.5rem 1.6rem;margin-bottom:1.2rem;box-shadow:var(--sh)}
.wt-eyebrow{display:inline-flex;align-items:center;font-size:.72rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--lo)}
.wt-title{font-family:var(--fd);color:var(--heading);font-size:1.6rem;margin:.35rem 0 .5rem}
.wt-sub{color:var(--txs);font-size:.94rem;line-height:1.6;margin:0 0 1.1rem;max-width:64ch}
.wt-toolbar{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.wt-toggle{display:inline-flex;border:1px solid var(--bdr);border-radius:var(--rs);overflow:hidden}
.wt-toggle-btn{background:var(--bg);color:var(--txs);border:none;font-family:var(--fb);font-weight:700;font-size:.82rem;padding:.45rem .85rem;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem}
.wt-toggle-btn.active{background:var(--lp);color:#fff}
.wt-toggle-btn:disabled{opacity:.45;cursor:not-allowed}
.wt-progress{display:flex;align-items:center;gap:.6rem;flex:1;min-width:180px}
.wt-progress-bar{flex:1;height:8px;background:var(--g100);border-radius:99px;overflow:hidden}
.wt-progress-fill{height:100%;width:0;background:var(--lo);border-radius:99px;transition:width .4s ease}
.wt-progress-txt{font-size:.78rem;font-weight:700;color:var(--txm);white-space:nowrap}
.wt-stage{position:relative}
.wt-3d-wrap{position:relative}
.wt-canvas-host{width:100%;height:440px;border-radius:var(--r);overflow:hidden;background:var(--lp-d);border:1px solid var(--bdr);display:flex;align-items:center;justify-content:center}
.wt-canvas-host canvas{display:block;width:100%;height:100%}
.wt-loading{color:#cdbfe6;font-size:.9rem;font-weight:600}
.wt-loading.err{color:#ffd3d3}
.wt-hint{margin-top:.5rem;font-size:.76rem;color:var(--txm);display:flex;align-items:center;gap:.4rem}
.wt-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:.8rem}
.wt-litem{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.9rem 1rem;box-shadow:var(--sh)}
.wt-litem-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.15rem}
.wt-litem-title{font-weight:800;color:var(--heading);font-size:1rem}
.wt-litem-track{font-size:.72rem;font-weight:700;color:var(--lo);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-bottom:.5rem}
.wt-litem-check{font-size:.86rem;color:var(--tx);margin-bottom:.4rem;line-height:1.5}
.wt-litem-why{font-size:.82rem;color:var(--txs);line-height:1.55;margin-bottom:.7rem}
.wt-litem-actions,.wt-card-actions{display:flex;gap:.5rem;flex-wrap:wrap}
.wt-badge{font-size:.68rem;font-weight:800;padding:.15rem .5rem;border-radius:99px;white-space:nowrap;display:inline-flex;align-items:center;gap:.25rem}
.wt-badge.todo{background:var(--g100);color:var(--txm)}
.wt-badge.ok{background:var(--ok-l);color:var(--ok)}
.wt-badge.gap{background:var(--er-l);color:var(--er)}
.wt-mark{font-family:var(--fb);font-weight:700;font-size:.82rem;padding:.45rem .8rem;border-radius:var(--rs);cursor:pointer;border:1.5px solid var(--bdr);background:var(--bg);color:var(--txs);display:inline-flex;align-items:center;gap:.35rem}
.wt-mark.ok:hover,.wt-mark.ok.sel{background:var(--ok);border-color:var(--ok);color:#fff}
.wt-mark.gap:hover,.wt-mark.gap.sel{background:var(--er);border-color:var(--er);color:#fff}
.wt-card-overlay{position:fixed;inset:0;background:rgba(15,18,30,.55);z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:1rem}
.wt-card{position:relative;background:var(--wh);border-radius:var(--rl);box-shadow:var(--shl);max-width:460px;width:100%;padding:1.5rem 1.6rem}
.wt-card-x{position:absolute;top:.7rem;right:.7rem;background:transparent;border:none;color:var(--txm);font-size:1rem;cursor:pointer;padding:.3rem}
.wt-card-track{font-size:.72rem;font-weight:800;color:var(--lo);text-transform:uppercase;letter-spacing:var(--ls-caps)}
.wt-card-title{font-family:var(--fd);color:var(--heading);font-size:1.35rem;margin:.25rem 0 .9rem}
.wt-card-check,.wt-card-why{font-size:.9rem;line-height:1.6;margin-bottom:.8rem;color:var(--tx)}
.wt-card-why{color:var(--txs)}
.wt-card-lbl{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-bottom:.2rem}
.wt-summary{margin-top:1.1rem}
.wt-summary-inner{background:var(--wh);border:1px solid var(--bdr);border-left:4px solid var(--lo);border-radius:var(--r);padding:1.2rem 1.4rem;box-shadow:var(--sh)}
.wt-summary-inner h3{font-family:var(--fd);color:var(--heading);font-size:1.2rem;margin:0 0 .5rem}
.wt-summary-inner p{font-size:.9rem;color:var(--txs);line-height:1.6}
.wt-gap-list{list-style:none;padding:0;margin:.6rem 0}
.wt-gap-list li{font-size:.88rem;color:var(--tx);padding:.25rem 0}
.wt-gap-list li i{color:var(--er);margin-right:.4rem}
.wt-gap-list li span{color:var(--txm);font-size:.8rem}
.wt-clean{font-size:.9rem;color:var(--ok);font-weight:600;margin:.6rem 0}
.wt-linklike{background:none;border:none;color:var(--lo);font-weight:700;cursor:pointer;padding:0;font-size:inherit;text-decoration:underline}
@media (max-width:640px){ .wt-canvas-host{height:340px} }

/* Walkthrough v2 — room picker */
/* 4 equal, full-width columns per row (8 rooms -> 4x2 on desktop) */
.wt-rooms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;margin-bottom:1rem}
@media (max-width:900px){.wt-rooms{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.wt-rooms{grid-template-columns:minmax(0,1fr)}}
.wt-room{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0;background:var(--bg);border:1.5px solid var(--bdr);border-radius:var(--rs);padding:.55rem .85rem;cursor:pointer;font-family:var(--fb);font-weight:700;font-size:.86rem;color:var(--txs);transition:all .15s}
.wt-room:hover{border-color:var(--lo)}
.wt-room.active{background:var(--lp);border-color:var(--lp);color:#fff}
.wt-room .bi{font-size:1rem;flex-shrink:0}
.wt-room-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.wt-room-prog{font-size:.72rem;font-weight:800;background:var(--g100);color:var(--txm);border-radius:99px;padding:.05rem .45rem}
.wt-room.active .wt-room-prog{background:rgba(255,255,255,.2);color:#fff}
.wt-room-prog.done{background:var(--ok-l);color:var(--ok)}
.wt-room.active .wt-room-prog.done{background:rgba(255,255,255,.9);color:var(--ok)}

/* Walkthrough — on-canvas controls + fullscreen */
.wt-3d-wrap{position:relative}
.wt-fs-btn{position:absolute;top:.6rem;right:.6rem;z-index:4;width:2.15rem;height:2.15rem;border-radius:var(--rs);border:none;background:rgba(30,42,77,.72);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.95rem;transition:background .15s}
.wt-fs-btn:hover{background:rgba(30,42,77,.95)}
.wt-controls{position:absolute;right:.6rem;bottom:2.7rem;z-index:4;display:flex;flex-direction:column;gap:.35rem}
.wt-controls button{width:2.15rem;height:2.15rem;border-radius:var(--rs);border:none;background:rgba(30,42,77,.72);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:background .15s}
.wt-controls button:hover{background:rgba(30,42,77,.95)}
.wt-3d-wrap:fullscreen{width:100vw;height:100vh;background:var(--lp-d);display:flex;flex-direction:column}
.wt-3d-wrap:-webkit-full-screen{width:100vw;height:100vh;background:var(--lp-d);display:flex;flex-direction:column}
.wt-3d-wrap:fullscreen .wt-canvas-host{flex:1;height:auto;border-radius:0;border:none}
.wt-3d-wrap:-webkit-full-screen .wt-canvas-host{flex:1;height:auto;border-radius:0;border:none}
.wt-3d-wrap:fullscreen .wt-hint{position:absolute;left:0;right:0;bottom:.6rem;justify-content:center;color:#dfe4ee;z-index:4}
.wt-3d-wrap:-webkit-full-screen .wt-hint{position:absolute;left:0;right:0;bottom:.6rem;justify-content:center;color:#dfe4ee;z-index:4}

/* Walkthrough — guided tour panel (overlays the bottom of the 3D view) */
.wt-tour-bar{position:absolute;left:0;right:0;bottom:0;z-index:5;background:rgba(20,28,52,.94);color:#fff;padding:.7rem .9rem}
.wt-tour-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.25rem}
.wt-tour-step{font-size:.68rem;font-weight:800;letter-spacing:var(--ls-caps);text-transform:uppercase;color:#c9d3ea}
.wt-tour-x{background:transparent;border:none;color:#c9d3ea;cursor:pointer;font-size:.9rem}
.wt-tour-title{font-family:var(--fd);font-size:1.05rem;font-weight:700;margin-bottom:.2rem}
.wt-tour-check{font-size:.84rem;line-height:1.45;margin-bottom:.25rem}
.wt-tour-why{font-size:.8rem;line-height:1.5;color:#c9d3ea;margin-bottom:.55rem}
.wt-tour-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.wt-tour-nav{margin-left:auto;display:flex;gap:.35rem}
.wt-tour-btn{background:rgba(255,255,255,.15);color:#fff;border:none;border-radius:var(--rs);padding:.42rem .75rem;font-family:var(--fb);font-weight:700;font-size:.82rem;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem}
.wt-tour-btn:hover{background:rgba(255,255,255,.26)}
.wt-tour-btn:disabled{opacity:.4;cursor:not-allowed}
.wt-tour-done{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.9rem}

/* Walkthrough — inspection-simulator UI (how-to, legend, verdicts, report) */
.wt-how{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:.7rem}
.wt-how-step{display:inline-flex;align-items:center;gap:.4rem;background:var(--bg);border:1px solid var(--bdr);border-radius:99px;padding:.3rem .75rem;font-size:.76rem;font-weight:700;color:var(--txs)}
.wt-how-step b{display:inline-flex;align-items:center;justify-content:center;width:1.15rem;height:1.15rem;border-radius:50%;background:var(--lo);color:#fff;font-size:.66rem}
.wt-legend{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:.9rem;font-size:.74rem;font-weight:600;color:var(--txm)}
.wt-legend span{display:inline-flex;align-items:center;gap:.35rem}
.wt-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.wt-dot.amber{background:#f2a935}.wt-dot.green{background:#16a34a}.wt-dot.red{background:#dc2626}
.wt-verdict{display:flex;align-items:center;gap:.45rem;font-weight:800;font-size:.9rem;border-radius:var(--rs);padding:.5rem .7rem;margin:.5rem 0 .35rem}
.wt-verdict.ok{background:var(--ok-l);color:var(--ok)}
.wt-verdict.bad{background:var(--er-l);color:var(--er)}
.wt-tour-bar .wt-verdict.ok{background:rgba(22,163,74,.25);color:#7ef0a8}
.wt-tour-bar .wt-verdict.bad{background:rgba(220,38,38,.25);color:#ffa3a3}
.wt-verdict-see{font-size:.84rem;line-height:1.5;color:var(--txs);margin-bottom:.5rem}
.wt-tour-bar .wt-verdict-see{color:#c9d3ea}
.wt-litem-see{font-size:.84rem;line-height:1.55;background:var(--bg);border-left:3px solid var(--lo);border-radius:var(--rs);padding:.5rem .65rem;margin-bottom:.55rem;color:var(--tx)}
.wt-tour-btn.primary{background:var(--lo)}
.wt-tour-btn.primary:hover{background:var(--lo-h)}
.wt-report-score{display:flex;align-items:baseline;gap:.7rem;margin:.4rem 0 .5rem}
.wt-report-acc{font-family:var(--fd);font-size:2.4rem;font-weight:700;color:var(--lo);line-height:1}
.wt-report-lbl{font-size:.84rem;font-weight:700;color:var(--txm)}
.wt-report-sec{margin:.7rem 0}
.wt-report-sec strong{font-size:.88rem;color:var(--heading)}

/* QIP Builder tool */
.qip-items{display:flex;flex-direction:column;gap:.9rem;margin-bottom:.6rem}
.qip-item{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem}
.qip-item-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}
.qip-item-n{font-family:var(--fd);font-weight:700;font-size:1.02rem;color:var(--heading)}
.qip-ok{font-size:.74rem;font-weight:800;color:var(--ok);display:inline-flex;align-items:center;gap:.25rem}
.qip-need{font-size:.72rem;font-weight:700;color:var(--wa)}
.qip-del{margin-left:auto;background:transparent;border:none;color:var(--txm);cursor:pointer;font-size:.95rem;padding:.2rem .35rem;border-radius:var(--rs)}
.qip-del:hover{color:var(--er);background:var(--er-l)}
.qip-hint{font-weight:600;color:var(--txm);font-size:.72rem}
.qip-count{font-size:.8rem;font-weight:700;color:var(--txm);align-self:center}
.tool-save-row{gap:.6rem;flex-wrap:wrap;align-items:center}

/* PDSA Cycle Tracker tool */
.pdsa-cycles{display:flex;flex-direction:column;gap:.9rem;margin-bottom:.6rem}
.pdsa-cycle{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem;box-shadow:var(--sh)}
.pdsa-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}
.pdsa-ramp{font-family:var(--fd);font-weight:700;font-size:1rem;color:var(--heading)}
.pdsa-badge{font-size:.7rem;font-weight:800;padding:.15rem .55rem;border-radius:99px;white-space:nowrap}
.pdsa-badge.todo{background:var(--g100);color:var(--txm)}
.pdsa-badge.info{background:var(--inf-l);color:var(--inf)}
.pdsa-badge.ok{background:var(--ok-l);color:var(--ok)}
.pdsa-badge.wa{background:var(--wa-l);color:var(--wa)}
.pdsa-badge.er{background:var(--er-l);color:var(--er)}
.pdsa-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media (max-width:720px){.pdsa-grid{grid-template-columns:1fr}}
.pdsa-stage{border:1px solid var(--bdr);border-radius:var(--rs);padding:.7rem .8rem;background:var(--bg)}
.pdsa-stage-h{display:flex;align-items:center;gap:.45rem;font-weight:800;font-size:.82rem;color:var(--heading);text-transform:uppercase;letter-spacing:var(--ls-caps);margin-bottom:.5rem}
.pdsa-let{display:inline-flex;align-items:center;justify-content:center;width:1.35rem;height:1.35rem;border-radius:var(--rs);color:#fff;font-family:var(--fd);font-size:.82rem}
.pdsa-stage.plan{border-top:3px solid #2563eb}.pdsa-stage.plan .pdsa-let{background:#2563eb}
.pdsa-stage.do{border-top:3px solid #d97706}.pdsa-stage.do .pdsa-let{background:#d97706}
.pdsa-stage.study{border-top:3px solid #0d9488}.pdsa-stage.study .pdsa-let{background:#0d9488}
.pdsa-stage.act{border-top:3px solid #be185d}.pdsa-stage.act .pdsa-let{background:#be185d}
.pdsa-link{max-width:220px}

/* Indicator Dashboard tool */
.qd-inds{display:flex;flex-direction:column;gap:1rem;margin-bottom:.6rem}
.qd-ind{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem;box-shadow:var(--sh)}
.qd-ind-head{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.7rem}
.qd-name{flex:1;min-width:180px}
.qd-fam{max-width:180px}.qd-dir{max-width:150px}.qd-target{max-width:100px}
.qd-chart-wrap{background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);padding:.5rem .6rem}
.qd-svg{width:100%;height:auto;display:block}
.qd-verdict{display:flex;align-items:flex-start;gap:.45rem;font-size:.85rem;line-height:1.45;font-weight:600;border-radius:var(--rs);padding:.55rem .7rem;margin-top:.6rem}
.qd-verdict.good{background:var(--ok-l);color:var(--ok)}
.qd-verdict.bad{background:var(--er-l);color:var(--er)}
.qd-verdict.none{background:var(--g100);color:var(--txs)}
.qd-points{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.7rem}
.qd-points-lbl{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txm);margin-right:.2rem}
.qd-cell{display:flex;flex-direction:column;gap:.15rem;position:relative}
.qd-cell .qd-p{width:64px;padding:.3rem .4rem;font-size:.76rem;text-align:center}
.qd-cell .qd-v{width:64px;padding:.3rem .4rem;font-size:.8rem;text-align:center}
.qd-x{position:absolute;top:-6px;right:-6px;width:15px;height:15px;line-height:13px;text-align:center;border:none;border-radius:50%;background:var(--g200);color:var(--txs);font-size:.7rem;cursor:pointer;padding:0}
.qd-x:hover{background:var(--er);color:#fff}
.qd-addp{background:var(--bg);border:1px dashed var(--bdr);border-radius:var(--rs);color:var(--txs);font-weight:700;font-size:.76rem;padding:.35rem .6rem;cursor:pointer;align-self:stretch}
.qd-addp:hover{border-color:var(--lo);color:var(--lo)}

/* ── Change-Idea Library (tool: change-ideas) ───────────────────────── */
.ci-intro{margin-bottom:.9rem}
.ci-intro .ci-note{display:block;margin-top:.4rem;font-size:.82rem;color:var(--txs)}
.ci-inline-add{display:inline-flex;align-items:center;gap:.15rem;background:rgba(37,99,235,.1);color:#1d4ed8;font-weight:700;font-size:.74rem;padding:.05rem .35rem;border-radius:var(--rs);white-space:nowrap}
.ci-searchrow{margin-bottom:1rem}
.ci-search-wrap{position:relative;display:flex;align-items:center}
.ci-search-wrap i{position:absolute;left:.7rem;color:var(--txs);pointer-events:none}
.ci-search-wrap .pi{padding-left:2rem}
.ci-fam{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:1rem 1.1rem;margin-bottom:.9rem}
.ci-fam-head{display:flex;align-items:flex-start;gap:.7rem;margin-bottom:.7rem}
.ci-fam-icon{flex:0 0 auto;width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:rgba(37,99,235,.1);color:#1d4ed8;font-size:1.05rem}
.ci-fam-title{flex:1 1 auto;min-width:0}
.ci-fam-name{font-family:var(--fd);font-weight:700;font-size:1.05rem;color:var(--heading)}
.ci-fam-why{font-size:.85rem;color:var(--txs);margin-top:.1rem}
.ci-copy{flex:0 0 auto;background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);color:var(--txs);cursor:pointer;padding:.3rem .5rem;font-size:.8rem}
.ci-copy:hover{border-color:#1d4ed8;color:#1d4ed8}
.ci-driver{margin:.5rem 0 .3rem}
.ci-driver-name{font-weight:700;font-size:.82rem;letter-spacing:var(--ls-caps);text-transform:uppercase;color:#1d4ed8;margin:.4rem 0 .35rem}
.ci-idea{display:flex;align-items:center;gap:.6rem;padding:.4rem .55rem;border:1px solid var(--bdr);border-radius:var(--rs);margin-bottom:.35rem;background:var(--bg)}
.ci-idea-txt{flex:1 1 auto;font-size:.9rem;color:var(--txm);line-height:1.35}
.ci-add{flex:0 0 auto;display:inline-flex;align-items:center;gap:.2rem;background:rgba(37,99,235,.1);border:1px solid rgba(37,99,235,.28);border-radius:var(--rs);color:#1d4ed8;font-weight:700;font-size:.76rem;padding:.28rem .5rem;cursor:pointer;white-space:nowrap;transition:background .12s}
.ci-add:hover{background:#1d4ed8;color:#fff;border-color:#1d4ed8}
.ci-add.ci-added{background:var(--ok,#16a34a);border-color:var(--ok,#16a34a);color:#fff;cursor:default}

/* ── Self-Audit → QIP loop button ───────────────────────────────────── */
.ir-toqip{background:rgba(37,99,235,.1);border:1px solid rgba(37,99,235,.28);color:#1d4ed8}
.ir-toqip:hover{background:#1d4ed8;color:#fff;border-color:#1d4ed8}

/* ── Walkthrough report → QIP loop bridge ───────────────────────────── */
.wt-report-loop{display:flex;gap:.5rem;align-items:flex-start;background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.22);border-radius:var(--rs);padding:.6rem .75rem;margin:.7rem 0;font-size:.87rem;line-height:1.4;color:var(--txm)}
.wt-report-loop i{color:#1d4ed8;font-size:1.05rem;margin-top:.05rem}
.wt-toaudit{background:rgba(37,99,235,.1);border:1px solid rgba(37,99,235,.28);color:#1d4ed8;margin-left:.4rem}
.wt-toaudit:hover{background:#1d4ed8;color:#fff;border-color:#1d4ed8}

/* ── QI micro-credential capstone panel (exam page) ─────────────────── */
.qc-panel{background:var(--wh);border:1px solid var(--bdr);border-left:4px solid #1d4ed8;border-radius:var(--r);padding:1.1rem 1.2rem;margin-bottom:1.4rem}
.qc-panel-earned{border-left-color:#16a34a;background:linear-gradient(0deg,rgba(22,163,74,.04),rgba(22,163,74,.04)),var(--wh)}
.qc-head{display:flex;gap:.7rem;align-items:flex-start;margin-bottom:.9rem}
.qc-head-icon{flex:0 0 auto;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(37,99,235,.1);color:#1d4ed8;font-size:1.25rem}
.qc-title{font-family:var(--fd);font-weight:700;font-size:1.18rem;color:var(--heading);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.qc-sub{font-size:.87rem;color:var(--txs);margin-top:.15rem;line-height:1.4}
/* --ff was never defined anywhere in the repo — the only font tokens are --fd
   (display) and --fb (body) — so these three rules resolved to nothing and
   fell back to the browser default rather than the product face. */
.qc-earned{font-family:var(--fb);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps);color:#16a34a;background:rgba(22,163,74,.12);border-radius:999px;padding:.12rem .5rem;display:inline-flex;align-items:center;gap:.25rem}
.qc-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-bottom:1rem}
@media(max-width:640px){.qc-steps{grid-template-columns:1fr}}
.qc-step{display:flex;gap:.55rem;align-items:flex-start;background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);padding:.6rem .7rem}
.qc-step-mark{flex:0 0 auto;font-size:1.15rem;line-height:1.2}
.qc-step.qc-done .qc-step-mark{color:#16a34a}
.qc-step.qc-part .qc-step-mark{color:#d97706}
.qc-step.qc-todo .qc-step-mark{color:var(--txs)}
.qc-step-label{font-weight:700;font-size:.9rem;color:var(--heading)}
.qc-step-detail{font-size:.8rem;color:var(--txs);margin-top:.1rem;line-height:1.35}
.qc-cta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.qc-hint{font-size:.82rem;color:var(--txs)}

/* ── Opening-Readiness Tracker (tool: opening-readiness) ────────────── */
.or-domain{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem 1rem;margin-bottom:.8rem}
.or-dom-head{display:flex;align-items:center;gap:.55rem;margin-bottom:.5rem}
.or-dom-icon{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(194,65,12,.1);color:#c2410c;font-size:.95rem}
.or-dom-name{font-family:var(--fd);font-weight:700;font-size:1rem;color:var(--heading);flex:1 1 auto}
.or-dom-pct{font-weight:700;font-size:.82rem;color:var(--txs);background:var(--bg);border-radius:999px;padding:.1rem .5rem}
.or-row{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.4rem 0;border-top:1px solid var(--bdr)}
.or-row:first-child{border-top:none}
.or-row-lbl{flex:1 1 auto;font-size:.88rem;color:var(--txm);line-height:1.35}
.or-seg{flex:0 0 auto;display:inline-flex;border:1px solid var(--bdr);border-radius:var(--rs);overflow:hidden}
.or-seg-btn{background:var(--wh);border:none;border-left:1px solid var(--bdr);color:var(--txs);font-size:.74rem;font-weight:600;padding:.3rem .5rem;cursor:pointer;white-space:nowrap}
.or-seg-btn:first-child{border-left:none}
.or-seg-btn:hover{background:var(--bg)}
.or-seg-btn.or-on-ok{background:#16a34a;color:#fff}
.or-seg-btn.or-on-wa{background:#d97706;color:#fff}
.or-seg-btn.or-on-er{background:#dc2626;color:#fff}
.or-seg-btn.or-on-na{background:#64748b;color:#fff}
.or-bars{margin-top:.6rem;display:flex;flex-direction:column;gap:.25rem}
.or-bar-row{display:flex;align-items:center;gap:.5rem;font-size:.78rem}
.or-bar-lbl{flex:0 0 42%;color:var(--txm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.or-bar-track{flex:1 1 auto;height:7px;background:var(--bg);border-radius:999px;overflow:hidden}
.or-bar-fill{display:block;height:100%;border-radius:999px}
.or-bar-val{flex:0 0 auto;color:var(--txs);font-weight:600;width:2.4rem;text-align:right}
.or-outstanding{margin:.35rem 0 0;padding-left:1rem}
.or-outstanding li{margin-bottom:.25rem;line-height:1.35}
.or-out-dom{color:var(--txs);font-weight:600}
.or-tag{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps);border-radius:999px;padding:.05rem .4rem;color:#fff}
.or-tag-wip{background:#d97706}
.or-tag-gap{background:#dc2626}
.or-pdf{background:rgba(194,65,12,.1);border:1px solid rgba(194,65,12,.28);color:#c2410c}
.or-pdf:hover{background:#c2410c;color:#fff;border-color:#c2410c}

/* ── Staffing-Up Ramp Planner (tool: staffing-ramp) ─────────────────── */
.ramp-sec{margin-bottom:1rem}
.ramp-sec-h{font-family:var(--fd);font-weight:700;font-size:1rem;color:var(--heading);margin-bottom:.5rem}
.ramp-sec-sub{font-family:var(--fb);font-weight:400;font-size:.8rem;color:var(--txs)}
.ramp-inrow{display:flex;flex-wrap:wrap;gap:.7rem}
.ramp-inp{flex:1 1 130px;margin-bottom:0}
.ramp-inwrap{position:relative;display:flex;align-items:center}
.ramp-suffix{position:absolute;right:.6rem;font-size:.78rem;color:var(--txs);pointer-events:none}
.ramp-role{display:grid;grid-template-columns:1fr 68px 68px 52px auto auto;gap:.4rem;align-items:center;margin-bottom:.35rem}
.ramp-role-head{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txs);margin-bottom:.2rem}
.ramp-role-head span{padding:0 .1rem}
.ramp-role-name{min-width:0}
.ramp-role-n{text-align:center}
.ramp-gap{font-weight:700;font-size:.86rem;text-align:center;color:var(--txs)}
.ramp-gap-hire{color:#c2410c}
.ramp-gap-over{color:#16a34a}
.ramp-dc{display:flex;align-items:center;gap:.2rem;font-size:.74rem;color:var(--txs);white-space:nowrap;margin:0;cursor:pointer}
.ramp-del{background:none;border:none;color:var(--txs);cursor:pointer;padding:.15rem .3rem;border-radius:6px}
.ramp-del:hover{background:var(--er-l,rgba(220,38,38,.1));color:var(--er)}
.ramp-addrole{background:var(--bg);border:1px dashed var(--bdr);border-radius:var(--rs);color:var(--txs);font-weight:700;font-size:.78rem;padding:.35rem .7rem;cursor:pointer;margin-top:.3rem}
.ramp-addrole:hover{border-color:#c2410c;color:#c2410c}
.ramp-out-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media(max-width:640px){.ramp-out-grid{grid-template-columns:1fr}.ramp-role{grid-template-columns:1fr 56px 56px 44px auto auto}}
.ramp-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem .9rem}
.ramp-card-h{font-family:var(--fd);font-weight:700;font-size:.92rem;color:var(--heading);margin-bottom:.5rem;display:flex;align-items:center;gap:.35rem}
.ramp-card-h i{color:#c2410c}
.ramp-env-row,.ramp-tot>div{display:flex;justify-content:space-between;align-items:center;font-size:.86rem;color:var(--txm);padding:.2rem 0}
.ramp-env-big{display:flex;justify-content:space-between;align-items:center;margin-top:.3rem;padding-top:.4rem;border-top:1px solid var(--bdr)}
.ramp-env-big strong{font-size:1.5rem;color:#c2410c}
.ramp-tot-hire strong{color:#c2410c}
.ramp-sched-wrap{overflow-x:auto}
.ramp-sched{width:100%;border-collapse:collapse;font-size:.84rem}
.ramp-sched th{text-align:left;color:var(--txs);font-weight:600;font-size:.76rem;border-bottom:1px solid var(--bdr);padding:.3rem .4rem}
.ramp-sched td{padding:.3rem .4rem;border-bottom:1px solid var(--bg)}
.ramp-note{color:var(--txs);font-style:italic}
.ramp-sched-note{font-size:.8rem;color:var(--txs);margin:.4rem 0 0}
.ramp-pdf{background:rgba(194,65,12,.1);border:1px solid rgba(194,65,12,.28);color:#c2410c}
.ramp-pdf:hover{background:#c2410c;color:#fff;border-color:#c2410c}

/* ── Occupancy-Ramp Funding Model (tool: ramp-funding) ──────────────── */
.rf-sec{margin-bottom:1rem}
.rf-sec-h{font-family:var(--fd);font-weight:700;font-size:1rem;color:var(--heading);margin-bottom:.5rem}
.rf-sec-sub{font-family:var(--fb);font-weight:400;font-size:.8rem;color:var(--txs)}
.rf-inrow{display:flex;flex-wrap:wrap;gap:.7rem}
.rf-inp{flex:1 1 150px;margin-bottom:0}
.rf-inwrap{position:relative;display:flex;align-items:center}
.rf-pre{position:absolute;left:.6rem;font-size:.85rem;color:var(--txs);pointer-events:none}
.rf-money{padding-left:1.3rem}
.rf-suffix{position:absolute;right:.6rem;font-size:.78rem;color:var(--txs);pointer-events:none}
.rf-cards{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media(max-width:640px){.rf-cards{grid-template-columns:1fr}}
.rf-card{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem .9rem}
.rf-card-h{font-family:var(--fd);font-weight:700;font-size:.92rem;color:var(--heading);margin-bottom:.4rem;display:flex;align-items:center;gap:.35rem}
.rf-card-h i{color:#166534}
.rf-card-big{font-size:1.15rem;font-weight:800;color:var(--heading);line-height:1.2}
.rf-be-pct{color:#166534}
.rf-be-pct.rf-neg{color:#dc2626}
.rf-per{font-size:.8rem;font-weight:700}
.rf-card-sub{font-size:.78rem;color:var(--txs);margin-top:.25rem;line-height:1.35}
.rf-sched-wrap{overflow-x:auto}
.rf-sched{width:100%;border-collapse:collapse;font-size:.84rem}
.rf-sched th{text-align:left;color:var(--txs);font-weight:600;font-size:.76rem;border-bottom:1px solid var(--bdr);padding:.3rem .4rem}
.rf-sched td{padding:.3rem .4rem;border-bottom:1px solid var(--bg)}
.rf-be-row{background:rgba(22,101,52,.07)}
.rf-be-row td:first-child{font-weight:700;color:#166534}
.rf-pos{color:#166534}
.rf-neg{color:#dc2626}
.rf-pdf{background:rgba(22,101,52,.1);border:1px solid rgba(22,101,52,.28);color:#166534}
.rf-pdf:hover{background:#166534;color:#fff;border-color:#166534}

/* ── New-Hire Onboarding Hub (page: nhonboard) ──────────────────────── */
.nho-welcome{text-align:center;max-width:620px;margin:1.5rem auto;padding:1.5rem}
.nho-welcome-icon{font-size:2.6rem;color:var(--lo);margin-bottom:.5rem}
.nho-welcome h2{font-family:var(--fd);color:var(--heading);font-size:1.5rem;margin-bottom:.5rem}
.nho-welcome p{color:var(--txm);margin-bottom:1.2rem}
.nho-rolegrid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:1rem}
@media(max-width:560px){.nho-rolegrid{grid-template-columns:1fr}}
.nho-rolebtn{display:flex;align-items:center;gap:.5rem;background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem 1rem;font-weight:600;font-size:.9rem;color:var(--heading);cursor:pointer;text-align:left;transition:all .12s}
.nho-rolebtn i{color:var(--lo);font-size:1.15rem}
.nho-rolebtn:hover{border-color:var(--lo);background:var(--lo-l,rgba(214,93,134,.06));transform:translateY(-1px)}
.nho-note{font-size:.82rem;color:var(--txs)}
.nho-top{display:flex;flex-wrap:wrap;gap:.8rem;align-items:flex-end;justify-content:space-between;margin-bottom:.8rem}
.nho-top-role{font-family:var(--fd);font-weight:700;font-size:1.1rem;color:var(--heading);display:flex;align-items:center;gap:.4rem}
.nho-top-role i{color:var(--lo)}
.nho-linklike{background:none;border:none;color:var(--lo);font-size:.8rem;cursor:pointer;text-decoration:underline;padding:0 .2rem}
.nho-startwrap{display:flex;flex-direction:column;gap:.15rem}
.nho-startwrap label{font-size:.78rem;color:var(--txs);font-weight:600}
.nho-optional{font-weight:400}
.nho-start{max-width:190px;padding:.3rem .5rem}
.nho-progresswrap{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem 1rem;margin-bottom:1rem}
.nho-progress-top{display:flex;justify-content:space-between;font-size:.9rem;color:var(--txm);margin-bottom:.4rem}
.nho-progress-bar{height:10px;background:var(--bg);border-radius:999px;overflow:hidden}
.nho-progress-fill{height:100%;background:var(--lo);border-radius:999px;transition:width .3s}
.nho-fill-done{background:#16a34a}
.nho-phase{background:var(--wh);border:1px solid var(--bdr);border-radius:var(--r);padding:.8rem 1rem;margin-bottom:.8rem}
.nho-phase-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem;flex-wrap:wrap}
.nho-phase-name{font-family:var(--fd);font-weight:700;font-size:1rem;color:var(--heading);flex:1 1 auto}
.nho-phase-count{font-weight:700;font-size:.82rem;color:var(--txs);background:var(--bg);border-radius:999px;padding:.1rem .5rem}
.nho-due{font-size:.76rem;color:var(--txs);display:inline-flex;align-items:center;gap:.25rem}
.nho-overdue{color:var(--er);font-weight:700}
.nho-item{display:flex;align-items:center;gap:.6rem;padding:.45rem 0;border-top:1px solid var(--bg)}
.nho-item:first-of-type{border-top:none}
.nho-item-mark{flex:0 0 auto;font-size:1.05rem;color:var(--txs)}
.nho-item-done .nho-item-mark{color:#16a34a}
.nho-item-lbl{flex:1 1 auto;font-size:.88rem;color:var(--txm);line-height:1.35}
.nho-item-done .nho-item-lbl{color:var(--txs)}
.nho-type{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--txs);background:var(--bg);border-radius:4px;padding:.05rem .3rem;margin-left:.2rem}
.nho-go{flex:0 0 auto;background:rgba(214,93,134,.1);border:1px solid rgba(214,93,134,.28);border-radius:var(--rs);color:var(--lo);font-weight:700;font-size:.76rem;padding:.28rem .6rem;cursor:pointer;white-space:nowrap}
.nho-go:hover{background:var(--lo);color:#fff;border-color:var(--lo)}
.nho-check{flex:0 0 auto;background:var(--bg);border:1px solid var(--bdr);border-radius:var(--rs);color:var(--txs);font-weight:600;font-size:.76rem;padding:.28rem .6rem;cursor:pointer;white-space:nowrap}
.nho-check:hover{border-color:#16a34a;color:#16a34a}
.nho-checked{background:#16a34a;border-color:#16a34a;color:#fff}
.nho-mgr-note{font-size:.8rem;color:var(--txs);margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--bdr)}