:root{--llb-pill-font:.8333rem;--ll-ink:#16202a;--ll-muted:#63594d;--ll-line:#ded6ca;--ll-bg:#f8f4ee;--ll-card:#fffdf9;--ll-accent:#9a5728;--ll-accent-dark:#7a3f18;--ll-blue:#2c5875;--ll-note:#fff6ea;--ll-header-font:'Roboto',sans-serif;--ll-button-font:'Inter',sans-serif;--ll-ui-font:'Roboto',sans-serif;--ll-serif:Georgia,'Times New Roman',serif;--ll-radius-sm:10px;--ll-radius-md:14px;--ll-radius-lg:18px;--ll-radius-pill:999px;--ll-shadow:0 18px 40px rgba(70,45,20,.08);--ll-header-h:5.625rem;--ll-content:1240px;--ll-reading:760px;--ll-gap:1rem}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(135deg,#f8f4ee,#fffaf2);color:var(--ll-ink);font-family:var(--ll-serif);font-size:16.2px;line-height:1.65}.screen-reader-text,.skip-link{position:absolute;left:-999px}.skip-link:focus{left:1rem;top:1rem;z-index:999;background:#fff;padding:.55rem .8rem;border:2px solid var(--ll-accent);border-radius:var(--ll-radius-sm)}a{color:var(--ll-accent-dark)}a:hover,a:focus-visible{color:#5f2f10}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(154,87,40,.45);outline-offset:3px}img{max-width:100%;height:auto}.topbar{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid rgba(22,32,42,.11);box-shadow:0 1px 0 rgba(22,32,42,.03)}.topbar__inner{display:grid;grid-template-columns:minmax(10rem,auto) auto minmax(15rem,1fr) auto;grid-template-areas:'brand nav search account';gap:.65rem 18px;align-items:center;max-width:var(--ll-content);margin:0 auto;min-height:var(--ll-header-h);padding:0 1rem}.brand{grid-area:brand}.brand__name,.brand__meta{margin:0}.brand__name a,.brand__fallback{color:var(--ll-ink);font:700 0.9rem/1.05 var(--ll-header-font);letter-spacing:-.01em;text-decoration:none;white-space:nowrap}.brand__meta{display:none;color:var(--ll-muted)}.custom-logo-link img{display:block;max-width:13rem;max-height:3.5rem}.header-search{grid-area:search;justify-self:end;max-width:350px;width:100%}.header-search label{position:absolute;left:-999px}.header-search__pill{display:flex;align-items:center;gap:.35rem;min-height:2.25rem;border:1px solid rgba(22,32,42,.15);border-radius:var(--ll-radius-pill);background:#fff;padding:0 0 0 .85rem;box-shadow:0 1px 2px rgba(22,32,42,.05)}.header-search input{min-width:0;border:0;outline:0;flex:1;background:transparent;color:var(--ll-ink);font:400 14px/1.2 var(--ll-ui-font)}.header-search button,.action-link,.search-form button{display:inline-flex;align-items:center;justify-content:center;min-height:2.25rem;border:0;border-radius:var(--ll-radius-pill);background:var(--ll-accent);color:#fff;font:700 14px/1 var(--ll-button-font);padding:0 .9rem;text-decoration:none;cursor:pointer;white-space:nowrap}.nav{grid-area:nav;display:flex;align-items:center;gap:1.05rem;font:400 16.2px/1 var(--ll-header-font);white-space:nowrap}.nav__list,.footer__nav-list{display:flex;align-items:center;gap:1.05rem;margin:0;padding:0;list-style:none}.nav a{display:inline-flex;align-items:center;min-height:var(--ll-header-h);color:var(--ll-ink);padding:0 .1rem;text-decoration:none}.nav .current-menu-item>a,.nav .current-menu-ancestor>a,.nav .current_page_item>a,.nav .current_page_ancestor>a,.nav a:hover,.nav a:focus-visible,.auth-link:hover,.auth-link:focus-visible{color:var(--ll-accent-dark);outline:none}.topbar__account{grid-area:account;justify-self:end;display:flex;gap:.5rem;align-items:center}.auth-link{display:inline;color:var(--ll-ink);font:400 13.5px/1 var(--ll-header-font);text-decoration:none}.nav-toggle{display:none;grid-area:toggle;border:1px solid rgba(22,32,42,.15);border-radius:var(--ll-radius-pill);background:#fff;color:var(--ll-ink);min-height:2.35rem;padding:0 .75rem}.nav-toggle__bars,.nav-toggle__bars:before,.nav-toggle__bars:after{display:block;width:1.1rem;height:2px;border-radius:2px;background:currentColor;content:''}.nav-toggle__bars{position:relative}.nav-toggle__bars:before,.nav-toggle__bars:after{position:absolute;left:0}.nav-toggle__bars:before{top:-5px}.nav-toggle__bars:after{top:5px}.main{max-width:var(--ll-content);margin:0 auto;padding:2rem 1rem}.surface{background:var(--ll-card);border:1px solid var(--ll-line);border-radius:var(--ll-radius-lg);box-shadow:var(--ll-shadow)}.landing,.article,.learning-path-page,.search-page,.workspace-shell{padding:1.25rem}.landing--compact h1{font-size:clamp(2rem,4vw,3.4rem)}.lede{color:var(--ll-muted);font-size:1.08rem;max-width:70ch}.meta,.card__meta{color:var(--ll-muted)}.eyebrow{font:800 .78rem/1.1 var(--ll-ui-font);letter-spacing:.08em;text-transform:uppercase;color:var(--ll-blue)}.landing-split,.path-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.card-list{display:grid;gap:1rem}.card-list--index{margin-top:1rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.card{padding:1rem;border:1px solid var(--ll-line);border-radius:var(--ll-radius-md);background:#fff}.card h2{margin-top:.2rem;font:800 1.35rem/1.12 var(--ll-header-font)}.card a{text-underline-offset:.18em}.article-layout{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.8fr) minmax(220px,.65fr);gap:1rem;align-items:start}.article-column{min-width:0}.study-nav,.toc-rail{position:sticky;top:calc(var(--ll-header-h) + .5rem);padding:1rem;font-family:var(--ll-ui-font)}.study-nav__list,.toc{padding-left:1.2rem}.study-nav__link.current{font-weight:900}.toc a{text-decoration:none}.toc a:hover,.toc a:focus-visible{text-decoration:underline}.toc__item--level-3{margin-left:.7rem}.toc__empty{color:var(--ll-muted)}.article-summary{padding:1rem;margin:1rem 0}.article-note,.llb-callout{border-left:4px solid var(--ll-accent);padding:.8rem 1rem;background:var(--ll-note);margin:1rem 0}.body{font-size:0.972rem;line-height:1.72}.body h2,.body h3,.body h4{scroll-margin-top:calc(var(--ll-header-h) + 1.25rem)}.body h2{font-size:2rem;line-height:1.1;margin-top:2rem}.body h3{font-size:1.45rem;line-height:1.18;margin-top:1.4rem}.breadcrumbs{display:flex;gap:.4rem;flex-wrap:wrap;list-style:none;padding:0;color:var(--ll-muted);font:500 .9rem/1.3 var(--ll-ui-font)}.breadcrumbs li:not(:last-child):after{content:'/';margin-left:.4rem;color:#a6957e}/* :after on the item it follows, not :before on the next one. With li+li:before the separator belongs to the FOLLOWING crumb, so a trail that wraps starts its second line with a stray '/'. Invisible until 2026-09-24, when the article crumb became the first three-item trail on the site and wrapped at 390px. */.meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.meta-grid div{border-top:1px solid var(--ll-line);padding-top:.4rem}.meta-grid dt{font:800 .72rem/1.1 var(--ll-ui-font);text-transform:uppercase;color:var(--ll-muted)}.meta-grid dd{margin:0}.llb-authority-link{display:inline-flex;align-items:center;gap:.35rem;border-radius:var(--ll-radius-pill);background:#fff2d6;color:#4a3b0a;padding:.18rem .55rem;text-decoration:none;font:800 .82rem/1.25 var(--ll-ui-font)}.llb-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.llb-stage{padding:1rem;border:1px solid var(--ll-line);border-radius:var(--ll-radius-md);background:#fff}.search-form{display:flex;gap:.6rem;align-items:end;flex-wrap:wrap}.search-form label{display:grid;gap:.25rem;font:700 .9rem/1.2 var(--ll-ui-font)}.search-form input{min-height:2.5rem;border:1px solid var(--ll-line);border-radius:var(--ll-radius-pill);padding:0 1rem;font:400 1rem/1.2 var(--ll-ui-font)}.search-page__prompt{color:var(--ll-muted);font-size:1.08rem;max-width:70ch;margin-top:1rem}.search-page__count{font-weight:800;margin-top:1.25rem}.search-page__empty{border-left:4px solid var(--ll-accent);padding:.8rem 1rem;background:var(--ll-note);margin:1.25rem 0}.search-page__results{margin-top:1rem}.footer{max-width:var(--ll-content);margin:0 auto;padding:1.5rem 1rem 2.25rem;color:var(--ll-muted);font:500 .9rem/1.4 var(--ll-ui-font)}.footer__inner{border-top:1px solid var(--ll-line);padding-top:1rem}.footer__nav-list{justify-content:flex-start;flex-wrap:wrap}.footer a{color:var(--ll-accent-dark)}.wp-block-button__link{border-radius:var(--ll-radius-pill);background:var(--ll-accent);font-family:var(--ll-button-font);font-weight:700}.wp-block-quote{border-left:4px solid var(--ll-accent);background:#fff;padding:.75rem 1rem}.wp-block-table table{border-collapse:collapse}.wp-block-table td,.wp-block-table th{border:1px solid var(--ll-line);padding:.65rem;text-align:left}@media(max-width:920px){:root{--ll-header-h:3.8125rem}.topbar__inner{grid-template-columns:1fr auto;grid-template-areas:'brand toggle' 'nav nav' 'search search' 'account account';align-items:center;min-height:var(--ll-header-h);padding:.55rem 1rem}.nav-toggle{display:inline-flex;align-items:center;justify-content:center;justify-self:end}.nav{display:none;grid-area:nav;overflow-x:auto;padding:.4rem 0}.nav[data-open='true']{display:block}.nav__list{align-items:flex-start;flex-direction:column;gap:.15rem}.nav a{min-height:2.25rem}.header-search{grid-area:search;display:none;justify-self:stretch;max-width:none}.nav[data-open='true']+.topbar__account,.topbar__account{justify-self:start}.topbar[data-nav-open='true'] .header-search{display:block}.article-layout{grid-template-columns:1fr}.study-nav,.toc-rail{position:static}.study-nav{display:none}.meta-grid,.landing-split{grid-template-columns:1fr}}@media(max-width:599px){body{font-size:15.3px}.main{padding:1rem .75rem}.landing,.article,.learning-path-page,.search-page,.library-index,.institution-console{padding:1rem}.card-list--index{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Stage 3 extracted renderer presentation */
:root {
      --ll-token_set: legal-learning-foundation;
      --ll-status: active;
      --ll-principle: compact-application-shell;
      --ll-color-canvas: #f4efe6;
      --ll-color-canvasGradientTop: #faf6ee;
      --ll-color-ink: #1f2730;
      --ll-color-muted: #55606b;
      --ll-color-line: #d7d0c2;
      --ll-color-surface: #fffdfa;
      --ll-color-surfaceStrong: #f8f3ea;
      --ll-color-accent: #8a4a22;
      --ll-color-accentHover: #6d391a;
      --ll-color-accentSoft: #f2e3d2;
      --ll-color-focus: #165d91;
      --ll-typography-ui: ui-sans-serif, system-ui, sans-serif;
      --ll-typography-serif: Georgia, 'Times New Roman', serif;
      --ll-typography-bodySize: 14.4px;
      --ll-typography-bodyLineHeight: 1.65;
      /* Fixed, not clamp(1.85rem, 3.2vw, 2.45rem) -- that vw term made H1
         grow smoothly from 29.6px to 39.2px between ~925px and ~1225px
         viewport widths, and a separate <=599px override on top of it
         (font-size:clamp(1.7rem,11.05vw,2.72rem), see below) could jump
         as high as 43.52px, LARGER than any desktop value -- a jarring,
         backwards increase when narrowing the window. Operator request,
         2026-08-20: H1 must not change size on resize, at all. Fixed at
         the old clamp's floor (1.85rem = 29.6px, the size already shown
         at typical desktop widths) and the <=599px override removed
         entirely so every width now renders identically. */
      --ll-typography-titleSize: 1.85rem;
      --ll-typography-sectionTitleSize: 1.1rem;
      --ll-typography-labelSize: 0.81rem;
      --ll-spacing-xxs: 0.25rem;
      --ll-spacing-xs: 0.5rem;
      --ll-spacing-sm: 0.75rem;
      --ll-spacing-md: 1rem;
      --ll-spacing-lg: 1.5rem;
      --ll-spacing-xl: 2rem;
      --ll-spacing-xxl: 3rem;
      --ll-radius-sm: 0.65rem;
      --ll-radius-md: 1rem;
      --ll-radius-lg: 1.4rem;
      --ll-radius-pill: 999px;
      --ll-shadow-panel: 0 18px 44px rgba(31, 39, 48, 0.08);
      --ll-layout-shellWidth: 1160px;
      --ll-layout-contentWidth: 780px;
      --ll-layout-readingMeasure: 780px;
      --ll-layout-headerHeight: 3.5rem;
      --ll-layout-sidebarWidth: 15rem;
      --ll-layout-railWidth: 13rem;
      --ll-layout-pageInset: clamp(14px, 2.4vw, 24px);
      --ll-layout-stickyOffset: calc(var(--ll-layout-headerHeight) + var(--ll-spacing-md));
      --ll-layout-stickyOffsetPx: 72px;
      --ll-breakpoints-mobile: 640px;
      --ll-breakpoints-tablet: 920px;
      --ll-breakpoints-desktop: 1180px;
      --ll-motion-duration: 160ms;
      --ll-motion-easing: ease;
      --ll-a11y-focusWidth: 3px;
      --ll-a11y-targetOffset: 4.5rem;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: linear-gradient(180deg, var(--ll-color-canvasGradientTop) 0%, var(--ll-color-canvas) 100%);
      color: var(--ll-color-ink);
      font-family: var(--ll-typography-serif);
      font-size: var(--ll-typography-bodySize);
      line-height: var(--ll-typography-bodyLineHeight);
    }
    body.assistant-panel-open, body.tutor-dialog-open { overflow: hidden; }
    a { color: var(--ll-color-accent); text-underline-offset: 0.12em; }
    a:hover { color: var(--ll-color-accentHover); }
    img, svg, video { max-width: 100%; height: auto; }
    table { width: 100%; border-collapse: collapse; margin: 0 0 var(--ll-spacing-md); font: 500 0.92rem/1.45 var(--ll-typography-ui); }
    th, td { padding: 0.7rem 0.8rem; border: 1px solid var(--ll-color-line); text-align: left; vertical-align: top; }
    th { background: var(--ll-color-accentSoft); }
    blockquote { margin: 0 0 var(--ll-spacing-md); padding: 0.2rem 0 0.2rem var(--ll-spacing-md); border-left: 3px solid var(--ll-color-accent); color: var(--ll-color-muted); }
    code { padding: 0.08rem 0.32rem; border-radius: var(--ll-radius-sm); background: var(--ll-color-surfaceStrong); font: 600 0.84em/1.2 var(--ll-typography-ui); }
    .skip-link {
      position: absolute;
      left: var(--ll-spacing-md);
      top: var(--ll-spacing-sm);
      transform: translateY(-180%);
      padding: var(--ll-spacing-xs) var(--ll-spacing-sm);
      border-radius: var(--ll-radius-pill);
      background: var(--ll-color-focus);
      color: var(--ll-color-surface);
      font: 700 var(--ll-typography-labelSize)/1 var(--ll-typography-ui);
      text-decoration: none;
      transition: transform var(--ll-motion-duration) var(--ll-motion-easing);
    }
    .skip-link:focus-visible { transform: translateY(0); }
    .app { min-height: 100vh; }
    .topbar {
      position: sticky;
      top: 0;
      z-index: 20;
      border-bottom: 1px solid var(--ll-color-line);
      background: rgba(255, 253, 250, 0.94);
      backdrop-filter: blur(10px);
    }
    .topbar__inner, .topbar__meta, .main, .footer {
      width: min(calc(100% - (2 * var(--ll-layout-pageInset))), var(--ll-layout-shellWidth));
      margin: 0 auto;
    }
    .topbar__inner {
      min-height: var(--ll-layout-headerHeight);
      display: grid;
      grid-template-columns: minmax(12rem, 1fr) minmax(16rem, 24rem) auto minmax(9rem, auto);
      grid-template-areas: "brand search nav account";
      align-items: center;
      gap: 0.45rem var(--ll-spacing-md);
      overflow: visible;
      padding: var(--ll-spacing-sm) 0;
    }
    .brand { grid-area: brand; }
    .header-search { grid-area: search; }
    .nav { grid-area: nav; }
    .topbar__account { grid-area: account; justify-self: end; align-self: center; }
    .brand { display: grid; gap: 0.12rem; min-width: 0; }
    .brand__name {
      margin: 0;
      font: 700 0.837rem/1.1 var(--ll-typography-ui);
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .brand__name a { color: inherit; text-decoration: none; }
    .brand__logo-link { display: inline-block; }
    .brand__logo {
      display: inline-block;
      height: 2.75rem;
      width: auto;
      /* The logo's own wordmark baseline sits 65.48% down from the top of its
         2400x420 viewBox (measured from the SVG's text-path transform origin),
         i.e. 34.52% up from the bottom. Image vertical-align:baseline puts the
         image's bottom edge on the surrounding text baseline by default, so
         shift down by roughly that fraction of the rendered height to bring
         the wordmark's own baseline into line with the header nav text
         baseline instead; the extra beyond 0.3452em is a small empirical
         correction confirmed by measuring the actual rendered "Home" nav
         link's text baseline (Playwright + getBoundingClientRect), since
         real font-metric baselines don't sit at a pure geometric midpoint. */
      vertical-align: -0.418em;
      font-size: 2.75rem;
    }
    .brand__meta { margin: 0; color: var(--ll-color-muted); font: 500 var(--ll-typography-labelSize)/1.2 var(--ll-typography-ui); }
    .nav { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: var(--ll-spacing-sm); font: 600 0.801rem/1.2 var(--ll-typography-ui); }
    .nav a { color: var(--ll-color-ink); text-decoration: none; padding: 0.2rem 0; }
    .nav a.current { color: var(--ll-color-accentHover); border-bottom: 2px solid var(--ll-color-accent); }

    .header-search { width: min(100%, 24rem); justify-self: center; }
    .header-search label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .header-search__pill {
      min-height: 2.45rem;
      display: grid;
      grid-template-columns: 1rem minmax(8rem, 1fr) auto;
      align-items: center;
      gap: 0.42rem;
      border: 1px solid var(--ll-color-line);
      border-radius: var(--ll-radius-pill);
      padding: 0.16rem 0.22rem 0.16rem 0.72rem;
      background: #fff;
      box-shadow: 0 8px 18px rgba(64, 43, 28, 0.06);
    }
    .header-search__icon { width: 1rem; height: 1rem; fill: var(--ll-color-muted); }
    .header-search input[type="search"] {
      min-height: 2rem;
      width: 100%;
      border: 0;
      padding: 0.25rem 0;
      background: transparent;
      font: 600 0.82rem/1.2 var(--ll-typography-ui);
      outline: none;
    }
    .header-search button, .inline-form button, .auth-form button, .tutor-dialog__form button, .action-link--primary {
      min-height: 2.3rem;
      border: 1px solid var(--ll-color-line);
      border-radius: var(--ll-radius-pill);
      background: var(--ll-color-accent);
      color: #fff;
      padding: 0.45rem 0.75rem;
      font: 700 0.82rem/1.1 var(--ll-typography-ui);
      cursor: pointer;
    }
    .header-search button { min-height: 2rem; padding: 0.36rem 0.68rem; background: var(--ll-color-ink); }
    .account-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.42rem; font: 600 0.801rem/1.2 var(--ll-typography-ui); }
    .account-nav a { color: var(--ll-color-ink); text-decoration: none; padding: 0.2rem 0; }
    .account-nav a:hover { color: var(--ll-color-accentHover); }
    .auth-separator { color: var(--ll-color-muted); font-weight: 500; }
    .account-menu-control { position: relative; }
    .account-pill { display: inline-flex; align-items: center; gap: 0.42rem; max-width: 13rem; min-height: 2.45rem; border: 1px solid var(--ll-color-line); border-radius: var(--ll-radius-pill); background: #fff; color: var(--ll-color-ink); padding: 0.16rem 0.72rem; font: 800 0.738rem/1.2 var(--ll-typography-ui); cursor: pointer; box-shadow: 0 8px 18px rgba(64, 43, 28, 0.06); }
    .account-pill span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .account-pill__caret { width: 0.7rem; height: 0.5rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform var(--ll-motion-duration) var(--ll-motion-easing); }
    .account-pill[aria-expanded="true"] .account-pill__caret { transform: rotate(180deg); }
    .account-menu { position: absolute; right: 0; top: calc(100% + 0.35rem); z-index: 120; min-width: 9.5rem; padding: 0.35rem; background: #fff; border: 1px solid rgba(31, 39, 48, 0.14); box-shadow: 0 16px 34px rgba(31, 39, 48, 0.14); }
    .account-menu[hidden] { display: none; }
    .account-menu a, .account-menu button { display: flex; width: 100%; align-items: center; justify-content: flex-start; min-height: 2.2rem; border: 0; border-radius: var(--ll-radius-sm); background: transparent; color: var(--ll-color-ink); padding: 0.45rem 0.6rem; font: 800 0.82rem/1 var(--ll-typography-ui); text-decoration: none; cursor: pointer; }
    .account-menu a:focus-visible, .account-menu button:focus-visible, .account-menu a:hover, .account-menu button:hover { background: var(--ll-color-accentSoft); outline: none; }
    .account-menu form { margin: 0; }
    .inline-form { display: inline-flex; margin: 0; gap: 0.35rem; }

    .saved-state { display: inline-flex; align-items: center; border-radius: var(--ll-radius-pill); padding: 0.42rem 0.62rem; background: #e8f5e9; color: #1c6f5b; font: 800 0.76rem/1 var(--ll-typography-ui); }
    .upload-widget { display: grid; gap: var(--ll-spacing-sm); margin-top: var(--ll-spacing-sm); }
    .upload-widget__dropzone { display: grid; gap: 0.45rem; border: 2px dashed var(--ll-color-line); border-radius: var(--ll-radius-md); padding: var(--ll-spacing-md); background: var(--ll-color-surfaceStrong); font: 700 0.84rem/1.3 var(--ll-typography-ui); cursor: pointer; }
    .upload-widget__status { margin: 0; color: var(--ll-color-muted); font: 600 0.8rem/1.35 var(--ll-typography-ui); }
    .tutor-workspace { display: grid; gap: var(--ll-spacing-md); padding: clamp(1.1rem, 2vw, 1.8rem); }
    .tutor-dialog--workspace { position: static; width: 100%; height: min(48rem, calc(100vh - 12rem)); max-height: none; }
    .inline-form button.action-link { color: var(--ll-color-ink); background: var(--ll-color-surface); }
    .action-link--primary { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
    .workspace-table { width: 100%; border-collapse: collapse; margin: var(--ll-spacing-sm) 0; font: 600 0.82rem/1.35 var(--ll-typography-ui); }
    .workspace-table th, .workspace-table td { border-bottom: 1px solid var(--ll-color-line); padding: 0.62rem 0.5rem; text-align: left; vertical-align: top; }
    .workspace-table th { color: var(--ll-color-muted); font: 800 0.72rem/1.1 var(--ll-typography-ui); letter-spacing: 0.04em; text-transform: uppercase; }
    .workspace-table td .workspace-inline-meta { display: block; margin-top: 0.18rem; }
    .workspace-table .inline-form { display: inline-flex; vertical-align: middle; }
    .main--utility { width: min(calc(100% - (2 * var(--ll-layout-pageInset))), 800px); }
    .auth-page { display: grid; justify-items: center; text-align: left; }
    .auth-page > * { width: min(100%, 34rem); }
    .auth-form { display: grid; gap: var(--ll-spacing-sm); width: min(100%, 34rem); max-width: 34rem; margin: var(--ll-spacing-md) auto 0; }
    .auth-form label { display: grid; gap: 0.35rem; font: 700 0.82rem/1.2 var(--ll-typography-ui); }
    .auth-form input { min-height: 2.5rem; border: 1px solid var(--ll-color-line); border-radius: var(--ll-radius-sm); padding: 0.45rem 0.65rem; font: 500 1rem/1.2 var(--ll-typography-ui); }
    .main { padding: var(--ll-spacing-lg) 0 var(--ll-spacing-xxl); }
    .surface {
      background: var(--ll-color-surface);
      border: 1px solid rgba(138, 74, 34, 0.12);
      border-radius: var(--ll-radius-lg);
      box-shadow: var(--ll-shadow-panel);
    }
    .landing, .learning-path-page { padding: clamp(1.2rem, 2vw, 1.8rem); }
    /* One title treatment for every page heading. Contextual rules may adjust
       spacing below a heading, but never its font, line-height or top margin. */
    h1 { margin: 0 0 var(--ll-spacing-sm); font: 700 var(--ll-typography-titleSize)/1.02 var(--ll-typography-serif); }
    .lede { max-width: 62ch; margin: 0; color: var(--ll-color-muted); }
    .section-title { margin: 0 0 var(--ll-spacing-sm); font: 700 1rem/1.2 var(--ll-typography-ui); }
    .landing-split, .learning-path-hero, .stage-list, .card-list, .workspace-grid { display: grid; gap: var(--ll-spacing-sm); }
    .landing-split { margin-top: var(--ll-spacing-lg); }
    .card-list { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
    .workspace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: var(--ll-spacing-lg); }
    .card, .workspace-card, .workspace-hero, .upgrade-note, .stage-card, .learning-path-hero__panel, .article-summary { padding: var(--ll-spacing-md); border: 1px solid var(--ll-color-line); border-radius: var(--ll-radius-md); background: #fff; }
    .card h2, .workspace-card h2, .stage-card h2 { margin: 0 0 var(--ll-spacing-xs); font: 700 1rem/1.25 var(--ll-typography-ui); }
    .card p, .workspace-card p, .upgrade-note p, .stage-card p, .article-summary p { margin: 0 0 var(--ll-spacing-sm); color: var(--ll-color-muted); }
    .card a { font: 700 0.86rem/1.2 var(--ll-typography-ui); }
    .card__meta, .stage-card__effort { color: var(--ll-color-muted); font: 600 0.8rem/1.3 var(--ll-typography-ui); }
    .article-layout {
      display: grid;
      grid-template-columns: minmax(0, var(--ll-layout-sidebarWidth)) minmax(0, 1fr) minmax(0, var(--ll-layout-railWidth));
      gap: var(--ll-spacing-md);
      align-items: start;
    }
    .article-layout--no-right { grid-template-columns: minmax(0, var(--ll-layout-sidebarWidth)) minmax(0, 1fr); }
    .article-column { min-width: 0; display: grid; gap: var(--ll-spacing-sm); }
    .study-nav, .toc-rail { padding: var(--ll-spacing-md); }
    .study-nav, .toc-rail { position: sticky; top: var(--ll-layout-stickyOffset); }
    .eyebrow { margin: 0 0 var(--ll-spacing-xs); color: var(--ll-blue); font: 800 .78rem/1.1 var(--ll-ui-font); letter-spacing: 0.08em; text-transform: uppercase; }
    .study-nav__summary { margin: 0 0 var(--ll-spacing-sm); font: 600 0.82rem/1.25 var(--ll-typography-ui); }
    .study-nav__empty { color: var(--ll-color-muted); font: 600 0.82rem/1.35 var(--ll-typography-ui); }
    .study-nav__path-link { margin: 0 0 var(--ll-spacing-sm); font: 600 0.82rem/1.25 var(--ll-typography-ui); }
    .study-nav__list, .toc, .assistant-actions { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.32rem; }
    .study-nav__link, .toc a {
      display: block;
      padding: 0.34rem 0.45rem;
      border-radius: var(--ll-radius-sm);
      color: var(--ll-color-ink);
      text-decoration: none;
      font: 600 0.82rem/1.25 var(--ll-typography-ui);
    }
    .study-nav__link.current, .toc a[data-active] { background: var(--ll-color-accentSoft); color: var(--ll-color-accentHover); }
    .toc__item--level-3 a { padding-left: 1rem; color: var(--ll-color-muted); }
    .toc-rail__header { display: grid; gap: var(--ll-spacing-xs); margin-bottom: var(--ll-spacing-sm); }
    .toc-bookmark { display: grid; gap: 0.35rem; margin: 0; }
    .toc-bookmark .action-link { width: 100%; }
    .toc-bookmark--login { font: 700 0.82rem/1.25 var(--ll-typography-ui); }
    .toc-bookmark--login a { text-decoration: none; }
    .saved-state--unsaved { background: var(--ll-color-surfaceStrong); color: var(--ll-color-muted); }
    .action-link, .assistant-action, .assistant-panel__close {
      border: 1px solid var(--ll-color-line);
      border-radius: var(--ll-radius-pill);
      background: var(--ll-color-surface);
      padding: 0.55rem 0.85rem;
      font: 700 0.82rem/1.1 var(--ll-typography-ui);
      color: var(--ll-color-ink);
      text-decoration: none;
      cursor: pointer;
    }
    .action-link { display: inline-flex; align-items: center; justify-content: center; }
    .assistant-action[disabled] { cursor: not-allowed; color: var(--ll-color-muted); background: var(--ll-color-surfaceStrong); }
    .article { width: 100%; padding: clamp(1.1rem, 2vw, 1.8rem); }
    .breadcrumbs {
      display: flex;
      flex-wrap: wrap;
      gap: 0.42rem;
      margin: 0 0 var(--ll-spacing-sm);
      padding: 0;
      list-style: none;
      color: var(--ll-color-muted);
      font: 500 0.8rem/1.2 var(--ll-typography-ui);
    }
    .breadcrumbs li { display: inline-flex; align-items: center; gap: 0.42rem; }
    .breadcrumbs li:not(:last-child)::after { content: "/"; margin-left: 0.42rem; color: #a6957e; } /* ::after on the item it follows, not ::before on the next one -- see the note on the same rule in the base sheet. Two copies of this sheet are concatenated and only one was fixed first time, which put TWO separators on the wrapped line instead of none. */
    .assistant-panel h2 { margin: 0 0 var(--ll-spacing-xs); font: 700 var(--ll-typography-titleSize)/1.04 var(--ll-typography-serif); }
    .assistant-panel h2 { font-size: 1.45rem; }
    .meta { margin: 0 0 var(--ll-spacing-sm); color: var(--ll-color-muted); font: 500 0.82rem/1.35 var(--ll-typography-ui); }
    .article-note { margin-bottom: var(--ll-spacing-lg); padding: var(--ll-spacing-sm); border-left: 3px solid var(--ll-color-accent); background: var(--ll-color-accentSoft); color: var(--ll-color-ink); font: 500 0.85rem/1.45 var(--ll-typography-ui); }
    .article-summary { margin-bottom: var(--ll-spacing-lg); }
    .meta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 0.7rem 1rem; margin: 0 0 var(--ll-spacing-md); }
    .meta-grid dt { margin: 0 0 0.2rem; color: var(--ll-color-muted); font: 700 0.72rem/1.2 var(--ll-typography-ui); letter-spacing: 0.06em; text-transform: uppercase; }
    .meta-grid dd { margin: 0; font: 500 0.88rem/1.45 var(--ll-typography-ui); }
    .body { width: min(100%, var(--ll-layout-readingMeasure)); }
    /* The reading measure is a prose control -- it keeps article body text to a
       comfortable line length. The full-width template exists precisely to opt
       out of that, but nothing had ever acted on its marker class, so a page
       using it still had its content capped at the measure. On the Trust Centre
       that left an empty strip down the right that read as a reserved rail.
       Scoped to the full-width template, so article and learning-path prose keep
       their measure. */
    .article--full-width .body { width: 100%; }
    .body h2, .body h3 { scroll-margin-top: var(--ll-layout-stickyOffset); }
    .body h2 { margin: 1.8rem 0 0.55rem; font: 700 var(--ll-typography-sectionTitleSize)/1.2 var(--ll-typography-ui); }
    .body h3 { margin: 1.25rem 0 0.5rem; font: 700 0.97rem/1.2 var(--ll-typography-ui); }
    .body h2 a, .body h3 a { color: inherit; text-decoration: none; }
    .body p, .body li { margin: 0 0 0.85rem; }
    .body ul, .body ol, .stage-card ul { padding-left: 1.2rem; margin: 0 0 var(--ll-spacing-md); }
    .actions { display: flex; flex-wrap: wrap; gap: var(--ll-spacing-xs); margin-top: var(--ll-spacing-lg); }
    .authority-pill, .authority-text { display: inline-flex; align-items: center; margin: 0 0.08rem; vertical-align: baseline; }
    .authority-pill { border: 1px solid rgba(138, 74, 34, 0.24); border-radius: var(--ll-radius-pill); background: var(--ll-color-accentSoft); overflow: hidden; font: 700 0.86em/1.25 var(--ll-typography-ui); }
    .authority-pill__text { padding: 0.08rem 0.42rem; color: var(--ll-color-accentHover); text-decoration: none; }
    .authority-pill__save { min-width: 1.6rem; min-height: 1.6rem; border: 0; border-left: 1px solid rgba(138, 74, 34, 0.2); background: #fff; color: var(--ll-color-accentHover); padding: 0 0.42rem; font: 900 0.78rem/1 var(--ll-typography-ui); text-decoration: none; cursor: pointer; }
    .authority-pill__save[aria-pressed="true"] { color: #1c6f5b; cursor: default; }
    .authority-pill__save[data-save-failed] { color: #9f2f2f; }
    .authority-text { border-bottom: 1px dotted var(--ll-color-line); }
    .upgrade-note { margin-bottom: var(--ll-spacing-sm); }
    .learning-path-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: var(--ll-spacing-lg) 0; align-items: start; }
    .stage-list { margin-top: var(--ll-spacing-lg); }
    .stage-card__header { display: flex; align-items: start; justify-content: space-between; gap: var(--ll-spacing-sm); margin-bottom: var(--ll-spacing-sm); }
    .stage-card__purpose { color: var(--ll-color-ink); }
    .stage-card__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ll-spacing-md); }
    .assistant-panel {
      position: fixed;
      right: max(var(--ll-layout-pageInset), calc((100vw - var(--ll-layout-shellWidth)) / 2));
      bottom: var(--ll-spacing-lg);
      width: min(28rem, calc(100vw - (2 * var(--ll-layout-pageInset))));
      max-height: min(34rem, calc(100vh - (2 * var(--ll-spacing-lg))));
      overflow: auto;
      padding: var(--ll-spacing-md);
      z-index: 40;
    }
    .assistant-panel__header { display: flex; align-items: start; justify-content: space-between; gap: var(--ll-spacing-sm); margin-bottom: var(--ll-spacing-sm); }
    .assistant-panel__note { margin: 0 0 var(--ll-spacing-md); color: var(--ll-color-muted); font: 500 0.84rem/1.45 var(--ll-typography-ui); }
    .tutor-launcher {
      position: fixed;
      right: max(var(--ll-layout-pageInset), calc((100vw - var(--ll-layout-shellWidth)) / 2));
      bottom: var(--ll-spacing-md);
      z-index: 45;
      min-width: 4.6rem;
      min-height: 4.6rem;
      border: 0;
      border-radius: 999px;
      background: #1c6f5b;
      color: #fff;
      box-shadow: 0 18px 42px rgba(22, 68, 54, 0.28);
      font: 800 0.88rem/1 var(--ll-typography-ui);
      cursor: pointer;
    }
    .tutor-dialog {
      position: fixed;
      right: max(var(--ll-layout-pageInset), calc((100vw - var(--ll-layout-shellWidth)) / 2));
      bottom: calc(var(--ll-spacing-md) + 5.25rem);
      width: min(30rem, calc(100vw - (2 * var(--ll-layout-pageInset))));
      height: min(42rem, calc(100vh - 8rem));
      max-height: calc(100vh - 8rem);
      z-index: 46;
      display: grid;
      grid-template-rows: auto minmax(12rem, 1fr) auto auto;
      overflow: hidden;
      background: #fff;
      border: 1px solid rgba(31, 39, 48, 0.16);
      box-shadow: 0 20px 48px rgba(31, 39, 48, 0.14);
    }
    .tutor-dialog[hidden] { display: none; }
    .tutor-dialog__header { display: flex; justify-content: space-between; gap: var(--ll-spacing-sm); padding: var(--ll-spacing-md); border-bottom: 1px solid var(--ll-color-line); }
    .tutor-dialog__header h2 { margin: 0; font: 700 1.18rem/1.1 var(--ll-typography-serif); }
    .tutor-dialog__messages { overflow: auto; padding: var(--ll-spacing-md); background: #fff; scroll-behavior: smooth; }
    .tutor-bubble { max-width: 86%; margin: 0 0 var(--ll-spacing-xs); padding: 0.72rem 0.82rem; border-radius: 1rem; border: 1px solid rgba(31, 39, 48, 0.08); background: #fff; box-shadow: 0 1px 1px rgba(0,0,0,0.06); font: 500 0.9rem/1.45 var(--ll-typography-ui); overflow-wrap: anywhere; }
    .tutor-bubble--user { margin-left: auto; background: #e8f5e9; border-color: rgba(31, 111, 91, 0.18); }
    .tutor-bubble--tutor { margin-right: auto; background: #fff; }
    .tutor-bubble--loading, .tutor-bubble--error { color: var(--ll-color-muted); }
    .tutor-citations { display: flex; flex-wrap: wrap; gap: 0.42rem; max-height: 9rem; overflow: auto; margin: 0.65rem 0 0; font: 600 0.8rem/1.35 var(--ll-typography-ui); }
    .citation-pill, .article-link-pill { display: inline-flex; align-items: center; gap: 0.22rem; border: 1px solid var(--ll-color-line); border-radius: var(--ll-radius-pill); background: var(--ll-color-surfaceStrong); overflow: hidden; }
    .article-link-pill { background: #e8f5e9; border-color: rgba(31, 111, 91, 0.2); }
    .citation-pill a, .article-link-pill a { padding: 0.34rem 0.48rem; color: var(--ll-color-ink); text-decoration: none; }
    .citation-pill button, .article-link-pill button { min-height: 1.8rem; border: 0; border-left: 1px solid var(--ll-color-line); background: #fff; color: var(--ll-color-accentHover); padding: 0.28rem 0.48rem; font: 800 0.72rem/1 var(--ll-typography-ui); cursor: pointer; }
    .citation-pill button[aria-pressed="true"], .article-link-pill button[aria-pressed="true"] { color: #1c6f5b; cursor: default; }
    .tutor-feedback { display: flex; gap: 0.4rem; margin-top: 0.65rem; }
    .tutor-feedback button { border: 1px solid var(--ll-color-line); border-radius: var(--ll-radius-pill); background: var(--ll-color-surface); color: var(--ll-color-ink); padding: 0.35rem 0.6rem; font: 700 0.76rem/1 var(--ll-typography-ui); cursor: pointer; }
    .tutor-feedback button[data-selected], .tutor-feedback button[aria-pressed="true"] { background: #1c6f5b; color: #fff; border-color: #1c6f5b; }
    .tutor-feedback__choices { display: flex; gap: 0.4rem; }
    .tutor-feedback__receipt { font-weight: 700; }
    .tutor-feedback__details { display: grid; gap: 0.5rem; width: min(100%, 24rem); padding: 0.7rem; border: 1px solid var(--ll-color-line); border-radius: 12px; background: rgba(255,255,255,.72); }
    .tutor-feedback__details label { display: grid; gap: 0.25rem; font-size: 0.82rem; font-weight: 700; }
    .tutor-feedback__details select, .tutor-feedback__details textarea { width: 100%; border: 1px solid var(--ll-color-line); border-radius: 8px; padding: 0.45rem; background: #fff; color: var(--ll-color-ink); font: inherit; }
    .tutor-dialog__form { display: grid; grid-template-columns: 1fr auto; gap: 0.5rem; align-items: end; padding: var(--ll-spacing-sm); border-top: 1px solid var(--ll-color-line); background: #fff; }
    .tutor-dialog__form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .tutor-dialog__form textarea { width: 100%; min-height: 2.7rem; resize: vertical; border: 1px solid var(--ll-color-line); border-radius: 1.3rem; padding: 0.65rem 0.85rem; font: 500 0.9rem/1.3 var(--ll-typography-ui); }
    .tutor-dialog__full, .tutor-dialog__auth { margin: 0; padding: 0 var(--ll-spacing-md) var(--ll-spacing-md); background: #fff; font: 700 0.82rem/1.3 var(--ll-typography-ui); }
    .footer { padding-bottom: var(--ll-spacing-lg); color: var(--ll-color-muted); font: 500 0.78rem/1.35 var(--ll-typography-ui); }
    .workspace-shell { display: grid; gap: var(--ll-spacing-md); }
    :focus-visible { outline: var(--ll-a11y-focusWidth) solid var(--ll-color-focus); outline-offset: 2px; }
    @media (max-width: 920px) {
      .topbar__inner { grid-template-columns: 1fr auto; grid-template-areas: "brand account" "search search" "nav nav"; }
      .header-search { width: min(100%, 28rem); justify-self: center; }
      .nav { justify-content: center; }
      .topbar__account { align-self: center; }
      .article-layout, .article-layout--no-right, .workspace-grid, .learning-path-hero, .stage-card__grid { grid-template-columns: 1fr; }
      .study-nav, .toc-rail { position: static; }
      .assistant-panel { top: auto; right: 0; bottom: 0; width: min(100vw, 32rem); max-height: 88vh; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
      .tutor-dialog { right: var(--ll-layout-pageInset); bottom: calc(var(--ll-spacing-md) + 5rem); width: min(29rem, calc(100vw - (2 * var(--ll-layout-pageInset)))); height: min(38rem, calc(100vh - 7.5rem)); }
      .tutor-dialog--workspace { position: static; width: 100%; height: min(48rem, calc(100vh - 12rem)); max-height: none; border-radius: var(--ll-radius-lg); }
    }
    @media (max-width: 640px) {
      body { overflow-x: hidden; }
      .topbar__inner { gap: var(--ll-spacing-sm); }
      .landing, .learning-path-page, .article, .study-nav, .toc-rail, .assistant-panel, .workspace-card, .workspace-hero, .upgrade-note, .stage-card, .learning-path-hero__panel, .article-summary { padding: var(--ll-spacing-md); border-radius: var(--ll-radius-md); }
      .nav { gap: 0.65rem 0.9rem; }
      .account-pill { max-width: 9.5rem; }
      .account-menu { right: 0; }
      .tutor-launcher { right: var(--ll-spacing-sm); bottom: var(--ll-spacing-sm); min-width: 4rem; min-height: 4rem; }
      .tutor-dialog { right: 0; bottom: 0; width: 100vw; height: 92vh; max-height: 92vh; border-radius: var(--ll-radius-lg) var(--ll-radius-lg) 0 0; }
      .tutor-dialog--workspace { position: static; width: 100%; height: 78vh; max-height: none; border-radius: var(--ll-radius-md); }
      .tutor-bubble { max-width: 92%; }
      .tutor-dialog__form { grid-template-columns: 1fr; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition-duration: 0s !important; animation-duration: 0s !important; }
    }

.llb-page-fragment {
  width: min(calc(100% - (2 * var(--ll-layout-pageInset))), var(--ll-layout-shellWidth));
  margin: 0 auto;
  padding: var(--ll-spacing-lg) 0 var(--ll-spacing-xxl);
}

/* An article page sits in the same box as /library, /workspace and a case page: <main>'s own
   padding sets the gap to the header and the footer, so the fragment adds none of its own. */
.llb-page-fragment:has(>.article-layout) { width: 100%; padding: 0; }

.llb-page-fragment--utility {
  width: min(calc(100% - (2 * var(--ll-layout-pageInset))), 800px);
}

/* Stage 3 extracted MU-plugin presentation */

/* LLB public shell, content, navigation and Tutor styles. */
:root{--ll-ink:#16202a;--ll-muted:#63594d;--ll-line:#ded6ca;--ll-bg:#f8f4ee;--ll-card:#fffdf9;--ll-accent:#9a5728;--ll-header-font:'Roboto',sans-serif;--ll-button-font:'Inter',sans-serif;--ll-ui-font:'Roboto',sans-serif;--ll-header-pill:2.25rem;--ll-radius-header:999px}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(135deg,#f8f4ee,#fffaf2);color:var(--ll-ink);font-family:Georgia,'Times New Roman',serif}
.skip-link{position:absolute;left:-999px}
.skip-link:focus{left:1rem;top:1rem;z-index:10;background:#fff;padding:.5rem}
.topbar{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid rgba(22,32,42,.11);box-shadow:0 1px 0 rgba(22,32,42,.03)}
.topbar__inner{display:grid;grid-template-columns:minmax(10rem,auto) auto minmax(15rem,1fr) auto;grid-template-areas:'brand nav search account';gap:.65rem 18px;align-items:center;max-width:1240px;margin:0 auto;min-height:5.625rem;padding:0 1rem}
.brand{grid-area:brand}
.brand__name,.brand__meta{margin:0}
.brand__name a{color:var(--ll-ink);font:700 1rem/1.05 var(--ll-header-font);letter-spacing:-.01em;text-decoration:none;white-space:nowrap}
.brand__meta{display:none}
.brand__meta,.meta,.lede,.card__meta{color:var(--ll-muted)}
.header-search{grid-area:search;justify-self:end;max-width:350px;width:100%}
.header-search label{position:absolute;left:-999px}
.header-search__pill{display:flex;align-items:center;gap:.35rem;min-height:var(--ll-header-pill);border:1px solid rgba(22,32,42,.15);border-radius:var(--ll-radius-header);background:#fff;padding:0 0 0 .85rem;box-shadow:0 1px 2px rgba(22,32,42,.05)}
.header-search input{min-width:0;border:0;outline:0;flex:1;background:transparent;color:var(--ll-ink);font:400 14px/1.2 var(--ll-ui-font)}
.header-search input::placeholder{color:#7a7167}
.header-search button,.action-link{display:inline-flex;align-items:center;justify-content:center;min-height:var(--ll-header-pill);border:0;border-radius:var(--ll-radius-header);background:var(--ll-accent);color:#fff;font:600 14px/1 var(--ll-button-font);padding:0 .85rem;text-decoration:none;cursor:pointer;white-space:nowrap}
.nav{grid-area:nav;display:flex;align-items:center;gap:1.05rem;font:400 18px/1 var(--ll-header-font);white-space:nowrap}
.nav a{display:inline-flex;align-items:center;min-height:5.625rem;color:#16202a;padding:0 .1rem;text-decoration:none}.nav__responsive-search{display:none!important}.auth-link{display:inline;color:#16202a;padding:0;text-decoration:none}
.nav a:hover,.nav a:focus-visible,.nav a.current,.auth-link:hover,.auth-link:focus-visible{color:#7a3f18;outline:none}
.topbar__account{grid-area:account;justify-self:end}
.account-nav{display:flex;align-items:center;justify-content:flex-end;gap:.45rem;font:400 15px/1 var(--ll-header-font);white-space:nowrap}
.auth-separator{color:#b98b67;font:400 15px/1 var(--ll-header-font)}
.account-menu-control{position:relative}
.account-pill{display:inline-flex;align-items:center;gap:.45rem;max-width:14rem;min-height:var(--ll-header-pill);border:1px solid rgba(22,32,42,.15);border-radius:var(--ll-radius-header);background:#fff;color:var(--ll-ink);padding:0 .85rem;font:400 15px/1 var(--ll-header-font);box-shadow:0 1px 2px rgba(22,32,42,.05);cursor:pointer}
.account-pill span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-pill__caret{width:.7rem;height:.45rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.account-pill:hover,.account-pill:focus-visible,.account-menu-control:focus-within .account-pill{border-color:#c88c5f;background:#fffaf2;outline:none}
.account-menu{position:absolute;right:0;top:calc(100% + .4rem);z-index:100;min-width:11rem;padding:.35rem;background:#fff;border:1px solid rgba(22,32,42,.14);border-radius:var(--ll-radius-header);box-shadow:0 16px 34px rgba(31,39,48,.14)}
.account-menu[hidden]{display:none}
.account-menu a{display:flex;align-items:center;min-height:2.35rem;border-radius:var(--ll-radius-header);color:#7a3f18;padding:0 .75rem;font:400 15px/1 var(--ll-header-font);text-decoration:none}
.account-menu a:hover,.account-menu a:focus-visible{background:#f5eadf;color:#5f2f10;outline:none}
.tutor-menu-control{position:relative;margin-left:auto}
.tutor-menu-button{display:inline-flex;align-items:center;gap:.45rem;min-height:2.35rem;border:0;border-radius:10px;background:#9a5728;color:#fff;padding:0 .7rem;font:800 .86rem/1 var(--ll-ui-font);cursor:pointer}
.tutor-menu-button__bars,.tutor-menu-button__bars:before,.tutor-menu-button__bars:after{display:block;width:1rem;height:2px;border-radius:2px;background:currentColor;content:''}
.tutor-menu-button__bars{position:relative}
.tutor-menu-button__bars:before,.tutor-menu-button__bars:after{position:absolute;left:0}
.tutor-menu-button__bars:before{top:-5px}
.tutor-menu-button__bars:after{top:5px}
.tutor-menu-panel[hidden]{display:none}
.tutor-menu-panel a:hover,.tutor-menu-panel a:focus-visible{background:#f5eadf;color:#5f2f10;outline:none}
.main{max-width:1240px;margin:0 auto;padding:2rem 1rem}
.surface{background:var(--ll-card);border:1px solid var(--ll-line);border-radius:18px;box-shadow:0 18px 40px rgba(70,45,20,.08)}
.landing,.article,.learning-path-page,.search-page,.library-index,.institution-console{padding:1.25rem}
.landing-split,.article-layout,.path-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.card-list{display:grid;gap:1rem}
.card{padding:1rem;border:1px solid var(--ll-line);border-radius:14px;background:#fff}
.eyebrow{font:800 .78rem/1.1 sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#2c5875}
.article-layout{grid-template-columns:250px minmax(0,1fr) 250px;align-items:start}
.study-nav,.toc-rail{position:sticky;top:6rem;padding:1rem;font-family:var(--ll-ui-font)}
.toc{padding-left:1.2rem}
.study-nav__link{display:block;padding-left:1.4em;text-indent:-1.4em}
.study-nav__link.current{font-weight:900;margin-left:-6px;margin-right:-6px;padding-left:calc(1.4em + 6px);padding-right:calc(.45rem + 6px)}
/* No nested elevation. A surface inside a surface is a card within a card, and the
   inner drop shadow reads as a glow rather than as depth. The border and background
   already distinguish it, so only the shadow is dropped. */
.surface .surface{box-shadow:none}
.article-summary{padding:1rem;margin:1rem 0}
.article-note{border-left:4px solid var(--ll-accent);padding:.8rem 1rem;background:#fff6ea;margin:1rem 0}
.body{font-size:1.08rem;line-height:1.72}
.body h2,.body h3{scroll-margin-top:7rem}
.body a,.toc a,.study-nav a,.card a{color:#7a3f18}
.toc-bookmark{margin:.5rem 0}
.saved-state{display:inline-flex;border:1px solid var(--ll-line);border-radius:999px;padding:.4rem .65rem;font:800 .8rem/1 sans-serif}
.saved-state--unsaved{margin-left:.5rem;color:var(--ll-muted)}
.breadcrumbs{display:flex;gap:.4rem;list-style:none;padding:0;color:var(--ll-muted);font-size:.9rem}
.meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.meta-grid div{border-top:1px solid var(--ll-line);padding-top:.4rem}
.meta-grid dt{font:800 .72rem/1.1 sans-serif;text-transform:uppercase;color:var(--ll-muted)}
.meta-grid dd{margin:0}
.tutor-launcher{position:fixed;right:1.2rem;bottom:1.2rem;z-index:4;border:0;border-radius:999px;background:var(--ll-accent);color:#fff;font-weight:900;padding:.9rem 1.1rem;box-shadow:0 16px 34px rgba(70,45,20,.22);cursor:pointer}
.tutor-dialog{position:fixed;right:1.2rem;bottom:5rem;z-index:5;width:min(420px,calc(100vw - 2rem));max-height:min(680px,calc(100vh - 7rem));display:flex;flex-direction:column;overflow:hidden;border:1px solid #d1d7db;border-radius:16px;background:#efeae2;box-shadow:0 18px 40px rgba(70,45,20,.12)}
.tutor-dialog[hidden]{display:none}
.tutor-dialog__header{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:.8rem;padding:.85rem 1rem;background:#9a5728;color:#fff}
.tutor-dialog__header .eyebrow{margin:0 0 .15rem;color:rgba(255,255,255,.78)}
.tutor-dialog__heading{flex:1 1 auto;min-width:0}
.tutor-dialog__header h2{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 1.05rem/1.1 var(--ll-ui-font)}
.tutor-dialog__header-actions{display:flex;align-items:center;justify-content:flex-end;gap:.55rem;margin-left:auto}
.tutor-dialog__new{border:1px solid rgba(255,255,255,.55);border-radius:999px;background:transparent;color:#fff;font:800 .76rem/1 var(--ll-ui-font);padding:.5rem .72rem;cursor:pointer}
.tutor-dialog__new:hover{background:rgba(255,255,255,.12)}
.tutor-dialog__new:focus-visible{outline:3px solid #153f5f;outline-offset:3px}
.tutor-dialog__avatar{display:flex;align-items:center;justify-content:center;flex:0 0 2.35rem;width:2.35rem;height:2.35rem;color:#fff}
.tutor-dialog__avatar img{display:block;width:100%;height:100%;object-fit:contain}
.tutor-dialog__close{border:0;background:transparent;color:#fff;font-weight:900;text-decoration:underline;cursor:pointer}
.tutor-dialog__messages{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;gap:.65rem;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable both-edges;padding:1rem;background:#efeae2}
.tutor-dialog__messages>*:first-child{margin-top:auto}
.tutor-conversation-loading{margin:auto;color:var(--ll-muted);font:700 .88rem/1.4 var(--ll-ui-font)}
.tutor-empty-state{width:min(100%,36rem);margin:auto;padding:1.15rem;border:1px solid rgba(122,63,24,.18);border-radius:18px;background:rgba(255,255,255,.78);box-shadow:0 8px 28px rgba(70,45,20,.08)}
.tutor-empty-state h3{margin:0 0 .65rem;color:var(--ll-ink);font:900 clamp(1.35rem,3vw,1.8rem)/1.1 Georgia,'Times New Roman',serif}
.tutor-empty-state p{margin:.45rem 0;color:var(--ll-ink);font:500 .95rem/1.5 var(--ll-ui-font)}
.tutor-empty-state__privacy{color:var(--ll-muted)!important;font-size:.86rem!important}
.tutor-history-note{align-self:center;margin:.2rem auto;color:var(--ll-muted);font:700 .78rem/1.35 var(--ll-ui-font)}
.tutor-bubble{max-width:78%;border:0;border-radius:10px;padding:.7rem .85rem;background:#fff;font:400 .95rem/1.45 var(--ll-ui-font);box-shadow:0 1px 1px rgba(0,0,0,.12);white-space:normal;word-break:break-word}
.tutor-bubble--user{align-self:flex-end;background:#dcf8c6}
.tutor-bubble--tutor,.tutor-bubble--error{align-self:flex-start}
.tutor-bubble--error{border:1px solid #c44;background:#fff0f0}
.tutor-loading{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem 0}
.tutor-loading__dot{width:.42rem;height:.42rem;border-radius:50%;background:#9a5728;opacity:.35;animation:tutor-loading-pulse 1.05s ease-in-out infinite}
.tutor-loading__dot:nth-child(2){animation-delay:.15s}
.tutor-loading__dot:nth-child(3){animation-delay:.3s}
@keyframes tutor-loading-pulse{0%,80%,100%{opacity:.3;transform:scale(.85)}40%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion: reduce){.tutor-loading__dot{animation:none;opacity:.7}}
.tutor-citation-marker{font-size:.72em;margin-left:.05em}
.tutor-citation-marker a{color:#9a5728;text-decoration:none;font-weight:800}
.tutor-citation-marker a:hover,.tutor-citation-marker a:focus-visible{text-decoration:underline}
.tutor-sources{margin-top:.7rem;padding-top:.55rem;border-top:1px solid rgba(0,0,0,.08)}
.tutor-sources__title{margin:0 0 .35rem;font:800 .74rem/1.1 sans-serif;text-transform:uppercase;color:var(--ll-muted)}
.tutor-sources__list{display:grid;gap:.3rem;margin:0;padding:0;list-style:none}
.tutor-source{display:flex;align-items:baseline;flex-wrap:wrap;gap:.4rem;font-size:.85rem;line-height:1.35;scroll-margin-top:1rem}
.tutor-source__marker{color:var(--ll-muted);font-weight:800;flex:0 0 auto}
.tutor-source__link{color:var(--ll-ink);text-decoration:underline;text-decoration-color:rgba(0,0,0,.25)}
.tutor-source--case .tutor-source__link em{font-style:italic}
.tutor-source--legislation .tutor-source__link{color:#4a3b0a}
.tutor-source__actions{display:inline-flex}
.tutor-source__save{border:0;border-radius:999px;background:#efe2d0;color:#3a1f0d;font:800 .7rem/1 var(--ll-ui-font);padding:.2rem .55rem;cursor:pointer}
.tutor-source--case .tutor-source__save{background:#dfece7;color:#183d34}
.tutor-source__link--workspace{color:var(--ll-muted);text-decoration:none;font-style:italic}
a.tutor-source__link--workspace{color:var(--ll-accent-dark);text-decoration:underline;text-underline-offset:.18em}
.tutor-source__badge{font:800 .68rem/1 var(--ll-ui-font);text-transform:uppercase;letter-spacing:.02em;color:#6b4a00;background:#fff2d6;border-radius:999px;padding:.15rem .5rem}
.tutor-debug{margin-top:.75rem;border:1px solid rgba(122,63,24,.24);border-radius:14px;background:#fff8ef;color:#4b2b18;font:600 .78rem/1.35 var(--ll-ui-font)}
.tutor-debug summary{cursor:pointer;padding:.55rem .7rem;color:#7a3f18}
.tutor-debug pre{margin:0;padding:.65rem .7rem;border-top:1px solid rgba(122,63,24,.18);white-space:pre-wrap;overflow:auto;font:500 .74rem/1.35 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.tutor-failure{padding:.15rem 0}
.tutor-failure__actions{display:flex;gap:.5rem;margin-top:.6rem}
.tutor-failure__retry,.tutor-failure__edit{border:0;border-radius:999px;font-weight:800;padding:.5rem .85rem;cursor:pointer}
.tutor-failure__retry{background:var(--ll-accent);color:#fff}
.tutor-failure__edit{background:#efe2d0;color:#3a1f0d}
.tutor-failure__retry[disabled],.tutor-failure__edit[disabled]{cursor:not-allowed;opacity:.6}
.tutor-feedback{display:flex;gap:.4rem;margin-top:.5rem;justify-content:flex-end}
.tutor-feedback__prompt{font-size:.78rem;font-weight:700;color:var(--ll-muted)}
.tutor-feedback__choices{display:flex;gap:.4rem}
.tutor-feedback__receipt{font-weight:700}
.tutor-feedback__details{display:grid;gap:.5rem;width:min(100%,24rem);padding:.7rem;border:1px solid rgba(31,44,38,.18);border-radius:12px;background:rgba(255,255,255,.72)}
.tutor-feedback__details label{display:grid;gap:.25rem;font-size:.82rem;font-weight:700}
.tutor-feedback__details select,.tutor-feedback__details textarea{width:100%;border:1px solid rgba(31,44,38,.25);border-radius:8px;padding:.45rem;background:#fff;color:var(--ll-ink);font:inherit}
.tutor-feedback__actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.tutor-feedback__error:empty{display:none}.tutor-feedback__error{font-size:.82rem;color:#8a2f24}
.tutor-feedback button,.tutor-dialog__form button,.tutor-undo{border:0;border-radius:999px;background:var(--ll-accent);color:#fff;font-weight:800;padding:.55rem .85rem;cursor:pointer}
.tutor-feedback{flex-wrap:wrap;align-items:center}.tutor-feedback__prompt{flex:1 1 9rem}.tutor-feedback__choices{flex:0 0 auto}.tutor-feedback__choices button{white-space:nowrap}
.tutor-dialog__form{display:flex;flex:0 0 auto;gap:.65rem;align-items:flex-end;padding:.8rem;background:#f0f2f5;border-top:1px solid #d1d7db}
.tutor-dialog__form textarea{flex:1;min-height:2.75rem;max-height:8.75rem;width:100%;resize:vertical;border:0;border-radius:22px;padding:.75rem 1rem;font:400 .95rem/1.35 var(--ll-ui-font);background:#fff;outline:none}
.tutor-dialog__form textarea[readonly]{opacity:.82}
.tutor-dialog__form button{min-height:2.75rem;padding:0 1.1rem}
.tutor-dialog__form button[disabled]{cursor:wait;opacity:.72}
.llb-tutor-page{min-height:100vh;min-height:100dvh;overflow:hidden}
.llb-tutor-page .topbar{position:relative}
.llb-tutor-page .main--tutor{display:flex;flex-direction:column;min-height:0;height:calc(100vh - 5.625rem);height:calc(100dvh - 5.625rem);max-width:none;padding:15px;overflow:hidden}
.tutor-workspace{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;width:100%;max-width:100%;padding:0;font-family:var(--ll-ui-font)}
.tutor-workspace .tutor-dialog{position:static;display:flex;flex:1 1 auto;min-height:0;height:100%;width:min(100%,768px);max-width:768px;max-height:none;margin:0 auto;padding:0;gap:0;overflow:hidden;border:1px solid #d1d7db;border-radius:16px;background:#efeae2;box-shadow:0 18px 40px rgba(70,45,20,.08)}
.tutor-workspace .tutor-dialog__messages{flex:1 1 auto;min-height:0;max-height:none}
.tutor-workspace--anonymous{width:min(100%,768px);margin:0 auto;padding:1.25rem;border:1px solid var(--ll-line);border-radius:18px;background:var(--ll-card);box-shadow:0 18px 40px rgba(70,45,20,.08)}
@media(max-width:920px){.topbar__inner{grid-template-columns:1fr auto;grid-template-areas:'brand account' 'search search' 'nav nav';align-items:center;min-height:3.8125rem;padding:.55rem 1rem}
.brand{grid-area:brand}
.header-search{display:none}
.nav{grid-area:nav;overflow-x:auto;padding-bottom:.1rem}
.nav__responsive-search{display:inline-flex!important}
.nav a{min-height:2.25rem}
.topbar__account{grid-area:account}
.account-pill{max-width:11rem}
.article-layout{grid-template-columns:1fr}
.study-nav,.toc-rail{position:static}
.meta-grid{grid-template-columns:1fr}
.llb-tutor-page{overflow:hidden}
.llb-tutor-page .topbar{display:none}
.llb-tutor-page .main--tutor{width:100%;max-width:none;height:100vh;height:100dvh;margin:0;padding:0;overflow:hidden}
.llb-tutor-page .tutor-workspace{width:100%;max-width:none;margin:0}
.llb-tutor-page .tutor-workspace .tutor-dialog{width:100%;max-width:none;margin:0;border-width:1px 0 0;border-radius:0;box-shadow:none}
}

/* LLB WordPress utility/login pages. */
body.login { margin: 0; background: linear-gradient(135deg,#f8f4ee,#fffaf2); color: var(--ll-ink); font-family: Georgia,'Times New Roman',serif; }

body.login #login { width: min(100% - 2rem, 800px); padding-top: 2rem; }
body.login .language-switcher { display: none; }

body.login #login > h1 { display: none; }
body.login .llb-login-title { margin: 0 0 1rem; color: var(--ll-ink); font: 900 clamp(2rem, 5vw, 3.2rem)/.95 Georgia,'Times New Roman',serif; }

body.login form { border: 1px solid var(--ll-line); border-radius: 18px; box-shadow: 0 18px 40px rgba(70,45,20,.08); }

body.login .button-primary { border: 0; border-radius: 999px; background: var(--ll-accent); font-weight: 800; }

body.login #backtoblog { display: none; }
body.login #nav a { color: #7a3f18; font-weight: 800; }

/* LLB workspace tables, uploads and private collection surfaces. */
.workspace-shell{font-family:Georgia,serif;color:var(--ll-ink);min-height:0;align-content:start;gap:0}
.workspace-shell .surface{background:var(--ll-card);border:1px solid var(--ll-line);border-radius:18px;box-shadow:0 18px 40px rgba(70,45,20,.08)}
.workspace-hero,.workspace-card{padding:1.2rem}
.workspace-card{min-width:0}
.workspace-shell .eyebrow{font:800 .78rem/1.1 sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#2c5875}
.workspace-shell .lede,.workspace-card p,.workspace-inline-meta{color:var(--ll-muted)}
.workspace-shell>h1{margin-bottom:.7rem}
.workspace-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-top:0;align-items:stretch}
.workspace-tabs{min-width:0}
.workspace-tabs__panel{display:grid;gap:1rem}
.workspace-tabs__panel[hidden]{display:none}
.workspace-tabs__list{display:flex;gap:.35rem;margin-bottom:1rem;border-bottom:1px solid var(--ll-line)}
.workspace-tabs__tab{display:inline-flex;align-items:center;gap:.42rem;padding:.55rem .75rem;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--ll-muted);font:800 .9rem/1.2 var(--ll-ui-font);cursor:pointer}
.workspace-tabs__tab[aria-selected="true"]{border-bottom-color:var(--ll-accent);color:var(--ll-ink)}
.workspace-tabs__tab span{display:inline-flex;align-items:center;justify-content:center;min-width:1.35rem;height:1.35rem;padding:0 .35rem;border-radius:999px;background:var(--ll-note);font-size:.72rem}
.workspace-tabs__tab:focus-visible{outline:2px solid var(--ll-accent);outline-offset:2px}
.institution-console__tabs-list{display:flex;gap:.35rem;margin:1.25rem 0 1rem;border-bottom:1px solid var(--ll-line);flex-wrap:wrap}
.institution-console__tabs-list button{border:0;border-bottom:3px solid transparent;background:transparent;color:var(--ll-muted);font:800 .9rem/1.2 var(--ll-ui-font);padding:.55rem .75rem;cursor:pointer}
.institution-console__tabs-list button[aria-selected="true"]{border-bottom-color:var(--ll-accent);color:var(--ll-ink)}
.institution-console__tabs-list button:focus-visible{outline:2px solid var(--ll-accent);outline-offset:2px}
.institution-console__panel[hidden]{display:none}
.institution-console__table{width:100%;border-collapse:collapse;margin:.5rem 0 1rem}
.institution-console__table th,.institution-console__table td{border-top:1px solid var(--ll-line);padding:.5rem .6rem;text-align:left}
.institution-console__notice{border-left:4px solid var(--ll-accent);background:var(--ll-note);padding:.7rem 1rem;margin:.75rem 0}
.institution-console__cohort{padding:.6rem 0;border-top:1px solid var(--ll-line)}
.workspace-collection{display:grid;gap:.75rem;margin-top:.85rem}
@media(min-width:600px){.workspace-collection{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:600px){.workspace-upload-card{width:100%;max-width:calc((100% - .75rem)/2)}.workspace-upload-card .upload-widget{width:100%}}
.workspace-shell .workspace-upload-card{background:var(--ll-note)}
.workspace-shell #tutor-context{display:none}
.workspace-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;padding:1rem;border:1px solid var(--ll-line);border-radius:14px;background:#fff}
.workspace-item h3{margin:0;font:700 1rem/1.3 var(--ll-ui-font)}
.workspace-item h3 a{color:var(--ll-accent);text-decoration:underline}
.workspace-item__new{display:inline-flex;vertical-align:middle;align-items:center;margin-left:.45rem;padding:.14rem .42rem;border-radius:999px;background:#eaf5ef;color:#166534;font:800 .67rem/1 var(--ll-ui-font);text-transform:uppercase;letter-spacing:.04em}
.article-recently-added{display:inline-flex!important;vertical-align:middle;align-items:center;padding:.14rem .42rem;border:1px solid #cbd8eb;border-radius:999px;background:#eef3fb;color:#153f5f;font:800 .67rem/1 var(--ll-ui-font);text-decoration:none;white-space:nowrap;text-transform:uppercase;letter-spacing:.04em}
.workspace-item__origin{margin:.28rem 0 0!important;font-size:.88rem;line-height:1.4}
.workspace-item__details{width:100%;margin-top:.8rem;border-collapse:collapse;font:600 .84rem/1.35 var(--ll-ui-font)}
.workspace-item__details th,.workspace-item__details td{padding:.38rem 0;border:0;background:transparent;text-align:left;vertical-align:top}
.workspace-item__details th{width:80px;color:var(--ll-muted);font-weight:800}
.workspace-item__meta{display:flex;flex-wrap:wrap;gap:.65rem 1.25rem;margin:.8rem 0 0}
.workspace-item__meta>div{min-width:7rem}
.workspace-item__meta dt{font:800 .68rem/1.1 var(--ll-ui-font);letter-spacing:.05em;text-transform:uppercase;color:var(--ll-muted)}
.workspace-item__meta dd{margin:.18rem 0 0;font:600 .84rem/1.35 var(--ll-ui-font);overflow-wrap:anywhere}
.workspace-item__actions{display:flex;align-items:flex-start;flex-wrap:wrap;gap:.35rem}
.workspace-item__action{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border:1px solid var(--ll-line);border-radius:50%;background:#fff;color:#92501f;text-decoration:none;cursor:pointer}
.workspace-item__action:hover,.workspace-item__action:focus-visible{border-color:currentColor;background:#fff8f2}
.workspace-item__action svg{width:1rem;height:1rem}
.workspace-item__action--delete{color:#b42318}
.workspace-item__delete{margin:0}
.workspace-empty{margin:.85rem 0 0!important;padding:1rem;border:1px dashed var(--ll-line);border-radius:14px;background:#fff}
.workspace-delete-modal{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:1rem}
.workspace-delete-modal[hidden]{display:none}
.workspace-delete-modal__backdrop{position:absolute;inset:0;background:rgba(15,23,42,.55)}
.workspace-delete-modal__dialog{position:relative;z-index:1;width:min(100%,24rem);padding:1.35rem;border-radius:16px;background:#fff;box-shadow:0 24px 56px rgba(15,23,42,.3)}
.workspace-delete-modal__dialog h2{margin:0;font:800 1.2rem/1.25 var(--ll-header-font)}
.workspace-delete-modal__dialog p{margin:.55rem 0 0;color:var(--ll-muted)}
.workspace-delete-modal__actions{display:flex;justify-content:flex-end;gap:.65rem;margin-top:1.2rem}
.workspace-delete-modal__confirm{border:0;border-radius:999px;background:#b42318;color:#fff;padding:.62rem 1rem;font:800 .85rem/1.2 var(--ll-ui-font);cursor:pointer}
.workspace-delete-modal__confirm:hover,.workspace-delete-modal__confirm:focus-visible{background:#8f1d14}
.workspace-progress-modal{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:1rem}
.workspace-progress-modal[hidden]{display:none}
.workspace-progress-modal__backdrop{position:absolute;inset:0;background:rgba(15,23,42,.55)}
.workspace-progress-modal__dialog{position:relative;z-index:1;width:min(100%,24rem);padding:1.35rem;border-radius:16px;background:#fff;box-shadow:0 24px 56px rgba(15,23,42,.3)}
.workspace-progress-modal__dialog h2{margin:0;font:800 1.2rem/1.25 var(--ll-header-font)}
.workspace-progress-modal__dialog p{margin:.75rem 0 0;color:var(--ll-muted)}
.workspace-progress-modal__bar{position:relative;height:.5rem;margin-top:1rem;border-radius:999px;background:var(--ll-line);overflow:hidden}
.workspace-progress-modal__bar span{position:absolute;top:0;bottom:0;left:0;width:40%;border-radius:999px;background:var(--ll-accent);animation:workspace-progress-slide 1.3s ease-in-out infinite}
.workspace-progress-modal__actions{display:flex;justify-content:flex-end;margin-top:1.2rem}
@keyframes workspace-progress-slide{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
@media (prefers-reduced-motion: reduce){.workspace-progress-modal__bar span{animation:none;width:100%;opacity:.55}}
.workspace-progress-modal,.workspace-delete-modal{overscroll-behavior:contain;touch-action:none}
body.workspace-scroll-locked{position:fixed;left:0;right:0;width:100%;overflow:hidden}
.workspace-view{max-width:60rem;margin:0 auto;padding:1.2rem}
.workspace-view__bar{position:sticky;top:var(--llb-topbar-h,var(--ll-header-h));z-index:5;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin:0 0 1rem;padding:0 0 .75rem;background:var(--ll-card);border-bottom:1px solid var(--ll-line)}
.workspace-view__back,.workspace-view__download{display:inline-flex;align-items:center;min-height:2.75rem;padding:.4rem 1rem;border:1px solid var(--ll-line);border-radius:999px;font:800 .9rem/1.2 var(--ll-ui-font);text-decoration:none;color:inherit}
.workspace-view__back{background:var(--ll-accent);border-color:var(--ll-accent);color:#fff}
.workspace-view__title{margin:0 0 1rem;font:800 1.3rem/1.3 var(--ll-header-font);overflow-wrap:anywhere}
.workspace-view__text{margin:0;padding:1rem;min-height:12rem;max-height:calc(100vh - var(--llb-topbar-h,5rem) - 30rem);max-height:calc(100dvh - var(--llb-topbar-h,5rem) - 30rem);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid var(--ll-line);border-radius:8px;background:#fff;font:.95rem/1.55 ui-monospace,SFMono-Regular,Menlo,monospace}
.workspace-view__note{margin:.75rem 0 0;color:var(--ll-muted)}
.workspace-view__text{scrollbar-width:thin;scrollbar-color:#9a5728 #efe7da}
.workspace-view__text::-webkit-scrollbar{width:10px;height:10px;-webkit-appearance:none}
.workspace-view__text::-webkit-scrollbar-track{background:#efe7da;border-radius:8px}
.workspace-view__text::-webkit-scrollbar-thumb{background:#9a5728;border-radius:8px;border:2px solid #efe7da}
.llb-page-fragment:has(>[data-workspace-view]){padding-bottom:0}
.workspace-view__note+.workspace-view__text{margin-top:.75rem}
@media(max-width:599px){.workspace-view{padding:1rem}}
@media(min-width:921px){.workspace-view__text{max-height:calc(100vh - var(--llb-topbar-h,5rem) - 28rem);max-height:calc(100dvh - var(--llb-topbar-h,5rem) - 28rem)}}
.llb-session-timeout{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:1rem}
.llb-session-timeout[hidden]{display:none}
.llb-session-timeout__backdrop{position:absolute;inset:0;background:rgba(15,23,42,.62)}
.llb-session-timeout__dialog{position:relative;z-index:1;width:min(100%,27rem);padding:1.5rem;border-radius:16px;background:#fff;box-shadow:0 24px 56px rgba(15,23,42,.35);font-family:var(--ll-ui-font)}
.llb-session-timeout__dialog h2{margin:0;font:800 1.25rem/1.25 var(--ll-header-font)}
.llb-session-timeout__dialog p{margin:.7rem 0 0;color:var(--ll-muted)}
.llb-session-timeout__dialog button{margin-top:1.25rem;border:0;border-radius:999px;background:var(--ll-accent);color:#fff;padding:.7rem 1rem;font:800 .9rem/1.2 var(--ll-ui-font);cursor:pointer}
.llb-session-timeout__dialog button:focus-visible{outline:3px solid #153f5f;outline-offset:3px}
.workspace-inline-meta{display:block;margin-top:.2rem;font-size:.82rem}
.workspace-shell .action-link{border:0;background:transparent;color:#92501f;font:800 .85rem/1.2 sans-serif;text-decoration:underline;cursor:pointer}
.workspace-shell .action-link--primary{background:#9a5728;color:#fff;text-decoration:none;border-radius:999px;padding:.75rem 1.2rem}
.inline-form{display:inline}
.upload-widget{display:grid;gap:.7rem}
.upload-widget__dropzone{border:1px dashed var(--ll-line);border-radius:14px;padding:1rem;background:#fff}
.upload-widget__dropzone input{display:block;margin-top:.5rem}
@media(max-width:920px){.workspace-grid{grid-template-columns:1fr}
.workspace-shell{padding:1rem}
}
@media(min-width:921px){
  /* Real spacing under the library's search component, where this was a -60px/-32px nudge
     of the tab list and jump row to cancel the space the old card reserved. */
  .library-index__freeze .library-index__search{margin-bottom:30px}
  .library-index__freeze-main>.library-tabs .library-index__jump{margin-top:28px}
}
@media(max-width:480px){.workspace-tabs__list{gap:0;justify-content:space-between}.workspace-tabs__tab{padding:.5rem .3rem;font-size:.82rem}.workspace-item{gap:.7rem;padding:.85rem}.workspace-item__meta{gap:.55rem .85rem}.workspace-item__meta>div{min-width:calc(50% - .5rem)}.workspace-item__actions{gap:.25rem}.workspace-item__action{width:1.85rem;height:1.85rem}}

@media(max-width:599px){.llb-tutor-page .main--tutor{height:100vh;height:100dvh;padding:0}.tutor-dialog__header{gap:.55rem;padding:.7rem}.tutor-dialog__avatar{flex-basis:2rem;width:2rem;height:2rem}.tutor-dialog__header h2{font-size:clamp(.55rem,2.6vw,1.05rem);letter-spacing:-.03em}.tutor-dialog__header-actions{gap:.35rem}.tutor-dialog__new{max-width:none;padding:.45rem .6rem;white-space:nowrap;font-size:0}.tutor-dialog__new:after{content:'New session';font:800 .76rem/1 var(--ll-ui-font)}.tutor-dialog__messages{padding:.85rem}.tutor-empty-state{padding:1rem}.tutor-bubble{max-width:86%}.tutor-dialog__form button{min-width:4.5rem}}
@media(max-width:360px){.tutor-dialog__header{gap:.4rem;padding-left:.5rem;padding-right:.5rem}.tutor-menu-button__label{display:none}.tutor-menu-button{padding-left:.65rem;padding-right:.65rem}}
.right-rail{position:sticky;top:calc(var(--ll-header-h) + .5rem);display:flex;flex-direction:column;gap:1rem}
.right-rail .toc-rail{position:static;top:auto}
.related-articles-rail,.citations-card-rail{padding:1rem;font-family:var(--ll-ui-font)}
.related-articles-rail .llb-case-card{margin:0 0 .85rem}
.related-articles-rail .llb-case-card:last-child{margin-bottom:0}
.related-articles-rail .llb-case-card__name{margin:0 0 .15rem}
.related-articles-rail .llb-case-card__citation,.related-articles-rail .llb-case-card__relationship{margin:0}
.related-articles,.citations-card{list-style:none;margin:0;padding:0;display:grid}
.citations-card{gap:.6rem}
/* Tighter than .citations-card's own gap -- reduces the space between
   articles within the same relation group (e.g. two "Applies" items),
   not the space between group headings (.related-articles__groups' own
   gap, untouched). Operator request, 2026-08-20. */
.related-articles{gap:.1rem}
.related-articles__item a{text-decoration:none;font-weight:700}
.related-articles__item a:hover,.related-articles__item a:focus-visible{text-decoration:underline}
.related-articles__relation,.citations-card__kind{display:block;color:var(--ll-muted);font:800 .72rem/1.1 var(--ll-ui-font);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.15rem}
.article-layout--no-left{grid-template-columns:minmax(0,1fr) 250px}
@media(max-width:920px){.article-layout--no-left{grid-template-columns:1fr}}
.search-page__toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-top:.5rem}
.search-facets{display:flex;flex-wrap:wrap;gap:1.25rem;margin:1rem 0;padding:1rem;background:var(--ll-note);border-radius:var(--ll-radius-md)}
.search-filters__check{position:absolute;opacity:0;pointer-events:none}
.search-filters__label{display:none}
@media(max-width:920px){.surface.search-page .library-search-card{margin-bottom:18px}.search-page .search-page__toolbar{margin-top:2px}.search-filters__label{display:inline-flex;align-items:center;gap:.45rem;margin-top:0;border:1px solid var(--ll-line);border-radius:var(--ll-radius-pill);background:#fff;padding:.25rem .7rem;color:var(--ll-ink);font:700 .82rem/1.2 var(--ll-ui-font);cursor:pointer}.search-filters__label::after{content:'+';font-weight:800}.search-filters__check:checked+.search-filters__label::after{content:'\2212'}.search-filters__check:focus-visible+.search-filters__label{outline:2px solid var(--ll-accent);outline-offset:2px}.search-filters__count{display:inline-block;min-width:1.2rem;border-radius:var(--ll-radius-pill);background:var(--ll-ink);color:#fff;padding:0 .35rem;text-align:center;font-size:.74rem}.search-filters__check:not(:checked)~.search-facets{display:none}.search-filters__label+.search-facets{margin-top:.6rem}}
.search-facet__label{font:800 .72rem/1.1 var(--ll-ui-font);text-transform:uppercase;letter-spacing:.06em;color:var(--ll-muted);margin:0 0 .4rem}
.search-facet__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.search-facet__option{display:inline-flex;align-items:center;gap:.3rem;border:1px solid var(--ll-line);border-radius:var(--ll-radius-pill);background:#fff;color:var(--ll-ink);padding:.2rem .6rem;text-decoration:none;font:600 .82rem/1.3 var(--ll-ui-font)}
.search-facet__option:hover,.search-facet__option:focus-visible{border-color:var(--ll-accent)}
.search-facet__option--active{background:var(--ll-accent);border-color:var(--ll-accent);color:#fff}
.search-facet__count{color:inherit;opacity:.7;font-weight:400}
.search-sort{display:inline-flex;align-items:center;border:1px solid var(--ll-line);border-radius:var(--ll-radius-pill);overflow:hidden;background:#fff}
.search-page__controls{display:flex;align-items:center;flex-wrap:wrap;gap:18px}
.search-page__controls .learning-path-views__toggle{margin-bottom:0}
.search-page__table{margin-top:.5rem}
.search-page__table .learning-path-table{min-width:36rem}
.search-page__controls .learning-path-views__btn{min-height:0;padding:.25rem .7rem;font:700 .82rem/1.2 var(--ll-ui-font)}
.search-page__controls .learning-path-views__btn.is-active{background:var(--ll-ink);color:#fff}
@media(max-width:920px){.search-page__controls .learning-path-views__toggle{display:none}.search-page [data-learning-path-panel=table]{display:none}.search-page [data-learning-path-panel=grid][hidden]{display:grid}}
.search-page__table td:nth-child(2) .search-result__meta{flex-wrap:nowrap;white-space:nowrap}
.search-page__table .search-result__meta{margin-top:0;padding-top:0}
.search-sort__option{padding:.25rem .7rem;text-decoration:none;color:var(--ll-ink);font:700 .82rem/1.2 var(--ll-ui-font)}
.search-sort__option+.search-sort__option{border-left:1px solid var(--ll-line)}
.search-sort__option--active{background:var(--ll-ink);color:#fff}
.search-result{position:relative;display:flex;flex-direction:column}
.search-result:hover,.search-result:focus-within{border-color:var(--ll-accent);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.search-result__link::after{content:'';position:absolute;inset:0}
.search-result__snippet{color:var(--ll-muted)}
.search-result__meta{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:auto;padding-top:.6rem}
.search-result__badge{display:inline-flex;border-radius:var(--ll-radius-pill);background:hsl(var(--badge-hue, 38) 70% 91%);color:hsl(var(--badge-hue, 38) 60% 24%);padding:.15rem .55rem;font:800 .74rem/1.3 var(--ll-ui-font)}
.search-pagination{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.5rem}
.search-external-sources{margin-top:1.75rem;padding-top:1.25rem;border-top:1px solid var(--ll-line)}
mark.search-hit{background:#ffe9a8;color:inherit;border-radius:2px;padding:0 .08em}
.search-hit-bar{position:sticky;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:0 0 .75rem;padding:.5rem 1.1rem;background:#fff6d6;border:1px solid #ecd58a;border-radius:8px;font-family:var(--ll-ui-font);font-size:.875rem}
.search-hit-bar__clear{appearance:none;border:0;background:none;padding:0 .1rem;margin:0;color:inherit;font:inherit;font-size:1.15rem;line-height:1;cursor:pointer}
.search-hit-bar__clear:hover,.search-hit-bar__clear:focus-visible{color:var(--ll-accent-dark,#7a4420)}
.search-result--external{border-left:3px solid var(--ll-blue)}
.pathway-navigator{margin-bottom:1rem}
.pathway-navigator__summary{margin:0 0 .5rem}
.pathway-navigator__links{display:flex;justify-content:space-between;gap:.75rem;flex-wrap:wrap}
.pathway-navigator__prev,.pathway-navigator__next{text-decoration:none;font:700 .92rem/1.3 var(--ll-ui-font);color:var(--ll-accent-dark)}
.pathway-navigator__next{margin-left:auto;text-align:right}
.library-tabs{min-width:0}
.library-tabs__list{display:flex;gap:.35rem;margin:1rem 0;border-bottom:1px solid var(--ll-line)}
.library-tabs__tab{display:inline-flex;align-items:center;gap:.42rem;padding:.55rem .75rem;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--ll-muted);font:800 .9rem/1.2 var(--ll-ui-font);cursor:pointer}
.library-tabs__tab[aria-selected="true"]{border-bottom-color:var(--ll-accent);color:var(--ll-ink)}
.library-index__freeze{position:sticky;top:var(--ll-header-h);z-index:12;min-width:0;padding:12px 0;background:var(--ll-card)}
.library-index__freeze-main{width:100%;min-width:0}
.library-index__freeze:not(.has-saved-rail) .library-index__freeze-main{width:100%}
/* Saved rail as a grid column (operator, 2026-09-01). It was position:absolute inside
   the sticky freeze, which took it out of flow: nothing sized the page card to it, so a
   rail taller than the index hung past the card's bottom edge. As a column it sizes the
   row it sits in, and the index column no longer has to reserve width by subtraction. */
.library-index__layout{display:block;min-width:0}
.library-index__layout.has-saved-rail{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:1rem;align-items:start}
.library-index__layout-main{min-width:0}
.library-index__freeze.has-saved-rail .library-index__freeze-main{width:100%}
/* Sticks in its own column rather than riding inside the freeze, and scrolls internally
   rather than growing without limit -- a long bookmark list must not set the page height. */
.library-index__freeze-rail{position:sticky;top:calc(var(--ll-header-h) + 12px);width:250px;max-height:calc(100vh - var(--ll-header-h) - 3rem);overflow-y:auto}
.library-index__freeze .library-tabs__list{margin-bottom:0}
.library-index__scroll-region{display:block;padding-top:12px}
.library-index__scroll-region:not(.has-saved-rail),.library-index__scroll-region:not(.has-saved-rail) .library-index__content{width:100%}
.library-index__scroll-region.has-saved-rail{display:block}
.library-index__content{min-width:0}
.library-saved-rail{width:250px;padding:1rem;font-family:var(--ll-ui-font)}
/* No glow on the Saved rail. It carries .surface while sitting inside the .surface
   page panel, so the same 0 18px 40px halo renders twice, one inside the other
   (operator, 2026-08-31). Same treatment, same reason, as the cards inside the
   pathway editor. The border and background still separate it from the page. */
.library-index .library-saved-rail{box-shadow:none}
.library-saved-rail .eyebrow{margin:.1rem 0 .65rem}
.library-saved-tabs__list{display:flex;gap:.2rem;margin:0;border-bottom:1px solid var(--ll-line)}
.library-saved-tabs__tab{display:inline-flex;align-items:center;gap:.3rem;padding:.45rem .35rem;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--ll-muted);font:800 .76rem/1.2 var(--ll-ui-font);cursor:pointer}
.library-saved-tabs__tab[aria-selected="true"]{border-bottom-color:var(--ll-accent);color:var(--ll-ink)}
.library-saved-tabs__tab span{display:inline-flex;align-items:center;justify-content:center;min-width:1.2rem;height:1.2rem;padding:0 .25rem;border-radius:999px;background:var(--ll-note);font-size:.68rem}
.library-saved-rail__items{display:grid;gap:.4rem;list-style:none;margin:.8rem 0;padding:0}
.library-saved-rail__items li{display:block}
.library-saved-rail__items a{color:var(--ll-ink);font:600 .82rem/1.35 var(--ll-ui-font);text-decoration:none}
.library-saved-rail__items a:hover,.library-saved-rail__items a:focus-visible{text-decoration:underline}
.library-saved-rail__new{display:inline-flex;vertical-align:middle;align-items:center;padding:.12rem .24rem;border-radius:999px;background:#eaf5ef;color:#166534;font:800 .58rem/1 var(--ll-ui-font);letter-spacing:.04em;text-transform:uppercase}
.library-saved-rail__empty{margin:.8rem 0;color:var(--ll-muted);font:600 .82rem/1.4 var(--ll-ui-font)}
.library-saved-rail__workspace-link{display:inline-block;margin-top:.25rem;font:800 .8rem/1.3 var(--ll-ui-font)}
@media(max-width:920px){.library-index__layout.has-saved-rail{display:block}.library-index__freeze{top:var(--ll-header-h)}.library-index__freeze-main{width:auto}.library-index__freeze-rail{position:static;width:auto;max-height:none;overflow:visible;margin-top:1rem}.library-index__scroll-region{grid-template-columns:1fr}.library-saved-rail{display:none}.library-saved-tabs__tab{padding:.5rem .55rem}}
.library-index__jump{margin:12px 0 0}
.library-index__jump ul{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:0}
.library-index__jump a{display:inline-flex;align-items:center;gap:.3rem;border:1px solid var(--ll-line);border-radius:var(--ll-radius-pill);padding:.3rem .7rem;text-decoration:none;color:var(--ll-ink);font-size:.85rem}
.library-index__count{color:var(--ll-muted)}
.library-index__group{margin-top:1.25rem;scroll-margin-top:calc(var(--ll-header-h) + 1.25rem)}
.library-index__content .library-index__group:first-child{margin-top:0}
.library-index__content .library-index__group:first-child h3{margin-top:0}
.library-index__articles{display:grid;gap:.2rem;list-style:none;margin:0;padding:0}
.library-index__articles li{display:flex;align-items:center;gap:.38rem}
.library-index__articles li>a{min-width:0}
.library-index__title{min-width:0}
.library-index__title .article-recently-added{margin-left:.1rem}
.library-index__recent-empty{margin:1rem 0;color:var(--ll-muted)}
.library-bookmark-toggle{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:1.3rem;height:1.55rem;padding:0;border:0;background:transparent;color:var(--ll-muted)}
button.library-bookmark-toggle{cursor:pointer}
button.library-bookmark-toggle:hover,button.library-bookmark-toggle:focus-visible,button.library-bookmark-toggle[aria-pressed='true']{color:var(--ll-accent)}
.library-bookmark-toggle__icon{width:1rem;height:1rem}
.library-bookmark-toggle__icon--filled{display:none}
.library-bookmark-toggle[aria-pressed='true'] .library-bookmark-toggle__icon--outline{display:none}
.library-bookmark-toggle[aria-pressed='true'] .library-bookmark-toggle__icon--filled{display:block}
.library-index__search{margin:0}
/* STANDARD SEARCH COMPONENT -- the library search card, rendered on /library and /search.
   One definition: nothing here is keyed to the page that holds it, so a container sets only
   its own spacing (see `.search-page .library-search-card`). The previous version was the large
   card, with /library overriding every metric through `.library-index__search` and nudging the
   rows into place with `position:relative;top:-20px` -- so /search drew a different control. */
.library-search-card{padding:0 1.25rem;border:0;border-radius:14px;background:#fffdf9}
.library-search-card__form>label:first-child{display:flex;align-items:center;min-height:3.25rem;border:1px solid var(--ll-line);border-radius:14px;background:#fff;padding:.2rem .25rem .2rem .85rem}
.library-search-card__icon{display:inline-flex;flex:0 0 auto;color:#81796e}
.library-search-card svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:round}
.library-search-card input[type=search]{width:100%;min-width:0;height:2.6rem;border:0!important;outline:0;background:transparent;padding:0 .65rem;color:var(--ll-ink);font:500 .95rem/1.2 var(--ll-ui-font)}
.library-search-card input::placeholder{color:#81796e;opacity:1}
.library-search-card button{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;padding:0;border:0;border-radius:10px;background:linear-gradient(135deg,#8e471b,#a9622d);color:#fff;cursor:pointer}
.library-search-card button:hover,.library-search-card button:focus-visible{background:var(--ll-accent-dark)}
.library-search-card__form>label:last-child{display:flex;align-items:center;gap:.45rem;margin-top:.82rem;padding:0 0 0 .85rem;color:var(--ll-muted);font:600 .82rem/1.2 var(--ll-ui-font);cursor:pointer}
.library-search-card__form>label:last-child input{width:1rem;height:1rem;margin:0;accent-color:var(--ll-accent)}
.search-page .library-search-card{margin:24px 0 1.25rem}
/* Two columns from 600px up, not 921px. The old desktop-only gate existed because
   below the breakpoint the content was squeezed into a column that still reserved
   250px for a hidden saved rail, leaving no room for a second column of titles.
   That reservation is fixed further down, so a tablet now has the width for two.
   Under 600px the base single-column rule applies. */
@media(min-width:600px){.library-index__articles{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:1rem;row-gap:.25rem}.library-index__articles li{display:grid;grid-template-columns:1.3rem minmax(0,1fr);column-gap:.38rem;align-items:start}.library-index__articles li>a{min-width:0}}
}
.search-pagination__link{border:1px solid var(--ll-line);border-radius:var(--ll-radius-pill);padding:.4rem 1rem;text-decoration:none;color:var(--ll-ink);font-weight:700}
.search-pagination__link:hover,.search-pagination__link:focus-visible{border-color:var(--ll-accent)}
.search-pagination__status{color:var(--ll-muted);font-size:.9rem}
.search-facet__option--empty{opacity:.55}
.search-facet__option--empty.search-facet__option--active{background:var(--ll-muted);border-color:var(--ll-muted)}

.toc a,.related-articles__item a,.citations-card__item a{display:block;padding:.28rem 0;margin:0;font:600 .82rem/1.4 var(--ll-ui-font);color:var(--ll-ink);text-decoration:none}
.citations-card__item a:hover,.citations-card__item a:focus-visible{text-decoration:underline}
.toc__item--level-3 a{padding-left:0;color:var(--ll-ink)}

.article{position:relative}
.bookmark-toggle{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.35rem;height:2.35rem;padding:0;border:1px solid var(--ll-line);border-radius:50%;background:#fff;color:var(--ll-muted);cursor:pointer}
.bookmark-toggle:hover,.bookmark-toggle:focus-visible{border-color:var(--ll-accent);color:var(--ll-accent)}
.bookmark-toggle[aria-pressed='true']{border-color:var(--ll-accent);color:var(--ll-accent)}
.bookmark-toggle__icon{width:1.15rem;height:1.15rem}
.bookmark-toggle__icon--filled{display:none}
.bookmark-toggle[aria-pressed='true'] .bookmark-toggle__icon--outline{display:none}
.bookmark-toggle[aria-pressed='true'] .bookmark-toggle__icon--filled{display:block}
.related-articles__groups{display:grid;gap:.9rem}
.toc{padding-left:0;margin:0}

.citations-card__item{display:flex;align-items:flex-start;gap:.4rem}
/* A citation whose authority a Case Learning record flags. Amber, matching the Case Card's own
   treatment warning, so one colour means "read this before you rely on it" on both surfaces.

   THESE RULES LIVED IN case-card.css AND NEVER APPLIED. That file is enqueued only for the
   case-learning, home-v2 and progress templates; an article page does not load it. So the
   treatment rendered as an unstyled flex ITEM beside the citation link, and because the link
   carries `flex:1;min-width:0` it collapsed to zero width and the citation name drew straight
   through the warning text. Measured on dev at 390px and 1440px: link width 0 at both.
   Shipped that way, and a curl for the rule text "confirmed" a fix that the page could not see.
   Rules for a component belong in the sheet the component's page actually loads. */
.citations-card__item{flex-wrap:wrap}
.citations-card__treatment{flex:0 0 100%}
/* One treatment box for every rail: citations, a case page's related cases and an article's cases. */
.citations-card__treatment,.llb-case-rail .llb-case-card__treatment.is-warning,.related-articles-rail .llb-case-card__treatment.is-warning{margin:.35rem 0 9px;padding:.4rem .65rem;border:0;border-left:3px solid #c8781a;border-radius:6px;background:#fff4e5;font:400 .8125rem/1.45 var(--ll-ui-font)}
/* Block: inline, the label ran into the note as one sentence. */
.citations-card__treatment-effect{display:block}
.citations-card__treatment-effect,.llb-case-rail .llb-case-card__treatment-effect,.related-articles-rail .llb-case-card__treatment-effect{display:block;font-weight:700;font-size:.8125rem;letter-spacing:0;text-transform:none;color:#8a4b08}
/* align-items:flex-start on the row leaves the number marker and save
   icon sitting at the very top of the item, reading as too high next to
   a title that wraps to two lines -- nudged down ~6px to sit closer to
   the title's own first line. Operator request, 2026-08-20. */
.citations-card__number{flex-shrink:0;color:var(--ll-muted);font:700 .82rem/1.4 var(--ll-ui-font);margin-top:6px}
.citations-card__item a{flex:1;min-width:0}
.citations-card__groups{display:grid;gap:.9rem}
.citation-save{display:inline-flex;align-items:center;justify-content:center;width:1.1em;height:1.1em;padding:0;border:0;background:none;color:var(--ll-muted);cursor:pointer;flex-shrink:0;margin-top:6px}
.citation-save:hover,.citation-save:focus-visible{color:var(--ll-accent)}
.citation-save[aria-pressed='true']{color:var(--ll-accent)}
.citation-save__icon{width:100%;height:100%}
.citation-save__icon--filled{display:none}
.citation-save[aria-pressed='true'] .citation-save__icon--outline{display:none}
.citation-save[aria-pressed='true'] .citation-save__icon--filled{display:block}
.citation-marker{margin-left:.1em}
.citation-marker a{color:var(--ll-blue);text-decoration:none;font-weight:700}
.citation-marker a:hover,.citation-marker a:focus-visible{text-decoration:underline}
.card{position:relative}
.card:hover,.card:focus-within{border-color:var(--ll-accent);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.card__link::after{content:'';position:absolute;inset:0}

/* Account and its subpages, plus /workspace/mfa (part of the same
   settings flow, already sharing this route group's own mobile H1 clamp
   below): cap the card at 460px at every window size (brief's own
   ".surface-landing" -- the space-separated class='surface landing'
   combo every account-family page already uses, not a distinct
   hyphenated class; narrowed from an initial 500px, then widened from
   tablet/desktop-only to unconditional, 2026-08-20).

   '/account' left this group on 2026-08-31: it now carries billing full-width plus the
   two-column password/sign-in-security layout, and 460px squeezed both. It takes the same
   width as /register, which is the page it was asked to match. '/account/passkeys' and
   '/workspace/mfa' are still single short forms and stay capped. */
[data-current-path="/account/passkeys"] .surface.landing,[data-current-path="/workspace/mfa"] .surface.landing{max-width:460px;margin-left:auto;margin-right:auto}

/* UI-005: /workspace/mfa, /account and /account/passkeys' H1 is 20%
   smaller than every other page's -- previously only below 599px (via a
   clamp with the same jump-on-resize problem as the base H1's own,
   above); now a fixed value applied at every width, matching the base
   H1 no longer changing size on resize either (operator request,
   2026-08-20). 20% of the base 1.85rem = 1.48rem. Scoped via the
   page-identifying data-current-path attribute every plugin-rendered
   fragment already carries, rather than adding a new page-specific
   class.

   '/account' left this rule on 2026-08-31: it is now the same two-column
   card as /register, at the same 800px utility width, and its H1 must
   match that page's rather than the narrow settings sub-pages' (operator
   request). Both /account variants render from the one shared builder, so
   there is a single H1 across all of them. '/workspace/mfa' and
   '/account/passkeys' keep the smaller size -- they also keep the 460px
   cap, and the pair of decisions belongs together. */
[data-current-path="/workspace/mfa"] h1,[data-current-path="/account/passkeys"] h1{font-size:1.48rem}

/* Homepage */
/* The generic .lede rule caps body copy at 70ch for readability elsewhere
   (article ledes, etc.) -- inside the hero card specifically, the brief
   wants the text spanning the full card width instead. */
.home-hero .lede{max-width:none}
.home-hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:1.25rem}
.home-hero__aside{margin:.85rem 0 0;color:var(--ll-muted);font:400 .92rem/1.3 var(--ll-ui-font)}
.home-hero__aside a{font-weight:700}
.action-link--secondary{background:transparent;border:1px solid var(--ll-accent);color:var(--ll-accent-dark)}
.action-link--secondary:hover,.action-link--secondary:focus-visible{background:var(--ll-note)}
.home-section__heading{margin:0 0 .35rem;text-align:center;font:800 clamp(1.4rem,2.6vw,1.85rem)/1.2 var(--ll-header-font)}
.home-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.6rem;list-style:none;margin:2.25rem 0 0;padding:0;color:var(--ll-muted);font:700 .88rem/1.3 var(--ll-ui-font)}
.home-badges__item{display:flex;align-items:center;gap:.45rem}
.home-badges__item::before{content:'';width:.4rem;height:.4rem;border-radius:50%;background:var(--ll-accent)}
.home-offer{margin-top:3.25rem;margin-bottom:3.25rem}
.home-offer__intro{max-width:56ch;margin:.75rem auto 0;text-align:center;color:var(--ll-muted)}
.home-offer__tier-label{margin:2rem 0 .85rem;text-align:center;font:800 .78rem/1.1 var(--ll-ui-font);letter-spacing:.06em;text-transform:uppercase;color:var(--ll-blue)}
.home-offer__grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0;align-items:stretch}
.home-offer__card{height:100%;display:flex;flex-direction:column}
/* Pathways/Workspace/Tutor headings: one explicit shared class
   (.home-offer__card-title, set in the markup itself) rather than two
   selectors (plain h3 vs h3 a) that merely happen to agree today --
   Pathways has no destination page yet so its heading isn't a link,
   unlike the other two, and this keeps them visually identical by
   construction instead of by coincidence. Also explicitly targets the
   nested <a> for Workspace/Tutor (color/text-decoration on the h3 alone
   don't override the base stylesheet's own direct `a{color:...}` and
   default underline -- a direct match on the element always beats an
   ancestor's inherited value, regardless of specificity), which is why
   Workspace/Tutor still rendered as underlined accent-coloured links
   instead of matching Pathways until this was added, flagged live by
   the operator, 2026-08-20. */
.home-offer__card-title{margin:.2rem 0 .5rem;font:800 1.3rem/1.15 var(--ll-header-font);color:var(--ll-ink);text-decoration:none;display:block}
/* font:inherit is also needed here, not just color/text-decoration: a
   separate, older ".card a{font:700 0.86rem/1.2 var(--ll-typography-ui)}"
   rule (theme.css, an earlier design-token generation) has equal
   specificity and comes first in the file, so without an explicit
   override it wins the font shorthand -- font-family, weight, and size
   all still differed from Pathways even after the color/text-decoration
   fix. Flagged live by the operator, 2026-08-20. */
.home-offer__card-title a{font:inherit;color:inherit;text-decoration:inherit}
.home-offer__card-title:hover,.home-offer__card-title:focus-visible,.home-offer__card-title a:hover,.home-offer__card-title a:focus-visible{color:var(--ll-accent-dark)}
.home-offer__card p{margin:0;color:var(--ll-muted)}
/* .home-offer__card--tutor's distinct accent border/shadow removed --
   flagged live by the operator, 2026-08-20: all three cards should look
   identical, not just their headings. The class stays on the Tutor
   card's markup as an inert hook, matching this file's precedent for
   other since-neutralised marker classes. */
.home-cta{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;margin-top:0;background:linear-gradient(135deg,#fff2e4,#fdece0);border-top:1px solid var(--ll-line)}
/* Full-bleed breakout section whose content otherwise lands narrower than
   every other page's content column: every other page's content sits inside
   .llb-page-fragment (width:min(calc(100% - (2 * --ll-layout-pageInset)),
   --ll-layout-shellWidth), nested inside .main's own max-width:1240px +
   padding:0 1rem) -- a second, independent inset this full-bleed breakout
   section doesn't share by default. The 4x (not 2x) pageInset term below
   isn't a literal transcription of that nested formula -- .main's own
   rendered width already runs ~2 * pageInset narrower than max-width:1240px
   would suggest, for a reason not traced to a specific rule -- it's an
   empirical fit confirmed by live pixel measurement against the offer
   cards' actual left/right edges at 800/1000/1200px viewport widths (exact
   match at each). Flagged live by the operator, 2026-08-20. */
.home-cta__inner{width:min(calc(min(100vw,var(--ll-content)) - (2 * 1rem) - (4 * var(--ll-layout-pageInset))),var(--ll-layout-shellWidth));margin:0 auto;padding:3rem 0;text-align:center}
.home-cta__inner h2{margin:0 0 1.25rem;font:800 clamp(1.5rem,3vw,2.1rem)/1.2 var(--ll-header-font)}
.home-cta__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}
@media(max-width:599px){.home-badges{gap:.5rem 1rem;font-size:.82rem}.home-cta__inner{padding:2.25rem 0;text-align:center}.home-hero__actions,.home-cta__actions{gap:.6rem}.home-hero__actions .action-link,.home-cta__actions .action-link{flex:1 1 auto;justify-content:center}}

/* Registration page styling and the .llb-notice component it and the
   Workspace verification banner both use -- additive-only append, no
   existing rules touched (registration-and-identity work, 2026-08-20).
   .llb-notice previously had no styling anywhere in this file; every
   existing caller (e.g. the Workspace empty state) gains this styling too,
   not just the new callers. */
.llb-notice{margin:1rem 0;padding:.9rem 1.1rem;border-radius:var(--ll-radius-md);border:1px solid var(--ll-line);background:var(--ll-card);color:var(--ll-ink)}
.llb-notice p{margin:0}
.llb-notice[data-state='error']{border-color:#d98b6a;background:#fdf0ea;color:#7a2f10}
.llb-notice[data-state='success']{border-color:#8fb99a;background:#eef6f0;color:#215934}
.llb-notice[data-state='info']{border-color:#9db8c9;background:#eef4f8;color:#1f4258}
.llb-notice[data-state='empty']{color:var(--ll-muted)}
.llb-verification-ribbon{width:100%;margin:0;padding:.55rem 1rem;text-align:center;background:#e3f1fb;border-bottom:1px solid #8db6d2;color:#153f5f;font:700 .9rem/1.4 var(--ll-ui-font)}
.llb-verification-ribbon p{margin:0}
.llb-verification-ribbon a{color:#153f5f;text-decoration:underline;text-underline-offset:.15em}
/* Signpost variants. The default (no attribute) is the blue verification bar above;
   these two tints match .llb-notice's success and error states so a bar and a body
   notice never disagree about what a colour means. */
.llb-verification-ribbon[data-signpost='success']{background:#eef6f0;border-bottom-color:#8fb99a;color:#215934}
.llb-verification-ribbon[data-signpost='success'] a{color:#215934}
.llb-verification-ribbon[data-signpost='subscription']{background:#fdf4ec;border-bottom-color:#d9a86a;color:#7a4a10}
.llb-verification-ribbon[data-signpost='subscription'] a{color:#7a4a10}
/* Registration fields retain a compact, predictable width while the
   password wrappers reserve room for their inline status indicators. */
.llb-register-form{display:grid;gap:1rem;max-width:26rem;margin-top:1.25rem}
.llb-register-form label{display:grid;gap:.35rem;font:700 .9rem/1.2 var(--ll-ui-font);color:var(--ll-ink)}
.llb-register-form input{min-height:2.6rem;border:1px solid var(--ll-line);border-radius:var(--ll-radius-sm);padding:0 .85rem;font:400 1rem/1.2 var(--ll-ui-font);color:var(--ll-ink);background:#fff}
.llb-password-field{position:relative;display:block}
.llb-password-field input{width:100%;padding-right:3rem}
.llb-password-indicator{position:absolute;right:.8rem;top:50%;display:flex;align-items:center;justify-content:center;width:1.35rem;height:1.35rem;border-radius:50%;transform:translateY(-50%);font:900 1rem/1 var(--ll-ui-font)}
.llb-password-indicator[data-state='valid']{background:#28733d;color:#fff}
.llb-password-indicator[data-state='invalid']{background:#b33a36;color:#fff}
.llb-password-help{font:500 .8rem/1.35 var(--ll-ui-font);color:var(--ll-muted)}
.llb-register-form button{margin-top:.35rem;align-self:start}
.llb-register-form button[disabled]{opacity:.55;cursor:not-allowed}
.llb-register-form__altcha-status{margin:0;font-size:.85rem;color:var(--ll-muted)}
.llb-register-form__alt{margin-top:1rem;color:var(--ll-muted)}
/* UI-004: horizontally centred. */
.llb-mfa-qrcode{width:240px;height:240px;margin:1.25rem auto;border:1px solid var(--ll-line);border-radius:var(--ll-radius-md);padding:.75rem;background:#fff}
.llb-mfa-qrcode svg{display:block;width:100%;height:100%}
.llb-mfa-manual-key{font:700 1rem/1.4 monospace;letter-spacing:.05em;background:var(--ll-note);border-radius:var(--ll-radius-sm);padding:.6rem .9rem;display:inline-block}
.llb-mfa-recovery-codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6rem;list-style:none;margin:1.25rem 0;padding:0}
.llb-mfa-recovery-codes li{background:var(--ll-note);border-radius:var(--ll-radius-sm);padding:.5rem .75rem;font:700 .95rem/1.2 monospace;text-align:center}
.llb-account-status{font-weight:700;color:var(--ll-ink)}
.llb-passkey-list{list-style:none;margin:1rem 0;padding:0;display:grid;gap:.6rem}
.llb-passkey-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--ll-note);border-radius:var(--ll-radius-sm);padding:.6rem .9rem}
.llb-passkey-row form{margin:0}

/* Header nav at the search-hide breakpoint (920px, this file's own
   existing breakpoint where .header-search already disappears): for a
   logged-in visitor, Home/Workspace/Tutor/Search/Account/Logout/Debug
   all move into the account-menu dropdown instead of the separate
   hamburger nav + search bar (llb_theme_header_account_markup(),
   functions.php -- see .llb-account-menu__compact-item there). Placed
   last in the file deliberately: this stylesheet has more than one
   pre-existing @media(max-width:920px) block from earlier work with
   overlapping selectors of equal specificity (e.g. .account-pill's own
   max-width is set differently in two places already) -- appending here
   guarantees these specific overrides win the cascade rather than
   depending on exactly which earlier block "happens" to win for any
   given property. body.logged-in is WordPress core's own automatic
   body_class() output, not a new class this theme has to add itself. */
/* These items were shown in the dropdown at every width from 2026-08-20,
   after the operator flagged them as "missing" at desktop. Reversed for the
   four that duplicate the inline nav on 2026-08-25: by then the nav itself
   carried Home, Library, Workspace and Tutor at desktop, so the dropdown was
   repeating what sat directly beside it. They are hidden only above 920px --
   exactly where .nav appears -- so the dropdown is still the complete menu on
   narrow screens, which is what the original change was protecting.

   Search deliberately keeps showing: the operator named the four nav items,
   and the header search box is a box rather than a nav entry.

   Selector deliberately carries .account-menu and the element: the menu's own
   `.account-menu a { display: flex }` outranks a lone class, so a bare
   `.llb-account-menu__nav-item` rule loses and the items stay visible. */
@media (min-width: 921px) {
    .account-menu a.llb-account-menu__nav-item { display: none; }
    /* The Tutor page's own menu is the mobile stand-in for the header: below 921px
       `.llb-tutor-page .topbar` is hidden, so that button is the only way to Home, Library,
       Workspace, Account and Log out. Above 921px the header is back and the two carry
       identical items, so the user saw two dropdowns with the same contents on one screen
       (operator, 2026-08-30). 921px deliberately matches the rule above it -- the same
       threshold where the header dropdown drops its duplicate nav items -- so exactly one
       menu owns navigation at every width. */
    .tutor-menu-control { display: none; }
}

/* Right-alignment applies at every width, not just <=920px -- scoping it to
   the media query left the dropdown left-aligned above the breakpoint,
   inconsistent with the (correct) right-aligned look below it. Flagged live by
   the operator, 2026-08-20. */
.account-menu a,.account-menu button{justify-content:flex-end;padding-right:12px}

/* Narrow menu (operator, 2026-08-25). min-width rather than width: at desktop
   only Search/Account/Log out are shown and none reaches 100px, so the menu
   sits at exactly 100px. Below 920px the four nav links return, and "Workspace"
   is wider than that -- a fixed width would clip it, while a minimum simply
   lets the box grow to fit. */
.account-menu{min-width:100px}
@media(max-width:920px){
  body.logged-in .nav-toggle,body.logged-in .nav,body.logged-in .header-search{display:none!important}
  /* The ≤920px grid above reserves a 'search search' row and then hides the search that
     would sit in it, because the intended mobile affordance was .nav__responsive-search --
     an element the CSS styles (line 608) and no PHP has ever rendered, exactly like the
     .nav-toggle the removed rule below names. Until one of them is built, the header search
     goes in the row the grid already has. Anonymous only: the logged-in rule above hides it
     deliberately, and those users have the account menu. */
  body:not(.logged-in) .header-search{display:block}
  /* Centred, and allowed to use the row. The base rule is `justify-self:end; max-width:350px`,
     which is right beside an account menu on a wide header and wrong in a full-width row: the box
     hugged the right edge, so from 412px up the gap on the left grew while the right stayed at
     25px -- 220px against 30px by 600px. The ≤920px grid gives search a row of its own, so it
     should sit in the middle of it. */
  body:not(.logged-in) .header-search{justify-self:center;width:min(100%,28rem);max-width:none}
  /* The ≤920px block in the base sheet lays the nav out as a COLUMN, because it was styling
     the panel .nav-toggle used to drop down. With no toggle the nav is permanently visible,
     and a column of four full-height rows pushed the case title about 570px down a 390px
     screen -- the whole first viewport was menu. A wrapping row instead. If the toggle is
     ever rebuilt, this and the display rules below it should go back to the disclosure
     design rather than being patched further. */
  body:not(.logged-in) .nav{padding:.15rem 0;overflow-x:visible}
  body:not(.logged-in) .nav__list{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:.3rem 1rem}
  body:not(.logged-in) .nav a{min-height:2rem}
  /* REMOVED 2026-09-24. The rule here hid the nav and the hamburger from anonymous
     visitors below 920px, on the ground that "'Home' is the only item the primary nav
     ever renders for them ... a menu containing exactly one, already-redundant link"
     (operator request, 2026-08-20, commit 2859d477). That premise expired: the
     anonymous nav now renders Home, Library, Workspace and Tutor, because
     LLB-engine.php filters llb_theme_paid_nav_visible to true for everyone so the
     paid features are advertised to people who have not yet subscribed. Measured on a
     case page at 390px before the removal: the only header controls a signed-out
     reader had were the logo, '?', Login and Register -- no Home, no Library, no
     search. The .nav-toggle the rule also named no longer exists anywhere in the
     theme. The logged-in rule above is deliberately untouched: those users reach
     navigation through the account menu. */
  /* A fixed 150px pill width (an earlier, explicit brief requirement)
     grows the pill beyond its content for short usernames, leaving a
     visibly empty gap after the caret -- looked broken and inconsistent
     with the correctly-sized desktop pill. The operator's follow-up,
     2026-08-20, overrides that requirement: same content-hugging sizing
     as desktop (max-width:14rem, no forced width) at every width, not a
     fixed box. This also overrides a pre-existing, unrelated
     .account-pill{max-width:11rem} rule earlier in this file (from a
     different <=920px block) that would otherwise still narrow it
     slightly below the breakpoint. */
  .account-pill{max-width:14rem}
}
@media(max-width:599px){.home-offer__grid{grid-template-columns:1fr}}

/* On phones, every document page shares a 9px canvas inset and title-card
   rhythm. Tutor remains its own edge-to-edge workspace. The card has a 1px
   border, so 11px of padding produces the requested 12px visible gap. */
@media(max-width:599px){
body:not(.llb-tutor-page){--ll-layout-pageInset:9px}
body:not(.llb-tutor-page) .main{width:calc(100% - 18px);padding-top:9px;padding-left:0;padding-right:0}
body:not(.llb-tutor-page) .llb-page-fragment{width:100%;padding-top:0}
body:not(.llb-tutor-page) .surface:has(>h1){padding-top:11px}
body:not(.llb-tutor-page) .surface:has(>h1)>h1{margin-top:0}
}

/* Legal pages use the same sticky On this page card as article pages. */
.legal-page-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,250px);gap:1rem;align-items:start}
.legal-page-layout .toc-rail{position:sticky;top:6rem}
.legal-page-layout .toc{list-style:none;padding-left:0}
.legal-page-layout .toc__item{display:grid;grid-template-columns:1.35rem minmax(0,1fr);gap:.2rem;align-items:start}
.legal-page-layout .toc__number{text-align:right}
@media(max-width:920px){.legal-page-layout{grid-template-columns:1fr}.legal-page-layout .toc-rail{position:static}}

/* Subscription status bubble and cancellation confirmation (/account). Colour is
   never the only signal -- each bubble also carries its own word ("Active",
   "Ending", "Inactive") so it still reads correctly without colour vision. */
.llb-sub-status { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; margin: 0 0 0.9rem; }
.llb-sub-bubble { display: inline-flex; align-items: center; gap: 0.4rem; border-radius: var(--ll-radius-pill);
  padding: 0.2rem 0.7rem; font: 800 0.78rem/1.5 var(--ll-ui-font); letter-spacing: 0.01em; }
.llb-sub-bubble::before { content: ''; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: currentColor; }
.llb-sub-bubble--active { background: #e7f4ec; color: #1c6b3f; }
.llb-sub-bubble--ending { background: #fdf1dc; color: #8a5a12; }
.llb-sub-bubble--inactive { background: #f0eee9; color: #5f5a52; }
.llb-sub-status__detail { color: var(--ll-muted); }
.llb-confirm { border: 1px solid var(--ll-line); border-radius: var(--ll-radius-lg); background: var(--ll-card);
  color: var(--ll-ink); padding: 1.25rem; max-width: 30rem; box-shadow: 0 24px 60px rgba(40, 26, 12, 0.22); }
.llb-confirm::backdrop { background: rgba(22, 32, 42, 0.45); }
.llb-confirm h3 { margin: 0 0 0.5rem; font: 800 1.15rem/1.2 var(--ll-header-font); }
.llb-confirm p { margin: 0 0 1rem; color: var(--ll-muted); }
.llb-confirm__actions { display: flex; gap: 0.6rem; flex-wrap: wrap; justify-content: flex-end; }


/* ------------------------------------------------------------------
   Library: the rail's column is no longer reclaimed, because it is no
   longer reserved.

   Until 2026-09-01 the index reserved 250px beside itself and the rail
   was painted into that space from the sticky freeze, out of flow. Below
   920px the reservation had to be undone, and the rules that undid it
   needed to match the desktop rule's class count -- a media query adds no
   specificity, so `.library-index__scroll-region` (0,1,0) lost to
   `.library-index__scroll-region.has-saved-rail` (0,2,0) and 250px stayed
   reserved for a rail that was already hidden.

   The rail is now a real grid column of .library-index__layout, so the
   index column is simply `minmax(0,1fr)` and there is nothing to reclaim:
   the layout collapses to one column at the breakpoint and the rail flows
   after the index. The rules that lived here matched
   `.library-index__freeze .library-index__freeze-rail`, a descendant
   relationship that no longer exists, so they matched nothing at all.
   ------------------------------------------------------------------ */

/* ------------------------------------------------------------------
   Library header: tighter vertical rhythm on tablet and phone.

   The stack from the heading down to the tabs accumulated five separate
   gaps -- the h1's margin, the sticky wrapper's padding, the search
   card's padding, the case-sensitive row's margin, and the tab list's
   margin. Each is defensible on a desktop page with room to spare; on a
   narrow screen together they pushed the first article most of a screen
   down. Trimmed rather than removed, so the grouping still reads.

   Every selector here matches the class count of the rule it overrides:
   a plain `.library-search-card` would lose to
   `.library-index__search .library-search-card`, and the change would
   silently do nothing.
   ------------------------------------------------------------------ */
@media (max-width: 920px) {
    .library-index > h1 { margin-bottom: .35rem; }
    .library-index__freeze { padding: 6px 0; }
    .library-search-card { padding: .85rem; }
    .search-page .library-search-card { margin-top: 12px; }
    .library-search-card__form > label:last-child { margin-top: .45rem; }
    .library-tabs__list { margin-top: .5rem; }
}

/* ---------------------------------------------------------------------------
   Student pathways (student-pathways programme, Phase 1)
   --------------------------------------------------------------------------- */
.action-link--danger { background: #b3261e; color: #fff; }
.action-link--danger:hover, .action-link--danger:focus-visible { background: #8f1d17; }

.llb-pathways__section { margin-bottom: 1.5rem; }
.llb-pathways__section h3 { font: 800 1.2rem/1.15 var(--ll-header-font); margin: 0 0 .6rem; }
/* My pathways | Public pathways, side by side. Single column first, two from 600px --
   the same breakpoint and repeat(2, minmax(0,1fr)) track .workspace-collection uses, so
   the Pathways tab reflows at the same width as the rest of the workspace rather than at
   one of its own. align-items:start keeps a short column from stretching to match a long
   one. */
/* One column until 900px. At 600px these two collided: each card carries a title, a chip,
   a meta line and a three-button action row, and half of a ~720px viewport cannot hold that
   without the columns overlapping (operator, 2026-08-30). Stacked, the order follows the DOM
   -- My pathways, Public pathways, then the create card -- which is why the create card is a
   grid sibling rather than nested inside My pathways. */
.llb-pathways__columns { display: grid; gap: 1.25rem; align-items: start; }
@media (min-width: 921px) {
  .llb-pathways__columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .llb-pathways__section--mine   { grid-column: 1; grid-row: 1; }
  /* Column B is either the curated public list or the student's institution list --
     both sit in the same slot, so both must carry the placement (operator, 2026-08-30). */
  .llb-pathways__section--public,
  .llb-pathways__section--institutional { grid-column: 2; grid-row: 1; }
  /* The create card is no longer a grid sibling -- it is nested inside the My pathways
     section (operator, 2026-08-31), so it sits at the foot of column A by DOM position
     and needs no placement rule. A grid-column/grid-row here would now match nothing. */
}
/* The create form reads as the last card in column A, not a footer rule under the list. */
.llb-pathways__create { margin-top: 1rem; padding: 1rem; border-radius: var(--ll-radius-md); }
/* Warm note tint so the create card reads as a different kind of thing from the pathway
   cards around it (operator, 2026-08-30). Needs TWO classes: `.workspace-shell .surface`
   (0,2,0) sets --ll-card on every card in the panel and beat the single-class selector this
   background was originally declared on, so it never actually applied. */
.llb-pathways .llb-pathways__create { background: var(--ll-note); border-color: #e8d9c4; }
.llb-pathway-create, .llb-pathway-meta { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; }
.llb-pathway-create label, .llb-pathway-meta label { display: grid; gap: .25rem; font: 700 .85rem/1.2 var(--ll-ui-font); }
.llb-pathway-create input, .llb-pathway-create select,
.llb-pathway-meta input, .llb-pathway-meta select {
  min-height: 2.4rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-sm);
  padding: 0 .6rem; font: 400 .95rem/1.2 var(--ll-ui-font); background: #fff;
}

.llb-pathway-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.llb-pathway-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1rem; }
.llb-pathway-card__body h4 { margin: 0 0 .2rem; font: 800 1.05rem/1.2 var(--ll-header-font); }
.llb-pathway-card__meta { margin: 0; color: var(--ll-muted); font: 500 .85rem/1.3 var(--ll-ui-font); }
/* EXPERIMENT (operator, 2026-08-30): the Tutor call to action spans the action column,
   above the ordinary controls. The column stacks rather than sitting in one row. */
.llb-pathway-card__actions { display: flex; flex-direction: column; gap: .5rem; align-items: stretch; flex: 0 0 auto; }
/* Lets the title wrap instead of squeezing the CTA into wrapping. */
.llb-pathway-card__body { min-width: 0; }
/* A row of the workspace's circular icon controls -- .35rem matches
   .workspace-item__actions so a pathway card's controls sit like a bookmark's. */
.llb-pathway-card__actions-row { display: flex; gap: .35rem; align-items: center; justify-content: flex-end; }
/* Matches .workspace-item__actions so the control sits in the row like a bookmark's. */
.llb-pathway-card__actions-row .workspace-item__delete { margin: 0; display: inline-flex; }

/* Deliberately OFF the LLB palette -- this is the one control on the card that is not a
   CRUD action, and the operator wants it to read that way. Indigo/violet against the
   theme's warm browns, with the four-point AI sparkle. Contrast of white on #5b21b6 is
   ~8.6:1, comfortably past AA, so the distinctiveness does not cost legibility. */
.llb-tutor-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 2.1rem; padding: 0 .9rem;
  border: 0; border-radius: var(--ll-radius-pill);
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 55%, #9333ea 100%);
  color: #fff; font: 700 .85rem/1 var(--ll-button-font);
  text-decoration: none; cursor: pointer;
  box-shadow: 0 1px 2px rgba(79, 70, 229, .35);
  /* One line, always. The label is a fixed three words, and wrapping it mid-button made the
     control taller than the icon row beneath it and ragged across cards (operator,
     2026-08-30). The action column sizes to this instead. */
  white-space: nowrap;
}
/* Full width only in the card's stacked action column, where it spans the icon row
   beneath it. In the viewer's header row it sits beside Edit at its natural size. */
.llb-pathway-card__actions > .llb-tutor-cta { width: 100%; }
.llb-tutor-cta:hover, .llb-tutor-cta:focus-visible {
  background: linear-gradient(135deg, #4338ca 0%, #6d28d9 55%, #7e22ce 100%);
  color: #fff;
}
.llb-tutor-cta__spark { width: 1.05em; height: 1.05em; fill: currentColor; flex: 0 0 auto; }
@media (prefers-reduced-motion: no-preference) {
  .llb-tutor-cta__spark { transition: transform .18s ease; }
  .llb-tutor-cta:hover .llb-tutor-cta__spark { transform: rotate(15deg) scale(1.08); }
}
.llb-pathway-card--readonly { opacity: .95; }

/* The chip sat inline after the title, so a wrapping title left it indented mid-line.
   Its own row instead, flush with the title's left edge, 6px clear above and below at every
   width (operator, 2026-08-30). */
.llb-pathway-card__body h4 { display: flex; flex-direction: column; align-items: flex-start; }
/* Pulled 6px left so the chip's TEXT lines up with the title's, not its pill edge: the
   pill carries .5rem of internal left padding, so a box flush with the title reads as
   indented (operator, 2026-08-30 -- "visually align"). Well inside the card's 1rem
   padding, so nothing clips. */
.llb-pathway-card__body h4 .llb-pathway-tag { margin: 6px 0 6px -6px; align-self: flex-start; }
.llb-pathway-tag { display: inline-block; border-radius: var(--ll-radius-pill); padding: .1rem .5rem;
  font: 800 .7rem/1.4 var(--ll-ui-font); text-transform: uppercase; letter-spacing: .03em; vertical-align: middle; }
.llb-pathway-tag--private { background: #eceff1; color: #37474f; }
.llb-pathway-tag--fork-public { background: #e3f2fd; color: #0d47a1; }
.llb-pathway-tag--fork-institutional { background: #f3e5f5; color: #6a1b9a; }
.llb-pathway-tag--institutional { background: #e8f5e9; color: #1b5e20; }
.llb-pathway-tag--public { background: #e3f2fd; color: #0d3c61; }
/* Curated public paths carry a one-line summary the private cards don't have. */
.llb-pathway-card__summary { margin: .35rem 0 0; color: var(--ll-muted); font: 400 .88rem/1.45 var(--ll-ui-font); }

/* --- Pathways panel presentation (operator, 2026-08-30) --- */
/* 1. No glow on the cards. `.workspace-shell .surface` carries a 40px drop shadow meant for
   a page-level panel; on cards nested INSIDE that panel it reads as a halo. Border only. */
.llb-pathways .llb-pathway-card,
.llb-pathways .llb-pathways__create { box-shadow: none; }

/* 2. Buttons, not bold underlined text, across the whole pathways UI -- the panel, the
   editor and the viewer (operator asked twice: cards first, then the editor).
   `.workspace-shell .action-link` (line ~703) strips every action back to an underlined
   link; wherever a pathway offers an action it should read as a control. Outlined by
   default so a row of them doesn't shout; --primary and --danger keep their fills. */
.llb-pathways .llb-pathway-card__actions .action-link,
.llb-pathway-editor .action-link,
.llb-pathway-builder .action-link,
.llb-pathway-item .action-link,
.llb-pathway-viewer .action-link,
.llb-pathway-fork-cta .action-link,
.llb-pathway-shared .action-link {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 2.1rem; padding: 0 .85rem;
  border: 1px solid var(--ll-accent); border-radius: var(--ll-radius-pill);
  background: transparent; color: var(--ll-accent-dark);
  font: 700 .85rem/1 var(--ll-button-font); text-decoration: none; cursor: pointer;
}
.llb-pathways .llb-pathway-card__actions .action-link:hover,
.llb-pathways .llb-pathway-card__actions .action-link:focus-visible,
.llb-pathway-editor .action-link:hover, .llb-pathway-editor .action-link:focus-visible,
.llb-pathway-builder .action-link:hover, .llb-pathway-builder .action-link:focus-visible,
.llb-pathway-item .action-link:hover, .llb-pathway-item .action-link:focus-visible,
.llb-pathway-viewer .action-link:hover, .llb-pathway-viewer .action-link:focus-visible,
.llb-pathway-fork-cta .action-link:hover, .llb-pathway-fork-cta .action-link:focus-visible,
.llb-pathway-shared .action-link:hover, .llb-pathway-shared .action-link:focus-visible {
  background: var(--ll-accent); color: #fff;
}
.llb-pathways .llb-pathway-card__actions .action-link--primary,
.llb-pathway-editor .action-link--primary,
.llb-pathway-builder .action-link--primary,
.llb-pathway-item .action-link--primary,
.llb-pathway-viewer .action-link--primary,
.llb-pathway-fork-cta .action-link--primary,
.llb-pathway-shared .action-link--primary {
  background: var(--ll-accent); border-color: var(--ll-accent); color: #fff;
}
.llb-pathways .llb-pathway-card__actions .action-link--danger,
.llb-pathway-editor .action-link--danger,
.llb-pathway-builder .action-link--danger,
.llb-pathway-item .action-link--danger,
.llb-pathway-viewer .action-link--danger,
.llb-pathway-fork-cta .action-link--danger,
.llb-pathway-shared .action-link--danger {
  border-color: #b3261e; background: #b3261e; color: #fff;
}
.llb-pathways .llb-pathway-card__actions .action-link--danger:hover,
.llb-pathways .llb-pathway-card__actions .action-link--danger:focus-visible,
.llb-pathway-editor .action-link--danger:hover, .llb-pathway-editor .action-link--danger:focus-visible,
.llb-pathway-builder .action-link--danger:hover, .llb-pathway-builder .action-link--danger:focus-visible,
.llb-pathway-item .action-link--danger:hover, .llb-pathway-item .action-link--danger:focus-visible {
  background: #8f1d17; border-color: #8f1d17; color: #fff;
}

/* 3. Title spans the card. The form was a wrap-flex, so Title took only its intrinsic width
   and sat beside Topic. Grid instead: Title on its own full-width row, Topic + submit below. */
/* Heading, then Title and its field on ONE line, then Save at the right (operator,
   2026-08-30). The label was a stacked grid, which is why the caption sat above the field. */
.llb-pathways__create-title { margin: 0 0 .6rem; font: 800 1.05rem/1.15 var(--ll-header-font); }
.llb-pathways__create .llb-pathway-create {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem;
}
.llb-pathways__create .llb-pathway-create > label {
  grid-column: 1 / -1;
  display: flex; align-items: center; gap: .6rem;
  font: 700 .85rem/1.2 var(--ll-ui-font);
}
/* flex:1 rather than width:100% -- the caption now shares the row and needs its own space. */
.llb-pathways__create .llb-pathway-create input[name="title"] { flex: 1; min-width: 0; width: auto; }
/* Submit sits at the right edge of the card, on its own row under the title line. */
.llb-pathways__create .llb-pathway-create > button { justify-self: end; }

/* Editor: two-column builder (order | picker), stacking on narrow screens */
.llb-pathway-editor__back { margin: 0 0 .5rem; font: 600 .9rem/1.2 var(--ll-ui-font); }
.llb-pathway-builder { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1rem; margin-top: 1rem; }
/* Column A is three explicit rows -- title, ordered items, then the Cancel/Save foot.
   Column B (the picker) is placed on row 2 so its top edge lines up with the Pathway order
   card rather than with the Title field (operator, 2026-08-30). This only works because the
   three parts are the grid's own children; wrapping them re-introduces the misalignment. */
.llb-pathway-meta        { grid-column: 1; grid-row: 1; display: grid; gap: .75rem; }
.llb-pathway-builder__items  { grid-column: 1; grid-row: 2; }
/* align-self keeps this box its own height instead of stretching to fill row 3, which the
   picker inflates whenever the article list is taller than the ordered items (it spans
   rows 2-3, so the surplus lands here). align-items then stops the buttons themselves
   stretching. Without both, Cancel/Save rendered as full-height pills. */
.llb-pathway-meta__save  { grid-column: 1; grid-row: 3; display: flex; justify-content: flex-end;
                           align-self: start; align-items: center; gap: .5rem; }
.llb-pathway-builder__picker { grid-column: 2; grid-row: 2 / span 2; align-self: start; }
.llb-pathway-meta > label { grid-column: 1 / -1; }
.llb-pathway-meta input[name="title"] { width: 100%; }

/* No glow on the cards inside the editor -- same 40px page-panel shadow, same halo. */
.llb-pathway-editor .surface,
.llb-pathway-editor .llb-pathway-item { box-shadow: none; }
.llb-pathway-builder__items, .llb-pathway-builder__picker { padding: 1rem; }
@media (min-width: 921px) {
  .llb-pathway-builder__picker { position: sticky; top: calc(var(--ll-header-h) + .5rem); }
}
.llb-pathway-builder__items h3, .llb-pathway-builder__picker h3 { margin: 0 0 .3rem; font: 800 1.1rem/1.15 var(--ll-header-font); }

.llb-pathway-builder__list { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .4rem; }
.llb-pathway-builder__empty { color: var(--ll-muted); border: 1px dashed var(--ll-line); border-radius: var(--ll-radius-sm); padding: .8rem; }
.llb-pathway-item { display: flex; align-items: center; gap: .55rem; padding: .5rem .6rem;
  border: 1px solid var(--ll-line); border-radius: var(--ll-radius-sm); background: #fff; }
.llb-pathway-item.is-dragging { opacity: .5; }
.llb-pathway-item__handle { display: inline-flex; align-items: center; padding: 0 .15rem; cursor: grab; color: var(--ll-muted); }
.llb-pathway-item__handle:active { cursor: grabbing; }
.llb-pathway-item__grip { display: block; fill: currentColor; }
.llb-pathway-item:hover .llb-pathway-item__handle, .llb-pathway-item.is-dragging .llb-pathway-item__handle { color: var(--ll-accent); }
.llb-pathway-item__pos { min-width: 1.4rem; text-align: center; font: 800 .85rem/1 var(--ll-ui-font); color: var(--ll-muted); }
.llb-pathway-item__body { flex: 1; min-width: 0; display: grid; gap: .1rem; }
.llb-pathway-item__body a { font-weight: 700; text-decoration: none; }
.llb-pathway-item__body small { color: var(--ll-muted); }
.llb-pathway-item__controls { display: flex; gap: .15rem; align-items: center; }
.llb-pathway-item__controls .inline-form { margin: 0; }
/* Hollow move/remove buttons: .inline-form button (0,1,1) sets a filled accent style,
   so scope to (0,2,1) here to win and render outlined circles instead. */
.inline-form button.llb-pathway-item__btn, button.llb-pathway-item__btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2rem; height: 2rem; min-width: 2rem; min-height: 2rem; padding: 0;
  border: 1.6px solid var(--ll-accent); border-radius: 50%; background: transparent;
  color: var(--ll-accent); font-size: .8rem; line-height: 1; cursor: pointer; }
.inline-form button.llb-pathway-item__btn:hover, .inline-form button.llb-pathway-item__btn:focus-visible,
button.llb-pathway-item__btn:hover, button.llb-pathway-item__btn:focus-visible { background: var(--ll-note); }
button.llb-pathway-item__btn:disabled { opacity: .3; cursor: default; }
.inline-form button.llb-pathway-item__btn--remove, button.llb-pathway-item__btn--remove { border-color: #b3261e; color: #b3261e; font-size: 1.05rem; }

.llb-pathway-picker__search { display: grid; gap: .25rem; margin: .5rem 0; font: 700 .85rem/1.2 var(--ll-ui-font); }
.llb-pathway-picker__search input { min-height: 2.4rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-pill); padding: 0 .8rem; }
/* Was a flat 26rem, which cut the list off far short of column A (operator: "the height of
   the Add articles column is truncated"). Sized to the viewport instead and made sticky, so
   the picker stays usable while scrolling a long pathway rather than scrolling away. */
.llb-pathway-picker__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; max-height: calc(100vh - 16rem); overflow-y: auto; }
.llb-pathway-picker__item { display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .45rem .55rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-sm); background: #fff; }
.llb-pathway-picker__body { display: grid; gap: .1rem; min-width: 0; }
.llb-pathway-picker__body small { color: var(--ll-muted); }
.llb-pathway-picker__item .inline-form { margin: 0; }

@media (max-width: 920px) {
  .llb-pathway-builder { grid-template-columns: 1fr; }
}

/* Phase 2 -- share-by-link panel + shared public view */
.llb-pathway-share { margin-top: 1rem; padding: 1rem; }
.llb-pathway-share h3 { margin: 0 0 .3rem; font: 800 1.1rem/1.15 var(--ll-header-font); }
.llb-pathway-share__link { display: grid; gap: .25rem; margin: .5rem 0; font: 700 .85rem/1.2 var(--ll-ui-font); }
.llb-pathway-share__link input { min-height: 2.4rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-sm);
  padding: 0 .6rem; font: 400 .9rem/1.2 var(--ll-ui-font); background: #fff; }
.llb-pathway-share__actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }

.llb-pathway-shared__list { padding-left: 1.3rem; display: grid; gap: .4rem; }
.llb-pathway-shared__list a { font-weight: 700; text-decoration: none; }
.llb-pathway-shared__list small { color: var(--ll-muted); }

/* Learning-path page -- grid/table view toggle + fork CTA (student-pathways) */
.learning-path-articles__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem; }
.learning-path-articles__head .section-title { margin: 0; }
.learning-path-count { display: inline-block; min-width: 1.5rem; text-align: center; border-radius: var(--ll-radius-pill);
  background: var(--ll-note); color: var(--ll-muted); font: 800 .8rem/1.5 var(--ll-ui-font); padding: 0 .45rem; vertical-align: middle; }
.learning-path-step { margin: 0 0 .3rem; color: var(--ll-blue); }

/* 12px clear between the Grid/Table switch and the cards below it (operator, 2026-08-30). */
.learning-path-views__toggle { display: inline-flex; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-pill); overflow: hidden; background: #fff; margin-bottom: 12px; }
.learning-path-views__btn { border: 0; background: transparent; cursor: pointer; padding: .4rem .9rem;
  font: 700 .85rem/1.2 var(--ll-ui-font); color: var(--ll-ink); min-height: 2.2rem; }
.learning-path-views__btn + .learning-path-views__btn { border-left: 1px solid var(--ll-line); }
.learning-path-views__btn.is-active { background: var(--ll-accent); color: #fff; }

.learning-path-table__wrap { margin-top: 1rem; overflow-x: auto; }
.learning-path-table { width: 100%; border-collapse: collapse; font: 400 .95rem/1.4 var(--ll-ui-font); }
.learning-path-table th, .learning-path-table td { border: 1px solid var(--ll-line); padding: .6rem .7rem; text-align: left; vertical-align: top; }
.learning-path-table thead th { background: var(--ll-note); font: 800 .78rem/1.1 var(--ll-ui-font); text-transform: uppercase; letter-spacing: .04em; color: var(--ll-muted); }
.learning-path-table__step { text-align: center; white-space: nowrap; font-weight: 800; color: var(--ll-muted); }
.learning-path-table td a { font-weight: 700; text-decoration: none; }
.learning-path-table tbody tr:nth-child(even) { background: rgba(22,32,42,.02); }

.llb-pathway-fork-cta { margin: 1rem 0 .5rem; padding: 1rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-md);
  background: var(--ll-note); display: flex; flex-direction: column; gap: .4rem; align-items: flex-start; }
.llb-pathway-fork-cta .workspace-inline-meta { margin: 0; }

/* Pathway rail -- reading-progress ticks (student-pathways) */
.study-nav__list { list-style: none; padding-left: 0; margin: .5rem 0 0; }
.study-nav__item { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; margin: .35rem 0; }
.study-nav__item .study-nav__link { flex: 1 1 auto; min-width: 0; }
.study-nav__tick, .study-nav__tick-form { margin: 0; flex: 0 0 auto; line-height: 0; margin-left: auto; }
.study-nav__tick { display: inline-flex; align-items: center; justify-content: center; width: 1.4rem; height: 1.4rem;
  min-width: 1.4rem; border-radius: 50%; border: 2px solid var(--ll-line); padding: 0; background: transparent;
  color: #b7b2a8; box-sizing: border-box; margin-top: -1px; }

/* Standalone read tick at the end of an article H1 (articles with no pathway rail).
   Sized to the heading and kept on the last word's line via a preceding &nbsp;. */
.article h1 .study-nav__tick-form { display: inline; margin: 0; }
.article h1 .study-nav__tick { width: 1.73em; height: 1.73em; min-width: 1.73em; border-width: 2.4px;
  vertical-align: .06em; margin-left: 12px; margin-top: 0; }
.article h1 .study-nav__tick-check { width: 1.1em; height: 1.1em; }
button.study-nav__tick { cursor: pointer; transition: box-shadow var(--ll-motion-duration, .15s) ease; }
button.study-nav__tick:disabled { opacity: .6; cursor: progress; }
.study-nav__tick-check { width: .85rem; height: .85rem; display: block; }
.study-nav__tick--read { background: #1b8a3f; border-color: #1b8a3f; color: #fff; }
.study-nav__tick--current { background: transparent; border-color: #1b8a3f; color: #1b8a3f; }
.study-nav__tick--unread { background: transparent; border-color: var(--ll-line); color: #c3bdb2; }
button.study-nav__tick:hover, button.study-nav__tick:focus-visible { box-shadow: 0 0 0 3px rgba(27,138,63,.2); outline: none; }
.study-nav__item .study-nav__link { padding-top: .05rem; }

/* Current-article highlight pill: pull its right edge in 12px (from margin-right:-6px
   to +6px) so there is a clear gap between the pill and the reading-progress tick, and
   wrap long titles inside the pill's width rather than letting them spill past it. */
.study-nav__item .study-nav__link { overflow-wrap: break-word; word-break: break-word; }
/* The current article's <li> is study-nav__item--{read|current|unread} depending on
   read state, but its link always carries .current -- so target the link, not the item,
   to keep a ~12px gap between the highlight pill and the tick (base is margin-right:-6px;
   +4px here plus the flex gap makes ~12px). */
.study-nav__item .study-nav__link.current { margin-right: 4px; }

/* The article bookmark button is position:absolute at the article's top-right
   (top:1rem; right:1rem; ~2.35rem wide). Only the navigator's SUMMARY line sits in
   its band, so reserve room on that line alone -- the prev/next links sit below the
   bookmark and keep the full width (next-link stays right-aligned to the edge). */
.pathway-navigator__summary { padding-right: 2.9rem; }

/* Tutor pathway-focus selector + pathway-editor "Study with Tutor" (student-pathways P3) */
.tutor-focus { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; flex-wrap: wrap; }
.tutor-focus__label { font: 800 .72rem/1.1 var(--ll-ui-font); text-transform: uppercase; letter-spacing: .06em; color: var(--ll-muted); }
.tutor-focus__select { min-height: 2.2rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-pill);
  padding: 0 .7rem; font: 600 .85rem/1.2 var(--ll-ui-font); background: #fff; color: var(--ll-ink); max-width: 100%; }
.llb-pathway-editor__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.llb-pathway-editor__head h1 { margin: 0; }
.llb-pathway-editor__study { flex: 0 0 auto; text-decoration: none; }

/* A hidden learning-path view panel must actually hide: .card-list's display:grid
   otherwise overrides the browser's [hidden]{display:none}, leaving the grid showing
   under the table. Attribute-pair specificity (0,2,0) beats .card-list (0,1,0). */
[data-learning-path-panel][hidden] { display: none; }

/* Private pathway viewer page header (student-pathways) */
.llb-pathway-viewer__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: .5rem; }
.llb-pathway-viewer__head h1 { margin: 0 0 .3rem; }
.llb-pathway-viewer__title { min-width: 0; }
.llb-pathway-viewer__actions, .llb-pathway-editor__head-actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; flex: 0 0 auto; }

/* Picker filter must actually hide non-matching items: .llb-pathway-picker__item's
   display:flex otherwise overrides the browser's [hidden]{display:none}. */
.llb-pathway-picker__item[hidden] { display: none; }

/* Table: jurisdictions + reading time under the article name, non-bold + muted. */
.learning-path-table__sub { display: block; margin-top: .15rem; font-weight: 400; font-size: .82rem; color: var(--ll-muted); }

/* Viewer title share-link icon (circle-bordered, matches the tick/bookmark theme) */
.llb-pathway-share-btn { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: 1.9rem;
  min-width: 1.9rem; border: 2px solid var(--ll-line); border-radius: 50%; background: #fff; color: var(--ll-muted);
  padding: 0; cursor: pointer; vertical-align: .12em; margin-left: .5rem; transition: box-shadow var(--ll-motion-duration, .15s) ease; }
.llb-pathway-share-btn:hover, .llb-pathway-share-btn:focus-visible { border-color: var(--ll-accent); color: var(--ll-accent); box-shadow: 0 0 0 3px rgba(154,87,40,.18); outline: none; }
.llb-pathway-share-btn.is-copied { border-color: #1b8a3f; color: #1b8a3f; }
.llb-pathway-share-btn svg { width: 1rem; height: 1rem; }

.llb-pathway-share-reveal { display: block; margin-top: .4rem; font: 500 .85rem/1.4 var(--ll-ui-font); color: var(--ll-muted); word-break: break-all; }
.llb-pathway-share-reveal a { color: var(--ll-accent-dark); }

/* Pathway card + workspace-tab mobile refinements (student-pathways) */
/* 9px between a pathway title and its coloured origin tag (card + viewer). */
/* Only the viewer's title keeps the inline 9px offset -- its chip still sits beside the
   heading. The card chip is on its own row now and must be flush left with the title, so it
   is deliberately no longer in this selector (it would override the 6px rule above). */
/* Orphan control (operator, 2026-08-30). The chip and share icon were loose inline
   children of the h1, so a long title pushed the icon onto a line by itself. Grouped into one
   non-breaking run: they now either sit beside the title or wrap together, never leaving the
   icon stranded. inline-flex keeps them optically centred on the title's baseline box. */
.llb-pathway-viewer__badges {
  display: inline-flex; align-items: center; gap: 9px;
  white-space: nowrap; margin-left: 9px; vertical-align: middle;
}
.llb-pathway-viewer__title h1 .llb-pathway-viewer__badges .llb-pathway-tag { margin-left: 0; }

@media (max-width: 480px) {
  /* Keep all four workspace tabs within the viewport, shrinking the tab font and
     count badges gradually with the width so they never overflow. */
  .workspace-tabs__list { gap: 0; justify-content: space-between; }
  .workspace-tabs__tab { padding: .5rem .26rem; gap: .26rem; font-size: clamp(.58rem, 3vw, .82rem); }
  .workspace-tabs__tab span { min-width: 1.02rem; height: 1.02rem; padding: 0 .22rem; font-size: clamp(.54rem, 2.3vw, .7rem); }
  /* Pathway cards: stack the body over the actions, and stack View/Edit/Delete. */
  .llb-pathway-card { flex-direction: column; align-items: flex-start; gap: .55rem; }
  .llb-pathway-card__actions { flex-direction: column; align-items: flex-start; gap: .3rem; width: 100%; }
}

/* "Create pathway" must read as a filled primary button at all sizes -- the generic
   .inline-form button.action-link rule otherwise wins over .action-link--primary and
   subdues it. Scoped to the create form so no other button changes. */
.llb-pathway-create.inline-form button.action-link--primary { background: #9a5728; color: #fff; }
.llb-pathway-create.inline-form button.action-link--primary:hover,
.llb-pathway-create.inline-form button.action-link--primary:focus-visible { background: #7f4a20; color: #fff; }

/* ---- Context-sensitive help (?) --------------------------------------------------
   CSS-only: reveal on hover and on keyboard focus, no JavaScript. The icon is a link
   to the help anchor, so with styles disabled the ? and its text simply read inline
   and the link still works -- the bubble is enhancement, never the only route. */
.llb-help {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 1.15rem; height: 1.15rem; margin-left: .35rem; vertical-align: middle;
  border: 1px solid var(--ll-line); border-radius: 50%;
  background: #fff; color: var(--ll-muted); text-decoration: none;
  font: 700 .72rem/1 var(--ll-ui-font);
}
.llb-help:hover, .llb-help:focus-visible { background: var(--ll-note); color: var(--ll-accent-dark); border-color: var(--ll-accent); }
.llb-help__mark { pointer-events: none; }
.llb-help__text {
  position: absolute; bottom: calc(100% + .45rem); left: 50%; transform: translateX(-50%);
  z-index: 40; width: max-content; max-width: min(22rem, 70vw);
  padding: .6rem .75rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-md);
  background: #fff; color: var(--ll-ink); box-shadow: var(--ll-shadow);
  font: 400 .85rem/1.45 var(--ll-ui-font); text-align: left;
  /* The icon sits inside whatever heading it annotates, and those inherit down: the
     Library's .eyebrow carries text-transform:uppercase and letter-spacing:.08em, so
     the Saved rail's bubble rendered as SHOUTED, SPACED-OUT PROSE. A tooltip is a
     sentence and must read as one wherever it is placed. */
  text-transform: none; letter-spacing: normal; font-weight: 400;
  /* Hidden from sight but NOT from assistive tech: aria-describedby must still
     resolve to readable text, so this cannot be display:none or visibility:hidden. */
  opacity: 0; pointer-events: none; transition: opacity var(--ll-motion-duration, .15s) var(--ll-motion-easing, ease);
}
.llb-help:hover .llb-help__text, .llb-help:focus-visible .llb-help__text { opacity: 1; }
/* Near the right edge the bubble would overflow the viewport; nudging it back is
   cheaper and more predictable than measuring position in JavaScript. */
.llb-help__text { margin-right: .5rem; }
@media (max-width: 599px) {
  .llb-help__text { left: auto; right: 0; transform: none; max-width: 78vw; }
}
@media (prefers-reduced-motion: reduce) { .llb-help__text { transition: none; } }

/* The header search submit is visually hidden (header.php), so the pill no longer has a
   button holding its right edge -- without this the input text runs to the border. The
   button stays in the DOM for assistive tech and to guarantee implicit submission. */
.header-search__pill { padding-right: .85rem; }
/* The header (?) sits beside the account pill, and inside the Tutor beside New session.
   Slightly larger than an inline annotation because it is a navigation target here. */
/* Sized from the same token as the search and account pills it sits between, so the three
   line up and stay lined up if the token moves. */
.llb-help--header { width: var(--ll-header-pill); height: var(--ll-header-pill); margin-left: 0; margin-right: .5rem; font-size: .95rem; }
/* Sized to New session beside it, not to the site header's pills (operator, 2026-08-31).
   That button has no explicit height -- it is padding .5rem top+bottom, a .76rem/1 line box
   and a 1px border -- so the circle is built from the same three numbers. If the button's
   padding or font changes, this needs changing with it; they are related by arithmetic, not
   by a shared token. */
.tutor-dialog__header-actions .llb-help--header {
  width: calc(1rem + .76rem + 2px); height: calc(1rem + .76rem + 2px);
  margin-right: .4rem; font-size: .8rem;
}

/* ---- Tutor pathway-focus control ------------------------------------------------
   Aligned and behaving like the header's account pill (operator, 2026-08-31). */
/* "STUDYING" sat flush against the panel edge while the prompt field below it is
   inset by the composer's own padding. Same inset here lines the two left edges up. */
.tutor-focus { padding-left: var(--ll-spacing-sm); }
.tutor-focus__control { position: relative; display: inline-flex; align-items: center; }
.tutor-focus__select {
  appearance: none; -webkit-appearance: none;
  min-height: 2.45rem;                       /* the account pill's height */
  border: 1px solid var(--ll-color-line); border-radius: var(--ll-radius-pill);
  background: #fff; color: var(--ll-color-ink);
  /* Right padding = caret width + its 9px shift + breathing room, so a long pathway
     name runs out of room BEFORE it reaches the caret rather than colliding with it. */
  /* Asymmetric vertical padding, not a margin: a 2px optical nudge so the selected
     pathway name sits on the same baseline as the STUDYING label beside it (operator,
     2026-08-31). The pill's own height is set by min-height, so shifting padding moves
     the text without resizing the control or disturbing the caret. */
  padding: calc(.16rem - 2px) 2.6rem calc(.16rem + 2px) .95rem;
  /* 600, not the account pill's 800. That pill shows a short username; this shows a
     pathway NAME -- prose of variable length -- and extra-bold at this size rendered
     as a heavy slab rather than a control label (operator: "almost looks super-bold"). */
  font: 600 .8rem/1.2 var(--ll-typography-ui);
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(64, 43, 28, .06);
  text-overflow: ellipsis;
}
.tutor-focus__select::-ms-expand { display: none; }
.tutor-focus__caret {
  position: absolute; right: calc(.72rem + 9px); top: 50%;
  width: .7rem; height: .5rem; pointer-events: none;
  fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  color: var(--ll-color-ink);
  transform: translateY(-50%);
  transition: transform var(--ll-motion-duration) var(--ll-motion-easing);
}
/* NO rotation, deliberately. A native <select> does not expose open/closed to CSS or JS --
   there is no :open, and no event fires when the browser's own dropdown closes. :focus-within
   was tried and is wrong: it stays true after the first click, so a second click reopened the
   list with the caret already flipped and nothing appeared to happen (operator, 2026-08-31).
   A caret that rotates sometimes is worse than one that never does, because it teaches the
   reader a rule the control then breaks. Matching the account pill's behaviour properly needs
   a real button + listbox, which is a separate piece of work; the caret is positioned and
   styled to match in the meantime. */
.tutor-focus__caret { transition: none; }

/* The hamburger's 1px light border was removed (operator, 2026-08-31). It sits on the accent
   header bar, so the global focus ring -- rgba(154,87,40,.45), the accent itself -- would be
   near-invisible against it. A white ring keeps the control keyboard-visible now that the
   border is gone. */
.tutor-menu-button:focus-visible { outline: 3px solid rgba(255,255,255,.9); outline-offset: 2px; }

/* The header search submits on Enter and shows no button. Hidden in CSS rather than by
   adding a class: contracts/presentation pins class="llb-search__submit" exactly, and
   tests/test_presentation_contract.py asserts that string. The button stays in the DOM
   for assistive tech and to guarantee implicit submission. */
.header-search .llb-search__submit { position: absolute; left: -999px; }

/* ---- Register: form beside what happens next (operator, 2026-08-31) ---------------
   Column A is the form, column B explains the journey the form starts. Stacks to one
   column below the tablet breakpoint, form first -- someone who arrived intending to
   register should not have to scroll past an explanation to reach the fields. */
/* The two-column card: a form in column A, context or status in the panel beside it.
   One definition, used by /register and /account alike (consolidated 2026-08-31);
   previously each page carried its own grid classes and its own copy of this geometry,
   kept in step by hand. Deliberately not named 'llb-account__*' -- the header account
   menu already owns that namespace. */
.llb-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; align-items: start; }
@media (min-width: 921px) {
  .llb-split { grid-template-columns: minmax(0, 1fr) minmax(260px, .8fr); gap: 2.25rem; }
}
.llb-split__col--side {
  padding: 1.15rem 1.25rem; border: 1px solid var(--ll-line); border-radius: var(--ll-radius-md);
  background: var(--ll-note); font-family: var(--ll-ui-font);
}
.llb-split__col--side h2 { margin: .15rem 0 .75rem; font: 800 1.15rem/1.15 var(--ll-header-font); }
/* Sub-headings inside the panel sit a step below its title rather than competing with it. */
.llb-split__col--side h3 { margin: 1.1rem 0 .3rem; font: 700 .95rem/1.2 var(--ll-header-font); }
.llb-split__col--side h3:first-of-type { margin-top: .25rem; }
.llb-split__col--side p { margin: 0 0 .5rem; font-size: .9rem; }
/* The grid opens immediately inside the card, so the heading block is the first thing in
   column A -- no margin-top, on either page. */
.llb-split__col--main > .eyebrow { margin-top: 0; }
.llb-split__col--main h2 { margin: 0 0 .75rem; }

/* Blocks within a column, separated by a rule rather than by guesswork about margins.
   Reusable across both pages: each is one topic the reader can stop at. */
.llb-split__block + .llb-split__block {
  margin-top: 1.4rem; padding-top: 1.4rem; border-top: 1px solid var(--ll-line);
}

/* Who you are signed in as. Label, then the name, then the address it will mail. */
.llb-identity { margin-top: .9rem; }
.llb-identity__label {
  margin: 0 0 .2rem; font: 800 .72rem/1.1 var(--ll-ui-font);
  letter-spacing: .08em; text-transform: uppercase; color: var(--ll-muted);
}
.llb-identity__name { margin: 0; font: 700 1.05rem/1.3 var(--ll-ui-font); }
.llb-identity__email { margin: .1rem 0 0; color: var(--ll-muted); font-size: .92rem; }

/* A button that reads as a link. For a low-emphasis action that must remain a real
   <button> -- cancelling opens a confirm dialog, and still posts the form when scripting
   is unavailable -- but should not compete with the page's primary action the way a
   bordered pill does. Takes the base anchor's own colour so it is indistinguishable from
   the links beside it. */
.llb-linkbutton {
  display: inline; margin: 0; padding: 0; border: 0; background: none;
  font: inherit; color: var(--ll-accent-dark); cursor: pointer;
  text-decoration: underline; text-underline-offset: .15em;
}
.llb-linkbutton:hover { color: var(--ll-ink); }
.llb-linkbutton:focus-visible { outline: 2px solid var(--ll-accent); outline-offset: 2px; }

/* A state flag: like .llb-sub-bubble but for a condition rather than a status, so no
   leading dot. Shares that component's palette so the two never disagree on meaning. */
.llb-flag {
  display: inline-flex; align-items: center; border-radius: var(--ll-radius-pill);
  padding: .28rem .65rem; font: 800 .72rem/1 var(--ll-ui-font);
  letter-spacing: .08em; text-transform: uppercase;
}
.llb-flag--attention { background: #fdf1dc; color: #8a5a12; }

/* Term/value rows for the side panel: a status list, not prose. */
.llb-panel-list { margin: 0; }
.llb-panel-list__row + .llb-panel-list__row {
  margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--ll-line);
}
.llb-panel-list__term { margin: 0; font: 700 .95rem/1.25 var(--ll-ui-font); }
/* dd carries a browser default indent that would step every value in from its term. */
.llb-panel-list__value {
  margin: .15rem 0 0; color: var(--ll-muted); font-size: .9rem;
  display: flex; flex-direction: column; align-items: flex-start; gap: .35rem;
}
/* The panel's own intro line, under its title and above the rows. */
.llb-split__col--side > .llb-panel-intro {
  margin: 0 0 .9rem; padding-bottom: .9rem; border-bottom: 1px solid var(--ll-line);
  color: var(--ll-muted); font-size: .9rem;
}
.llb-register__steps { margin: 0; padding-left: 1.15rem; display: grid; gap: .7rem; }
.llb-register__steps li { font-size: .9rem; line-height: 1.5; }
.llb-register__steps strong { font-weight: 800; }
.llb-register__next-note {
  margin: 1rem 0 0; padding-top: .85rem; border-top: 1px solid var(--ll-line);
  color: var(--ll-muted); font-size: .85rem; line-height: 1.5;
}

:root { --llb-tutor-spark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11 2.5c.7 4.3 1.7 5.3 6 6-4.3.7-5.3 1.7-6 6-.7-4.3-1.7-5.3-6-6 4.3-.7 5.3-1.7 6-6Z'/%3E%3Cpath fill='%23000' opacity='.75' d='M19 15.2c.4 2.6 1 3.2 3.6 3.6-2.6.4-3.2 1-3.6 3.6-.4-2.6-1-3.2-3.6-3.6 2.6-.4 3.2-1 3.6-3.6Z'/%3E%3C/svg%3E"); }

/* --- Header "Tutor" as a pill button (operator, 2026-09-07) -----------------------------------
   Matches .llb-tutor-cta above -- same gradient, radius and weight -- so the header's entry
   point and the "Study with Tutor" call to action on pathway cards read as the same control
   rather than two different purple things.

   Hooked on the href, not on a class, deliberately. This nav renders two ways: through
   llb_theme_primary_menu_fallback() when no menu is assigned, and through wp_nav_menu() when one
   is. A class added to the fallback's <li> would style the button in one of those and silently
   not the other, and which path is live depends on WordPress configuration rather than on this
   file. The href is the one thing both paths emit identically.

   The sparkle is a background-image rather than markup for the same reason: it needs no change
   to either renderer. */
.llb-site-nav__list a[href$="/tutor/"],
.llb-site-nav__list a[href$="/tutor"] {
  display: inline-flex; align-items: center; gap: .4rem;
  min-height: 2.1rem; padding: 0 .85rem;
  border-radius: var(--ll-radius-pill);
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 55%, #9333ea 100%);
  color: #fff; font-weight: 700;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(79, 70, 229, .35);
  white-space: nowrap;
}
.llb-site-nav__list a[href$="/tutor/"]::before,
.llb-site-nav__list a[href$="/tutor"]::before {
  content: ""; width: 1.05em; height: 1.05em; flex: 0 0 auto;
  background-color: currentColor;
  -webkit-mask: var(--llb-tutor-spark) center / contain no-repeat;
  mask: var(--llb-tutor-spark) center / contain no-repeat;
}
.llb-site-nav__list a[href$="/tutor/"]:hover,
.llb-site-nav__list a[href$="/tutor"]:hover,
.llb-site-nav__list a[href$="/tutor/"]:focus-visible,
.llb-site-nav__list a[href$="/tutor"]:focus-visible {
  background: linear-gradient(135deg, #4338ca 0%, #6d28d9 55%, #7e22ce 100%);
  color: #fff;
}
/* The active state must not repaint the pill. Elsewhere in this nav `current-menu-item` sets the
   accent colour on the link, which on a solid purple background would render brown-on-purple. */
.llb-site-nav__list .current-menu-item a[href$="/tutor/"],
.llb-site-nav__list .current-menu-item a[href$="/tutor"] {
  color: #fff;
  box-shadow: 0 1px 2px rgba(79, 70, 229, .35), 0 0 0 2px rgba(147, 51, 234, .35);
}

/* --- header nav: room for a fifth item ------------------------------------ */

/* Operator, 2026-09-10: about 10% smaller, to fit Home / Library / Workspace / Learning
 * / Tutor on one line. 16.2px -> 14.6px.
 *
 * The size lives here rather than in the minified block above, so the change is
 * attributable and reversible without editing a 900-column line. `.nav` sets the font
 * shorthand there, so only the size is overridden and the family, weight and line-height
 * continue to come from the one declaration.
 *
 * The gap is tightened with it: five items at the old 1.05rem spacing is wider than four
 * at the new type size, and shrinking only the text would have bought less room than it
 * looks. */
.nav { font-size: 14.6px; gap: .85rem; }
.nav__list { gap: .85rem; }

/* Below the breakpoint the inline nav is behind the toggle and the account dropdown
 * carries the same five items, so the size is not doing any fitting work there. */
@media (max-width: 920px) {
  .nav { font-size: 15.3px; }
}

/* A link that opens a new tab carries a small north-east arrow. Keyed on target=_blank so every
   surface that opens a tab -- citations, case sources, article body links, the Tutor -- is marked
   by the one rule. The arrow is a currentColor mask: it follows the link colour and is not
   underlined. The alt text after the slash gives a screen reader what the glyph says; links that
   already carry their own words or icon are excluded below. */
a[target="_blank"]::after{content:"";content:"" / "(opens in a new tab)";display:inline-block;width:.68em;height:.68em;margin-left:calc(.28em - 2px);position:relative;top:-3px;vertical-align:baseline;background:currentColor;opacity:.7;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M8 6h10v10'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M8 6h10v10'/%3E%3C/svg%3E") center/contain no-repeat}
a[target="_blank"]:hover::after,a[target="_blank"]:focus-visible::after{opacity:1}
a[target="_blank"]:has(.llb-case-newtab)::after{content:""}
a[target="_blank"]:has(.llb-plus-newtab-icon)::after{display:none}