/* XR Jags (Extended Reality Jaguars Research Group, Southern University): shared styles.
   Look: 14islands.com reference. Cool gray page, pure white panels, near-black text, muted gray first lines in
   two-tone headlines, uppercase UI labels, big media blocks with soft organic edges, lots of white space.
   Fonts: Supreme (display) and Switzer (UI and body), self-hosted, ITF Free Font License (assets/fonts/FFL.txt).
   Design tokens (:root) live inline in each page head (<style id="tokens">) so /tweak can read them.
   NOTE: these files are the XR Jags main site's styles (this repo was the CAAV site until Oct 2026). /immersion-in-motion/ has its own assets. */

@font-face{font-family:"Supreme";src:url("fonts/Supreme-Variable.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}
@font-face{font-family:"Switzer";src:url("fonts/Switzer-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:96px;background:var(--bg)}

body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--body-size)/1.55 var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%}
a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--blue-text,#1F5F8B);outline-offset:3px;border-radius:4px}
.inv :focus-visible,.launch :focus-visible{outline-color:var(--blue,#69B3E7)}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--ink);color:var(--panel);padding:12px 16px;border-radius:var(--r-btn);text-decoration:none}
.skip:focus{top:12px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 max(var(--gutter),env(safe-area-inset-right)) 0 max(var(--gutter),env(safe-area-inset-left))}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;margin:0;color:var(--ink)}
h1{font-size:var(--h1);line-height:1;letter-spacing:-.04em;text-wrap:balance;color:var(--muted)}
h2{font-size:var(--h2);line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
h3{font-size:1.5rem;line-height:1.15;letter-spacing:-.02em}
/* two-tone headline: first part muted gray, the marked part in ink */
h2.two{color:var(--muted)}
h1 .on,h2 .on{color:var(--ink)}
p{margin:0 0 1em}

/* small uppercase UI labels (Switzer) */
.kicker,.tag,.cap,.stats span,.sitemap,footer .small,.plist b small,.media figcaption,.mock h4,.tile small{font:400 .75rem/1.42 var(--font-body);text-transform:uppercase;letter-spacing:.06em}
.kicker{color:var(--ink-2);margin:0 0 20px;max-width:34ch}
.lede{font-size:1.25rem;line-height:1.5;color:var(--ink);max-width:40ch}

/* ---------- header ---------- */
header.bar{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);padding-top:env(safe-area-inset-top)}
header.bar .wrap{display:flex;align-items:center;gap:24px;min-height:76px}
header.bar .name{font:400 1.6rem/1 var(--font-display);letter-spacing:-.04em;color:var(--ink);text-decoration:none;white-space:nowrap;min-height:var(--tap);display:inline-flex;align-items:center}
header.bar nav{display:flex;gap:4px 22px;margin-left:auto;margin-right:auto;flex-wrap:wrap;justify-content:center}
header.bar nav a,header.bar .contact,.menu-btn{font:400 .875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink);text-decoration:none;min-height:var(--tap);display:inline-flex;align-items:center;white-space:nowrap;position:relative}
header.bar nav a::after,header.bar .contact::after{content:"";position:absolute;left:0;right:0;bottom:10px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
header.bar nav a:hover::after,header.bar nav a[aria-current="page"]::after,header.bar .contact:hover::after,header.bar .contact[aria-current="page"]::after{transform:scaleX(1)}
header.bar nav a[aria-current="page"]{color:var(--navy,#00263A)}
header.bar nav a:not([aria-current]){color:var(--ink-2)}
header.bar nav a:not([aria-current]):hover{color:var(--navy,#00263A)}
/* SU colors in the header: Columbia Blue underline on hover, gold-and-navy bar on the current page */
header.bar nav a::after,header.bar .contact::after{background:var(--blue,#69B3E7);height:2px}
header.bar nav a[aria-current="page"]::after,header.bar .contact[aria-current="page"]::after{background:var(--navy,#00263A);box-shadow:0 2px 0 var(--gold,#FFC72C)}
.menu-btn{display:none;background:none;border:0;padding:0 4px;cursor:pointer;gap:10px;margin-left:auto}
.menu-btn i{display:block;width:22px;height:1px;background:currentColor;box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor}
.menu-open .menu-btn i{box-shadow:none;width:14px}

/* full-screen menu (tablet and phone) */
.menu{position:fixed;inset:0;z-index:45;background:var(--bg);padding:calc(96px + env(safe-area-inset-top)) max(var(--gutter),env(safe-area-inset-right)) 120px max(var(--gutter),env(safe-area-inset-left));overflow:auto;display:none}
.menu-open .menu{display:block}
.menu ul{list-style:none;margin:0;padding:0}
.menu a{display:block;font:400 clamp(2.2rem,8vw,3.6rem)/1.08 var(--font-display);letter-spacing:-.04em;color:var(--muted);text-decoration:none;padding:4px 0}
.menu a:hover,.menu a[aria-current="page"]{color:var(--navy,#00263A)}
.menu a[aria-current="page"]{box-shadow:inset 4px 0 0 var(--gold,#FFC72C);padding-left:14px}

/* ---------- sections ---------- */
section{padding:var(--gap) 0}
/* text sits offset right: label in a narrow left column, content in the right two thirds */
section>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);column-gap:var(--col-gap);align-items:start}
section>.wrap>*{grid-column:2}
section>.wrap>.kicker{grid-column:1;padding-top:.9em}
section>.wrap>.wide,section>.wrap>.grid,section>.wrap>.stats,section>.wrap>.works,section>.wrap>.tiles,section>.wrap>.mocks,section>.wrap>.swatches,section>.wrap>.rules,section>.wrap>.media{grid-column:1/-1}
section>.wrap>h2{margin-bottom:40px}
section>.wrap>h3{margin:40px 0 16px}
section.panel{background:var(--panel)}
section.inv{background:var(--invert);color:var(--panel)}
section.inv h2,section.inv h3,section.inv .plist b{color:var(--panel)}
section.inv .plist span{color:rgba(255,255,255,.72)}
section.inv .kicker{color:var(--blue,#69B3E7)}
section.inv .plist li{border-color:rgba(255,255,255,.18)}
section.inv .btn.line{border-color:rgba(255,255,255,.5);color:var(--panel)}
section.inv .btn.line:hover{background:var(--panel);color:var(--ink)}
section.inv .note{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.86)}

/* page title block */
.pagehead{padding:calc(var(--gap) * .9) 0 calc(var(--gap) * .7)}
.pagehead>.wrap>h1{grid-column:1/-1;max-width:14ch;margin-bottom:48px}
.pagehead>.wrap>.kicker{grid-column:1/-1;padding-top:0}
.pagehead>.wrap>.lede{grid-column:2}

/* ---------- hero ---------- */
.hero{padding:calc(var(--gap) * .8) 0 var(--gap)}
.hero>.wrap>h1{grid-column:1/-1;max-width:13ch;margin-bottom:56px}
.hero>.wrap>.kicker{grid-column:1/-1;padding-top:0}
.hero .lede{margin-bottom:32px}
.hero .media{margin-top:72px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--tap);padding:0 22px;border-radius:var(--r-btn);font:500 .875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;text-decoration:none;border:1.5px solid var(--blue,#69B3E7);background:transparent;color:var(--navy,#00263A);cursor:pointer;transition:background .25s var(--ease),color .25s var(--ease)}
.btn::after{content:"";width:12px;height:12px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 10L10 2M4 2h6v6' fill='none' stroke='black' stroke-width='1.3'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 10L10 2M4 2h6v6' fill='none' stroke='black' stroke-width='1.3'/></svg>") center/contain no-repeat;transition:transform .3s var(--ease)}
.btn:hover{text-decoration:none}
.btn:hover::after{transform:translate(2px,-2px)}
.btn.solid{background:var(--navy,#00263A);border-color:var(--navy,#00263A);color:#fff}
.btn.solid:hover{background:#0E3958;border-color:#0E3958}
.btn.line:hover{background:var(--navy,#00263A);border-color:var(--navy,#00263A);color:#fff}
.actions{display:flex;gap:10px;flex-wrap:wrap}
p>.btn+.btn{margin-left:6px}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:var(--gap)}
.stats div{padding:24px 24px 0 0;border-top:2px solid var(--blue,#69B3E7)}
.stats div+div{padding-left:24px;border-left:1px solid var(--line)}
.stats b{display:block;font:300 clamp(2.4rem,4.6vw,4.2rem)/1 var(--font-display);letter-spacing:-.04em;font-variant-numeric:tabular-nums;white-space:nowrap}
.stats span{display:block;margin-top:14px;color:var(--ink-2);max-width:26ch}

/* ---------- organic media blocks ---------- */
.media{position:relative;overflow:hidden;margin:0;background:var(--panel);border-radius:var(--blob);aspect-ratio:16/8;isolation:isolate;transition:border-radius .9s var(--ease)}
.media:hover{border-radius:var(--blob-2)}
.media .art,.media .photo{position:absolute;inset:0;width:100%;height:100%;transition:transform .9s var(--ease)}
.media .photo{background:center/cover no-repeat;opacity:0;transition:opacity .6s,transform .9s var(--ease)}
.media.has-img .photo{opacity:1}
.media:hover .art,.media:hover .photo{transform:scale(1.035) rotate(-.4deg)}
.media .label{position:absolute;left:24px;bottom:20px;z-index:2;font:400 .75rem/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}
.media.has-img .label{display:none}
.media img.art{object-fit:cover;display:block}
.work>a.media{display:block}

/* work grid: two columns of large cards, caption below */
.works{display:grid;grid-template-columns:1fr 1fr;gap:56px 32px}
.work .media{aspect-ratio:4/3}
.work .cap{margin:22px 0 12px;color:var(--ink)}
.work .cap span{color:var(--ink-2)}
.work h3{font-size:clamp(1.7rem,3vw,2.5rem);letter-spacing:-.035em;line-height:1.05;margin-bottom:14px}
.work p{max-width:46ch}
.work:nth-child(2){margin-top:96px}

/* ---------- cards ---------- */
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.card{background:var(--panel);border-radius:var(--r);padding:32px}
section.panel .card{background:var(--bg)}
.card h3{margin-bottom:12px}
.card p:last-child{margin-bottom:0}
.card p{color:var(--ink-2)}
.card .btn{margin-top:8px}
.tag{display:block;color:var(--ink-2);margin-bottom:18px}
.card .num{display:block;font:300 .875rem/1 var(--font-body);color:var(--ink-2);margin-bottom:40px;letter-spacing:.06em}

/* list rows with hairlines */
.plist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.plist li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:8px 32px;padding:22px 0;border-bottom:1px solid var(--line)}
.plist b{font:400 1.25rem/1.25 var(--font-display);letter-spacing:-.02em;color:var(--ink)}
.plist span{color:var(--ink-2)}
ol.plist{counter-reset:p}
ol.plist li{grid-template-columns:56px minmax(0,1fr);counter-increment:p;color:var(--ink)}
ol.plist li::before{content:counter(p,decimal-leading-zero);font:400 .75rem/2 var(--font-body);letter-spacing:.06em;color:var(--ink-2)}
ul.tight{margin:0;padding-left:1.1em}
ul.tight li{margin:.45em 0}

.note{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;margin:28px 0;color:var(--ink)}
section.panel .note{background:var(--bg)}
.note b{font-weight:600}
.more{margin-top:32px}

/* ---------- footer ---------- */
footer{background:var(--panel);padding:calc(var(--gap) * 1.2) 0 calc(48px + env(safe-area-inset-bottom))}
footer .big{font:400 var(--h1)/1 var(--font-display);letter-spacing:-.04em;color:var(--muted);max-width:14ch;margin:0 0 56px;text-wrap:balance}
footer .big .on{color:var(--ink)}
footer .big a{text-decoration:none}
footer .cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);column-gap:var(--col-gap);border-top:1px solid var(--line);padding-top:28px}
footer .small{color:var(--ink-2);max-width:60ch;margin:0 0 20px}
footer .small a{color:var(--ink)}
.sitemap{display:flex;flex-wrap:wrap;gap:0 22px;margin:0;padding:0;list-style:none}
.sitemap a{color:var(--ink);text-decoration:none;min-height:var(--tap);display:inline-flex;align-items:center}
.sitemap a:hover{text-decoration:underline}

/* ---------- site family (CAAV, Immersion in Motion, AM Lab). Addresses live in FAMILY in site.js ---------- */
.family-top{display:flex;justify-content:flex-end;gap:0 20px;max-width:var(--maxw);margin:0 auto;padding:0 max(var(--gutter),env(safe-area-inset-right)) 0 max(var(--gutter),env(safe-area-inset-left));border-bottom:1px solid var(--line)}
.family-top a,.family a{font:400 .6875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);text-decoration:none;min-height:32px;display:inline-flex;align-items:center;gap:8px}
.family-top a:hover,.family a:hover{color:var(--ink)}
.family-top a[aria-current],.family a[aria-current]{color:var(--ink)}
.family-top a[aria-current]::before,.family a[aria-current]::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.family a[target]::after,.family-top a[target]::after{content:"\2197";font-size:.9em}
.family{display:flex;flex-wrap:wrap;align-items:center;gap:0 24px;margin-top:40px;padding-top:16px;border-top:1px solid var(--line)}
.family a{min-height:var(--tap)}
.family-label{font:400 .6875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.08em;color:rgba(0,38,58,.72);margin-right:8px}
section>.wrap>.media.wide,.hero .media{margin-top:72px}
section>.wrap>.actions{margin-top:8px}
.actions.more{margin-top:32px}
.work .media{color:inherit}
@media (max-width:900px){.family-top{display:none}}

/* ---------- bottom tab bar (Apple HIG, phones) ---------- */
.tabbar{display:none}

/* ---------- motion: only hidden when JS has said it will animate ---------- */
.js.motion [data-rise]{opacity:0;transform:translateY(calc(28px * var(--motion-scale)))}
@media (prefers-reduced-motion:reduce){
  .js.motion [data-rise]{opacity:1;transform:none}
  .media,.media .art,.media .photo,.btn,.btn::after,header.bar nav a::after{transition:none}
  .media:hover{border-radius:var(--blob)}
  .media:hover .art,.media:hover .photo{transform:none}
}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  header.bar nav,header.bar .contact{display:none}
  .menu-btn{display:inline-flex}
}
@media (max-width:900px){
  section>.wrap,footer .cols{grid-template-columns:1fr}
  section>.wrap>*,section>.wrap>.kicker,.pagehead>.wrap>.lede{grid-column:1}
  section>.wrap>.kicker{padding-top:0}
  .g3{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr}
  .stats div:nth-child(3){padding-left:0;border-left:0}
  .stats div:nth-child(n+3){margin-top:28px}
  .works{grid-template-columns:1fr;gap:56px}
  .work:nth-child(2){margin-top:0}
  .media{aspect-ratio:4/3}
}
@media (max-width:640px){
  :root{--gap:72px;--gutter:16px}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  header.bar .wrap{min-height:64px}
  .g2,.g3{grid-template-columns:1fr}
  .card{padding:24px}
  .plist li,ol.plist li{grid-template-columns:1fr}
  ol.plist li::before{line-height:1}
  .hero>.wrap>h1,.pagehead>.wrap>h1{margin-bottom:32px}
  .hero .media{margin-top:48px}
  .stats b{font-size:clamp(2rem,10vw,2.8rem)}
  .stats div+div{padding-left:16px}
  .stats div{padding-right:12px}
  p>.btn+.btn{margin-left:0;margin-top:8px}
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:color-mix(in srgb,var(--panel) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:56px;color:var(--ink-2);text-decoration:none;font:500 .6875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em}
  .tabbar a:hover,.tabbar a[aria-current="true"]{color:var(--navy,#00263A)}
  .tabbar a[aria-current="true"]{box-shadow:inset 0 3px 0 var(--gold,#FFC72C)}
  .tabbar svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
}
@media print{header.bar,.tabbar,.menu,#tweak-panel{display:none!important}body{background:#fff}}

/* soft organic edge: an SVG mask with a displaced, slightly blurred outline (falls back to the plain radius) */
@supports ((-webkit-mask-image:url(x.svg)) or (mask-image:url(x.svg))){
  .media{-webkit-mask:url("img/edge-mask.svg") center/100% 100% no-repeat;mask:url("img/edge-mask.svg") center/100% 100% no-repeat;border-radius:0}
  .media:hover{border-radius:0}
}

/* ---------- motion layer (14islands-style). Applied only when site.js has turned motion on ---------- */
/* organic edge: JS draws a living clip-path, so the static SVG mask steps aside */
.media.blobby{-webkit-mask:none;mask:none;border-radius:0;will-change:clip-path}
/* image settles from 1.15 to 1 on entry (--s), and breathes a touch larger on hover (--h) */
.motion .media .art,.motion .media .photo{transform:scale(calc(var(--s,1) * var(--h,1)));transition:opacity .6s;will-change:transform}
.motion .media:hover .art,.motion .media:hover .photo{transform:scale(calc(var(--s,1) * var(--h,1)))}
/* masked lines for headline reveals */
.ln{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.ln-in{display:inline-block;will-change:transform}
.ln .w.on{color:var(--ink)}
.media.blobby .label{left:44px;bottom:30px}
@keyframes capIn{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
/* work cards: slight lift, category slides in */
@media (hover:hover) and (pointer:fine){
  .motion .work .media{transition:transform .7s var(--ease)}
  .motion .work:hover .media{transform:translateY(-8px)}
  .motion .work .cap span{display:inline-block;transition:color .6s var(--ease)}
  .motion .work:hover .cap span{color:var(--ink);animation:capIn .7s var(--ease) both}
}
@media (prefers-reduced-motion:reduce){
  .media.blobby{clip-path:none!important}
  .motion .work:hover .media,.motion .work .cap span{transform:none}
}
/* ===== Family color (Oct 14; recolored Oct 24 for the Southern University rebrand, client rule "No orange, it must be SU
   yellow"): the shared top-section field was the AM Lab red-orange. It is now a Southern University GOLD field
   (#FFD45C -> #FFC72C -> #E0A91F) with NAVY #00263A text on it (never white on gold). It lives ONLY in the top section
   of every site in the family. Do not use it elsewhere on the page. ===== */
:root{--family-heat:#69B3E7;--family-heat-2:#69B3E7;--family-heat-deep:#69B3E7} /* Oct 26: top section is now solid SU Columbia Blue (owner) */
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:#69B3E7;pointer-events:none}
/* hero on the gold field: navy text; the muted first line is translucent navy (large text only) */
.hero{color:#00263A}
.hero h1{color:rgba(0,38,58,.72)} /* muted navy on Columbia Blue (large text) */.hero h1 .on,.hero .ln .w.on{color:#00263A}
.hero .kicker,.hero .lede,.hero .stats span{color:#00263A}
.hero .stats b{color:#00263A}
.hero .stats div{border-top-color:#00263A}
.hero .stats div+div{border-left-color:rgba(0,38,58,.25)}
.hero .btn.line{border-color:#00263A;color:#00263A}
.hero .btn.line:hover{background:#00263A;color:#FFC72C}
.hero .btn.solid{background:#00263A;color:#fff;border-color:#00263A}
.hero :focus-visible{outline-color:#00263A}

/* ---------- orbit (21tsi circles, ported from AM Lab; injected by orbit.js) ----------
   Fixed full-viewport overlay, no pointer events. z-index sits above section backgrounds
   and below the sticky header, tab bar, menus, modals and lightboxes. */
.orbit{position:fixed;left:0;top:0;width:100%;height:100vh;height:100svh;z-index:3;pointer-events:none;overflow:visible}
.orbit circle{fill:none;stroke:rgba(0,38,58,.2);stroke-width:1;vector-effect:non-scaling-stroke}
.orbit .ticks path{fill:none;stroke:#070707;stroke-opacity:.45;stroke-width:1.2;vector-effect:non-scaling-stroke}
.orbit .nums text{fill:#00263A;fill-opacity:.45;font:400 15px "Switzer",system-ui,sans-serif;letter-spacing:.02em}
.orbit .oc{opacity:0}
.orbit.still{opacity:.35}
.orbit.still .nums{display:none}
@media (max-width:760px){.orbit .nums text{font-size:22px}}
@media print{.orbit{display:none}}
.media[data-truck] .label{color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.65)}

/* ---------- family: truck blue accent + shared top menu (same on all four sites) ---------- */
:root{--truck:#69B3E7} /* Columbia Blue PMS 292 (decorative lines and dots, not text) */
.fn-prog{position:absolute;left:clamp(16px,4vw,48px);right:clamp(16px,4vw,48px);top:6px;height:1px;background:rgba(0,38,58,.14);pointer-events:none;z-index:2}
.fn-prog i{position:absolute;left:0;right:0;top:-.5px;height:2px;background:var(--truck);transform-origin:left;transform:scaleX(0)}
.fnav-on [data-fnav] a{text-transform:uppercase;letter-spacing:.07em;font-size:13px;color:rgba(0,38,58,.72);position:relative;transition:color .25s ease;background:none}
.fnav-on [data-fnav] a:hover,.fnav-on [data-fnav] a.fn-on{color:#00263A}
.fnav-on [data-fnav] a.fn-on:before{content:"";position:absolute;left:-11px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--truck)}
.orbit .ticks path{stroke:var(--truck)!important;stroke-opacity:.95!important}
/* top section: scroll-driven "Educating tomorrow's workforce" frames */
.scrub-cv{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:3;opacity:0;transition:opacity .4s}
.scrub-ready .scrub-cv{opacity:1}
/* image morphs (21tsi style) */
.mo-wrap{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.mo-a,.mo-b{position:absolute;inset:-20px;background:center/cover no-repeat}
.mo-b{inset:0;clip-path:inset(0 0 0 100%)}
.mo-a{will-change:filter}
.mo-line{position:absolute;top:0;bottom:0;width:1px;background:rgba(255,255,255,.85);box-shadow:0 0 0 .5px var(--truck);opacity:0}

/* ---------- family: scene backgrounds (moving, see-through film images, truck-blue tint) ---------- */
.sbg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%)}
.sbg-in{position:absolute;left:0;right:0;top:-10%;bottom:-10%;will-change:transform}
.sbg-dark .sbg-in{opacity:.24}
.sbg-light .sbg-in{opacity:.15}
.sbg i,.sbg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:center/cover no-repeat;display:block;opacity:0;transition:opacity 1.4s ease;filter:grayscale(1) sepia(1) hue-rotate(178deg) saturate(2.6) contrast(1.05)}
.sbg .on{opacity:1}
.sbg .kb{animation:sbgkb0 26s ease-in-out infinite alternate}
.sbg .kb1{animation-name:sbgkb1}
.sbg .kb2{animation-name:sbgkb2}
@keyframes sbgkb0{from{transform:scale(1.06) translate3d(-2%,1%,0)}to{transform:scale(1.2) translate3d(2%,-2%,0)}}
@keyframes sbgkb1{from{transform:scale(1.18) translate3d(2%,-1%,0)}to{transform:scale(1.05) translate3d(-2%,2%,0)}}
@keyframes sbgkb2{from{transform:scale(1.08) translate3d(0,2%,0)}to{transform:scale(1.16) translate3d(-1%,-2%,0)}}
@media (prefers-reduced-motion:reduce){.sbg .kb{animation:none}.sbg i,.sbg video{transition:none}}
@media print{.sbg{display:none}}

/* Southern University logo beside the site name, on every page */
.su-lock{display:inline-flex;align-items:center;flex:none;margin-left:12px;padding-left:12px;border-left:1px solid currentColor;border-color:rgba(127,127,127,.35);line-height:0}
.su-lock img{height:30px;width:auto;display:block}
@media (max-width:760px){.su-lock{margin-left:8px;padding-left:8px}.su-lock img{height:24px}}

/* ---------- mobile polish (phones and tablets only; desktop untouched) ----------
   Solid header and tab bar so scrolling text never shows through them, quieter orbit lines
   on small screens so they read as background, and long words wrap instead of clipping. */
@media (max-width:900px){
  header.bar{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 1px 0 var(--line)}
  h1,h2,h3,h4,p,li,.lede,.kicker,footer .big{overflow-wrap:break-word}
}
@media (max-width:640px){
  .tabbar{background:var(--panel);-webkit-backdrop-filter:none;backdrop-filter:none}
  .orbit circle{stroke:rgba(0,38,58,.12)}
  .orbit .ticks path{stroke-opacity:.55!important}
  .orbit .nums text{fill-opacity:.3}
}

/* Header call to action (was the orange "Deep dive"): Southern University gold, navy text, every header, every size */
header.bar .dd-cta{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 16px;margin-left:16px;border-radius:var(--r-btn);background:var(--gold);color:var(--navy);text-decoration:none;font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
header.bar .dd-cta:hover{background:var(--gold-2);color:var(--navy)}
@media (max-width:1180px){header.bar .dd-cta{margin-left:auto}header.bar .menu-btn{margin-left:12px}}
@media (max-width:600px){header.bar .dd-cta{padding:0 10px;font-size:.75rem}header.bar .menu-btn{margin-left:8px}}
@media (max-width:420px){header.bar .su-lock{display:none}}


/* =====================================================================================================
   XR Jags additions (Oct 2026). Southern University colors (COLORS.md):
   gold #FFC72C (navy text on gold, never white; gold TEXT on white uses #8A6A00), Columbia Blue #69B3E7 / #1F5F8B (text-safe on white), navy #00263A.
   Fallbacks below; each page's <style id="tokens"> sets the same values so /tweak can edit them.
   ===================================================================================================== */
:root{--gold:#FFC72C;--gold-2:#FFD45C;--gold-deep:#E0A91F;--gold-text:#8A6A00;--blue:#69B3E7;--blue-deep:#3A9ADF;--blue-text:#1F5F8B;--navy:#00263A}

/* typographic wordmark (no XR Jags logo file exists yet) */
header.bar .name.wm{gap:8px;font-weight:500}
header.bar .name.wm b{font-weight:500;color:var(--navy)}
header.bar .name.wm i{font-style:normal;display:inline-block;width:8px;height:8px;background:var(--gold);border-radius:2px;transform:translateY(-.5em)}
@media (max-width:420px){header.bar .name.wm{font-size:1.35rem}}

/* gold primary button (navy text on gold) */
.btn.gold{background:var(--gold);border-color:var(--gold-deep);color:var(--navy)}
.btn.gold:hover{background:var(--gold-2)}
a{text-decoration-color:var(--blue-text)}
.kicker.blue,.tag.blue{color:var(--blue-text)}
.pill-free{border-radius:var(--r-btn)}

/* way-back link (site.js adds it when the address has ?from=/path) */
.wayback{max-width:var(--maxw);margin:12px auto 0;padding:0 max(var(--gutter),env(safe-area-inset-right)) 0 max(var(--gutter),env(safe-area-inset-left))}
.wayback a{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--blue-text);text-decoration:none}
.wayback a::before{content:"";width:10px;height:10px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.wayback a:hover{text-decoration:underline}

/* "?" help (site.js turns [data-help] into a button + short text). Without JS nothing is added. */
.help-q{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin:6px 0 6px 10px;padding:0;border:1px solid var(--blue-text);border-radius:var(--r-btn);background:var(--panel);color:var(--blue-text);font:600 .9375rem/1 var(--font-body);cursor:pointer;vertical-align:middle;position:relative}
.help-q::before{content:"";position:absolute;inset:-6px}
.help-q[aria-expanded="true"]{background:var(--blue-text);color:#fff}
.help-q:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.help-t{grid-column:1/-1;margin:0 0 24px;padding:14px 18px;border-left:3px solid var(--gold);background:var(--panel);border-radius:0 var(--r-btn) var(--r-btn) 0;color:var(--ink);max-width:70ch;font-size:.9375rem}
section.panel .help-t,.card .help-t{background:var(--bg)}
.help-t[hidden]{display:none}
.help-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.hero .help-q{background:transparent;border-color:#00263A;color:#00263A}
.hero .help-t{background:rgba(255,255,255,.55);color:#00263A;border-left-color:#00263A}

/* forms */
.su-form{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;background:var(--panel);border-radius:var(--r);padding:32px}
section.panel .su-form{background:var(--bg)}
.su-form .f{display:flex;flex-direction:column;gap:8px;min-width:0}
.su-form .f.full,.su-form .full{grid-column:1/-1}
.su-form label,.su-form legend{font:500 .8125rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.su-form .req{color:var(--blue-text)}
.su-form input,.su-form select,.su-form textarea{width:100%;min-height:var(--tap);padding:10px 14px;border:1px solid #9A9A9A;border-radius:var(--r-btn);background:#fff;color:var(--ink);font:400 1rem/1.4 var(--font-body)}
.su-form textarea{min-height:120px;resize:vertical}
.su-form input:focus-visible,.su-form select:focus-visible,.su-form textarea:focus-visible{outline:2px solid var(--blue-text);outline-offset:1px;border-color:var(--blue-text)}
.su-form .hint{font-size:.8125rem;color:var(--ink-2);margin:0}
.su-form .actions{grid-column:1/-1;align-items:center}
.su-form .btn{min-width:180px}
.su-form .btn[disabled]{opacity:.6;cursor:progress}
.hp{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
@media (max-width:640px){.su-form{grid-template-columns:1fr;padding:22px}}

/* lead-capture status messages (su-leads.js), SU colors */
.su-status{grid-column:1/-1;margin:4px 0 0;padding:12px 16px;border-radius:var(--r-btn);font:500 .9375rem/1.45 var(--font-body);border:1px solid transparent}
.su-status:empty{display:none}
.su-status--ok{background:#E9F4FB;border-color:var(--blue-text);color:var(--navy)}
.su-status--warn{background:#FFF6DA;border-color:var(--gold-deep);color:var(--navy)}
.su-status--err{background:#FDECEC;border-color:#B3261E;color:#7A1712}
.su-status--busy{background:#EEF2F5;border-color:#9AA7B1;color:var(--navy)}

/* designed slots for content that is still coming */
.slot{display:flex;flex-direction:column;justify-content:center;gap:6px;min-height:160px;padding:24px;border:1.5px dashed #9AA7B1;border-radius:var(--r);background:repeating-linear-gradient(135deg,rgba(105,179,231,.08) 0 12px,transparent 12px 24px);color:var(--ink-2)}
.slot b{font:400 1.15rem/1.2 var(--font-display);color:var(--navy);letter-spacing:-.01em}
.slot small{font:400 .75rem/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--blue-text)}

/* project sections */
.proj-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;padding:0;list-style:none}
.proj-meta li{font:500 .6875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.06em;padding:8px 10px;border-radius:6px;background:#E9F4FB;color:var(--navy)}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cols2 .card ul{margin:0;padding-left:1.1em;color:var(--ink-2)}
.cols2 .card li{margin:.45em 0}
@media (max-width:900px){.cols2{grid-template-columns:1fr}}

/* launch block */
.launch{background:var(--navy);color:#fff;border-radius:var(--r);padding:32px;position:relative;overflow:hidden}
.launch::before{content:"";position:absolute;left:0;top:0;right:0;height:6px;background:linear-gradient(90deg,var(--gold) 0 50%,var(--blue) 50% 100%)}
.launch h3{color:#fff;font-size:clamp(1.6rem,3vw,2.4rem);margin:8px 0 12px}
.launch p{color:rgba(255,255,255,.88)}
.launch .tag{color:var(--gold)}
.launch .btn.line{border-color:rgba(255,255,255,.7);color:#fff}
.launch .btn.line:hover{background:#fff;color:var(--navy)}
.launch :focus-visible{outline-color:var(--gold)}

/* team cards + hover preview */
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.person{background:var(--panel);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:10px;scroll-margin-top:110px;transition:box-shadow .3s var(--ease)}
section.panel .person{background:var(--bg)}
.person:target,.person.is-open{box-shadow:0 0 0 2px var(--blue-text)}
.person .ph{aspect-ratio:1/1;border-radius:16px;overflow:hidden;background:#E6EBEF;margin:0}
.person .ph img{width:100%;height:100%;object-fit:cover;display:block}
.person .ph.slot{min-height:0;aspect-ratio:1/1;border-radius:16px;padding:16px}
.person h3{font-size:1.25rem}
.person h3 a{text-decoration:none}
.person h3 a:hover,.person h3 a:focus-visible{text-decoration:underline}
.person .role{margin:0;color:var(--ink-2);font-size:.9375rem}
.person .li{font:500 .75rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;min-height:var(--tap);display:inline-flex;align-items:center;color:var(--blue-text)}
.person .li.none{color:var(--ink-2);text-transform:none;letter-spacing:0;font-weight:400;font-size:.8125rem}
.person details{border-top:1px solid var(--line);padding-top:6px}
.person summary{cursor:pointer;min-height:var(--tap);display:flex;align-items:center;font:500 .75rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.person details p{font-size:.9375rem;color:var(--ink-2)}
.pv-card{position:fixed;z-index:120;width:220px;background:var(--panel);border-radius:14px;box-shadow:0 18px 48px rgba(0,38,58,.22),0 0 0 1px rgba(0,38,58,.08);padding:10px;pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease}
.pv-card.on{opacity:1;transform:none}
.pv-card img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;display:block;background:#E6EBEF}
.pv-card b{display:block;margin:10px 4px 2px;font:400 1.05rem/1.2 var(--font-display);color:var(--ink)}
.pv-card span{display:block;margin:0 4px 4px;font-size:.8125rem;color:var(--ink-2);line-height:1.35}
@media (prefers-reduced-motion:reduce){.pv-card{transition:none}}
a.pv{text-decoration-color:var(--blue-text)}

/* plain fact list */
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.facts div{border-top:2px solid var(--blue,#69B3E7);padding-top:14px}
.facts b{display:block;font:300 clamp(1.8rem,3.4vw,2.8rem)/1 var(--font-display);letter-spacing:-.03em}
.facts span{display:block;margin-top:10px;color:var(--ink-2);font-size:.9375rem}

/* funding acknowledgments (renders only entries with text, see assets/funding.js) */
.funding:empty{display:none}
.funding{display:grid;gap:12px}
.funding p{margin:0;padding:16px 20px;border-left:3px solid var(--blue-text);background:var(--panel);border-radius:0 var(--r-btn) var(--r-btn) 0}
.funding p b{display:block;font:500 .75rem/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--blue-text);margin-bottom:4px}

/* staff dashboard */
.dash-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:0 0 16px}
.dash-tools .f{display:flex;flex-direction:column;gap:6px}
.dash-tools label{font:500 .75rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em}
.dash-tools select{min-height:var(--tap);padding:0 12px;border:1px solid #9A9A9A;border-radius:var(--r-btn);background:#fff;font:400 .9375rem var(--font-body)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r);background:var(--panel);max-width:100%}
section.panel .tbl-wrap{background:var(--bg)}
table.dash{width:100%;border-collapse:collapse;font-size:.875rem;min-width:760px}
table.dash th,table.dash td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line)}
table.dash th{font:500 .6875rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);background:rgba(0,38,58,.04)}
table.dash td select{min-height:36px;border:1px solid #9A9A9A;border-radius:8px;background:#fff;padding:0 8px;font:inherit}
table.dash .det{color:var(--ink-2);font-size:.8125rem;max-width:34ch;white-space:pre-wrap;word-break:break-word}
.dash-empty{padding:24px;color:var(--ink-2)}
.pw-wrap{display:flex;gap:8px}
.pw-wrap input{flex:1;min-width:0}
.pw-toggle{flex:none;min-height:var(--tap);padding:0 14px;border:1px solid var(--blue-text);border-radius:var(--r-btn);background:#fff;color:var(--blue-text);font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;cursor:pointer}
.pw-toggle[aria-pressed="true"]{background:var(--blue-text);color:#fff}
.signed{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:24px}
[hidden]{display:none!important}
footer .staff-link{font-size:.75rem;color:var(--ink-2)}
footer .staff-link a{color:var(--ink-2)}
/* XR Jags nav has 7 items: keep it on one line at desktop widths */
@media (min-width:1181px){header.bar .wrap{gap:16px}header.bar nav{gap:4px 18px;flex-wrap:nowrap}.fnav-on [data-fnav] a{font-size:12px;letter-spacing:.06em}header.bar .dd-cta{margin-left:4px;padding:0 12px}header.bar .su-lock{margin-left:8px;padding-left:8px}}
@media (min-width:1181px) and (max-width:1320px){header.bar .su-lock{display:none}}
/* initials avatar for people without a photo: navy circle, gold initials */
.person .ph.initials{display:grid;place-items:center;background:var(--bg)}
section.panel .person .ph.initials{background:var(--panel)}
.person .ph.initials span{display:grid;place-items:center;width:62%;aspect-ratio:1/1;border-radius:50%;background:var(--navy);color:var(--gold);font:500 clamp(2.2rem,5vw,3.4rem)/1 var(--font-display);letter-spacing:.02em}

/* =====================================================================================================
   Oct 24 (Oct 23 meeting asks): header buttons, Sectors menu, still panels behind text, sector pages, uploads
   ===================================================================================================== */
/* header: direct buttons. "Book a Tour" is gold with navy text; "Become a Sponsor" is a navy outline */
header.bar .hbtn{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 14px;border-radius:var(--r-btn);text-decoration:none;font:500 .75rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;flex:none}
header.bar .hbtn-gold{background:var(--gold);color:var(--navy);border:1px solid var(--gold-deep)}
header.bar .hbtn-gold:hover{background:var(--gold-2)}
header.bar .hbtn-line{border:1px solid var(--navy);color:var(--navy);background:transparent}
header.bar .hbtn-line:hover{background:var(--navy);color:#fff}
header.bar .hbtn+.hbtn{margin-left:8px}
header.bar .hbtn:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
@media (min-width:1181px){header.bar nav{margin-left:auto;margin-right:18px}header.bar .hb-opt{display:none}}
@media (min-width:1440px){header.bar .hb-opt{display:inline}}
@media (max-width:1180px){header.bar .hbtn-line{margin-left:auto}header.bar .menu-btn{margin-left:12px}}
/* Oct 26: on tablet widths the long button pushed the Menu button off screen; drop the "/ Book a demo" half below 960px */
@media (max-width:960px){header.bar .hb-opt{display:none}}
@media (max-width:640px){header.bar .hbtn-line{display:none}header.bar .hbtn-gold{margin-left:auto;padding:0 12px}header.bar .hb-opt{display:none}}
@media (max-width:360px){header.bar .hbtn-gold{padding:0 8px;font-size:.6875rem}}

/* Sectors dropdown (desktop). The link goes to /sectors; the small button opens the list. Without JS the
   list also opens on hover and keyboard focus. */
header.bar .dd{position:relative;display:inline-flex;align-items:center}
header.bar .dd-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:var(--tap);margin-left:2px;padding:0;border:0;background:none;color:var(--ink-2);cursor:pointer;border-radius:6px}
header.bar .dd-btn svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .2s var(--ease)}
header.bar .dd-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
header.bar .dd-btn:focus-visible{outline:2px solid var(--navy);outline-offset:0}
header.bar .dd-list{position:absolute;top:100%;left:-16px;z-index:70;min-width:290px;margin:0;padding:8px;list-style:none;background:var(--panel);border-radius:14px;box-shadow:0 18px 48px rgba(0,38,58,.18),0 0 0 1px rgba(0,38,58,.08);display:none}
html:not(.js) header.bar .dd:hover .dd-list,html:not(.js) header.bar .dd:focus-within .dd-list,header.bar .dd.open .dd-list{display:block}
header.bar .dd-list a{display:flex;min-height:var(--tap);padding:0 12px;border-radius:8px;text-transform:none;letter-spacing:0;font-size:.9375rem;color:var(--ink)}
header.bar .dd-list a::after{display:none}
header.bar .dd-list a:hover,header.bar .dd-list a:focus-visible,header.bar .dd-list a[aria-current]{background:#FFF6DA;color:var(--navy)}
.fnav-on [data-fnav] .dd-list a{color:var(--ink);font-size:.9375rem;letter-spacing:0;text-transform:none}
.fnav-on [data-fnav] .dd-list a.fn-on:before{display:none}
/* full-screen menu: sector pages listed under Sectors */
.menu .menu-sub{list-style:none;margin:4px 0 12px;padding:0 0 0 16px;border-left:3px solid var(--gold)}
.menu .menu-sub a{font:400 1.15rem/1.3 var(--font-body);letter-spacing:0;padding:10px 0;min-height:var(--tap);color:var(--ink-2)}

/* page-title band: solid SU Columbia Blue (PMS 292, #69B3E7) with SU Navy words, per Sonny 2026-10-26.
   The blurred photo is switched off so the band reads as true SU blue. Navy on #69B3E7 is about 6.9:1. */
.pagehead.still{position:relative;isolation:isolate;overflow:hidden;background:var(--blue);color:var(--navy)}
.pagehead.still::before,.pagehead.still::after{content:none}
.pagehead.still h1{color:rgba(0,38,58,.72)}
.pagehead.still h1 .on,.pagehead.still .ln .w.on{color:var(--navy)}
.pagehead.still .kicker{color:var(--navy)}
.pagehead.still .lede{color:var(--navy)}
.pagehead.still a{color:var(--navy)}
.pagehead.still .help-q{background:transparent;border-color:var(--navy);color:var(--navy)}
.pagehead.still .help-q[aria-expanded="true"]{background:var(--navy);color:#fff}
.pagehead.still .help-t{background:rgba(255,255,255,.55);color:var(--navy)}
.pagehead.still :focus-visible{outline-color:var(--navy)}
.pagehead.still .btn.line{border-color:var(--navy);color:var(--navy)}
.pagehead.still .btn.line:hover{background:var(--navy);color:#fff}
@media print{.pagehead.still{background:#fff;color:var(--ink)}.pagehead.still::before,.pagehead.still::after{display:none}.pagehead.still h1,.pagehead.still h1 .on,.pagehead.still .lede{color:var(--navy)!important}}

/* sector pages */
.benefits{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.benefits li{background:var(--panel);border-radius:var(--r);padding:24px;border-top:4px solid var(--gold)}
section.panel .benefits li{background:var(--bg)}
.benefits b{display:block;font:400 1.25rem/1.2 var(--font-display);letter-spacing:-.02em;color:var(--ink);margin-bottom:8px}
.benefits span{color:var(--ink-2)}
.dive{background:var(--panel);border-radius:var(--r);margin:0 0 12px;border:1px solid var(--line)}
section.panel .dive{background:var(--bg)}
.dive>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:16px 24px;font:400 1.25rem/1.25 var(--font-display);letter-spacing:-.02em;color:var(--ink);border-radius:var(--r)}
.dive>summary::-webkit-details-marker{display:none}
.dive>summary::after{content:"";flex:none;width:28px;height:28px;border-radius:8px;background:var(--gold) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M6 2v8M2 6h8' stroke='%2300263A' stroke-width='1.6' fill='none'/></svg>") center/12px no-repeat}
.dive[open]>summary::after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 6h8' stroke='%2300263A' stroke-width='1.6' fill='none'/></svg>")}
.dive>summary:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.dive>summary small{display:block;font:500 .6875rem/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--gold-text);margin-bottom:4px}
.dive .dive-in{padding:0 24px 24px;max-width:78ch}
.dive .dive-in h4{font:500 .8125rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--navy);margin:20px 0 8px}
.dive .dive-in ul{margin:0;padding-left:1.1em;color:var(--ink-2)}
.dive .dive-in li{margin:.45em 0}
.dive .dive-in p{color:var(--ink-2)}
.dive .dive-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.src{font-size:.8125rem;color:var(--ink-2)}
.sector-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.sector-cards .card h3 a{text-decoration:none}
.sector-cards .card h3 a:hover{text-decoration:underline}
.sector-cards .card .tag{color:var(--gold-text)}

/* staff uploads */
.up-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.up-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;padding:14px 16px;background:var(--panel);border-radius:var(--r-btn);align-items:center}
section.panel .up-list li{background:var(--bg)}
.up-list b{font-weight:500;overflow-wrap:anywhere}
.up-list small{display:block;color:var(--ink-2);font-size:.8125rem;overflow-wrap:anywhere}
.up-kind{font:500 .6875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.06em;padding:6px 8px;border-radius:6px;background:#FFF6DA;color:var(--navy)}
.su-form input[type=file]{padding:10px;background:#fff}

/* =====================================================================================================
   Staff dashboard: team tasks + member management (assets/tasks.js). SU colors only: navy, gold (navy text),
   Columbia blue. Overdue dates use red text. Every control is at least 44px tall.
   ===================================================================================================== */
.tk-signed-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tk-bell-wrap{position:relative}
.tk-bell{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);padding:0 14px;border:1px solid var(--navy);border-radius:var(--r-btn);background:#fff;color:var(--navy);font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;cursor:pointer}
.tk-bell svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.tk-bell[aria-expanded="true"]{background:var(--navy);color:#fff}
.tk-badge{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--gold);color:var(--navy);font:600 .75rem/22px var(--font-body);text-align:center;letter-spacing:0}
.tk-bell-pop{position:absolute;right:0;top:calc(100% + 8px);z-index:90;width:min(360px,calc(100vw - 32px));max-height:min(70vh,520px);overflow:auto;background:var(--panel);border-radius:14px;box-shadow:0 18px 48px rgba(0,38,58,.22),0 0 0 1px rgba(0,38,58,.1);padding:8px}
.tk-bell-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 8px 8px;border-bottom:1px solid var(--line)}
.tk-bell-pop ul{list-style:none;margin:0;padding:4px 0 0}
.tk-note{display:block;width:100%;text-align:left;min-height:var(--tap);padding:10px;border:0;border-radius:8px;background:none;color:var(--ink);font:400 .9375rem/1.4 var(--font-body);cursor:pointer}
.tk-note:hover,.tk-note:focus-visible{background:#E9F4FB}
.tk-note.is-new span{font-weight:600;color:var(--navy)}
.tk-note.is-new{box-shadow:inset 3px 0 0 var(--gold)}
.tk-note small{display:block;margin-top:2px;color:var(--ink-2);font-size:.8125rem}
.tk-link{min-height:var(--tap);padding:0 8px;border:0;background:none;color:var(--blue-text);font:500 .8125rem/1 var(--font-body);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}

/* section tabs: underline style, wraps on phones (no sideways scroll) */
.tk-tabs{display:flex;flex-wrap:wrap;gap:4px 18px;border-bottom:1px solid var(--line)}
.tk-tabs a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 2px;font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2);text-decoration:none;border-bottom:3px solid transparent;margin-bottom:-1px}
.tk-tabs a:hover{color:var(--ink)}
.tk-tabs a[aria-current="page"]{color:var(--navy);border-bottom-color:var(--gold)}

/* cards, chips, dots */
.tk-groups{display:grid;gap:28px}
.tk-group-h{display:flex;align-items:center;gap:10px;font:400 1.35rem/1.2 var(--font-display);margin:0 0 12px}
.tk-group-h small{font:400 .9375rem var(--font-body);color:var(--ink-2)}
.tk-done-group>summary{list-style:none;cursor:pointer;min-height:var(--tap);display:flex;align-items:center}
.tk-done-group>summary::-webkit-details-marker{display:none}
.tk-done-group>summary .tk-group-h{margin:0}
.tk-done-group>summary .tk-group-h::after{content:"Show";margin-left:8px;font:500 .75rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--blue-text);text-decoration:underline}
.tk-done-group[open]>summary .tk-group-h::after{content:"Hide"}
.tk-done-group>.tk-cards{margin-top:12px}
.tk-dot{width:12px;height:12px;border-radius:50%;flex:none;background:#9AA7B1}
.tk-dot.s-doing{background:var(--blue)}.tk-dot.s-review{background:var(--gold)}.tk-dot.s-done{background:var(--navy)}
.tk-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:14px}
.tk-card{background:var(--bg);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:12px;min-width:0;border-top:4px solid transparent}
section:not(.panel) .tk-card{background:var(--panel)}
.tk-card.is-high{border-top-color:var(--gold)}
.tk-card h3{font-size:1.25rem;line-height:1.25;margin:0;overflow-wrap:anywhere}
.tk-top{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;justify-content:space-between}
.tk-title{text-decoration:none;color:var(--ink)}
.tk-title:hover,.tk-title:focus-visible{text-decoration:underline}
.tk-name{color:var(--blue-text);text-decoration:underline;text-decoration-color:rgba(31,95,139,.4);text-underline-offset:.2em;cursor:default}
a.tk-name{cursor:pointer}
.tk-chip{display:inline-flex;align-items:center;min-height:24px;padding:2px 8px;border-radius:6px;font:500 .6875rem/1.2 var(--font-body);text-transform:uppercase;letter-spacing:.05em;background:#EEF2F5;color:var(--navy);white-space:nowrap}
.tk-chip.s-doing{background:#E9F4FB;box-shadow:inset 0 0 0 1px var(--blue)}
.tk-chip.s-review{background:#FFF6DA;box-shadow:inset 0 0 0 1px var(--gold-deep)}
.tk-chip.s-done{background:var(--navy);color:#fff}
.tk-chip.high{background:var(--gold);color:var(--navy)}
.tk-chip.off{background:#FDECEC;color:#7A1712}
.tk-chip.wait{background:#FFF6DA;color:var(--navy)}
.tk-chip.ok{background:#E9F4FB;color:var(--navy)}
.tk-meta{margin:0;font-size:.9375rem;color:var(--ink-2);overflow-wrap:anywhere}
.tk-due{color:var(--ink-2)}
.tk-od{color:#B3261E!important;font-weight:600}
.tk-details{margin:0;color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
.tk-empty{color:var(--ink-2);margin:0}
.tk-bar{display:inline-block;width:110px;max-width:40%;height:8px;border-radius:4px;background:#DCE3E8;overflow:hidden;vertical-align:middle}
.tk-bar i{display:block;height:100%;background:var(--blue-text)}
.tk-check-h{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 6px;font-size:.9375rem}
.tk-check ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.tk-check li{display:flex;align-items:center;gap:10px;min-height:var(--tap)}
.tk-check li.is-done label{color:var(--ink-2);text-decoration:line-through}
.tk-check input[type=checkbox],.tk-pick input,.tk-radio input{width:24px;height:24px;flex:none;accent-color:var(--navy);margin:0}
.tk-check label{flex:1;min-height:var(--tap);display:flex;align-items:center;cursor:pointer;overflow-wrap:anywhere}
.tk-actions{display:flex;flex-wrap:wrap;gap:10px}
.tk-big{min-height:52px;font-size:.9375rem;padding:0 22px}
.tk-post{display:grid;gap:6px}
.tk-post label,.tk-inline label,.tk-move label,.tk-mem-role label{font:500 .75rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.tk-post textarea,.tk-inline input,.tk-inline select,.tk-move select,.tk-mem-role select{width:100%;min-height:var(--tap);padding:10px 12px;border:1px solid #9A9A9A;border-radius:var(--r-btn);background:#fff;color:var(--ink);font:400 1rem/1.4 var(--font-body)}
.tk-post textarea{min-height:64px;resize:vertical}
.tk-post .btn{justify-self:start}
.tk-post textarea:focus-visible,.tk-inline input:focus-visible,.tk-inline select:focus-visible,.tk-move select:focus-visible,.tk-mem-role select:focus-visible{outline:2px solid var(--blue-text);outline-offset:1px}
.tk-open{margin:0;font-size:.9375rem}
.tk-open a{display:inline-flex;align-items:center;min-height:var(--tap);color:var(--blue-text)}
.tk-quick{margin:0 0 24px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg)}
section:not(.panel) .tk-quick{background:var(--panel)}
.tk-quick>summary{cursor:pointer;min-height:56px;display:flex;align-items:center;padding:0 20px;font:500 .875rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--navy)}
.tk-quick>summary::marker{color:var(--gold-deep)}
.tk-quick .su-form{background:transparent;padding-top:4px}

/* team board */
.tk-seg{display:inline-flex;border:1px solid var(--navy);border-radius:var(--r-btn);overflow:hidden}
.tk-segb{min-height:var(--tap);padding:0 16px;border:0;background:#fff;color:var(--navy);font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;cursor:pointer}
.tk-segb+.tk-segb{border-left:1px solid var(--navy)}
.tk-segb[aria-pressed="true"]{background:var(--navy);color:#fff}
.tk-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start}
.tk-col{background:var(--bg);border-radius:var(--r);padding:14px;min-width:0}
.tk-col-h{display:flex;align-items:center;gap:8px;font:500 .8125rem/1.2 var(--font-body);text-transform:uppercase;letter-spacing:.05em;margin:4px 4px 12px}
.tk-col-h small{color:var(--ink-2);font-size:.8125rem}
.tk-col-in{display:grid;gap:10px}
.tk-bcard{background:var(--panel);border-radius:14px;padding:14px;display:grid;gap:8px;min-width:0;border-left:4px solid transparent}
.tk-bcard.is-high{border-left-color:var(--gold)}
.tk-bcard h4{font:400 1.05rem/1.3 var(--font-display);margin:0;overflow-wrap:anywhere}
.tk-bcard .tk-chip{justify-self:start}
.tk-steps{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tk-move{display:grid;gap:4px}
.tk-table{width:100%;border-collapse:collapse;font-size:.9375rem;background:var(--bg);border-radius:var(--r);overflow:hidden}
.tk-table th,.tk-table td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:right;vertical-align:middle}
.tk-table th:first-child{text-align:left}
.tk-table thead th{font:500 .6875rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2);background:rgba(0,38,58,.04)}
.tk-table tbody th{font-weight:500}
.tk-back{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);color:var(--blue-text);font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em}
.tk-back::before{content:"";width:10px;height:10px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.tk-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:4px 12px}
.tk-pick-row{display:flex;align-items:center;gap:10px;min-height:var(--tap);cursor:pointer;text-transform:none!important;letter-spacing:0!important;font:400 1rem/1.3 var(--font-body)!important}
.tk-people-pick{border:0;padding:0;margin:0}
.tk-radio{display:flex;flex-wrap:wrap;gap:6px 20px}
.tk-radio label{display:flex;align-items:center;gap:8px;min-height:var(--tap);text-transform:none;letter-spacing:0;font:400 1rem var(--font-body);cursor:pointer}
.tk-av{display:inline-grid;place-items:center;width:40px;height:40px;flex:none;border-radius:50%;background:var(--navy);color:var(--gold);font:500 .9375rem/1 var(--font-display);letter-spacing:.02em}
.tk-av.sm{width:28px;height:28px;font-size:.75rem}

/* team members */
.tk-temp{background:var(--navy);color:#fff;border-radius:var(--r);padding:24px;margin:0 0 20px;display:grid;gap:12px;border-top:6px solid var(--gold)}
.tk-temp p{margin:0;color:rgba(255,255,255,.92)}
.tk-temp-h{font-weight:600}
.tk-temp-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.tk-temp code{font:600 clamp(1.3rem,4.6vw,1.9rem)/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;background:#fff;color:var(--navy);padding:10px 14px;border-radius:var(--r-btn);overflow-wrap:anywhere}
.tk-temp .btn.line{border-color:rgba(255,255,255,.7);color:#fff;justify-self:start}
.tk-temp :focus-visible{outline-color:var(--gold)}
.tk-members,.tk-del{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.tk-members li{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(160px,.8fr) auto;gap:12px 20px;align-items:center;padding:16px;background:var(--bg);border-radius:var(--r-btn)}
.tk-members li.is-off{opacity:.8}
.tk-mem-who{display:flex;gap:12px;align-items:center;min-width:0}
.tk-mem-who b{display:block;font-weight:500;overflow-wrap:anywhere}
.tk-mem-who small{display:block;color:var(--ink-2);font-size:.8125rem;overflow-wrap:anywhere;margin-bottom:4px}
.tk-mem-role{display:grid;gap:4px}
.tk-mem-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.btn.tk-warn{border-color:#B3261E;color:#B3261E}
.btn.tk-warn:hover{background:#B3261E;color:#fff}
.tk-del li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;padding:16px;background:var(--bg);border-radius:var(--r-btn)}
.tk-del b{display:block;font-weight:500;overflow-wrap:anywhere}
.tk-del small{display:block;color:var(--ink-2);font-size:.875rem;overflow-wrap:anywhere}

/* task window */
.tk-dlg{padding:0;border:0;border-radius:var(--r);width:min(780px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;background:var(--panel);color:var(--ink);box-shadow:0 24px 64px rgba(0,38,58,.35)}
.tk-dlg::backdrop{background:rgba(0,38,58,.55)}
.tk-dlg-body{padding:24px 28px 32px;display:grid;gap:14px}
.tk-dlg-body h2{font-size:clamp(1.6rem,4vw,2.4rem);overflow-wrap:anywhere}
.tk-dlg-body h3{font:500 .8125rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--navy);margin:14px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.tk-dlg-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tk-x{width:var(--tap);height:var(--tap);border:1px solid var(--line);border-radius:var(--r-btn);background:#fff;color:var(--navy);font:400 1.6rem/1 var(--font-body);cursor:pointer}
.tk-dlg-people{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.tk-dlg-people li{display:flex;align-items:center;gap:10px;min-height:var(--tap)}
.tk-inline{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;align-items:end}
.tk-inline label{grid-column:1/-1}
.tk-feed{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tk-feed li{padding:12px 14px;background:var(--bg);border-radius:var(--r-btn)}
.tk-feed-h{margin:0;font-size:.9375rem}
.tk-feed-h small{color:var(--ink-2)}
.tk-feed-b{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.tk-hist>summary{cursor:pointer;min-height:var(--tap);display:flex;align-items:center;font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--navy);border-top:1px solid var(--line);margin-top:6px}
.tk-danger{border-top:1px solid var(--line);padding-top:16px;display:grid;gap:10px}
.tk-danger p{margin:0}
.tk-edit{padding:20px;background:var(--bg)}

/* hover preview card (shows only while the pointer is on a NAME or TITLE) */
.tk-pv{position:fixed;z-index:200;background:var(--panel);border-radius:14px;box-shadow:0 18px 48px rgba(0,38,58,.24),0 0 0 1px rgba(0,38,58,.1);padding:14px;pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .16s ease,transform .16s ease;font-size:.875rem}
.tk-pv.on{opacity:1;transform:none}
.tk-pv-top{display:flex;gap:12px;align-items:center;margin-bottom:8px}
.tk-pv-top b{display:block;font:400 1.05rem/1.25 var(--font-display);color:var(--ink);overflow-wrap:anywhere}
.tk-pv-top small{display:block;color:var(--ink-2);margin-top:2px}
.tk-pv-sum{margin:0 0 4px;color:var(--ink-2)}
.tk-pv ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.tk-pv li{display:flex;gap:8px;align-items:flex-start;line-height:1.3}
.tk-pv li .tk-chip{min-height:20px;font-size:.625rem}
.tk-ring{width:56px;height:56px;flex:none}
.tk-ring circle{fill:none;stroke-width:6}
.tk-ring-bg{stroke:#DCE3E8}
.tk-ring-fg{stroke:var(--navy);stroke-linecap:round;transform:rotate(-90deg);transform-origin:28px 28px}
.tk-ring text{font:600 12px var(--font-body);fill:var(--navy)}
@media (prefers-reduced-motion:reduce){.tk-pv{transition:none}}

@media (max-width:1100px){.tk-board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .tk-members li{grid-template-columns:1fr}
  .tk-mem-acts{justify-content:flex-start}
}
@media (max-width:640px){
  .tk-board{grid-template-columns:1fr}
  .tk-dlg{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .tk-dlg-body{padding:18px 16px 24px}
  .tk-del li{grid-template-columns:1fr}
  .tk-table{font-size:.875rem}
  .tk-table th,.tk-table td{padding:10px 6px}
  .tk-actions .btn{flex:1 1 100%}
  .tk-signed-acts{width:100%}
}
/* dashboard: wide tables scroll inside their own box on phones instead of widening the page */
#leads>.wrap>*,#activity>.wrap>*,#uploads>.wrap>*,[id^="t-"]>.wrap>*{min-width:0}
.tk-groups section.tk-group{padding:0}
.tk-board section.tk-col{padding:14px}

/* =====================================================================================================
   Staff dashboard: Partners tab (assets/partners.js). SU colors only: navy, gold (navy text), Columbia blue.
   Every control is at least 44px tall. Reuses the tk-* chips, back link and hover card from team tasks.
   ===================================================================================================== */
#t-partners>.wrap>*{min-width:0}
.pt-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 20px}
.pt-tile{background:var(--bg);border-radius:var(--r);padding:18px 20px;min-width:0;border-top:4px solid var(--blue)}
.pt-tile:nth-child(2){border-top-color:var(--gold)}
.pt-tile:nth-child(3){border-top-color:var(--navy)}
.pt-tile:nth-child(4){border-top-color:var(--gold)}
.pt-tile-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;font:500 .75rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2)}
.pt-tile .help-q{margin:0}
.pt-tile .help-t{margin:8px 0 0;background:var(--panel)}
.pt-big{margin:6px 0 2px;font:400 clamp(1.8rem,3.4vw,2.6rem)/1.1 var(--font-display);color:var(--navy);overflow-wrap:anywhere}
.pt-small{margin:0;color:var(--ink-2);font-size:.875rem;overflow-wrap:anywhere}
.pt-box{margin:0 0 18px;min-width:0}
.pt-box-h{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font:500 .8125rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--navy);margin:0 0 10px}
.pt-box-h .help-q{margin-left:6px}
.pt-box>.help-t{margin:0 0 14px}
.pt-check{display:inline-flex;align-items:center;gap:10px;min-height:var(--tap);font:400 1rem/1.3 var(--font-body);cursor:pointer;align-self:end}
.pt-check input{width:24px;height:24px;margin:0;accent-color:var(--navy)}
.pt-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pt-row{display:grid;grid-template-columns:minmax(0,1fr) repeat(3,minmax(84px,auto));gap:10px 24px;align-items:center;padding:16px 18px;background:var(--bg);border-radius:var(--r-btn);border-left:4px solid var(--blue)}
.pt-row-who b{display:block;font:400 1.15rem/1.3 var(--font-display);overflow-wrap:anywhere}
.pt-name{display:inline-flex;align-items:center;min-height:var(--tap);color:var(--navy);text-decoration:underline;text-decoration-color:rgba(0,38,58,.35);text-underline-offset:.2em}
.pt-name:hover,.pt-name:focus-visible{text-decoration-color:var(--navy)}
.pt-chips{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 0}
.pt-row-num{margin:0;text-align:right}
.pt-row-num b{display:block;font:500 1.05rem/1.2 var(--font-body);color:var(--navy)}
.pt-row-num small{color:var(--ink-2);font-size:.8125rem}
.tk-chip.pt-kind{background:#fff;box-shadow:inset 0 0 0 1px var(--navy)}
.tk-chip.pt-kind.k-sponsor{background:var(--gold);box-shadow:none;color:var(--navy)}
.tk-chip.pt-kind.k-program{background:#E9F4FB;box-shadow:inset 0 0 0 1px var(--blue)}
.tk-chip.pt-paper.p-not_started{background:#EEF2F5;color:var(--navy);box-shadow:inset 0 0 0 1px #9AA7B1}
.tk-chip.pt-paper.p-drafted{background:#fff;box-shadow:inset 0 0 0 1px var(--blue)}
.tk-chip.pt-paper.p-sent{background:#E9F4FB;box-shadow:inset 0 0 0 1px var(--blue-text)}
.tk-chip.pt-paper.p-signed{background:var(--navy);color:#fff}
.tk-chip.pt-rst.r-offered{background:#fff;box-shadow:inset 0 0 0 1px #9AA7B1}
.tk-chip.pt-rst.r-confirmed{background:#E9F4FB;box-shadow:inset 0 0 0 1px var(--blue)}
.tk-chip.pt-rst.r-deployed{background:var(--navy);color:#fff}
.tk-chip.pt-rst.r-declined{background:#EEF2F5;color:var(--ink-2);text-decoration:line-through}
.pt-pv-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px}
.pt-head{display:grid;gap:8px;margin:4px 0 12px}
.pt-title{font-size:clamp(1.6rem,4vw,2.4rem);margin:0;overflow-wrap:anywhere}
.pt-warn{margin:0 0 16px;padding:14px 18px;background:#FFF6DA;border-left:6px solid var(--gold);border-radius:0 var(--r-btn) var(--r-btn) 0;color:var(--navy);font-size:1rem}
.pt-dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:8px 18px;margin:0;padding:16px 18px;background:var(--bg);border-radius:var(--r-btn)}
.pt-dl dt{font:500 .75rem/1.6 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2)}
.pt-dl dd{margin:0;overflow-wrap:anywhere}
.pt-dl a{color:var(--blue-text)}
.pt-notes{white-space:pre-wrap;overflow-wrap:anywhere}
.pt-paper-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pt-paper-box{display:grid;gap:10px;padding:16px;background:var(--bg);border-radius:var(--r-btn);border-top:4px solid #9AA7B1;min-width:0}
.pt-paper-box.s-drafted,.pt-paper-box.s-sent{border-top-color:var(--blue)}
.pt-paper-box.s-signed{border-top-color:var(--navy)}
.pt-paper-box .f,.pt-res-edit .f{display:grid;gap:4px;min-width:0}
.pt-paper-box label{font:500 .75rem/1.3 var(--font-body);text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.pt-paper-box select,.pt-paper-box input{width:100%;min-height:var(--tap);padding:10px 12px;border:1px solid #9A9A9A;border-radius:var(--r-btn);background:#fff;color:var(--ink);font:400 1rem/1.4 var(--font-body)}
.pt-paper-box select:disabled,.pt-paper-box input:disabled{background:#F7F7F7;color:var(--ink-2)}
.pt-tl{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:12px}
.pt-tl-item{position:relative;padding:16px 18px 16px 22px;background:var(--bg);border-radius:var(--r-btn);border-left:4px solid #9AA7B1;display:grid;gap:8px;min-width:0}
.pt-tl-item.r-confirmed{border-left-color:var(--blue)}
.pt-tl-item.r-deployed{border-left-color:var(--navy)}
.pt-tl-item.r-declined{opacity:.85}
.pt-tl-top{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.pt-tl-what{font:400 1.1rem/1.3 var(--font-display);overflow-wrap:anywhere}
.pt-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 0}
.pt-step{display:flex;align-items:center;gap:8px;font-size:.9375rem;color:var(--ink-2)}
.pt-step+.pt-step::before{content:"";width:36px;height:2px;background:#C9D2D9;margin:0 10px}
.pt-step.is-on{color:var(--ink)}
.pt-dot{width:14px;height:14px;border-radius:50%;border:2px solid #9AA7B1;background:#fff;flex:none}
.pt-step.is-on .pt-dot{border-color:var(--navy);background:var(--navy)}
.pt-step.is-on+.pt-step.is-on::before{background:var(--navy)}
.pt-res-more>summary{cursor:pointer;min-height:var(--tap);display:inline-flex;align-items:center;color:var(--blue-text);font:500 .8125rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.05em}
.pt-res-edit{padding:14px;background:var(--panel);border-radius:var(--r-btn)}
.pt-inbox-h{padding:0 20px}
.pt-inbox-h+.help-t{margin:0 20px 10px}
.pt-add-res{background:transparent}
.pt-setup{list-style:none}
@media (max-width:1100px){.pt-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .pt-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px}
  .pt-row-who{grid-column:1/-1}
  .pt-row-num{text-align:left}
  .pt-paper-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .pt-summary{grid-template-columns:1fr 1fr;gap:10px}
  .pt-tile{padding:14px}
  .pt-dl{grid-template-columns:1fr;gap:2px}
  .pt-dl dd{margin-bottom:8px}
  .pt-step+.pt-step::before{width:18px;margin:0 6px}
}