/* ── Design Tokens ── */
:root {
  /* Brand — from design handoff (NCA canonical colors) */
  --blue: #2988C9;
  --blue-dark: #1E6BA3;
  --blue-darker: #1E4E78;
  --blue-light: #E4F0FC;
  --blue-gradient-start: #1F72AE; /* darkened 2026-07-23: white + light-blue small text on the hero must clear 4.5:1 */
  --blue-gradient-end: #17527E;

  --gold: #FBB018;
  --gold-text: #8F6508;
  --gold-dark: #A9760A;
  --gold-light: #FCF0D8;

  --red: #F03C24;
  --red-text: #D8402A;
  --red-deep: #B7331F; /* red for small text: 4.5:1+ on white, red-light, and bg-page */
  --red-dark: #C0392B;
  --red-light: #FCE4DF;

  --teal: #00B4A8;
  --teal-text: #009186;
  --teal-dark: #1E9E5A;
  --teal-light: #E4FCF0;

  --green: #5BBE54;

  /* A Trusted Space® sub-brand (Building Trusted Spaces track): teal green + purple.
     Purple sampled from the brand jumping-fella set (#782484). */
  --ats-teal: #00A896;
  --ats-teal-text: #007A6E;
  --ats-teal-dark: #00564E;
  --ats-teal-light: #DFF5F1;
  --ats-purple: #782484;
  --ats-purple-dark: #5C1B66;
  --ats-purple-light: #F3E8F6;
  --ats-green: #2C9364;
  --ats-green-text: #1E6B45;

  /* Year coding (NCA canonical) */
  --year1: var(--blue);       /* Notice */
  --year2: var(--red);        /* Choose */
  --year3: var(--gold);       /* Act */

  /* Neutrals */
  --ink: #242424;
  --body: #3C4A55;
  --body-alt: #55605A;
  --muted: #5F6B62;
  --muted-alt: #635A85;
  --caption: #66736A;
  --border: #E8ECE6;
  --border-lavender: #E2DCF0;
  --bg-page: #F4F7F3;
  --bg-sidebar: #F7FBF5;
  --bg-hover: #F1F4EF;
  --white: #FFFFFF;

  /* Pastel panels */
  --panel-blue: #E4F0FC;
  --panel-gold: #FCF0D8;
  --panel-teal: #E4FCF0;
  --panel-coral: #FCE4DF;
  --panel-lavender: #EFEBF7;
  --panel-lavender-light: #F6F2FC;
  --panel-cream: #FBF3DE;

  /* Success/error */
  --success: #1E9E5A;
  --success-bg: #E7F7ED;
  --success-text: #1E7A4A;
  --error: #C0392B;
  --error-bg: #FCE4DF;
  --error-text: #7A2A1E;

  /* Typography */
  --font-display: 'Fjalla One', sans-serif;
  --font-heading: 'Barlow Semi Condensed', sans-serif;
  --font-body: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Spacing */
  --container-max: 1240px;
  --sidebar-width: 248px;
  --section-gap: 60px;

  /* Radius */
  --radius-card: 16px;
  --radius-btn: 11px;
  --radius-chip: 10px;
  --radius-pill: 999px;
  --radius-frame: 18px;

  /* Shadows */
  --shadow-card: 0 16px 34px -28px rgba(36,36,36,.4);
  --shadow-frame: 0 40px 80px -34px rgba(36,36,36,.45);
  --shadow-btn: 0 12px 22px -12px rgba(41,136,201,.6);
}
/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg-page);
  font-family: var(--font-body);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.5;
}
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--gold); color: var(--ink); }
button, input, select, textarea { font-family: inherit; }
/* ── Animations ── */
@keyframes ldtpeFill { from { width: 0%; } to { width: 100%; } }
@keyframes ldtpeFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ldtpeGlow { 0%,100% { box-shadow: 0 0 0 0 rgba(41,136,201,.55); } 50% { box-shadow: 0 0 0 9px rgba(41,136,201,0); } }
/* ── Typography Helpers ── */
.font-display { font-family: var(--font-display); }
.font-heading { font-family: var(--font-heading); }
.eyebrow {
  font-family: var(--font-display);
  font-size: 13.5px;
  letter-spacing: .7px;
  text-transform: uppercase;
}
/* ── Layout ── */
.ldtpe-container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 28px;
}
/* ── Buttons ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  border-radius: var(--radius-btn);
  border: none;
  cursor: pointer;
  transition: opacity .15s;
}
.btn:hover { opacity: .9; }
.btn-primary {
  background: var(--blue);
  color: var(--white);
  font-size: 15px;
  padding: 13px 22px;
}
.btn-teal {
  background: var(--ats-teal, #00A896);
  color: #06110D;
  font-size: 15px;
  padding: 14px 22px;
}
.btn-gold {
  background: var(--gold);
  color: var(--ink);
  font-size: 15px;
  padding: 14px 22px;
}
.btn-ghost {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.3);
  color: var(--white);
  font-size: 14px;
  padding: 11px 18px;
}
.btn-outline {
  background: var(--white);
  border: 1.5px solid #E0E6DD;
  color: var(--ink);
  font-size: 13.5px;
  padding: 10px 16px;
}
.btn-disabled {
  background: #C7CFD9;
  color: var(--white);
  cursor: not-allowed;
}
.btn-success {
  background: var(--success);
  color: var(--white);
  font-size: 15px;
  padding: 13px 26px;
}
/* ── Cards ── */
.card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 22px;
}
/* ── Chips / Pills ── */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 800;
  padding: 8px 13px;
  border-radius: var(--radius-pill);
}
.chip-blue { background: var(--panel-blue); color: var(--blue-dark); }
.chip-gold { background: var(--panel-gold); color: var(--gold-dark); }
.chip-teal { background: var(--panel-teal); color: var(--teal-text); }
.chip-muted { background: var(--bg-page); color: var(--caption); }
.chip-success { background: var(--success-bg); color: var(--success-text); }
/* ── Progress Bars ── */
.progress-bar {
  height: 9px;
  border-radius: var(--radius-pill);
  background: #EEF1EC;
  overflow: hidden;
}
.progress-bar__fill {
  height: 100%;
  border-radius: var(--radius-pill);
  transition: width .4s ease;
}
/* ── Blob Shapes (curriculum manual signature) ── */
.blob {
  position: absolute;
  border-radius: 46% 54% 62% 38% / 54% 42% 58% 46%;
  pointer-events: none;
}
/* ══════════════════════════════════════════════
   LANDING PAGE
   ══════════════════════════════════════════════ */
.landing-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 560px;
}
/* Brand + login panel */
.landing-brand {
  position: relative;
  background: linear-gradient(158deg, var(--blue-gradient-start) 0%, var(--blue-gradient-end) 100%);
  overflow: hidden;
  padding: 48px 52px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.landing-brand .blob {
  width: 360px;
  height: 360px;
  background: rgba(255,255,255,.07);
  top: -140px;
  left: -90px;
}
.landing-brand__chips {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.landing-brand__ait-chip {
  display: inline-flex;
  background: var(--white);
  border-radius: var(--radius-chip);
  padding: 8px 10px;
}
.landing-brand__ait-chip img { height: 30px; display: block; }
.landing-brand__formerly {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .3px;
  color: #E8F4FD;
  margin-bottom: 22px;
}
.landing-brand__content { position: relative; }
.landing-brand__logo-chip {
  display: inline-flex;
  background: var(--white);
  border-radius: var(--radius-chip);
  padding: 8px 13px;
}
.landing-brand__logo-chip img { height: 32px; display: block; }
.landing-brand__eyebrow {
  font-family: var(--font-display);
  font-size: 12.5px;
  letter-spacing: .7px;
  color: #E8F4FD;
  margin-bottom: 14px;
}
.landing-brand h1 {
  font-family: 'Anton', sans-serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 1.11;
  margin: 0 0 16px;
  color: var(--white);
  text-transform: uppercase;
}
.landing-brand h1 .gold { color: var(--gold); }
.landing-brand__intro {
  font-size: 15px;
  line-height: 1.6;
  color: #E8F4FD;
  font-weight: 500;
  margin: 0 0 28px;
  max-width: 380px;
}
/* Login form on brand panel */
.landing-login label {
  font-family: var(--font-display);
  font-size: 12px;
  color: #E8F4FD;
  letter-spacing: .5px;
  display: block;
}
.landing-login__field {
  height: 46px;
  border: 1.5px solid rgba(255,255,255,.35);
  border-radius: 11px;
  background: rgba(255,255,255,.12);
  margin: 6px 0 14px;
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 14px;
  color: var(--white);
  font-weight: 600;
  width: 100%;
}
.landing-login__field::placeholder { color: #E8F4FD; }
.landing-login__field[type="password"] { letter-spacing: 3px; }
.landing-login input.landing-login__field {
  border: 1.5px solid rgba(255,255,255,.35);
  border-radius: 11px;
  background: rgba(255,255,255,.12);
  outline: none;
}
.landing-login input.landing-login__field:focus {
  border-color: rgba(255,255,255,.6);
  background: rgba(255,255,255,.18);
}
.landing-login__submit {
  background: var(--gold);
  color: var(--ink);
  font-size: 15.5px;
  font-weight: 800;
  padding: 14px;
  border-radius: 12px;
  text-align: center;
  max-width: 380px;
  width: 100%;
  border: none;
  cursor: pointer;
  margin-top: 4px;
}
.landing-login__links {
  display: flex;
  gap: 18px;
  margin-top: 16px;
  font-size: 13px;
  font-weight: 700;
  color: #E8F4FD;
}
.landing-login__links a:last-child { color: var(--white); }
/* Hero photo */
.landing-photo {
  position: relative;
  background: #9FB8C9;
  overflow: hidden;
}
.landing-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}
/* Info band */
.landing-info {
  position: relative;
  padding: 58px 38px 52px;
  background: var(--white);
  border-top: 1px solid #EEF1EC;
  overflow: hidden;
}
.landing-info .blob {
  width: 420px;
  height: 420px;
  background: radial-gradient(circle at 50% 50%, #EAF8E6, rgba(234,248,230,0));
  top: -180px;
  right: -140px;
  opacity: .8;
}
.landing-info__inner {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
}
.landing-info__grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 44px;
  align-items: start;
  margin-bottom: 40px;
}
.landing-info__eyebrow {
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--ats-teal-text);
  margin-bottom: 12px;
}
.landing-info h2 {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 31px;
  color: var(--ink);
  margin: 0;
  letter-spacing: -.2px;
  line-height: 1.08;
}
.landing-info__body {
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--body-alt);
  font-weight: 500;
  margin: 0 0 14px;
  padding-top: 4px;
}
.landing-info__body strong { font-weight: 800; color: var(--ink); }
.landing-info__sub {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
  font-weight: 600;
  margin: 0;
}
/* NCA framework cards */
.nca-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 18px;
}
.nca-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 24px 22px;
  box-shadow: var(--shadow-card);
}
.nca-card--notice { border-top: 5px solid var(--blue); }
.nca-card--choose { border-top: 5px solid var(--red); }
.nca-card--act { border-top: 5px solid var(--gold); }
.nca-card__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.nca-card__icon {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.nca-card__icon svg { width: 17px; height: 17px; }
.nca-card__label {
  font-family: var(--font-display);
  font-size: 18px;
  letter-spacing: .4px;
}
.nca-card__text {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--body-alt);
  font-weight: 600;
}
/* Stats row */
.stats-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.stat-card {
  border-radius: 14px;
  padding: 20px;
  text-align: center;
}
.stat-card__number {
  font-family: var(--font-display);
  font-size: 34px;
  line-height: 1;
  margin-bottom: 8px;
}
.stat-card__label {
  font-size: 13px;
  color: var(--body);
  font-weight: 600;
  line-height: 1.45;
}
/* Demo strip */
.landing-demo {
  position: relative;
  padding: 56px 38px;
  background: linear-gradient(160deg, var(--blue-dark) 0%, #17527E 100%);
  overflow: hidden;
}
.landing-demo .blob {
  width: 360px;
  height: 360px;
  background: rgba(255,255,255,.06);
  bottom: -160px;
  right: -90px;
}
.landing-demo__inner {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 40px;
  align-items: center;
}
.landing-demo__video {
  position: relative;
  border-radius: var(--radius-frame);
  overflow: hidden;
  box-shadow: 0 30px 60px -28px rgba(0,0,0,.5);
  height: 300px;
  background: #9FB8C9;
  display: flex;
  align-items: center;
  justify-content: center;
}
.landing-demo__video img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
  opacity: .85;
}
.landing-demo__video-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(23,82,126,.55), rgba(23,82,126,.1));
}
.landing-demo__play {
  position: relative;
  width: 74px;
  height: 74px;
  border-radius: 50%;
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 30px -6px rgba(0,0,0,.5);
  z-index: 1;
}
.landing-demo__play span {
  color: var(--blue-dark);
  font-size: 24px;
  margin-left: 5px;
}
/* The tile is a real button now (click plays the film in place) */
button.landing-demo__video { border: 0; padding: 0; cursor: pointer; font: inherit; width: 100%; }
button.landing-demo__video:hover .landing-demo__play,
button.landing-demo__video:focus-visible .landing-demo__play { transform: scale(1.08); }
.landing-demo__play { transition: transform .15s ease; }
.landing-demo__video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.landing-demo__eyebrow {
  font-family: var(--font-display);
  font-size: 12.5px;
  letter-spacing: 1px;
  color: #C9E9FF;
  margin-bottom: 10px;
}
.landing-demo h2 {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 30px;
  color: var(--white);
  line-height: 1.06;
  margin: 0 0 16px;
  letter-spacing: -.2px;
}
.landing-demo__features {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-bottom: 22px;
}
.landing-demo__feature {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.landing-demo__feature-check {
  color: #C9E9FF;
  font-weight: 800;
  font-size: 14px;
  line-height: 1.4;
}
.landing-demo__feature span:last-child {
  font-size: 14px;
  color: #E8F4FD;
  font-weight: 500;
  line-height: 1.45;
}
.landing-demo__actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
/* Footer */
.landing-footer {
  background: #F5F8F3;
  border-top: 3px solid var(--blue);
  padding: 40px 38px 30px;
}
.landing-footer__inner {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  flex-wrap: wrap;
}
.landing-footer__brand {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}
.landing-footer__brand img { height: 30px; }
.landing-footer__brand span {
  font-size: 13px;
  color: var(--caption);
  font-weight: 700;
}
.landing-footer__legal {
  font-size: 12.5px;
  color: var(--caption);
  font-weight: 600;
  text-align: right;
  line-height: 1.6;
}
.landing-footer__legal a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.landing-footer__legal a:hover { color: var(--blue); }
/* ══════════════════════════════════════════════
   APP SHELL (sidebar layout for logged-in views)
   ══════════════════════════════════════════════ */
.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
  min-height: 100vh;
}
/* Sidebar */
.sidebar {
  background: var(--bg-sidebar);
  border-right: 1px solid #EAEFE6;
  padding: 22px 16px;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}
.sidebar__logo { padding: 4px 8px 22px; }
.sidebar__logo img { height: auto; max-height: 30px; max-width: 100%; width: auto; object-fit: contain; display: block; }
/* img selector needed: `.sidebar__logo img` outranks a bare class and was
   showing the mark alongside the full logo in expanded views (Tanner 8/7). */
.sidebar__logo img.sidebar__logo-mark { display: none; }
.sidebar__lbl { white-space: nowrap; }
/* ── One menu everywhere (row 206): inner pages carry the sidebar as a fixed
   58px icon rail that expands OVER the content on hover or keyboard focus.
   The dashboard keeps the expanded grid embedding above. ── */
.sidebar--rail {
  position: fixed;
  top: 0; left: 0; bottom: 0;
  z-index: 60;
  width: 58px;
  height: 100vh;
  padding: 18px 9px;
  overflow: hidden;
  transition: width .22s ease, box-shadow .22s ease;
}
.sidebar--rail .sidebar__logo { padding: 4px 4px 18px; }
.sidebar--rail .sidebar__link { padding: 11px 10px; }
.sidebar--rail:hover, .sidebar--rail:focus-within {
  width: 232px;
  overflow-y: auto;
  box-shadow: 12px 0 30px rgba(20, 40, 50, .16);
}
/* Collapsed rail = icon-only: labels leave the layout entirely so each link
   (and the active blue pill) shrinks snugly around its centered emoji
   (Tanner 8/7: the wide half-empty active box read as broken). */
.sidebar--rail:not(:hover):not(:focus-within) .sidebar__lbl { display: none; }
.sidebar--rail:not(:hover):not(:focus-within) .sidebar__link { justify-content: center; padding: 11px 0; gap: 0; }
.sidebar--rail:not(:hover):not(:focus-within) .sidebar__signout { justify-content: center; text-align: center; }
.sidebar--rail:not(:hover):not(:focus-within) .sidebar__user-inner { justify-content: center; }
.sidebar--rail:not(:hover):not(:focus-within) img.sidebar__logo-full { display: none; }
.sidebar--rail:not(:hover):not(:focus-within) img.sidebar__logo-mark { display: block; width: 32px; margin: 0 auto; }
.sidebar__link--admin { margin-top: 10px; border-top: 1px solid var(--border, #EAEFE6); border-radius: 0; padding-top: 14px; }
/* Inner-page wrappers clear the rail on desktop. */
@media (min-width: 901px) {
.has-rail { padding-left: 58px; }
}
/* Drawer chrome: the hamburger lives in each page's top bar, shown below
   900px only; the scrim is printed by ldtpe_portal_sidebar(). */
.ldtpe-menu-btn { display: none; background: none; border: 0; cursor: pointer; padding: 6px 8px; flex: none; }
.ldtpe-menu-btn i { display: block; width: 19px; height: 2.5px; border-radius: 2px; background: var(--blue-dark); margin: 4px 0; }
.ldtpe-menu-btn:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.ldtpe-scrim {
  position: fixed; inset: 0; z-index: 55;
  background: rgba(12, 28, 38, .4);
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
}
@media (max-width: 900px) {
.ldtpe-menu-btn { display: inline-flex; flex-direction: column; }
/* Below 900px EVERY sidebar (dashboard grid or inner rail) becomes the
     slide-in drawer: full labels, full logo, no icon-rail behavior. */
.sidebar, .sidebar--rail {
    display: flex;
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 60;
    width: 258px; height: 100vh;
    padding: 22px 16px;
    transform: translateX(-105%);
    transition: transform .25s ease;
    overflow-y: auto;
    box-shadow: none;
  }
body.ldtpe-drawer-open .sidebar { transform: none; box-shadow: 12px 0 30px rgba(20, 40, 50, .28); }
body.ldtpe-drawer-open .ldtpe-scrim { opacity: 1; pointer-events: auto; }
.sidebar .sidebar__lbl { opacity: 1 !important; }
.sidebar .sidebar__logo-full { display: block !important; }
.sidebar .sidebar__logo-mark { display: none !important; }
/* Phones have no :hover, so the rail's icon-only rules (labels display:none,
     centered links) were still winning inside the open drawer (Tanner 9/2
     screenshot). The drawer is always the full menu. */
.sidebar--rail .sidebar__lbl { display: inline !important; }
.sidebar--rail .sidebar__link { justify-content: flex-start !important; padding: 11px 14px !important; gap: 12px !important; }
.sidebar--rail .sidebar__signout { justify-content: flex-start !important; text-align: left !important; }
.sidebar--rail .sidebar__user-inner { justify-content: flex-start !important; }
.sidebar--rail img.sidebar__logo-full { display: block !important; }
.sidebar--rail img.sidebar__logo-mark { display: none !important; }
.sidebar--rail .sidebar__logo { padding: 4px 8px 22px; }
}
@media (prefers-reduced-motion: reduce) {
.sidebar--rail, .sidebar, .ldtpe-scrim, .sidebar__lbl { transition: none; }
}
.sidebar__nav { display: flex; flex-direction: column; gap: 3px; }
.sidebar__link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: var(--radius-btn);
  color: var(--body-alt);
  font-weight: 700;
  font-size: 14px;
  transition: background .15s;
}
.sidebar__link:hover { background: rgba(0,0,0,.04); }
.sidebar__link--active {
  background: var(--blue);
  color: var(--white);
  font-weight: 800;
}
.sidebar__link--active:hover { background: var(--blue); }
.sidebar__link-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; flex: none; }
.sidebar__link-icon svg { width: 17px; height: 17px; }
.sidebar__signout svg { flex: none; }
/* Inline line icons (ldtpe_icon): sit on the text baseline, never shrink in flex rows */
.ldtpe-ico { display: inline-block; vertical-align: -0.22em; flex: none; }
/* Building Trusted Spaces entry (row 449): divider + the training's own dark-green
   skin so it reads as its own thing among the Playgility pages. */
.sidebar__divider { margin: 10px 6px 4px; border-top: 1px solid var(--border, #EAEFE6); }
/* dark-features face at a size that reads (feedback 463) */
.sidebar__face { width: 26px; max-width: none; height: auto; display: block; margin: -3px; }
.sidebar__link--bts {
  background: linear-gradient(135deg, #00473C 0%, #00120E 100%);
  color: #CFEDE5;
  font-weight: 800;
}
.sidebar__link--bts:hover { background: linear-gradient(135deg, #005A4B 0%, #001A14 100%); }
.sidebar__link--bts.sidebar__link--active {
  background: linear-gradient(135deg, #00473C 0%, #00120E 100%);
  color: #fff;
  box-shadow: inset 0 0 0 2px var(--ats-teal, #00A896);
}
.sidebar__user {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid #EAEFE6;
}
.sidebar__user-inner {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 8px;
}
.sidebar__avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  color: var(--ink);
  font-size: 16px;
  flex-shrink: 0;
}
.sidebar__user-name { font-weight: 800; font-size: 13.5px; color: var(--ink); }
.sidebar__user-school { font-size: 12px; color: var(--muted); font-weight: 600; }
.sidebar__signout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 0 8px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--muted);
  text-decoration: none;
}
.sidebar__signout:hover { color: var(--ink); }
.top-nav__signout {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
  text-decoration: none;
  white-space: nowrap;
}
.top-nav__signout:hover { color: var(--ink); }
/* Top bar */
.topbar {
  height: 64px;
  border-bottom: 1px solid #EEF1EC;
  display: flex;
  align-items: center;
  padding: 0 28px;
  gap: 18px;
  background: var(--white);
}
.topbar__search {
  flex: 1;
  max-width: 340px;
  height: 38px;
  background: var(--bg-page);
  border: 1px solid var(--border);
  border-radius: var(--radius-chip);
  display: flex;
  align-items: center;
  padding: 0 12px;
  gap: 8px;
  color: var(--caption);
  font-size: 13px;
  font-weight: 600;
}
.topbar__right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
}
.topbar__bell {
  width: 38px;
  height: 38px;
  border-radius: var(--radius-chip);
  background: var(--bg-page);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
}
.topbar__year-pill {
  background: var(--panel-blue);
  color: var(--blue-dark);
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .4px;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
}
/* Year 2 wears red, not blue (feedback 504) */
.topbar__year-pill--y2 {
  background: var(--red-light);
  color: var(--red-deep);
}
/* ══════════════════════════════════════════════
   TOP NAV (curriculum, plan views)
   ══════════════════════════════════════════════ */
.top-nav {
  height: 66px;
  background: var(--white);
  border-bottom: 1px solid #EEF1EC;
  display: flex;
  align-items: center;
  padding: 0 28px;
  gap: 28px;
}
.top-nav__logo { display: flex; align-items: center; }
.top-nav__logo img { height: auto; max-height: 32px; max-width: 168px; width: auto; object-fit: contain; display: block; }
.top-nav__links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  margin-left: 6px;
}
@media (max-width: 900px) {
.top-nav__links { gap: 8px 14px; }
}
.top-nav__link {
  font-size: 14px;
  font-weight: 700;
  color: var(--body-alt);
}
.top-nav__link--active {
  font-weight: 800;
  color: var(--blue);
}
.top-nav__right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
}
.top-nav .topbar__search { width: 230px; flex: none; }
/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */
/* ══════════════════════════════════════════════
   DASHBOARD
   ══════════════════════════════════════════════ */
.dash-main {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.dash-content {
  padding: 28px 28px 36px;
  max-width: 771px;
}
/* Greeting */
.dash-greeting { margin-bottom: 22px; }
.dash-greeting__row {
  display: flex;
  align-items: center;
  gap: 18px;
}
.dash-greeting__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 34px;
  color: var(--ink);
  margin: 0;
  letter-spacing: -.2px;
}
.dash-greeting__plan-btn {
  margin-left: auto;
  white-space: nowrap;
  font-size: 13.5px;
  padding: 10px 24px;
}
.dash-greeting__sub {
  font-size: 14px;
  color: var(--muted);
  font-weight: 600;
  margin-top: 3px;
}
/* Hero card */
.dash-hero {
  position: relative;
  background: linear-gradient(135deg, #2C90D1, #1E6BA3);
  border-radius: 18px;
  padding: 28px 30px;
  overflow: hidden;
  margin-bottom: 22px;
}
.dash-hero .blob {
  width: 300px;
  height: 300px;
  border-radius: 46% 54% 60% 40% / 52% 44% 56% 48%;
  background: rgba(255,255,255,.08);
  top: -130px;
  right: -60px;
}
.dash-hero__inner {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 28px;
  flex-wrap: wrap;
}
.dash-hero__text { flex: 1; min-width: 300px; }
.dash-hero__media {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-shrink: 0;
}
.dash-hero__eyebrow {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .8px;
  color: #BFE2F7;
  margin-bottom: 10px;
}
.dash-hero__meta {
  font-size: 12.5px;
  font-weight: 800;
  color: #BFE2F7;
  margin-bottom: 6px;
}
.dash-hero__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 30px;
  color: var(--white);
  line-height: 1.05;
  margin: 0 0 6px;
}
.dash-hero__desc {
  font-size: 14px;
  color: #DCECF8;
  font-weight: 600;
  margin-bottom: 16px;
}
.dash-hero__desc strong { color: var(--white); font-weight: 800; }
.dash-hero__progress {
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 420px;
  margin-bottom: 18px;
}
.dash-hero__pct {
  font-size: 12.5px;
  font-weight: 800;
  color: var(--white);
}
.dash-hero__photo {
  width: 230px;
  height: 150px;
  border-radius: 14px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.25);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 14px;
  flex-shrink: 0;
}
.dash-hero__photo span {
  font-family: ui-monospace, monospace;
  font-size: 12px;
  color: #DCECF8;
  font-weight: 700;
  line-height: 1.5;
}
.dash-hero__photo--img { padding: 0; overflow: hidden; }
.dash-hero__photo--img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Trusted Spaces hero: same layout, the dark A Trusted Space® room instead of
   Playgility blue. Light-on-dark pairs AA-checked against the near-black ground. */
/* Year 2 wears red, not blue (feedback 504) — hero included */
.dash-hero--y2 { background: linear-gradient(135deg, #D8402A, #A5301B); }
.dash-hero--y2 .dash-hero__eyebrow,
.dash-hero--y2 .dash-hero__meta { color: #FBD3C8; }
.dash-hero--y2 .dash-hero__desc { color: #FBE0D8; }
.dash-hero--bts { background: radial-gradient(120% 150% at 85% 0%, #003930 0%, #00120E 62%, #000202 100%); }
.dash-hero--bts .blob { background: rgba(111,222,204,.07); }
.dash-hero--bts .dash-hero__eyebrow,
.dash-hero--bts .dash-hero__meta { color: #6FDECC; }
.dash-hero--bts .dash-hero__desc { color: #C9E9E2; }
.dash-hero--bts .dash-hero__photo { background: rgba(111,222,204,.08); border-color: rgba(111,222,204,.28); }
.dash-hero__lesson-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 230px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 800;
  color: var(--ink);
}
/* Card shared overrides for dashboard */
.card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  flex-wrap: wrap;
  gap: 8px;
}
.card__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 21px;
  color: var(--ink);
  margin: 0;
}
.card__action {
  font-size: 12.5px;
  font-weight: 800;
  color: var(--blue);
}
.card__meta {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--muted);
}
/* 2-col grid */
.dash-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 22px;
}
.dash-grid__left,
.dash-grid__right {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
/* Certification bars */
.dash-cert { display: flex; flex-direction: column; gap: 14px; }
.dash-cert__row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 7px;
}
.dash-cert__label {
  font-size: 13.5px;
  font-weight: 800;
  color: var(--ink);
}
.dash-cert__count {
  font-size: 12.5px;
  font-weight: 800;
  color: var(--body-alt);
}
.dash-cert__count--muted { color: var(--caption); font-size: 12px; }
/* Week snapshot */
.dash-week {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
}
.dash-week__day {
  border-radius: 11px;
  padding: 12px 10px;
  min-height: 104px;
}
.dash-week__day--blue { background: var(--panel-blue); }
.dash-week__day--gold { background: var(--panel-gold); }
.dash-week__day--teal { background: var(--panel-teal); }
.dash-week__day--off { background: var(--bg-page); }
.dash-week__day-label {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .5px;
  margin-bottom: 8px;
  color: var(--caption);
}
.dash-week__day-title {
  font-size: 12px;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.35;
}
.dash-week__day-desc {
  font-size: 12px;
  color: var(--body-alt);
  font-weight: 600;
  margin-top: 4px;
}
.dash-week__day--off .dash-week__day-desc { color: var(--caption); }
.dash-week__footer {
  margin-top: 12px;
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.dash-week__footer a {
  color: var(--blue);
  font-weight: 800;
}
/* Quick links */
.dash-quick {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.dash-quick__tile {
  border-radius: 12px;
  padding: 14px;
  display: block;
  transition: opacity .15s;
}
.dash-quick__tile:hover { opacity: .85; }
.dash-quick__tile--blue { background: var(--panel-blue); }
.dash-quick__tile--gold { background: var(--panel-gold); }
.dash-quick__tile--teal { background: var(--panel-teal); }
.dash-quick__tile--warm { background: #FCF0E4; }
.dash-quick__icon {
  display: flex;
  margin-bottom: 6px;
}
.dash-quick__icon svg { width: 21px; height: 21px; }
.dash-quick__label {
  font-size: 13px;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.2;
}
/* Reflections */
.dash-reflections { display: flex; flex-direction: column; gap: 12px; }
.dash-reflections__item {
  border-left: 3px solid var(--blue);
  padding: 2px 0 2px 12px;
}
.dash-reflections__label {
  font-size: 12px;
  font-weight: 800;
  color: var(--blue);
  margin-bottom: 3px;
}
.dash-reflections__quote {
  font-size: 12.5px;
  color: var(--body);
  font-weight: 600;
  line-height: 1.45;
  font-style: italic;
}
.dash-reflections__date {
  font-size: 12px;
  color: var(--caption);
  font-weight: 700;
  margin-top: 4px;
}
/* SEL Muscles cloud */
.dash-muscles { margin-top: 22px; }
.dash-muscles__cloud { display: flex; flex-wrap: wrap; gap: 8px; }
/* Bottom row: cert ring + continue */
.dash-bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  margin-top: 22px;
}
.dash-bottom__ring-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.dash-ring__circle {
  width: 118px;
  height: 118px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.dash-ring__inner {
  width: 86px;
  height: 86px;
  border-radius: 50%;
  background: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.dash-ring__pct {
  font-family: var(--font-display);
  font-size: 26px;
  color: var(--blue);
  line-height: 1;
}
.dash-ring__label {
  font-size: 12px;
  color: var(--muted);
  font-weight: 800;
  letter-spacing: .3px;
}
.dash-bottom__ring-title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 16px;
  color: var(--ink);
  line-height: 1.1;
}
.dash-bottom__ring-sub {
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
  margin-top: 3px;
}
.dash-bottom__continue-eyebrow {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .6px;
  color: var(--caption);
  margin-bottom: 10px;
}
.dash-bottom__continue-title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 18px;
  color: var(--ink);
  line-height: 1.1;
  margin-bottom: 4px;
}
.dash-bottom__continue-step {
  font-size: 12.5px;
  color: var(--muted);
  font-weight: 600;
  margin-bottom: 14px;
}
/* ══════════════════════════════════════════════
   CURRICULUM LIBRARY
   ══════════════════════════════════════════════ */
.cur-page { min-height: 100vh; background: var(--white); }
.cur-content {
  position: relative;
  padding: 28px 30px 36px;
  overflow: hidden;
}
.cur-blob {
  width: 420px;
  height: 420px;
  background: radial-gradient(circle at 50% 45%, #EFEBF7, rgba(239,235,247,0));
  top: -180px;
  right: -150px;
  position: absolute;
  pointer-events: none;
}
.cur-inner {
  position: relative;
  z-index: 1;
  max-width: 1120px;
  margin: 0 auto;
}
.cur-header { margin-bottom: 18px; }
/* Year tabs */
.cur-tabs {
  display: flex;
  gap: 10px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.cur-tab {
  background: var(--white);
  border: 1.5px solid var(--border);
  color: var(--body-alt);
  border-radius: 11px;
  padding: 11px 18px;
  font-weight: 800;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.cur-tab--active {
  background: var(--blue);
  color: var(--white);
  border-color: var(--blue);
}
.cur-tab__year {
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: .03em;
}
/* Row 558: year colors live in classes (not inline styles) so the active
   white can win — a selected tab was showing red/gold on blue. */
.cur-tab__year--y2 { color: var(--red-text); }
.cur-tab__year--y3 { color: var(--gold-text); }
.cur-tab--active .cur-tab__year { color: var(--white); }
/* Filter bar */
.cur-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 26px;
  padding: 14px 18px;
  background: var(--panel-blue);
  border-radius: 12px;
}
.cur-filter__pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.cur-filter__label {
  font-size: 12px;
  font-weight: 800;
  color: var(--blue-dark);
}
.cur-filter__pill {
  background: var(--white);
  color: var(--blue-dark);
  font-size: 12.5px;
  font-weight: 800;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  cursor: pointer;
}
.cur-filter__pill--active {
  background: var(--blue);
  color: var(--white);
}
.cur-filter__note {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--blue-dark);
}
/* Muscle group header */
.cur-group-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.cur-group-dot {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex-shrink: 0;
}
.cur-group-title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 23px;
  color: var(--ink);
}
.cur-group-meta {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
/* Lesson card grid */
.cur-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 30px;
}
/* Lesson card */
.cur-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 16px;
  position: relative; /* fella anchors to the top corner */
  display: flex;
  flex-direction: column; /* lets the plan link pin to the bottom */
}
.cur-card--progress {
  border: 1.5px solid var(--gold);
  background: #FFFCF5;
}
.cur-card__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-right: 92px; /* clear of the corner fella */
}
.cur-card__top .cur-card__pill {
  margin: 0 auto; /* centered between the number and the fella */
  font-size: 11px;
  padding: 3px 8px;
}
.cur-card__num {
  font-family: var(--font-display);
  font-size: 13px;
  color: var(--white);
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cur-card__pill {
  font-size: 12px;
  font-weight: 800;
  padding: 4px 9px;
  border-radius: var(--radius-pill);
}
.cur-card__pill--complete {
  color: var(--success-text);
  background: var(--success-bg);
}
.cur-card__pill--progress {
  color: var(--gold-dark);
  background: var(--panel-gold);
}
.cur-card__pill--none {
  color: var(--caption);
  background: #F1F4EF;
}
.cur-card__fella {
  position: absolute;
  top: 12px;
  right: 12px;
  height: 62px;
  max-width: 88px; /* pairs/trios stay grouped, just crop wider */
  object-fit: contain;
}
.cur-card__name {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 17px;
  color: var(--ink);
  line-height: 1.1;
  margin-bottom: 6px;
  padding-right: 92px; /* clear of the corner fella */
}
.cur-card__activity {
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
  padding-right: 92px;
}
.cur-card__plan {
  display: flex;
  justify-content: flex-end;
  margin-top: auto; /* pin to the card's bottom corner */
  padding-top: 11px;
}
.cur-card__plan a {
  font-size: 12px;
  font-weight: 800;
  color: var(--blue);
}
@media (max-width: 900px) {
/* 900, not 680 (row 967, 10/5): the pills covered the module title on a 708px tablet. */
.trn-topbar__progress .progress-bar { display: none; }
/* Easy read shrinks to its Aa badge; the title attribute still names it. */
.trn-topbar .ldtpe-easy-toggle { padding: 5px; gap: 0; font-size: 0; flex-shrink: 0; }
.trn-topbar .ldtpe-easy-toggle__icon { font-size: 14px; }
}
@keyframes trnBob {
  0%, 100% { transform: rotate(var(--tilt, 0deg)) translateY(2px); }
  50% { transform: rotate(var(--tilt, 0deg)) translateY(-3px); }
}
@keyframes trnStarSpin { to { transform: rotate(360deg); } }
.trn-mtss .mtss-svg { width: 100%; height: auto; display: block; overflow: visible; }
.trn-mtss .mtss-band { cursor: default; }
.trn-mtss .mtss-caption {
  margin-top: 10px;
  text-align: center;
  /* the pyramid sits at x=81 of the 132-unit viewBox (side labels use the left
     gutter), so nudge the caption right to center it under the triangle itself */
  transform: translateX(11.4%);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--dim, #6C7A70);
}
/* Row 772 (Lori 9/17) + 9/29 redraw (Tanner, after the Playgility one-sheet): the training
   MTSS model is a teardrop in the BTS palette (plum tip, lamp gold, teal base); fills live
   in the SVG gradient, these rules set its type. */
.trn-mtss .mtss-td__tier { font-family: var(--font-display); text-anchor: middle; letter-spacing: .5px; pointer-events: none; }
.trn-mtss .mtss-td__tier--3 { fill: #FFFFFF; font-size: 3.6px; }
.trn-mtss .mtss-td__tier--2 { fill: #3A2A06; font-size: 4.6px; }
.trn-mtss .mtss-td__tier--1 { fill: #FFFFFF; font-size: 6.4px; filter: drop-shadow(0 .5px 1px rgba(0,0,0,.6)); }
.trn-mtss .mtss-td__brand { font-family: var(--font-heading); font-weight: 800; font-size: 4.4px; letter-spacing: .35px; fill: #FFFFFF; text-anchor: middle; filter: drop-shadow(0 .4px .9px rgba(0,0,0,.7)); pointer-events: none; }
.trn-mtss .mtss-td .mtss-side { font-size: 3.9px; }
.trn-page--bts .trn-mtss .mtss-side--1 { fill: #6FDECC; }
.trn-page--bts .trn-mtss .mtss-side--2 { fill: #F0C25F; }
.trn-page--bts .trn-mtss .mtss-side--3 { fill: #D9A6E0; }
.trn-page--bts .trn-mtss .mtss-caption { color: var(--bts-dim); }
@keyframes trnShake { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
#trn-build-line { font-size: 14.5px; font-weight: 700; color: var(--ink); line-height: 1.5; }
/* Curriculum card — dual links */
.cur-card__plan--dual { justify-content: space-between; align-items: center; }
.cur-card__plan-alt { color: var(--muted) !important; }
/* ══════════════════════════════════════════════
   LESSON PLAN VIEWER
   ══════════════════════════════════════════════ */
.plan-page { min-height: 100vh; background: var(--page-bg); }
/* Action bar */
.plan-action-bar {
  height: 60px;
  background: var(--white);
  border-bottom: 1px solid #EEF1EC;
  display: flex;
  align-items: center;
  padding: 0 24px;
  gap: 14px;
}
.plan-action-bar__back {
  font-size: 13px;
  font-weight: 800;
  color: var(--muted);
  text-decoration: none;
}
.plan-action-bar__right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.plan-action-bar__btn {
  background: var(--page-bg);
  border: 1px solid var(--border);
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  padding: 9px 14px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}
.plan-action-bar__btn--primary {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}
/* Paper mat */
.plan-mat {
  background: #EDEFEA;
  padding: 30px;
  display: flex;
  justify-content: center;
  min-height: calc(100vh - 170px);
}
.plan-paper-stack {
  width: 720px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.plan-paper {
  background: var(--white);
  border: 1px solid #E2E6DD;
  box-shadow: 0 14px 40px -20px rgba(36,36,36,.3);
  padding: 46px 50px;
}
/* Letterhead */
.plan-letterhead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  border-bottom: 3px solid var(--blue);
  padding-bottom: 18px;
  margin-bottom: 22px;
}
.plan-letterhead__logo {
  height: 30px;
  display: block;
  margin-bottom: 12px;
}
.plan-letterhead__meta {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .6px;
  color: var(--blue);
}
.plan-letterhead__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 32px;
  color: var(--ink);
  line-height: 1.05;
  margin: 2px 0 0;
}
.plan-letterhead__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  background: var(--panel-blue);
  border-radius: 999px;
  padding: 5px 13px;
}
.plan-letterhead__chip-for {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .5px;
  color: var(--blue-dark);
}
.plan-letterhead__chip-class {
  font-size: 13px;
  font-weight: 800;
  color: var(--blue-dark);
}
.plan-letterhead__right {
  text-align: right;
  font-size: 12px;
  color: var(--body);
  font-weight: 700;
  line-height: 1.7;
  padding-top: 4px;
}
/* Section labels */
.plan-section-label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 9px;
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .5px;
  color: #46586C;
}
.plan-section-dot {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  flex-shrink: 0;
}
/* Objective + Muscle two-col */
.plan-two-col {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 24px;
  margin-bottom: 26px;
}
.plan-objective-text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--body);
  font-weight: 600;
}
.plan-objective-text strong {
  font-weight: 800;
  color: var(--ink);
}
.plan-muscle-chip {
  display: inline-block;
  background: var(--panel-blue);
  color: var(--blue-dark);
  font-size: 13px;
  font-weight: 800;
  padding: 6px 12px;
  border-radius: 999px;
  margin-bottom: 10px;
}
.plan-muscle-meta {
  font-size: 12px;
  color: var(--body);
  font-weight: 700;
  line-height: 1.6;
}
/* What we mean */
.plan-meaning {
  margin-bottom: 26px;
}
.plan-meaning-text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--body);
  font-weight: 600;
}
/* Standards */
.plan-standards {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 18px;
}
.plan-standards__list {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.plan-standards__item {
  font-size: 12.5px;
  color: var(--body);
  font-weight: 600;
}
.plan-standards__code {
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* Standing safety note above the page-2 footer */
.plan-safety {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--muted, #5F6B62);
  border-top: 1px dashed var(--border, #E6E9EE);
  padding-top: 10px;
  margin-top: 14px;
}
/* Footer */
.plan-footer {
  text-align: right;
  font-size: 12px;
  color: #9AA69C;
  font-weight: 700;
  margin-top: 22px;
}
/* Lesson flow */
.plan-flow-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.plan-flow-note {
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
}
.plan-flow {
  display: flex;
  flex-direction: column;
  margin-bottom: 28px;
}
.plan-flow__step {
  display: flex;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid #F0F2EC;
}
.plan-flow__step--last {
  border-bottom: none;
}
.plan-flow__time {
  width: 62px;
  flex-shrink: 0;
  font-family: var(--font-display);
  font-size: 13px;
}
.plan-flow__step-title {
  font-size: 13.5px;
  font-weight: 800;
  color: var(--ink);
}
.plan-flow__step-desc {
  font-size: 12.5px;
  color: var(--body);
  font-weight: 500;
  line-height: 1.5;
}
.plan-flow__step--expanded .plan-flow__step-desc {
  line-height: 1.55;
  margin-bottom: 8px;
}
.plan-core-badge {
  background: #FCE4DF;
  color: #C0392B;
  font-size: 12px;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 999px;
  margin-left: 5px;
}
.plan-training-note {
  background: var(--panel-blue);
  border-radius: 9px;
  padding: 9px 12px;
  font-size: 12px;
  color: var(--blue-dark);
  font-weight: 600;
  line-height: 1.45;
  margin-bottom: 16px;
}
/* Activity */
.plan-activity {
  background: #F7FBF5;
  border-radius: 12px;
  padding: 20px 22px;
  margin-bottom: 24px;
}
.plan-activity__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.plan-activity__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 19px;
  color: var(--ink);
}
.plan-activity__link {
  font-size: 12px;
  color: var(--blue);
  font-weight: 800;
  text-decoration: none;
}
.plan-activity__desc {
  font-size: 13px;
  color: var(--body);
  font-weight: 500;
  line-height: 1.55;
  margin-bottom: 16px;
}
.plan-activity__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.plan-activity__sub-label {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .4px;
  color: #46586C;
  margin-bottom: 8px;
}
.plan-activity__checklist {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.plan-activity__check-item {
  font-size: 12.5px;
  color: var(--body);
  font-weight: 600;
}
.plan-activity__remember {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12.5px;
  color: #5C4A1E;
  font-weight: 600;
  line-height: 1.4;
}
/* Closing prompts */
.plan-closing {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px 22px;
  margin-bottom: 0;
}
.plan-closing__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 19px;
  color: var(--ink);
  margin-bottom: 4px;
}
.plan-closing__instruction {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  margin-bottom: 12px;
}
.plan-closing__prompts {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.plan-closing__prompt {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.plan-closing__nca-label {
  font-family: var(--font-display);
  font-size: 14px;
  width: 74px;
  flex-shrink: 0;
  padding-top: 1px;
}
.plan-closing__nca-text {
  font-size: 13.5px;
  color: var(--body);
  font-weight: 600;
  line-height: 1.5;
}
.plan-closing__divider {
  height: 1px;
  background: #F0F2EC;
}
/* ══════════════════════════════════════════════
   REGISTRATION
   ══════════════════════════════════════════════ */
.reg-page {
  min-height: 100vh;
  background: var(--page-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
}
.reg-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 560px;
  max-width: 960px;
  width: 100%;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 40px 80px -34px rgba(36,36,36,.45);
  border: 1px solid var(--border);
  background: var(--white);
}
/* Brand panel */
.reg-brand {
  position: relative;
  background: linear-gradient(158deg, #2C90D1 0%, #1E6BA3 100%);
  overflow: hidden;
  padding: 48px 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.reg-brand__blob {
  position: absolute;
  width: 340px;
  height: 340px;
  bottom: -130px;
  left: -90px;
  background: rgba(255,255,255,.07);
}
.reg-brand__inner { position: relative; }
.reg-brand__logo-chip {
  display: inline-flex;
  background: var(--white);
  border-radius: 10px;
  padding: 8px 12px;
  margin-bottom: 26px;
}
.reg-brand__logo-chip img { height: 34px; display: block; }
.reg-brand__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 38px;
  color: var(--white);
  line-height: 1.05;
  margin: 0 0 14px;
}
.reg-brand__desc {
  font-size: 15px;
  line-height: 1.6;
  color: #DCECF8;
  font-weight: 500;
  margin: 0 0 28px;
  max-width: 360px;
}
.reg-brand__steps {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.reg-brand__step {
  display: flex;
  align-items: center;
  gap: 12px;
}
.reg-brand__step-num {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: var(--white);
  font-weight: 800;
}
.reg-brand__step-text {
  font-size: 14px;
  color: #EAF4FB;
  font-weight: 700;
}
/* Form panel */
.reg-form {
  padding: 46px 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.reg-form__inner { max-width: 380px; }
.reg-form__eyebrow {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .8px;
  color: var(--blue);
  margin-bottom: 8px;
}
.reg-form__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 31px;
  color: var(--ink);
  margin: 0 0 6px;
}
.reg-form__hint {
  font-size: 13.5px;
  color: var(--muted);
  font-weight: 600;
  margin: 0 0 26px;
  line-height: 1.5;
}
.reg-form__label {
  font-family: var(--font-display);
  font-size: 12px;
  color: var(--body);
  letter-spacing: .5px;
}
/* Code input */
.reg-code {
  display: flex;
  gap: 8px;
  margin: 8px 0 6px;
  align-items: center;
}
.reg-code__box {
  flex: 1;
  height: 54px;
  border: 1.5px solid var(--border);
  border-radius: 11px;
  background: #FAFBF9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 22px;
  color: #AAB4AC;
  letter-spacing: 3px;
}
.reg-code__box--active {
  border-color: var(--blue);
  background: var(--white);
  color: var(--ink);
}
.reg-code__input {
  width: 100%;
  height: 100%;
  border: none;
  background: transparent;
  text-align: center;
  font-family: var(--font-display);
  font-size: 22px;
  color: var(--ink);
  letter-spacing: 3px;
  outline: none;
  text-transform: uppercase;
}
.reg-code__dash {
  font-size: 22px;
  color: #CBD3C9;
  font-weight: 800;
}
.reg-code__status {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 22px;
  font-size: 12.5px;
  color: var(--teal-text);
  font-weight: 800;
}
.reg-form__submit {
  width: 100%;
  font-size: 15.5px;
  padding: 14px;
  border-radius: 12px;
  text-align: center;
  box-shadow: 0 12px 22px -12px rgba(41,136,201,.6);
  margin-bottom: 16px;
}
.reg-form__links {
  border-top: 1px solid #EEF1EC;
  padding-top: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.reg-form__link-row {
  font-size: 13px;
  color: var(--body);
  font-weight: 700;
}
.reg-form__link-row a {
  color: var(--blue);
  font-weight: 800;
  text-decoration: none;
}
.reg-form__link--teal {
  color: var(--teal) !important;
}
/* ══════════════════════════════════════════════
   PROFILE SETUP
   ══════════════════════════════════════════════ */
.setup-page { min-height: 100vh; background: var(--white); }
/* Progress header */
.setup-header {
  background: var(--white);
  border-bottom: 1px solid #EEF1EC;
  padding: 22px 38px 0;
}
.setup-header__inner { max-width: 900px; margin: 0 auto; }
.setup-header__top {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.setup-header__logo { height: 26px; display: block; }
.setup-header__welcome {
  font-size: 13px;
  font-weight: 800;
  color: var(--muted);
  margin-left: auto;
}
.setup-progress {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.setup-progress__step { flex: 1; }
.setup-progress__bar {
  height: 6px;
  border-radius: 99px;
  background: #EEF1EC;
}
.setup-progress__label {
  font-size: 12px;
  font-weight: 800;
  margin-top: 7px;
  color: #9AA69C;
}
/* Content */
.setup-content {
  padding: 34px 38px 38px;
  background: var(--white);
}
.setup-content__inner { max-width: 900px; margin: 0 auto; }
.setup-intro { margin-bottom: 22px; }
.setup-intro__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 36px;
  color: var(--ink);
  margin: 0 0 6px;
  letter-spacing: -.2px;
}
.setup-intro__desc {
  font-size: 15px;
  color: var(--body);
  font-weight: 500;
  margin: 0;
  line-height: 1.55;
  max-width: 580px;
}
/* Shared field label */
.setup-field-label {
  font-family: var(--font-display);
  font-size: 12px;
  color: var(--body);
  letter-spacing: .5px;
  display: block;
}
/* Chip rows */
.setup-chip-row {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
  align-items: center;
}
.setup-chip {
  background: var(--white);
  border: 1.5px solid #E4E9E2;
  color: var(--body);
  font-size: 13.5px;
  font-weight: 800;
  padding: 9px 14px;
  border-radius: 10px;
  cursor: pointer;
  user-select: none;
  transition: background .15s, color .15s, border-color .15s;
}
.setup-chip--active {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
  padding: 10px 14px;
}
.setup-chip-note {
  font-size: 12px;
  color: #9AA69C;
  font-weight: 700;
  margin-left: 6px;
  margin-top: 8px;
}
/* How many classes */
.setup-how-many {
  background: #F7FBF5;
  border: 1px solid #E4ECDD;
  border-radius: 14px;
  padding: 18px 20px;
  margin-bottom: 22px;
}
/* Class tabs */
.setup-tabs {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.setup-tab {
  background: #F1F4EF;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  padding: 9px 14px;
  border-radius: 10px 10px 0 0;
  cursor: pointer;
}
.setup-tab--active {
  background: var(--ink);
  color: var(--white);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.setup-tab__badge {
  background: var(--gold);
  color: var(--ink);
  font-size: 12px;
  padding: 2px 6px;
  border-radius: 999px;
}
.setup-tab--remaining {
  color: #C2CBC0;
}
/* Class card */
.setup-class-card {
  border: 1.5px solid var(--ink);
  border-radius: 0 14px 14px 14px;
  padding: 24px;
  margin-bottom: 24px;
}
.setup-class-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 10px;
}
.setup-class-card__name {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 22px;
  color: var(--ink);
  line-height: 1.1;
  margin-top: 2px;
}
.setup-class-card__rename {
  font-size: 12.5px;
  color: var(--blue);
  font-weight: 800;
  cursor: pointer;
}
.setup-class-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}
/* Stepper + slider */
.setup-size-row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 10px;
}
.setup-stepper {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--blue);
  border-radius: 11px;
  overflow: hidden;
}
.setup-stepper__btn {
  width: 34px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blue);
  font-size: 18px;
  font-weight: 800;
  background: #F4F9FD;
  cursor: pointer;
  user-select: none;
}
.setup-stepper__val {
  width: 54px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 20px;
  color: var(--ink);
}
.setup-slider { flex: 1; }
.setup-slider__input {
  width: 100%;
  height: 8px;
  -webkit-appearance: none;
  appearance: none;
  background: #EEF1EC;
  border-radius: 99px;
  outline: none;
}
.setup-slider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--white);
  border: 3px solid var(--blue);
  box-shadow: 0 2px 6px rgba(36,36,36,.2);
  cursor: pointer;
}
/* Class actions */
.setup-class-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #EEF1EC;
}
.setup-class-actions__dup {
  background: var(--panel-blue);
  color: var(--blue-dark);
  font-size: 13.5px;
  font-weight: 800;
  padding: 11px 16px;
  border-radius: 11px;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.setup-class-actions__new {
  background: var(--white);
  border: 1.5px solid #E0E6DD;
  color: var(--ink);
  font-size: 13.5px;
  font-weight: 800;
  padding: 10px 16px;
  border-radius: 11px;
  cursor: pointer;
}
/* Preview callout */
.setup-preview {
  background: #E4FCF0;
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.setup-preview__text { flex: 1; min-width: 260px; }
.setup-preview__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 17px;
  color: var(--ink);
  margin-bottom: 3px;
}
.setup-preview__desc {
  font-size: 13px;
  color: var(--body);
  font-weight: 600;
  line-height: 1.45;
}
.setup-preview__btn {
  background: var(--white);
  border: 1px solid #CCEFE0;
  color: #1E7A4A;
  font-size: 13px;
  font-weight: 800;
  padding: 10px 16px;
  border-radius: 10px;
  text-decoration: none;
}
/* Nav */
.setup-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.setup-nav__back {
  font-size: 14px;
  font-weight: 800;
  color: var(--muted);
  cursor: pointer;
}
.setup-nav__right {
  display: flex;
  align-items: center;
  gap: 14px;
}
.setup-nav__skip {
  font-size: 13.5px;
  font-weight: 800;
  color: var(--muted);
  cursor: pointer;
}
.setup-nav__finish {
  font-size: 15px;
  padding: 13px 28px;
  box-shadow: 0 12px 22px -12px rgba(41,136,201,.6);
}
/* One sheet (family & team view of a lesson plan) */
.sheet-intro {
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--body);
}
.sheet-alias {
  font-size: 12.5px;
  color: #46586C;
  margin-top: 7px;
}
.sheet-intro + .sheet-alias,
.sheet-alias + .sheet-section { margin-bottom: 0; }
.sheet-section {
  border: 1px solid #E2E6DD;
  border-radius: 12px;
  padding: 15px 18px 14px;
  margin-top: 14px;
}
.sheet-section .plan-section-label { margin-bottom: 7px; }
.sheet-section__aud {
  margin-left: auto;
  font-size: 10.5px;
  letter-spacing: .8px;
  color: #7a828f;
}
.sheet-section__lead {
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--body);
  margin-bottom: 9px;
}
.sheet-try__label {
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: .7px;
  margin-bottom: 5px;
}
.sheet-try__item {
  display: flex;
  gap: 7px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--body);
  margin-bottom: 4px;
}
.sheet-try__item:last-child { margin-bottom: 0; }
.sheet-challenge {
  background: var(--panel-blue);
  border-radius: 12px;
  padding: 13px 18px;
  margin-top: 10px;
}
.sheet-challenge__label {
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: .7px;
  color: var(--blue-dark);
  margin-bottom: 4px;
}
.sheet-challenge__text {
  font-size: 13px;
  line-height: 1.55;
  color: var(--blue-dark);
}
/* Print styles */
@media print {
.top-nav,
  .plan-action-bar { display: none !important; }
.plan-mat {
    background: none;
    padding: 0;
  }
.plan-paper {
    box-shadow: none;
    border: none;
    page-break-after: always;
    padding: 30px 40px;
  }
.plan-paper:last-child { page-break-after: avoid; }
}
/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */
@media (max-width: 900px) {
.landing-hero { grid-template-columns: 1fr; }
.landing-photo { min-height: 300px; }
.landing-info__grid { grid-template-columns: 1fr; }
.nca-cards { grid-template-columns: 1fr; }
.stats-row { grid-template-columns: repeat(2, 1fr); }
.landing-demo__inner { grid-template-columns: 1fr; }
.app-shell { grid-template-columns: 1fr; }
/* .sidebar is NOT hidden here anymore: it becomes the slide-in drawer
     (see the sidebar drawer block above). */
.dash-content { max-width: 100%; }
.dash-grid { grid-template-columns: 1fr; }
.dash-week { grid-template-columns: repeat(3, 1fr); }
.dash-bottom { grid-template-columns: 1fr; }
.dash-greeting__row { flex-wrap: wrap; }
.dash-hero__photo { display: none; }
.cur-grid { grid-template-columns: repeat(2, 1fr); }
.cur-filter { flex-direction: column; align-items: flex-start; }
.plan-paper-stack { width: 100%; }
.plan-paper { padding: 28px 24px; }
.plan-letterhead { flex-direction: column; gap: 14px; }
.plan-letterhead__right { text-align: left; }
.plan-two-col { grid-template-columns: 1fr; }
.plan-activity__grid { grid-template-columns: 1fr; }
.plan-action-bar__right { gap: 6px; }
.reg-split { grid-template-columns: 1fr; }
.reg-brand { padding: 30px; }
.reg-form { padding: 30px; }
.setup-class-grid { grid-template-columns: 1fr; }
.setup-nav { flex-direction: column; gap: 16px; align-items: stretch; }
.setup-nav__right { justify-content: flex-end; }
}
/* Phones: the shared inner-page top bar and the curriculum library (row 328) */
@media (max-width: 640px) {
.top-nav { padding: 0 14px; gap: 12px; }
.top-nav__logo img { max-width: 126px; }
.top-nav__right { flex: 1; min-width: 0; gap: 10px; justify-content: flex-end; }
/* row 597: sign out + avatar hug the right edge */
.top-nav .topbar__search { width: auto; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; }
.cur-content { padding: 20px 14px 30px; }
.cur-grid { grid-template-columns: 1fr; }
.cur-group-header { flex-wrap: wrap; }
}
.card--table { overflow-x:auto; }
.adm-codebar .btn { text-decoration:none; }
.adm-form { display:grid; gap:14px; max-width:560px; }
.adm-form__row { display:grid; gap:6px; }
.adm-label { font-size:12px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; color:var(--body-alt); }
.adm-input, .adm-select { width:100%; padding:11px 13px; border:1.5px solid var(--border); border-radius:10px; font-family:var(--font-body); font-size:14.5px; color:var(--ink); background:var(--white); }
.adm-input:focus, .adm-select:focus { outline:none; border-color:var(--blue); }
.adm-hint { font-size:12px; color:var(--muted); }
.adm-notice { background:var(--success-bg); color:var(--success-text); border:1px solid #BFE6CD; border-radius:10px; padding:12px 14px; margin-bottom:18px; font-weight:600; font-size:14px; }
.adm-error { background:var(--error-bg); color:var(--error); border:1px solid #F3C2C2; border-radius:10px; padding:12px 14px; margin-bottom:18px; font-weight:600; font-size:14px; }
.adm-nudge__pick .adm-hint { font-weight:500; }
.adm-threshold .adm-input { width:64px; padding:5px 8px; font-size:13px; }
.adm-threshold .btn { padding:5px 11px; font-size:12.5px; }
.adm-filters__field .adm-select, .adm-filters__field .adm-input { min-width:170px; padding:8px 11px; font-size:13.5px; }
.adm-log__when .adm-hint { font-weight:500; }
.adm-pager .btn { padding:8px 16px; font-size:13px; text-decoration:none; }
@media (max-width:680px) {
.adm-filters__field .adm-select, .adm-filters__field .adm-input { min-width:0; width:100%; }
}
/* A card that fills its grid row (overview funnel next to the taller table). */
.card--fill { align-self:stretch; display:flex; flex-direction:column; }
.btn-danger { background:var(--error); color:#fff; border:1.5px solid var(--error); }
.btn-danger:hover { filter:brightness(.94); }
/* ── C6: data-handling statement page ──────────────────────────────────── */
.dp-wrap { max-width:760px; margin:0 auto; padding:56px 22px 80px; }
.dp__eyebrow { font-size:12px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--blue); margin:0 0 8px; }
.dp__title { font-family:var(--font-display); font-size:38px; line-height:1.08; color:var(--ink); margin:0 0 16px; }
.dp__lead { font-size:18px; line-height:1.6; color:var(--body); margin:0 0 12px; }
.dp__section { margin-top:30px; }
.dp__section h2 { font-family:var(--font-heading); font-weight:800; font-size:20px; color:var(--ink); margin:0 0 8px; }
.dp__section p { font-size:16px; line-height:1.65; color:var(--body); margin:0; }
.dp__section a { color:var(--blue-dark); font-weight:700; }
@media (max-width:680px) {
.dp__title { font-size:30px; }
.dp-wrap { padding:40px 18px 60px; }
}
/* ── Standards Alignment page (/standards/) ────────────────────────────── */
.std-wrap { max-width:860px; }
.std-return { margin:0 0 14px; }
.std-return a { color:var(--muted); font-weight:700; font-size:13px; text-decoration:none; }
.std-return a:hover { color:var(--blue); }
.screen-reader-text, .std-wrap .screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.std-links { display:flex; gap:14px; flex-wrap:wrap; margin:26px 0 8px; }
.std-links__card { flex:1 1 260px; display:flex; flex-direction:column; gap:4px; padding:16px 18px; border:1.5px solid var(--line, #E3E0D8); border-radius:14px; background:#fff; text-decoration:none; transition:border-color .15s, transform .15s; }
.std-links__card:hover { border-color:var(--blue); transform:translateY(-1px); }
.std-links__label { font-size:11px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; color:var(--muted, #6B7671); }
.std-links__title { font-family:var(--font-heading); font-weight:800; font-size:15.5px; line-height:1.35; color:var(--blue-dark); }
.std-toc { margin:22px 0 6px; display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; }
.std-toc__label { font-size:11px; font-weight:800; letter-spacing:.8px; color:var(--muted, #6B7671); margin-right:2px; }
.std-toc a { font-size:13px; font-weight:700; color:var(--blue-dark); text-decoration:none; padding:4px 10px; border:1px solid var(--line, #E3E0D8); border-radius:999px; background:#fff; }
.std-toc a:hover { border-color:var(--blue); }
.std-lesson { margin-top:42px; scroll-margin-top:24px; }
.std-lesson__eyebrow { font-size:11.5px; font-weight:800; letter-spacing:.9px; color:var(--muted, #6B7671); }
.std-lesson__title { font-family:var(--font-display); font-size:26px; color:var(--ink); margin:4px 0 6px; }
.std-lesson__skill { font-size:15.5px; line-height:1.6; color:var(--body); margin:0 0 12px; max-width:640px; }
.std-lesson__frameworks { display:flex; flex-direction:column; gap:8px; margin:0 0 14px; }
.std-fw { display:flex; gap:10px; align-items:baseline; }
.std-fw__tag { flex:0 0 auto; font-size:10.5px; font-weight:800; letter-spacing:.7px; padding:3px 9px; border-radius:999px; }
.std-fw__tag--casel { background:#E2F1EF; color:var(--teal-text, #00655D); }
.std-fw__tag--sel { background:#E7EDF8; color:var(--blue-dark); }
.std-fw__text { font-size:14.5px; line-height:1.55; color:var(--body); }
.std-table-wrap { overflow-x:auto; border:1.5px solid var(--line, #E3E0D8); border-radius:14px; background:#fff; }
.std-table { width:100%; border-collapse:collapse; font-size:14px; }
.std-table th { text-align:left; font-size:11px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; color:var(--muted, #6B7671); padding:10px 14px 8px; border-bottom:1.5px solid var(--line, #E3E0D8); }
.std-table td { padding:9px 14px; border-bottom:1px solid #EFEDE6; color:var(--body); line-height:1.5; vertical-align:top; }
.std-table tr:last-child td { border-bottom:0; }
.std-table__grade { font-weight:800; color:var(--ink); white-space:nowrap; width:64px; }
.std-table__code { font-weight:800; color:var(--blue-dark); white-space:nowrap; width:74px; }
.std-lesson__go { margin-top:10px; }
.std-lesson__go a { font-size:14px; font-weight:800; color:var(--blue-dark); text-decoration:none; }
.std-lesson__go a:hover { text-decoration:underline; }
.std-attrib { border-top:1.5px solid var(--line, #E3E0D8); padding-top:22px; margin-top:46px; }
@media (max-width:680px) {
.std-lesson__title { font-size:22px; }
}
/* ════════════════════════════════════════════════════════════════════════
   YEAR PLANNER (/plan/) — calendar setup tool (onboarding spec §4)
   ════════════════════════════════════════════════════════════════════════ */
.pl-page { min-height:100vh; background:var(--bg-page); }
.pl-wrap { max-width:1080px; margin:0 auto; padding:26px 28px 60px; }
.pl-save { font-size:13px; font-weight:700; color:var(--muted); margin-right:14px; }
.pl-save--ok { color:var(--success); }
.pl-save--err { color:var(--error); }
.pl-empty { max-width:520px; margin:80px auto; text-align:center; background:var(--white); border:1px solid var(--border); border-radius:18px; padding:46px 36px; }
.pl-empty__icon { display:flex; justify-content:center; color:var(--blue); }
.pl-empty__icon svg { width:48px; height:48px; }
.pl-empty__title { font-size:24px; color:var(--ink); margin:10px 0 8px; }
.pl-empty__text { color:var(--body-alt); line-height:1.6; margin-bottom:22px; }
.pl-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:18px; }
.pl-back { font-size:13px; font-weight:700; color:var(--blue-dark); text-decoration:none; }
.pl-title { font-size:34px; color:var(--ink); margin:6px 0 6px; }
.pl-sub { color:var(--body-alt); line-height:1.6; max-width:680px; font-size:14.5px; }
.pl-done { white-space:nowrap; text-decoration:none; }
.pl-classbar { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:18px; flex-wrap:wrap; }
.pl-tabs { display:flex; gap:8px; flex-wrap:wrap; }
.pl-tab { border:1.5px solid var(--border); background:var(--white); color:var(--body); border-radius:999px; padding:7px 16px; font-family:'Barlow Semi Condensed',sans-serif; font-weight:700; font-size:14px; cursor:pointer; }
.pl-tab--active { border-color:var(--blue); background:var(--blue); color:#fff; }
.pl-manage { font-size:13px; font-weight:700; color:var(--blue-dark); text-decoration:none; white-space:nowrap; padding:7px 0; }
.pl-manage:hover { text-decoration:underline; }
.pl-select { border:1.5px solid #DDE3DC; border-radius:9px; padding:8px 12px; font-family:inherit; font-size:14px; background:#fff; color:var(--ink); }
.pl-card { background:var(--white); border:1px solid var(--border); border-radius:16px; padding:22px 24px; margin-bottom:18px; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.pl-card__head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
.pl-card__title { font-size:18px; color:var(--ink); }
.pl-card__hint { font-size:12px; font-weight:600; color:var(--muted); letter-spacing:.02em; }
.pl-btn-sm { padding:8px 15px; font-size:13.5px; }
.pl-mini { display:flex; flex-direction:column; gap:5px; font-family:'Barlow Semi Condensed',sans-serif; font-weight:700; font-size:12px; letter-spacing:.05em; color:var(--muted); text-transform:uppercase; }
.pl-mini--grow { flex:1; }
.pl-date, .pl-input { border:1.5px solid #DDE3DC; border-radius:9px; padding:9px 11px; font-family:inherit; font-size:14px; color:var(--ink); background:#fff; box-sizing:border-box; }
.pl-date--sm { padding:6px 9px; font-size:13px; }
.pl-input--num { width:88px; }
.pl-date:focus, .pl-input:focus, .pl-select:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(41,136,201,.12); }
.pl-yearrow { display:flex; align-items:flex-end; gap:18px; flex-wrap:wrap; margin-bottom:18px; padding-bottom:18px; border-bottom:1px dashed var(--border); }
.pl-presets { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:var(--muted); }
.pl-chip { border:1.5px solid var(--border); background:var(--white); color:var(--body); border-radius:999px; padding:6px 14px; font-weight:700; font-size:13px; cursor:pointer; }
.pl-chip--on { border-color:var(--blue); background:var(--panel-blue); color:var(--blue-dark); }
/* One-window date range picker + the PE-days row (row 371). */
.pl-mini__lbl { display:block; }
.pl-mini--inline { flex-direction:row; align-items:center; gap:8px; }
.pl-select--sm { padding:6px 9px; font-size:13px; text-transform:none; letter-spacing:0; }
.pl-daterange {
  border:1.5px solid #DDE3DC; border-radius:9px; background:#fff; color:var(--ink);
  font-family:inherit; font-size:14px; font-weight:700; padding:9px 13px; cursor:pointer;
  text-align:left; letter-spacing:0; text-transform:none; white-space:nowrap;
}
.pl-daterange:hover { border-color:var(--blue); }
.pl-daterange--sm { padding:6px 10px; font-size:13px; }
.pl-daysrow { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:16px; }
.pl-daychips { display:flex; gap:6px; }
.pl-daychip {
  border:1.5px solid var(--border); background:var(--white); color:var(--body);
  border-radius:9px; padding:7px 11px; font-family:inherit; font-weight:800; font-size:13px; cursor:pointer;
}
.pl-daychip--on { border-color:var(--blue); background:var(--blue); color:#fff; }
.pl-pick {
  position:absolute; z-index:120; width:300px; background:var(--white);
  border:1px solid var(--border); border-radius:14px; padding:12px 14px 10px;
  box-shadow:0 18px 44px rgba(35,48,67,.22);
}
.pl-pick__head { display:flex; align-items:center; justify-content:space-between; }
.pl-pick__jump { display:flex; gap:5px; }
.pl-pick__sel { border:1.5px solid #DDE3DC; border-radius:8px; background:#fff; color:var(--ink); font-family:inherit; font-weight:700; font-size:13px; padding:4px 6px; }
.pl-pick__typed { display:flex; align-items:center; gap:7px; margin-top:9px; }
.pl-pick__in { flex:1 1 0; min-width:0; border:1.5px solid #DDE3DC; border-radius:8px; padding:6px 8px; font-family:inherit; font-size:13px; color:var(--ink); }
.pl-pick__in:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(41,136,201,.12); }
.pl-pick__dash { font-size:12px; font-weight:700; color:var(--muted); }
.pl-pick__nav { border:none; background:var(--bg-hover); color:var(--body); width:26px; height:26px; border-radius:8px; font-size:16px; font-weight:800; cursor:pointer; line-height:1; }
.pl-pick__title { font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin:6px 0 2px; }
.pl-pick__grid { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin-top:8px; }
.pl-pick__wd { text-align:center; font-size:11px; font-weight:800; color:var(--muted); padding-bottom:3px; }
.pl-pick__day {
  border:none; background:none; color:var(--ink); font-family:inherit; font-size:13px; font-weight:700;
  padding:6px 0; border-radius:8px; cursor:pointer;
}
.pl-pick__day:hover { background:var(--bg-hover); }
/* The chosen span shades in, ends solid, so one window shows the whole range. */
.pl-pick__day--mid { background:var(--panel-blue); color:var(--blue-dark); border-radius:0; }
.pl-pick__day--end { background:var(--blue); color:#fff; box-shadow:0 2px 6px rgba(41,136,201,.4); }
.pl-pick__day--start { border-radius:8px 0 0 8px; }
.pl-pick__day--stop { border-radius:0 8px 8px 0; }
.pl-pick__day--solo { border-radius:8px; }
.pl-pick__foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; }
.pl-pick__read { font-size:12.5px; font-weight:700; color:var(--body); }
.pl-pick__done { border:none; background:var(--blue); color:#fff; font-family:inherit; font-weight:800; font-size:13px; padding:7px 15px; border-radius:999px; cursor:pointer; }
.pl-pick__done:disabled { opacity:.4; cursor:default; }
.pl-pick__hint { font-size:11.5px; color:var(--muted); margin-top:6px; }
.pl-terms { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.pl-term { border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--bg-sidebar); }
.pl-term__name { width:100%; border:none; background:transparent; font-family:'Barlow Semi Condensed',sans-serif; font-weight:800; font-size:15px; color:var(--ink); margin-bottom:8px; }
.pl-term__name:focus { outline:none; }
.pl-term__dates { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.pl-term__to { font-size:12px; color:var(--muted); }
.pl-term__wk { font-size: 12px; font-weight:700; color:var(--muted); margin-left:auto; }
.pl-legend { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:14px; font-size:13px; }
.pl-legend__lbl { font-weight:800; color:var(--muted); font-size:12px; letter-spacing:.05em; text-transform:uppercase; }
.pl-legend__none { color:var(--muted); font-style:italic; }
.pl-legend__item { display:inline-flex; align-items:center; gap:6px; color:var(--body); }
.pl-legend__dot { width:12px; height:12px; border-radius:3px; display:inline-block; }
.pl-legend__badge { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:var(--gold); color:#3a2a00; font-weight:800; font-size: 12px; }
.pl-legend__item--ldtpe { font-weight:700; }
.pl-block-editor { border:1px solid var(--blue); background:var(--panel-blue); border-radius:12px; padding:16px 18px; margin-bottom:16px; }
.pl-be__row { display:flex; gap:16px; flex-wrap:wrap; margin-bottom:14px; }
.pl-be__actions { display:flex; gap:10px; align-items:center; }
.pl-be__hint { font-size:12.5px; color:var(--muted); margin:-6px 0 12px; }
.pl-be__del { margin-left:auto; color:var(--error)!important; }
.pl-be__row--weeks { margin-bottom:8px; }
.pl-be__hint--tight { margin:6px 0 0; display:block; }
.pl-weekchips { display:flex; gap:6px; flex-wrap:wrap; }
.pl-weekchip {
  border:1.5px solid var(--border); background:var(--white); color:var(--body);
  border-radius:999px; padding:6px 12px; font-family:inherit; font-weight:700; font-size:12.5px;
  cursor:pointer; letter-spacing:0; text-transform:none;
}
.pl-weekchip--on { border-color:var(--gold); background:var(--panel-gold); color:var(--gold-text); }
.pl-card__hint--block { margin:0 0 10px; }
.pl-range-hint { font-size:13px; font-weight:700; color:var(--blue-dark); background:var(--panel-blue); border-radius:9px; padding:8px 12px; margin-bottom:10px; }
.pl-excsug { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.pl-excsug__lbl { font-size:12px; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.pl-excsug__hint { font-size:12px; color:var(--muted); }
.pl-chip--add { padding:6px 12px; font-size:12.5px; }
.pl-warnings { margin-bottom:12px; display:flex; flex-direction:column; gap:8px; }
.pl-warn { font-size:13px; border-radius:9px; padding:9px 13px; line-height:1.5; }
.pl-warn--bad { background:var(--error-bg); color:var(--error); border:1px solid #F3C2C2; }
.pl-warn--info { background:var(--bg-hover); color:var(--body-alt); }
.pl-trow { margin-bottom:14px; }
.pl-trow__head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px; }
.pl-trow__name { font-family:'Barlow Semi Condensed',sans-serif; font-weight:800; font-size:14px; color:var(--ink); }
.pl-trow__span { font-size:12px; color:var(--muted); }
/* Weeks wrap onto as many rows as they need: no term ever scrolls sideways. */
.pl-track { display:flex; gap:2px; padding-bottom:4px; flex-wrap:wrap; overflow-x:visible; }
.pl-track .pl-cell { flex:0 0 66px; }
.pl-cell { position:relative; flex:1 0 42px; min-height:52px; border-radius:6px; cursor:pointer; padding:4px 5px; box-sizing:border-box; transition:filter .12s; overflow:hidden; }
.pl-cell:hover { filter:brightness(1.04); outline:2px solid rgba(41,136,201,.35); }
.pl-cell--block { color:#fff; }
.pl-cell--gap { background:repeating-linear-gradient(45deg,var(--bg-hover),var(--bg-hover) 6px,#fff 6px,#fff 12px); border:1px dashed var(--border); }
.pl-cell--lesson { box-shadow:inset 0 0 0 2px var(--gold); }
.pl-cell--overlap { box-shadow:inset 0 0 0 2px var(--error); }
.pl-cell--more { flex:0 0 auto; display:flex; align-items:center; color:var(--muted); font-size:12px; font-weight:700; background:none; cursor:default; }
.pl-cell__wk { position:absolute; bottom:3px; left:5px; font-size: 12px; font-weight:700; opacity:.75; white-space:nowrap; }
.pl-cell--gap .pl-cell__wk { color:var(--muted); }
.pl-cell__wd { margin-left:4px; font-family:'Barlow Semi Condensed',sans-serif; font-weight:600; font-size:11px; letter-spacing:.02em; }
.pl-cell__label { display:block; font-size: 12px; font-weight:800; line-height:1.2; }
.pl-cell__lesson { position:absolute; top:3px; right:3px; width:18px; height:18px; border-radius:50%; background:var(--gold); color:#3a2a00; font-weight:800; font-size: 12px; display:flex; align-items:center; justify-content:center; box-shadow:0 1px 2px rgba(0,0,0,.25); border:none; font-family:inherit; cursor:pointer; padding:0; }
/* Set a Playgility lesson day straight on the calendar: the L+ shows on hover. */
/* BTS year calendar (9/8): the planner's week grid as a real calendar, month by month.
   Every week wears the focus in effect; the week a focus starts carries its name. */
.pl-page--bts .pl-wrap { max-width: 1080px; }
.pl-head__side { display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.pl-keep { display:flex; align-items:center; gap:10px; }
.pl-card--notice { padding:14px 18px; font-size:14px; line-height:1.55; color:var(--body); }
.pl-adjustable { display:flex; align-items:center; gap:10px; cursor:pointer; font-weight:700; color:var(--ink); }
.pl-page--bts .pl-track { gap:4px; }
.pl-page--bts .pl-track .pl-cell { flex:0 0 calc(20% - 4px); min-height:66px; padding:6px 8px 20px; }
.pl-cell--run { opacity:.8; }
.pl-cell--run:hover { opacity:.95; }
.pl-cell--break .pl-cell__label { font-weight:700; }
.pl-cell__wk--date { font-family:'Barlow Semi Condensed',sans-serif; font-size:12px; letter-spacing:.02em; opacity:.85; right:6px; white-space:nowrap; }
.pl-cell--gap .pl-cell__wk--date { color:var(--body-alt); }
.pl-page--bts .pl-cell__label { padding-right:22px; }
.pl-cell__lesson[draggable="true"] { cursor:grab; }
.pl-cell--dragging { opacity:.45; }
.pl-cell--dragover { outline:2px solid var(--gold); filter:brightness(1.06); }
.pl-app--readonly .pl-cell { cursor:default; }
.pl-app--readonly .pl-cell:hover { filter:none; outline:none; }
.pl-app--readonly .pl-cell { cursor:default; }
.pl-app--readonly .pl-cell:hover { filter:none; outline:none; }
.pl-app--readonly button:disabled, .pl-app--readonly select:disabled, .pl-app--readonly input:disabled { opacity:.6; cursor:default; }
@media (max-width:860px) {
.pl-page--bts .pl-track .pl-cell { flex:0 0 calc(33.33% - 4px); }
}
@media (max-width:520px) {
.pl-page--bts .pl-track .pl-cell { flex:0 0 calc(50% - 4px); }
.pl-head__side { align-items:flex-start; }
}
.pl-cell__addl {
  position:absolute; top:3px; right:3px; width:18px; height:18px; border-radius:50%;
  background:rgba(255,255,255,.82); color:var(--gold-text); border:1px dashed var(--gold);
  font-family:inherit; font-weight:800; font-size:9.5px; line-height:1; padding:0; cursor:pointer;
  display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .12s;
}
.pl-cell:hover .pl-cell__addl, .pl-cell__addl:focus-visible { opacity:1; }
.pl-cell__addl:hover { background:var(--gold); color:#3a2a00; border-style:solid; }
/* Touch has no hover: keep it visible so a tap can reach it instead of starting a unit. */
@media (hover: none) {
.pl-cell__addl { opacity:.85; }
}
.pl-cell--pending { outline:2px solid var(--blue); background:var(--panel-blue); box-shadow:inset 0 0 0 999px rgba(41,136,201,.14); }
.pl-dist-note { font-size:13px; color:var(--gold-dark); background:var(--gold-light); border-radius:9px; padding:0; line-height:1.5; }
.pl-dist-note:not(:empty) { padding:9px 13px; margin-bottom:12px; }
.pl-lessons { display:flex; flex-direction:column; gap:6px; }
.pl-lrow { display:flex; align-items:center; gap:12px; padding:9px 10px; border:1px solid var(--border); border-radius:10px; }
.pl-lrow--unplaced { background:var(--bg-sidebar); }
.pl-lrow--year { border:none; padding:10px 2px 2px; font-family:'Barlow Semi Condensed',sans-serif; font-weight:800; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
/* A new school year (9/15): pick up where last year left off, or start Year 1 over. */
.pl-roll__text { margin:0 0 14px; line-height:1.6; font-size:14.5px; color:var(--body); }
.pl-roll__btns { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.pl-roll__skip { font-size:13px; }
.pl-legend__swatches { display:inline-flex; gap:2px; }
.pl-legend__swatches .pl-legend__dot { width:9px; height:12px; border-radius:2px; }
.pl-yearlabel__more { font-size:12px; color:var(--muted); font-weight:600; margin-left:6px; }
.pl-lrow__num { flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--panel-blue); color:var(--blue-dark); font-weight:800; font-size:13px; display:flex; align-items:center; justify-content:center; }
.pl-lrow__main { flex:1; min-width:0; }
.pl-lrow__title { font-weight:700; color:var(--ink); font-size:14px; }
.pl-lrow__meta { font-size:12px; color:var(--muted); }
.pl-tag { font-size: 12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); background:var(--bg-hover); border-radius:5px; padding:1px 6px; vertical-align:middle; }
.pl-lrow__date { display:flex; align-items:center; gap:8px; }
.pl-lrow__date--none { color:var(--muted); font-size:13px; font-style:italic; }
.pl-lock { display:inline-flex; align-items:center; gap:3px; font-size:12px; color:var(--muted); cursor:pointer; }
.pl-lock input { width:auto; }
.pl-exc { display:flex; flex-direction:column; gap:6px; }
.pl-exc__row { display:flex; align-items:center; gap:12px; padding:8px 10px; border:1px solid var(--border); border-radius:9px; }
.pl-exc__date { font-weight:700; color:var(--ink); font-size:13.5px; min-width:120px; }
.pl-exc__date--edit { border:1px dashed var(--border); background:#fff; border-radius:8px; padding:5px 9px; font-family:inherit; cursor:pointer; text-align:left; }
.pl-exc__date--edit:hover { border-color:var(--blue); border-style:solid; color:var(--blue-dark); }
.pl-exc__type { font-size: 12px; font-weight:700; border-radius:5px; padding:2px 8px; }
.pl-exc__type--no_school { background:var(--error-bg); color:var(--error); }
.pl-exc__type--event { background:var(--panel-blue); color:var(--blue-dark); }
.pl-exc__type--note { background:var(--bg-hover); color:var(--body-alt); }
.pl-exc__note { flex:1; color:var(--body-alt); font-size:13px; }
.pl-exc__del { border:none; background:none; color:var(--error); font-size:12px; font-weight:700; cursor:pointer; }
.pl-hint { color:var(--muted); font-size:13.5px; font-style:italic; padding:4px 0; }
@media (max-width:600px) {
.pl-be__row{flex-direction:column;gap:10px}
.pl-head{flex-direction:column}
.pl-cell{flex-basis:36px}
}
/* ── Floating beta feedback widget ─────────────────────────────────────────── */
.fbw { position:fixed; right:18px; bottom:18px; z-index:99999; }
.fbw-btn { background:var(--blue); color:#fff; border:none; border-radius:999px; padding:12px 18px; font-size:14px; font-weight:700; cursor:pointer; box-shadow:0 6px 20px rgba(20,40,80,.25); font-family:inherit; }
.fbw-btn:hover { filter:brightness(1.05); }
.fbw-panel { display:none; width:330px; max-width:calc(100vw - 36px); background:#fff; border:1px solid #e6e9ee; border-radius:14px; box-shadow:0 12px 40px rgba(20,40,80,.22); overflow:hidden; }
.fbw--open .fbw-btn { display:none; }
.fbw--open .fbw-panel { display:block; }
.fbw-head { display:flex; align-items:center; justify-content:space-between; background:var(--blue); color:#fff; padding:11px 14px; }
.fbw-title { font-size:14px; font-weight:700; }
.fbw-min { background:transparent; border:none; color:#fff; font-size:22px; line-height:1; cursor:pointer; padding:0 6px; }
.fbw-body { padding:14px; }
.fbw-page { font-size:12px; color:#5a6472; margin-bottom:8px; }
.fbw-text { width:100%; box-sizing:border-box; font-family:inherit; font-size:14px; color:#1b2430; border:1px solid #d8dde4; border-radius:9px; padding:10px; resize:vertical; min-height:88px; line-height:1.45; }
.fbw-actions { display:flex; align-items:center; gap:10px; margin-top:10px; }
.fbw-save { background:var(--blue); color:#fff; border:none; border-radius:9px; padding:9px 16px; font-size:14px; font-weight:600; cursor:pointer; font-family:inherit; }
.fbw-save:disabled { opacity:.6; cursor:default; }
.fbw-status { font-size:12px; color:#5a6472; }
/* Row 897 (Lori 9/20): the microphone button, shown only where the browser can transcribe speech. */
.fbw-mic { display:none; align-items:center; justify-content:center; width:36px; height:36px; border-radius:9px; border:1px solid #d8dde4; background:#fff; color:#1b2430; cursor:pointer; padding:0; }
.fbw--canmic .fbw-mic { display:inline-flex; }
.fbw-mic--on { background:#c62828; border-color:#c62828; color:#fff; }
.fbw-full { display:inline-block; margin-top:12px; font-size:13px; color:var(--blue); font-weight:600; text-decoration:none; }
.fbw-full:hover { text-decoration:underline; }
@media print {
.fbw { display:none; }
}
/* Playgility logo files carry a white background; multiply melts it into any
   light surface so the mark never sits in a white box. */
img[src*="ldtpe-logo"], img[src*="ldtpe-mark"] { mix-blend-mode: multiply; }
/* ═══════════ Landing: Playgility (stats label + MTSS prevention model) ═══════════ */
.stats-eyebrow {
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--ats-teal-text);
  margin: 34px 0 14px;
}
.landing-mtss {
  position: relative;
  padding: 58px 38px 64px;
  background: var(--bg-page);
  border-top: 1px solid #EEF1EC;
  overflow: hidden;
}
.landing-mtss__inner { max-width: 1080px; margin: 0 auto; }
.landing-mtss__head { max-width: 640px; margin-bottom: 30px; }
.landing-mtss__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 31px;
  color: var(--ink);
  margin: 0 0 12px;
  letter-spacing: -.2px;
}
.landing-mtss__lead {
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--body-alt);
  font-weight: 500;
  margin: 0;
}
.mtss-model {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 44px;
  align-items: center;
}
.mtss-svgwrap { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.landing-mtss.is-in .mtss-svgwrap { opacity: 1; transform: none; }
.mtss-svg { width: 100%; height: auto; display: block; overflow: visible; }
.mtss-band { cursor: pointer; transition: filter .25s ease, opacity .25s ease; stroke: var(--bg-page); stroke-width: .7; }
.mtss-band--1 { fill: var(--blue); fill-opacity: .46; }
.mtss-band--1:not(.is-active) { fill-opacity: .68; }
.mtss-band--2 { fill: var(--gold); }
.mtss-band--3 { fill: var(--red); }
.mtss-band:hover { filter: brightness(1.06); }
.mtss-band:focus-visible { outline: none; stroke: var(--blue-darker); stroke-width: 1.4; }
.mtss-band.is-active { filter: none; }
.mtss-band--2:not(.is-active), .mtss-band--3:not(.is-active) { opacity: .82; }
.mtss-txt {
  /* SVG viewBox units (132x78), NOT screen px - exempt from the 12px UI floor */
  font-family: var(--font-display);
  fill: #FFFFFF;
  font-size: 7px;
  letter-spacing: .35px;
  text-anchor: middle;
  pointer-events: none;
}
.mtss-txt--1 { filter: drop-shadow(0 1px 1.5px rgba(16, 38, 58, .6)); }
.mtss-brand { filter: drop-shadow(0 .6px 1.2px rgba(16, 38, 58, .35)); pointer-events: none; }
.mtss-brand__pill { fill: #FFFFFF; }
.mtss-txt--2 { fill: #5C3F04; font-size: 4px; }
/* small enough that FEW stays inside the narrow red tip once the pyramid
   settles into the prevention shape (Tanner 8/17) */
.mtss-txt--3 { fill: #FFFFFF; font-size: 3px; letter-spacing: .2px; }
.mtss-side {
  /* SVG viewBox units - exempt from the 12px UI floor */
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 4.5px;
  text-anchor: end;
  pointer-events: none;
}
.mtss-side--1 { fill: var(--blue-dark); }
.mtss-side--2 { fill: var(--gold-text); }
.mtss-side--3 { fill: var(--red-deep); }
.landing-proof {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 14px;
}
.landing-proof__item {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 18px;
}
.landing-proof__stat {
  font-family: var(--font-display);
  font-size: 27px;
  color: var(--blue-dark);
  line-height: 1;
}
.landing-proof__text {
  font-size: 13px;
  line-height: 1.5;
  color: var(--body-alt);
  font-weight: 600;
}
/* One line of context under the results (Tanner 9/15): where the numbers come from, and a call instead of a report. */
.landing-proof__note {
  margin: 10px 2px 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--body-alt);
}
.landing-proof__note a { color: var(--blue-dark); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.landing-proof__note a:hover { color: var(--blue); }
@media (max-width: 900px) {
.landing-proof { grid-template-columns: 1fr; }
}
/* 9/29 (Tanner): the homepage MTSS model is a teardrop after the Playgility one-sheet (ldtpe_mtss_teardrop_svg);
   fills live in the SVG, these rules set its type and the tier buttons. */
.mtss-td .mtss-td__tier { font-family: var(--font-display); text-anchor: middle; letter-spacing: .5px; pointer-events: none; fill: #FFFFFF; }
.mtss-td .mtss-td__tier--3 { font-size: 3.6px; }
.mtss-td .mtss-td__tier--2 { font-size: 4.6px; }
.mtss-td--bts .mtss-td__tier--2 { fill: #3A2A06; }
.mtss-td .mtss-td__tier--1 { font-size: 6.4px; filter: drop-shadow(0 .5px 1px rgba(0,0,0,.6)); }
.mtss-td__brand { pointer-events: none; filter: drop-shadow(0 .5px 1.2px rgba(0,0,0,.45)); }
.mtss-td .mtss-side { font-size: 3.9px; opacity: .72; transition: opacity .2s ease; }
.mtss-td .mtss-side.is-active { opacity: 1; }
.mtss-hit { fill: #FFFFFF; fill-opacity: 0; cursor: pointer; stroke: none; transition: fill-opacity .2s ease; outline: none; }
.mtss-hit:hover { fill-opacity: .1; }
.mtss-hit.is-active { fill-opacity: .16; }
.mtss-hit:focus-visible { fill-opacity: .22; }
.mtss-svgtitle {
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: 1.4px;
  color: var(--ink);
  text-align: center;
  margin-bottom: 10px;
}
.mtss-caption {
  margin-top: 12px;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--caption);
}
.mtss-panels { position: relative; min-height: 190px; }
.mtss-panel {
  position: absolute;
  inset: 0;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 26px 28px;
  box-shadow: 0 24px 44px -32px rgba(30,78,120,.4);
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .35s ease, transform .35s ease;
}
.mtss-panel.is-active { opacity: 1; transform: none; pointer-events: auto; position: relative; }
.mtss-panel__badge {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .8px;
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 12px;
}
.mtss-panel__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 20px;
  color: var(--ink);
  margin: 0 0 8px;
}
.mtss-panel__body {
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--body-alt);
  font-weight: 500;
  margin: 0;
}
@media (prefers-reduced-motion: reduce) {
.mtss-svgwrap, .mtss-panel { transition: none !important; }
.landing-mtss .mtss-svgwrap { opacity: 1; transform: none; }
}
@media (max-width: 900px) {
.mtss-model { grid-template-columns: 1fr; gap: 28px; }
.mtss-panels { min-height: 220px; }
}
/* ═══════════ Landing: Building Trusted Spaces band ═══════════ */
/* Distinct from the rest of the landing page on purpose: the deep-teal
   A Trusted Space® room, with a typographic Building Trusted Spaces lockup.
   Light-on-dark pairs here all measure 10:1 or better. */
.landing-bts {
  position: relative;
  padding: 62px 38px 66px;
  background:
    radial-gradient(900px 420px at 78% 18%, rgba(0,168,150,.28), transparent 62%),
    radial-gradient(700px 380px at 12% 92%, rgba(0,86,78,.35), transparent 60%),
    linear-gradient(165deg, #003930 0%, #00120E 58%, #000202 100%);
  overflow: hidden;
}
.landing-bts__inner {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: center;
}
.landing-bts__logo { display: block; width: 100%; max-width: 180px; height: auto; margin: 0 0 16px; }
.landing-bts__eyebrow {
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: 1px;
  color: #6FDECC;
  margin-bottom: 12px;
}
.landing-bts h2 {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 31px;
  color: #FFFFFF;
  margin: 0 0 10px;
  letter-spacing: -.2px;
  line-height: 1.08;
}
.landing-bts__lead {
  font-size: 16.5px;
  line-height: 1.55;
  color: #6FDECC;
  font-weight: 700;
  margin: 0 0 14px;
  max-width: 520px;
}
.landing-bts__body {
  font-size: 15.5px;
  line-height: 1.65;
  color: #EAF7F4;
  font-weight: 500;
  margin: 0 0 18px;
  max-width: 560px;
}
.landing-bts__body strong { color: #FFFFFF; font-weight: 800; }
.landing-bts__features {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-bottom: 24px;
}
.landing-bts__feature {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 14px;
  color: #EAF7F4;
  font-weight: 600;
  line-height: 1.45;
}
.landing-bts__feature-check {
  color: #6FDECC;
  font-weight: 800;
  font-size: 14px;
  line-height: 1.45;
}
.landing-bts__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.landing-bts__note {
  margin: 14px 0 0;
  font-size: 13px;
  font-weight: 600;
  color: #9CCFC6;
}
.landing-bts__mark {
  justify-self: center;
  padding: 36px 40px;
  border: 1.5px solid rgba(111,222,204,.4);
  border-radius: 18px;
  background: rgba(255,255,255,.03);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,.6), 0 0 60px rgba(0,168,150,.12) inset;
}
.landing-bts__mark-ait {
  font-family: var(--font-display);
  font-size: 14px;
  letter-spacing: 2px;
  color: #6FDECC;
  margin-bottom: 12px;
}
.landing-bts__mark-name {
  font-family: 'Anton', sans-serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 1.08;
  letter-spacing: .5px;
  color: #FFFFFF;
  text-transform: uppercase;
}
.landing-bts__mark-rule {
  margin-top: 18px;
  width: 64px;
  height: 4px;
  border-radius: 2px;
  background: #6FDECC;
}
@media (max-width: 900px) {
.landing-bts__inner { grid-template-columns: 1fr; gap: 30px; }
.landing-bts__mark { order: -1; justify-self: start; padding: 26px 30px; }
.landing-bts__mark-name { font-size: 36px; }
}
/* ── Landing: one license, the whole campus (feedback 667, 9/11) ── */
.landing-scope {
  position: relative;
  padding: 58px 38px 60px;
  background: #F7FAF8;
  border-top: 1px solid #EEF1EC;
}
.landing-scope__inner { max-width: 1080px; margin: 0 auto; }
.landing-scope__head { max-width: 720px; margin-bottom: 28px; }
.landing-scope__brand { margin-bottom: 16px; border: 1px solid #EEF1EC; }
.landing-scope__brand img { height: 34px; }
.landing-scope__title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 31px;
  color: var(--ink);
  margin: 0 0 12px;
  letter-spacing: -.2px;
  line-height: 1.08;
}
.landing-scope__lead {
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--body-alt);
  font-weight: 500;
  margin: 0;
}
.scope-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.scope-tiles--3 { grid-template-columns: repeat(3, 1fr); gap: 18px; }
.landing-scope__more { display: inline-block; margin-top: 22px; font-family: var(--font-heading); font-weight: 800; font-size: 15px; color: var(--blue-dark); text-decoration: none; border-bottom: 2px solid var(--panel-blue); padding-bottom: 2px; }
.landing-scope__more:hover { border-bottom-color: var(--blue-dark); }
.scope-tile {
  display: block;
  text-decoration: none;
  background: var(--white);
  border: 1px solid #E6E9EE;
  border-radius: 18px;
  padding: 26px 28px 24px;
  box-shadow: 0 10px 36px -24px rgba(20,40,80,.35);
  transition: transform .15s ease, box-shadow .15s ease;
}
.scope-tile:hover { transform: translateY(-2px); box-shadow: 0 16px 40px -22px rgba(20,40,80,.45); }
.scope-tile--pg { border-top: 5px solid var(--blue-dark); }
.scope-tile--bts { border-top: 5px solid var(--ats-teal, #00A896); }
.scope-tile__eyebrow { font-family: var(--font-display); font-size: 12.5px; letter-spacing: 1px; color: var(--blue-dark); margin-bottom: 6px; }
.scope-tile--bts .scope-tile__eyebrow { color: var(--ats-teal-text); }
.scope-tile__title { font-family: var(--font-heading); font-weight: 800; font-size: 24px; color: var(--ink); margin: 0 0 10px; line-height: 1.1; }
.scope-tile__text { font-size: 15px; line-height: 1.6; color: var(--body-alt); font-weight: 500; margin: 0 0 14px; }
.scope-tile__more { font-family: var(--font-heading); font-weight: 800; font-size: 14.5px; color: var(--blue-dark); }
.scope-tile--bts .scope-tile__more { color: var(--ats-teal-text); }
.landing-bts__editions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.landing-bts__edition {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 13.5px;
  letter-spacing: .2px;
  color: #FFFFFF;
  background: rgba(111,222,204,.14);
  border: 1px solid rgba(111,222,204,.45);
  border-radius: 999px;
  padding: 6px 13px;
}
@media (max-width: 900px) {
.landing-scope { padding: 44px 22px 48px; }
.scope-tiles, .scope-tiles--3 { grid-template-columns: 1fr; }
.scope-tile { padding: 22px 20px 20px; }
}
/* ── Homepage: community schools band (row 911) and administrator FAQ (row 913), 9/24 ── */
.landing-cs { background: var(--white); }
.scope-tiles--4 { grid-template-columns: repeat(4, 1fr); gap: 16px; }
.scope-tile--static { cursor: default; }
.scope-tile--static:hover { transform: none; box-shadow: 0 10px 36px -24px rgba(20,40,80,.35); }
.scope-tiles--4 .scope-tile { padding: 22px 22px 20px; }
.scope-tiles--4 .scope-tile__title { font-size: 19px; line-height: 1.2; }
.scope-tiles--4 .scope-tile__text { font-size: 14.5px; margin: 0; }
.landing-faq { padding: 58px 38px 64px; background: #F7FAF8; border-top: 1px solid #EEF1EC; }
.landing-faq__inner { max-width: 820px; margin: 0 auto; }
.landing-faq__title { font-family: var(--font-heading); font-weight: 800; font-size: 31px; color: var(--ink); margin: 0 0 20px; letter-spacing: -.2px; line-height: 1.08; }
.landing-faq__list { border-top: 1px solid #E3E8E4; }
.landing-faq__item { border-bottom: 1px solid #E3E8E4; }
.landing-faq__item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 17px 2px; font-family: var(--font-heading); font-weight: 800; font-size: 18px; color: var(--ink); }
.landing-faq__item summary::-webkit-details-marker { display: none; }
.landing-faq__item summary::after { content: ""; flex: 0 0 auto; width: 9px; height: 9px; border-right: 2.5px solid var(--blue-dark); border-bottom: 2.5px solid var(--blue-dark); transform: rotate(45deg); margin-right: 6px; transition: transform .15s ease; }
.landing-faq__item[open] summary::after { transform: rotate(-135deg); }
.landing-faq__item summary:focus-visible { outline: 2px solid var(--blue-dark); outline-offset: 2px; border-radius: 6px; }
.landing-faq__item p { margin: 0 0 18px; padding: 0 2px; font-size: 15.5px; line-height: 1.65; color: var(--body-alt); font-weight: 500; max-width: 720px; }
.landing-faq__item p a { color: var(--blue-dark); font-weight: 700; }
.landing-faq__cta { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 26px; }
.landing-faq__cta .landing-scope__more { margin-top: 0; }
@media (max-width: 1080px) {
.scope-tiles--4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
.scope-tiles--4 { grid-template-columns: 1fr; }
.landing-faq { padding: 44px 22px 48px; }
.landing-faq__title { font-size: 24px; }
.landing-faq__item summary { font-size: 16.5px; }
}
/* ── About page (/about/): the detail behind the homepage lines ── */
.about-top { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); border-bottom: 1px solid #EEF1EC; }
.about-top__inner { max-width: 1080px; margin: 0 auto; padding: 12px 38px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.about-top__brand img { height: 30px; display: block; }
.about-top__nav { display: flex; gap: 18px; align-items: center; font-family: var(--font-heading); font-weight: 800; font-size: 14.5px; }
.about-top__nav a { color: var(--body-alt); text-decoration: none; }
.about-top__nav a:hover { color: var(--ink); }
.about-top__nav .btn { padding: 9px 16px; font-size: 14px; }
.about-hero { padding: 54px 38px 22px; }
.about-hero__inner { max-width: 1080px; margin: 0 auto; }
.about-hero h1 { font-family: var(--font-heading); font-weight: 800; font-size: 40px; line-height: 1.05; color: var(--ink); margin: 0 0 14px; letter-spacing: -.3px; max-width: 760px; }
.about-hero__lead { font-size: 17px; line-height: 1.65; color: var(--body-alt); font-weight: 500; margin: 0; max-width: 720px; }
.about-band { padding: 40px 38px 46px; }
.about-band--tint { background: #F7FAF8; border-top: 1px solid #EEF1EC; border-bottom: 1px solid #EEF1EC; }
.about-band__inner { max-width: 1080px; margin: 0 auto; }
.about-band__head { max-width: 720px; margin-bottom: 22px; }
.about-band__title { font-family: var(--font-heading); font-weight: 800; font-size: 30px; line-height: 1.08; color: var(--ink); margin: 0 0 10px; letter-spacing: -.2px; }
.about-band__lead { font-size: 15.5px; line-height: 1.65; color: var(--body-alt); font-weight: 500; margin: 0; }
.scope-card {
  background: var(--white);
  border: 1px solid #E6E9EE;
  border-radius: 18px;
  padding: 26px 28px 24px;
  box-shadow: 0 10px 36px -24px rgba(20,40,80,.35);
}
.scope-card--pg { border-top: 5px solid var(--blue-dark); }
.scope-card--bts { border-top: 5px solid var(--ats-teal, #00A896); }
.scope-card__logo { display: block; width: 100%; max-width: 160px; height: auto; margin: 0 0 14px; }
.scope-card__eyebrow { font-family: var(--font-display); font-size: 12.5px; letter-spacing: 1px; color: var(--blue-dark); margin-bottom: 6px; }
.scope-card--bts .scope-card__eyebrow { color: var(--ats-teal-text); }
.scope-card__title { font-family: var(--font-heading); font-weight: 800; font-size: 24px; color: var(--ink); margin: 0 0 14px; line-height: 1.1; }
.scope-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 26px; }
.scope-list li { position: relative; padding-left: 22px; font-size: 14.5px; line-height: 1.55; color: var(--body-alt); font-weight: 500; }
.scope-list li::before { content: ''; position: absolute; left: 0; top: .55em; width: 10px; height: 10px; border-radius: 50%; background: var(--panel-blue); border: 2px solid var(--blue-dark); box-sizing: border-box; }
.scope-card--bts .scope-list li::before { background: var(--panel-teal); border-color: var(--ats-teal, #00A896); }
.scope-list li strong { color: var(--ink); font-weight: 800; }
.about-editions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 22px; }
.about-edition { background: var(--white); border: 1px solid #E6E9EE; border-radius: 16px; padding: 20px 22px; box-shadow: 0 8px 24px -18px rgba(18,48,42,.35); }
.about-edition__logo { display: block; width: 100%; max-width: 180px; height: auto; margin: 0 0 14px; }
.about-edition__who { font-size: 13.5px; line-height: 1.55; color: var(--body-alt); margin: 0; }
.about-edition__note { font-size: 12.5px; line-height: 1.55; color: var(--muted); margin: 10px 0 0; padding-top: 10px; border-top: 1px solid #EEF1EC; }
.about-cta { padding: 46px 38px 60px; text-align: center; }
.about-cta__inner { max-width: 640px; margin: 0 auto; }
.about-cta h2 { font-family: var(--font-heading); font-weight: 800; font-size: 28px; color: var(--ink); margin: 0 0 10px; }
.about-cta p { font-size: 15.5px; line-height: 1.6; color: var(--body-alt); margin: 0 0 20px; }
.about-cta__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 900px) {
.about-top__inner, .about-hero, .about-band, .about-cta { padding-left: 22px; padding-right: 22px; }
.about-hero h1 { font-size: 32px; }
.scope-list { grid-template-columns: 1fr; }
.about-editions { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
.about-editions { grid-template-columns: 1fr; }
}
/* ══════════════════════════════════════════════
   ACTIVITIES: directory cards + printable sheet
   ══════════════════════════════════════════════ */
.act-card { display: flex; flex-direction: column; }
.act-card__photo {
  width: calc(100% + 36px);
  margin: -18px -18px 12px;
  height: 120px;
  object-fit: cover;
  border-radius: 14px 14px 0 0;
}
.act-card--locked .act-card__photo { filter: grayscale(.7); opacity: .7; }
/* ── Crop focus (Tanner 8/25): the 120px cover-crops on the activity cards and
   training rail were slicing subjects at the vertical center — legs instead of
   faces. Per-photo object-position keeps the important part of each photo in
   the band wherever the file is cropped. Full-aspect uses ignore this. ── */
img[src*="photo-hi-ya"]              { object-position: 50% 15%; }
img[src*="photo-helium-stick"]       { object-position: 50% 12%; }
img[src*="photo-foxtails-grab"]      { object-position: 50% 30%; }
img[src*="photo-huddle-race"]        { object-position: 50% 30%; }
img[src*="photo-beach-ball-party"]   { object-position: 50% 30%; }
img[src*="photo-catch-the-move"]     { object-position: 50% 35%; }
img[src*="photo-bear-salmon-mosquito"]{ object-position: 50% 35%; }
img[src*="photo-castle-ball"]        { object-position: 50% 40%; }
img[src*="photo-hula-hoop-pass"]     { object-position: 50% 40%; }
img[src*="photo-group-juggle-circle"]{ object-position: 50% 45%; }
img[src*="photo-intro-muscles"]      { object-position: 50% 25%; }
img[src*="photo-u-matter-relay"]{ object-position: 50% 35%; }
img[src*="photo-graduation"]         { object-position: 50% 45%; }
img[src*="photo-invention-factory"]  { object-position: 50% 22%; }
img[src*="photo-masterpiece"]        { object-position: 50% 40%; }
img[src*="photo-shoulders-touchdown"]{ object-position: 50% 28%; }
img[src*="photo-pick-me-popcorn"]    { object-position: 50% 22%; }
img[src*="photo-dash-derby"]         { object-position: 50% 40%; }
img[src*="photo-gator-frenzy"]       { object-position: 50% 45%; }
img[src*="photo-jousting-jets"]      { object-position: 50% 40%; }
img[src*="photo-picture-pipeline"]   { object-position: 50% 45%; }
img[src*="photo-four-corner-frenzy"] { object-position: 50% 40%; }
img[src*="photo-minefield-crossing"] { object-position: 50% 45%; }
.act-card--locked .cur-card__name { color: var(--body-alt); }
.act-card__meta {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--body-alt);
  margin-top: 4px;
}
.act-card__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 14px;
}
.act-card__actions--locked { display: none; }
.act-card--locked .act-card__actions--open { display: none; }
.act-card--locked .act-card__actions--locked { display: flex; }
.act-card__btn {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  color: var(--blue-dark);
  background: var(--panel-blue);
  padding: 8px 13px;
  border-radius: 9px;
}
.act-card__btn--primary { background: var(--blue); color: var(--white); }
/* Three actions per card (row 370): share the row evenly, and wrap rather than
   letting a label run outside its pill on a narrow card. */
.act-card__actions--three { gap: 6px; flex-wrap: wrap; }
.act-card__actions--three .act-card__btn {
  flex: 1 1 auto;
  min-width: max-content;
  padding: 8px 8px;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
}
@media (max-width: 1100px) {
.act-card__actions--three .act-card__btn { font-size: 11.5px; padding: 8px 6px; }
}
.act-card__btn--play { background: var(--panel-gold); color: var(--gold-text); }
.act-back { display: inline-block; margin-bottom: 10px; }
.act-card__locknote {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--body-alt);
  flex-basis: 100%;
}
.act-sheet__section { margin-top: 22px; }
.act-sheet__text {
  font-size: 13.5px;
  color: var(--body);
  line-height: 1.62;
  margin-top: 8px;
}
.act-sheet__equip { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.act-sheet__equip-item {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--body);
  background: var(--bg-sidebar);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 10px;
}
.act-sheet__debrief {
  margin: 8px 0 0;
  padding-left: 22px;
}
.act-sheet__debrief li {
  font-size: 13.5px;
  color: var(--body);
  line-height: 1.55;
  padding: 3px 0;
}
.act-sheet__sub-label {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--blue-dark);
  margin-top: 14px;
}
.act-sheet__mylist { margin: 6px 0 0; padding-left: 22px; }
.act-sheet__mylist li { font-size: 13.5px; color: var(--ink); font-weight: 600; line-height: 1.55; padding: 3px 0; }
.act-sheet__note {
  font-size: 13.5px;
  color: var(--ink);
  line-height: 1.6;
  background: var(--panel-lavender-light);
  border: 1px solid var(--border-lavender);
  border-radius: 10px;
  padding: 12px 14px;
  margin-top: 8px;
}
/* ── Materials Library (rows 448/453/454): compact button on the directory + the order table ── */
.act-mat-banner {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--border-teal, #cde8e4);
  border-left: 4px solid var(--teal, #00B4A8);
  border-radius: 12px;
  padding: 10px 18px;
  margin: 0 0 26px;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(20, 40, 80, .05);
  transition: box-shadow .15s, transform .15s;
}
.act-mat-banner:hover { box-shadow: 0 8px 22px rgba(20, 40, 80, .1); transform: translateY(-1px); }
.act-mat-banner__icon { display: inline-flex; color: var(--teal-text, #007A6E); }
.act-mat-banner__icon svg { width: 22px; height: 22px; }
.act-mat-banner__title { font-family: var(--font-heading); font-weight: 800; font-size: 15.5px; color: var(--ink); }
.act-mat-banner__go { font-weight: 800; font-size: 15px; color: var(--teal-text, #007a72); white-space: nowrap; }
/* ── My Plans PE calendar (row 452): month grids from the year plan ── */
.mpc {
  background: #fff;
  border: 1px solid #e6e9ee;
  border-radius: 16px;
  padding: 16px 18px 18px;
  box-shadow: 0 4px 18px rgba(20, 40, 80, .05);
}
.mpc__bar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.mpc__nav {
  width: 32px; height: 32px;
  border: 1px solid #d8dde4; background: #fff; border-radius: 9px;
  font-size: 16px; font-weight: 700; color: #2d3742; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.mpc__nav:disabled { opacity: .35; cursor: default; }
.mpc__label { font-family: var(--font-heading); font-weight: 800; font-size: 16.5px; color: var(--ink); min-width: 148px; text-align: center; }
.mpc__legend { margin-left: auto; display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: #5a6472; font-weight: 600; }
.mpc__legend-item { display: inline-flex; align-items: center; gap: 6px; }
.mpc__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.mpc__dow { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; color: #7a828f; text-align: center; padding: 3px 0; text-transform: uppercase; }
.mpc__cell { min-height: 62px; border: 1px solid #eef1f5; border-radius: 9px; padding: 4px 5px; background: #fff; min-width: 0; }
.mpc__cell--pad { border-color: transparent; background: transparent; }
.mpc__cell--off { background: #F7F9FB; }
.mpc__cell--today { box-shadow: inset 0 0 0 2px var(--blue); }
.mpc__date { font-size: 11px; font-weight: 700; color: #7a828f; display: block; margin-bottom: 2px; }
.mpc__chip {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700; line-height: 1.35;
  border-radius: 6px; padding: 2px 6px; margin-top: 2px;
  text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mpc__chip--lesson { background: var(--blue); color: #fff; }
a.mpc__chip--lesson:hover { filter: brightness(1.12); }
.mpc__chip--soon { opacity: .55; }
.mpc__chip--pe { background: #E4F5F3; color: #04665F; }
a.mpc__chip--pe:hover { background: #CFEDE9; }
.mpc__chip--mut { background: #F1F3F6; color: #7a828f; font-weight: 600; }
.mpc__dot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 7px; }
@media (max-width: 700px) {
.mpc__cell { min-height: 42px; padding: 3px 3px; }
.mpc__chip { font-size: 9px; padding: 1px 3px; gap: 3px; }
.mpc__legend { margin-left: 0; width: 100%; }
}
.act-mat__yours {
  font-size: 13.5px;
  color: var(--ink);
  line-height: 1.55;
  background: var(--panel-teal-light, #eefaf8);
  border: 1px solid var(--border-teal, #cde8e4);
  border-radius: 10px;
  padding: 11px 14px;
  margin-top: 10px;
}
.act-mat__scroll { overflow-x: auto; margin-top: 10px; }
.act-mat__table { width: 100%; border-collapse: collapse; font-size: 13px; }
.act-mat__table th {
  text-align: center;
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: .05em;
  color: var(--blue-dark);
  padding: 8px 8px 6px;
  border-bottom: 2px solid var(--border, #e6e9ee);
  white-space: nowrap;
}
.act-mat__table td {
  padding: 9px 8px;
  border-bottom: 1px solid var(--border, #eef1f5);
  text-align: center;
  color: var(--ink);
  font-weight: 700;
  vertical-align: top;
}
.act-mat__table .act-mat__item-col { text-align: left; min-width: 220px; }
.act-mat__item { font-weight: 800; color: var(--ink); }
.act-mat__note { font-size: 12px; color: var(--body); font-weight: 400; line-height: 1.5; margin-top: 2px; }
.act-mat__used { font-size: 12px; color: var(--body); font-weight: 600; white-space: nowrap; vertical-align: top; }
.act-mat__usedyear { display: flex; gap: 8px; align-items: flex-start; line-height: 1.5; }
.act-mat__usedyear + .act-mat__usedyear { margin-top: 4px; }
.act-mat__usedlbl { flex: 0 0 auto; font-family: 'Barlow Semi Condensed', sans-serif; font-weight: 800; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--teal-text, #007a72); padding-top: 2px; }
.act-mat__usedlist { font-variant-numeric: tabular-nums; }
.act-mat__table .act-mat__hl { background: var(--panel-teal-light, #eefaf8); }
.act-mat__table th.act-mat__hl { color: var(--teal-text, #007a72); }
@media print {
.act-mat-banner { display: none; }
.act-mat__scroll { overflow: visible; }
.act-mat__table .act-mat__hl { background: #eefaf8 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.trn-page--bts .progress-bar{background:rgba(255,255,255,.15)}
/* ── Fella motion, two gears (gen2 handoff spec) ──────────────────────────
   calm = rail: slow idle only. lively = overview / checkpoint / celebration:
   idle on the inner svg plus a periodic whole-figure accent on the wrapper
   (the approved SVGs expose no per-part groups, so accents approximate each
   lesson's brief with whole-figure moves). Motion pauses after ~8s without
   user activity (html.ldtpe-fella-still, set by the player); pausing holds
   the current pose, amplitudes are small enough that the hold reads as rest. */
[data-gear="calm"] { animation: fellaIdle 4.2s ease-in-out infinite; }
[data-gear="lively"] svg { animation: fellaIdle 4.2s ease-in-out infinite; }
@keyframes fellaIdle {
  0%, 100% { transform: translateY(1px) rotate(-.5deg); }
  50% { transform: translateY(-6px) rotate(.5deg); }
}
@keyframes fellaAccLeap   { 0%,14%,100% { transform: none; } 4% { transform: translateY(-15px); } 8% { transform: translateY(-17px); } 11% { transform: translateY(-14px); } }
@keyframes fellaAccHop    { 0%,14%,100% { transform: none; } 3% { transform: translateY(-10px); } 6% { transform: none; } 9% { transform: translateY(-7px); } 12% { transform: none; } }
@keyframes fellaAccLean   { 0%,16%,100% { transform: none; } 5%,11% { transform: rotate(-4deg) translateX(-3px); } }
@keyframes fellaAccBurst  { 0%,15%,100% { transform: none; } 4% { transform: scale(1.07) rotate(-3deg); } 9% { transform: scale(1.04) rotate(-2deg); } }
@keyframes fellaAccWiggle { 0%,16%,100% { transform: none; } 3% { transform: rotate(-3deg); } 6% { transform: rotate(3deg); } 9% { transform: rotate(-2deg); } 12% { transform: rotate(2deg); } }
@keyframes fellaAccShine  { 0%,16%,100% { filter: brightness(1); transform: none; } 5%,10% { filter: brightness(1.22); transform: translateY(-3px); } }
@keyframes fellaAccStride { 0%,16%,100% { transform: none; } 5% { transform: translateX(4px) translateY(-3px); } 10% { transform: translateX(5px); } }
@keyframes fellaAccGlide  { 0%,18%,100% { transform: none; } 5% { transform: translateX(9px) rotate(1.5deg); } 11% { transform: translateX(10px); } }
@keyframes fellaAccPuff   { 0%,15%,100% { transform: none; } 5%,10% { transform: scale(1.06); } }
@keyframes fellaAccTip    { 0%,15%,100% { transform: none; } 5%,9% { transform: rotate(5deg); } }
@keyframes fellaAccNod    { 0%,14%,100% { transform: none; } 3% { transform: rotate(3deg); } 6% { transform: none; } 9% { transform: rotate(2deg); } }
@keyframes fellaIdleRoll {
  0%, 100% { transform: translateX(-4px) rotate(-.6deg); }
  50% { transform: translateX(4px) rotate(.6deg); }
}
html.ldtpe-fella-still [data-gear],
html.ldtpe-fella-still [data-gear] svg { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
.trn-rail__fella, .trn-screen__fella, .trn-complete__fella,
  [data-gear], [data-gear] svg { animation: none !important; }
}
/* Faces + motion */
@keyframes btsFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes btsFaceIn{from{transform:translateY(26px) scale(.7);opacity:0}to{transform:none;opacity:1}}
.trn-page--bts .btn-primary{background:var(--bts-accent);color:var(--bts-btn-ink)}
.trn-page--bts .btn-success{background:#2FBF71;color:#06110D}
.trn-page--bts .btn-outline{background:transparent;border-color:color-mix(in srgb, var(--bts-glow) 45%, transparent);color:#fff}
/* The trauma content (part 3) must never strobe or lurch */
/* Real photos (jpg) in a beat render wider than transparent art, no glow */
.trn-artimg img[src$=".jpg"] { max-width: min(640px, 100%); border-radius: 14px; }
.trn-page--bts .trn-artimg img[src$=".jpg"] { filter: none; }
.trn-aside .trn-artimg img,
.trn-aside .trn-artimg img[src$=".jpg"] {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(100vh - 250px);
  object-fit: unset;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(31, 41, 26, .16);
}
/* ── Easy read (accessibility) mode ──────────────────────────────────────
   Flipped by the "Aa Easy read" toggle on the Trusted Spaces hub and the
   b-module player. Larger type, taller line-height, stronger contrast, and
   the decorative layers turned down, for anyone who wants plainer pages. */
.ldtpe-easy-toggle{display:inline-flex;align-items:center;gap:7px;background:#fff;border:2px solid #C2CEC7;border-radius:999px;padding:7px 14px;font-family:'Mulish',sans-serif;font-weight:800;font-size:13.5px;color:#22312A;cursor:pointer;line-height:1}
.ldtpe-easy-toggle__icon{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:14px;line-height:1;background:#12302A;color:#fff;border-radius:6px;padding:3px 6px}
.ldtpe-easy-toggle:hover{border-color:#12302A}
.ldtpe-easy-toggle:focus-visible{outline:3px solid #2988C9;outline-offset:2px}
html.ldtpe-easy .ldtpe-easy-toggle{background:#12302A;color:#fff;border-color:#12302A}
/* Page mode toggle (row 631) follows its own switch, not easy read */
html.ldtpe-easy .ldtpe-easy-toggle.trn-pagemode-toggle{background:#fff;color:#22312A;border-color:#C2CEC7}
html.ldtpe-pagemode .ldtpe-easy-toggle.trn-pagemode-toggle{background:#12302A;color:#fff;border-color:#12302A}
html.ldtpe-easy .ldtpe-easy-toggle__icon{background:#fff;color:#12302A}
.bts-top__right{display:flex;align-items:center;gap:16px}
/* The Building Trusted Spaces shell (row 758, Tanner 9/18: "one product, one look"): the hub and the
   advice library carry the dashboard's dark evergreen room and mint accents. Shared here so the two
   templates cannot drift; each template styles only its own sections inline. */
.bts-hub{--bh-bg:#0C332C;--bh-bg-img:radial-gradient(120% 70% at 85% 0%,#0A6154 0%,#0C4339 38%,#0C332C 78%);--bh-ink:#DFF5F1;--bh-glow:#6FDECC;--bh-glow2:#8BE9DA;--bh-glow-rgb:111,222,204;--bh-dim:#B9DAD3;--bh-soft:#C9E9E2;--bh-mid:#8FD9CB;--bh-deep:#00120E;--bh-media:#0E2B26;--bh-media2:#00564E;--bh-lamp:#E9B44C;--bh-scrim-rgb:0,18,14;--bh-bg-rgb:12,51,44;--bh-dim2:#8FB8B0;--bh-ink2:#20302A;--bh-easy-ink:#12302A;--bh-playscrim:rgba(6,17,13,.72);
  --bh-spine:linear-gradient(#2988C9,#00A896,#782484,#5BBE54,#F5822A,#F03C24,#E24E9C,#2988C9);
  --bh-p-ink:#0E2B26;--bh-p-body:#33514A;--bh-p-muted:#5F7A73;--bh-p-accent:#007A6E;--bh-p-deep:#00564E;--bh-p-tint:#DFF5F1;--bh-p-tint2:#EDF5F1;--bh-p-tint2-rgb:237,245,241;--bh-p-deep-rgb:0,86,78;--bh-p-rule:rgba(14,43,38,.12);
  /* Longhands, not the background shorthand: a <color> is only legal in the shorthand's LAST
     layer, so an edition whose --bh-bg-img is two stacked gradients would invalidate the whole
     declaration and drop the ground to white (caught 9/21). */
  min-height:100vh;background-color:var(--bh-bg);background-image:var(--bh-bg-img);background-repeat:no-repeat;color:var(--bh-ink)}
/* School counselor edition (Tanner 9/21): the hub, the advice library and the share sheet wear
   the colors of the film set the counselor clips were shot on — aubergine ground, a violet glow
   low and left, a dusty mauve haze up and right. One palette swap, same tokens. */
.bts-ed-c .bts-hub{--bh-bg:#1E1530;--bh-bg-img:radial-gradient(85% 90% at 6% 108%,rgba(124,116,230,.52) 0%,rgba(124,116,230,0) 58%),radial-gradient(120% 70% at 85% 0%,#5C4353 0%,#3A2A44 38%,#1E1530 78%);--bh-ink:#F2EBE7;--bh-glow:#C2B9F8;--bh-glow2:#D4CDFA;--bh-glow-rgb:194,185,248;--bh-dim:#DDD1CB;--bh-soft:#EFE6E1;--bh-mid:#DCCFD6;--bh-deep:#17102A;--bh-media:#241833;--bh-media2:#45308A;--bh-scrim-rgb:24,16,40;--bh-bg-rgb:30,21,48;--bh-dim2:#C9BAB9;--bh-ink2:#2B1F2E;--bh-easy-ink:#2A1E45;--bh-playscrim:rgba(24,14,32,.72);
  --bh-spine:linear-gradient(#4F5FCC,#7A5ADB,#A34FC0,#8494EC,#B5748F,#C26A76,#CD64B2,#4F5FCC);
  --bh-p-ink:#111111;--bh-p-body:#1A1A1A;--bh-p-muted:#3A3A3A;--bh-p-accent:#5A3FA6;--bh-p-deep:#45308A;--bh-p-tint:#FFFFFF;--bh-p-tint2:#F4EFEC;--bh-p-tint2-rgb:244,239,236;--bh-p-deep-rgb:69,48,138;--bh-p-rule:rgba(17,17,17,.14)}
.bts-top{display:flex;justify-content:space-between;align-items:center;max-width:1020px;margin:0 auto;padding:18px 24px 0}
.bts-top__back,.bts-top__signout{font-size:13.5px;font-weight:800;color:var(--bh-dim,#B9DAD3);text-decoration:none}
.bts-top__back:hover,.bts-top__signout:hover{color:#fff}
.bts-wrap{max-width:1020px;margin:0 auto;padding:26px 24px 60px}
.bts-strap{display:flex;align-items:center;gap:14px;max-width:860px;margin:0 auto 22px;font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.14em;color:var(--bh-glow,#6FDECC);text-align:center}
.bts-strap::before,.bts-strap::after{content:"";flex:1;height:1px;background:rgba(var(--bh-glow-rgb,111,222,204),.3)}
@media (max-width:640px){.bts-strap{font-size:10.5px;letter-spacing:.1em;line-height:1.4}}
html.ldtpe-easy .trn-content .blob{display:none}
/* the Trusted Spaces hub */
html.ldtpe-easy .bts-wrap{zoom:1.12}
html.ldtpe-easy .bts-head__lead{font-size:18.5px;line-height:1.8;color:#EAF6F2}
html.ldtpe-easy .bts-head__antidote{font-style:normal}
html.ldtpe-easy .bts-head__face{display:none}
html.ldtpe-easy .bts-tl__sub{font-size:15px;color:#EAF6F2}
html.ldtpe-easy .bts-tl__meta{font-size:13.5px}
html.ldtpe-easy .bts-bonus__blurb{font-size:15px;line-height:1.7;color:#EAF6F2}
html.ldtpe-easy .bts-hub *,html.ldtpe-easy .bts-hub *::before,html.ldtpe-easy .bts-hub *::after{animation:none!important;transition:none!important}
/* Row 800 (Tanner 9/18): Easy read turns the BTS hub white with black text. The shell here; the hub's own
   sections (timeline, films, practice, share) carry their light rules in template-edition-training.php. */
html.ldtpe-easy .bts-hub{background:#fff;color:#000}
html.ldtpe-easy .bts-top__back,html.ldtpe-easy .bts-top__signout{color:#000;text-decoration:underline}
html.ldtpe-easy .bts-strap{color:#000}
html.ldtpe-easy .bts-strap::before,html.ldtpe-easy .bts-strap::after{background:rgba(0,0,0,.35)}
html.ldtpe-easy .bts-head__lead{color:#000}
html.ldtpe-easy .bts-hub .bts-voices__title,html.ldtpe-easy .bts-hub .bts-voices__name,html.ldtpe-easy .bts-hub .bts-advice__playerhead{color:#000}
html.ldtpe-easy .bts-hub .bts-voices__eyebrow,html.ldtpe-easy .bts-hub .bts-voices__libhead,html.ldtpe-easy .bts-hub .bts-voices__who b{color:#00564E}
html.ldtpe-easy .bts-hub .bts-voices__lead,html.ldtpe-easy .bts-hub .bts-voices__sub,html.ldtpe-easy .bts-hub .bts-voices__desc,html.ldtpe-easy .bts-hub .bts-voices__who span,html.ldtpe-easy .bts-hub .bts-voices__len,html.ldtpe-easy .bts-hub .bts-advice__playerhead button{color:#000}
html.ldtpe-easy .bts-hub .bts-voices__card{background:#fff;border-color:rgba(0,0,0,.3);box-shadow:none}
html.ldtpe-easy .bts-hub .bts-voices__play{background:#00564E;color:#fff}
html.ldtpe-easy .bts-hub .bts-voices__more{background:#fff;border-color:#000;color:#000}
html.ldtpe-easy .bts-hub .bts-voices__more:hover{background:#000;color:#fff}
html.ldtpe-easy .bts-hub .bts-advice__player{background:#fff;border-color:rgba(0,0,0,.3)}
html.ldtpe-easy .bts-hub .bts-partner__text{color:#000}
html.ldtpe-easy .bts-partner__pre{opacity:1}
html.ldtpe-easy .trn-page--bts .progress-bar{background:rgba(0,0,0,.15)}
html.ldtpe-easy .trn-page--bts .btn-outline{background:#fff;border-color:rgba(0,0,0,.5);color:#000}
/* MTSS pyramid side labels: pastel fills on the white room */
html.ldtpe-easy .trn-page--bts .trn-mtss .mtss-side--1{fill:#00564E}
html.ldtpe-easy .trn-page--bts .trn-mtss .mtss-side--2{fill:#6E4E06}
html.ldtpe-easy .trn-page--bts .trn-mtss .mtss-side--3{fill:#5A1A63}
/* ══════════════════════════════════════════════
   PRINTABLE DOCUMENTS · 8/20 REDESIGN (pp-)
   Source of truth: design_handoff_onesheets mocks.
   Three print documents rendered by plan-print.js into .plan-paper-stack:
   Lesson Plan (up to 4 pages), Family One Sheet, School Team One Sheet.
   Every .pp is one fixed US Letter sheet (816×1056 @96dpi).
   Framework coding is canonical: Notice = blue, Choose = red, Act = gold.
   Mid-tone brand fills (#2988C9/#F03C24) never carry text; white text rides
   the darker AA pair (#1E6BA3/#C0392B). Do not use Anton; do not widen
   letterspacing on small labels (both rejected for legibility).
   ══════════════════════════════════════════════ */
.plan-mat { overflow-x: auto; }
#plan-paper-stack { width: 816px; }
/* Screen-only affordances on the printable docs: links render in the portal,
   disappear in print and in the downloaded PDF (no link affordances on paper). */
/* ══════════════════════════════════════════════
   Demo window veil (board round 8/25): shelves past the demo window render
   as untitled locked cards that blur and fade into the page, with one line
   pointing at the Request-a-demo form. Titles are never in the markup;
   the blur is the look, not the lock.
   ══════════════════════════════════════════════ */
.demo-veil { position: relative; }
.demo-veil__mask { -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 35%, rgba(0,0,0,.22) 78%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 35%, rgba(0,0,0,.22) 78%, transparent 100%); }
.demo-card-locked { pointer-events: none; user-select: none; }
.demo-card-locked__blur { filter: blur(4px); opacity: .8; }
.demo-veil__note { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; margin: -6px 0 26px; text-align: center; font-size: 14px; color: var(--body); }
.demo-veil__note a { color: var(--blue); font-weight: 800; text-decoration: none; }
.demo-veil__note a:hover { text-decoration: underline; }
/* BTS hub flavor of the same veil (its own light-gallery palette) */
.bts-tl__row--locked { pointer-events: none; user-select: none; }
.bts-tl__row--locked .bts-tl__card { box-shadow: none; }
.bts-tl__row--locked .bts-tl__name { filter: blur(4px); opacity: .75; }
.bts-tl--demo-fade { -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 30%, rgba(0,0,0,.25) 75%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 30%, rgba(0,0,0,.25) 75%, transparent 100%); }
.bts-demo-note { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; margin: 6px auto 34px; max-width: 640px; text-align: center; font-size: 14.5px; color: #3A4A44; }
.bts-demo-note a { color: #00564E; font-weight: 800; text-decoration: none; }
.bts-demo-note a:hover { text-decoration: underline; }
@keyframes mhSpeakPulse{0%,100%{box-shadow:0 0 0 0 rgba(196,99,79,.34)}50%{box-shadow:0 0 0 7px rgba(196,99,79,0)}}
/* The MHIY goody (Transcendent Thinking, row 573: lives on the dashboards) —
   warm paper and textbook navy, matched to her office */
.mhiy-goody{margin:14px 0 8px}
.mhiy-goody__card{position:relative;display:flex;align-items:stretch;gap:0;background:linear-gradient(120deg,#FDFAF1 0%,#F4EDDD 100%);border:1px solid #E0D6BB;border-top:3px solid #2C3E66;border-radius:10px;overflow:hidden;text-decoration:none;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.mhiy-goody__card:hover{border-color:#2C3E66;box-shadow:0 10px 26px rgba(44,62,102,.16);transform:translateY(-2px)}
.mhiy-goody__body{flex:1;padding:20px 22px 18px;min-width:0}
.mhiy-goody__eyebrow{font-family:'Mulish',sans-serif;font-weight:800;font-size:11px;letter-spacing:.1em;color:#B05A48;margin-bottom:6px}
.mhiy-goody__pill{display:inline-block;margin-left:8px;background:#2C3E66;color:#F3E8CE;border-radius:999px;padding:2px 9px;font-size:10px;letter-spacing:.08em;vertical-align:1px}
.mhiy-goody__name{font-family:'Fraunces',Georgia,serif;font-weight:580;font-size:29px;color:#1E2B49;line-height:1.08;letter-spacing:.002em}
.mhiy-goody__sub{font-family:'Source Serif 4',Georgia,serif;font-size:14px;color:#3E4864;line-height:1.6;margin:7px 0 12px;max-width:600px}
.mhiy-goody__foot{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.mhiy-goody__go{font-family:'Mulish',sans-serif;font-weight:800;font-size:14px;color:#2C3E66;white-space:nowrap}
.mhiy-goody__card:hover .mhiy-goody__go{text-decoration:underline}
.mhiy-goody__meta{font-family:'Source Serif 4',Georgia,serif;font-style:italic;font-size:13px;letter-spacing:.01em;color:#565F7C}
.mhiy-goody__art{flex:0 0 236px;position:relative}
.mhiy-goody__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 12%}
@media (max-width:700px) {
.mhiy-goody__art{display:none}
}
/* ── Year calendar (row 572): /calendar/ page, the weeks editor, and the
      teacher dashboard's Weekly Focus card ─────────────────────────────── */
.ldtpe-calpage{max-width:860px;margin:0 auto;padding:36px 20px 70px}
.ldtpe-calpage__title{font-family:var(--font-display,'Barlow Semi Condensed',sans-serif);font-weight:800;font-size:30px;color:var(--ink);margin:14px 0 6px}
.ldtpe-calpage__lead{color:var(--body-alt);font-size:15px;line-height:1.6;margin:0 0 20px}
.ldtpe-cal__controls{display:flex;gap:26px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px}
.ldtpe-cal__table td{vertical-align:middle}
.ldtpe-cal__focus{max-width:340px;padding:7px 10px;font-size:13.5px}
.ldtpe-cal__empty{display:none}
.ldtpe-cal [data-cal-del]{line-height:1;padding:4px}
.dash-focus{border-top:3px solid var(--blue)}
.dash-focus__eyebrow{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:11.5px;letter-spacing:.08em;color:var(--blue-dark);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:420px) {
.dash-focus__dates{display:none}
}
.dash-focus__title{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:21px;color:var(--ink);margin-bottom:4px}
.dash-focus__sub{color:var(--body-alt);font-size:13.5px;line-height:1.55;margin-bottom:10px}
.dash-focus__links{display:flex;gap:16px;flex-wrap:wrap}
.dash-focus__links a{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:13.5px;color:var(--blue-dark);text-decoration:none}
.dash-focus__links a:hover{text-decoration:underline}
.dash-focus--setup{border-top-color:var(--gold)}
/* Planner: the class's Playgility year as a label (row 619) + ELO program-length chips (row 618) */
.pl-yearlabel{font-weight:700;color:var(--ink);font-size:13.5px}
.pl-yearlabel__edit{margin-left:8px;font-weight:700;font-size:12.5px;color:var(--blue-dark)}
.pl-yearlabel__edit:hover{text-decoration:underline}
button.pl-linkbtn{background:none;border:0;padding:0;cursor:pointer;font-family:inherit;line-height:inherit}
.pl-presets--length{display:block;margin-bottom:8px}
/* Weekly Focus stacked by class (Tanner 9/4, row 619): one row per class plan */
.dash-focus__stack{display:flex;flex-direction:column;gap:10px;margin:2px 0 12px}
.dash-focus__row{padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--white)}
.dash-focus__class{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.dash-focus__lesson{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:17px;color:var(--ink);line-height:1.25}
.dash-focus__meta{color:var(--body-alt);font-size:13px;margin-top:3px}
.dash-focus__meta a{font-weight:700;color:var(--blue-dark)}
.dash-focus__meta a:hover{text-decoration:underline}
/* ── /app/ entry screen (3.94.0; brand look 3.95.0) ─────────────────────
   Playgility wears the landing page's brand panel (.landing-brand / .landing-login
   classes are reused so the two stay in step). BTS wears the atrustedspace landing.
   ───────────────────────────────────────────────────────────────────────── */
.app-entry { position: relative; overflow: hidden; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; padding: max(22px, env(safe-area-inset-top)) 20px max(18px, env(safe-area-inset-bottom)); background: linear-gradient(158deg, var(--blue-gradient-start) 0%, var(--blue-gradient-end) 100%); color: var(--white); }
.app-entry__blob { width: 360px; height: 360px; background: rgba(255,255,255,.07); top: -140px; left: -90px; }
.app-entry__inner { position: relative; width: 100%; max-width: 400px; margin: 0 auto; flex: 1; display: flex; flex-direction: column; }
.app-entry__brand { position: relative; text-align: center; padding: 10px 0 22px; }
.app-entry__chips { display: inline-flex; align-items: center; justify-content: center; gap: 12px; }
.app-entry__chips .landing-brand__logo-chip img { height: 38px; }
.app-entry__chips .landing-brand__ait-chip img { height: 34px; }
.app-entry .app-entry__eyebrow { margin: 18px 0 0; }
.app-entry__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.28); border-radius: 12px; padding: 4px; margin-bottom: 18px; }
.app-entry__tab { font: inherit; font-weight: 800; font-size: 14px; padding: 10px 6px; border: 0; border-radius: 9px; background: transparent; color: #E8F4FD; cursor: pointer; }
.app-entry__tab.is-on { background: var(--white); color: var(--ink); box-shadow: 0 1px 3px rgba(0,0,0,.15); }
.app-entry__pane { display: none; }
.app-entry__pane.is-on { display: block; }
.app-entry .landing-login__field { font-size: 16px; }
.app-entry .app-entry__field--code { font-family: var(--font-display); font-size: 20px; letter-spacing: 2px; text-transform: uppercase; }
.app-entry .landing-login__submit { max-width: none; margin-top: 2px; }
.app-entry__link { display: block; text-align: center; margin-top: 16px; font-size: 13.5px; font-weight: 700; color: #E8F4FD; }
.app-entry__error { display: flex; gap: 8px; align-items: center; background: var(--white); color: var(--red-deep); border-radius: 10px; padding: 10px 12px; font-size: 14px; font-weight: 600; margin-bottom: 12px; }
.app-entry__install { text-align: center; font-size: 13.5px; line-height: 1.55; color: #E8F4FD; margin: 26px auto 0; max-width: 330px; }
.app-entry__install b { color: var(--white); }
.app-entry__install-lead { display: block; margin-bottom: 4px; }
.app-entry__glyph { vertical-align: -3px; margin: 0 1px; }
.app-entry__install-btn { display: inline-block; margin-top: 10px; font: inherit; font-weight: 800; font-size: 14px; color: var(--white); background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.45); border-radius: 999px; padding: 10px 18px; cursor: pointer; }
.app-entry__install-btn:hover { background: rgba(255,255,255,.24); }
.app-entry__foot { text-align: center; font-size: 12px; color: #E8F4FD; margin: auto 0 0; padding-top: 24px; }
.app-entry__foot a { color: inherit; }
/* Your account view (sign out + delete) keeps a plain white card. */
.app-entry__card { background: var(--white); color: var(--ink); border-radius: 18px; padding: 18px 20px 22px; box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.app-entry__card-title { font-family: var(--font-heading); font-weight: 800; font-size: 24px; margin: 0 0 6px; }
.app-entry__hint { font-size: 14px; color: var(--body); margin: 0 0 4px; }
.app-entry__btn { display: block; width: 100%; margin-top: 14px; text-align: center; padding: 14px; font-size: 16px; }
.app-entry__btn--quiet { background: var(--bg-page); color: var(--ink); }
.app-entry__btn--danger { background: var(--red-light); color: var(--red-deep); }
/* Row 728 (9/17): the account form (name, email, password) on /app/?view=account. */
.app-entry__ok { background: rgba(0,168,150,.12); color: var(--ink); }
.app-entry__acct { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 10px; }
.app-entry__acct-h { font-family: var(--font-heading); font-weight: 800; font-size: 16px; margin: 6px 0 0; }
.app-entry__acct-note { font-size: 13px; color: var(--body); margin: -4px 0 0; }
.app-entry__acct-row { display: flex; gap: 10px; }
.app-entry__acct-row .app-entry__acct-field { flex: 1 1 0; min-width: 0; }
.app-entry__acct-field { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; font-weight: 700; color: var(--body); }
.app-entry__acct .landing-login__field { width: 100%; background: var(--white); color: var(--ink); border: 1.5px solid var(--border); font-size: 16px; }
.app-entry__acct .landing-login__field::placeholder { color: #8A94A0; }
.app-entry__acct .landing-login__field[type="password"] { letter-spacing: 2px; }
.app-entry__acct .app-entry__btn { margin-top: 6px; align-self: flex-start; }
@media (max-width: 520px) { .app-entry__acct-row { flex-direction: column; } }
.app-entry__danger { margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--border); }
.app-entry__danger h3 { font-family: var(--font-heading); font-weight: 800; font-size: 16px; margin: 0 0 6px; }
.app-entry__danger p { font-size: 14px; color: var(--body); margin: 0 0 8px; }
/* BTS: the atrustedspace landing look (mint page, Barlow uppercase, the faces). */
.app-entry--bts { background: linear-gradient(180deg, #F5F9F7 0%, #E6F0EB 100%); color: #12302A; }
.app-entry--bts .app-entry__blob { display: none; }
.app-entry--bts .app-entry__brand { padding: 26px 0 24px; }
.app-entry--bts .app-entry__eyebrow { font-family: var(--font-heading); font-weight: 800; font-size: 11.5px; letter-spacing: .12em; color: #007A6E; margin: 0 0 10px; }
.app-entry__title { margin: 0 0 12px; line-height: 0; }
.app-entry__logo { display: block; width: 100%; max-width: 220px; height: auto; margin: 0 auto; }
.app-entry__antidote { font-family: 'Newsreader', Georgia, serif; font-style: italic; font-weight: 500; font-size: 20px; color: #00564E; margin: 0; }
.app-entry__face { position: absolute; width: 72px; filter: drop-shadow(0 8px 16px rgba(0,0,0,.16)); animation: atsFloat 5.4s ease-in-out infinite; pointer-events: none; }
.app-entry__face--teal { left: -6px; top: 86px; }
.app-entry__face--purple { right: -4px; top: 14px; width: 62px; animation-delay: 1.7s; } /* 9/24: up beside the logo, clear of the tabs */
@keyframes atsFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) {
.app-entry__face { animation: none; }
}
.app-entry--bts .app-entry__tabs { background: rgba(18,48,42,.06); border-color: rgba(18,48,42,.12); }
.app-entry--bts .app-entry__tab { color: #3A4A44; }
.app-entry--bts .app-entry__tab.is-on { background: #fff; color: #12302A; }
.app-entry--bts .landing-login label { font-family: var(--font-heading); font-weight: 800; font-size: 11.5px; letter-spacing: .1em; color: #3A4A44; }
.app-entry--bts .landing-login input.landing-login__field { background: #fff; border-color: rgba(18,48,42,.22); color: #12302A; }
.app-entry--bts .landing-login input.landing-login__field::placeholder { color: #7A8A84; }
.app-entry--bts .landing-login input.landing-login__field:focus { border-color: #00A896; background: #fff; }
.app-entry--bts .landing-login__submit { background: #00564E; color: #fff; font-family: var(--font-heading); font-size: 16.5px; }
.app-entry--bts .landing-login__submit:hover { background: #007A6E; }
.app-entry--bts .app-entry__link { color: #00564E; }
.app-entry--bts .app-entry__error { background: #FDECEC; color: #9B2C2C; }
.app-entry--bts .app-entry__install { color: #3A4A44; }
/* 9/24 (Tanner): the access code in three parts, both brands; the BTS entry sits in one card with the CASC lockup. */
.app-entry__code { display: flex; align-items: center; gap: 6px; margin: 6px 0 14px; }
.app-entry .app-entry__seg { flex: 1 1 0; min-width: 0; width: 100%; margin: 0; text-align: center; font-family: var(--font-display); font-size: 21px; letter-spacing: 1.5px; text-transform: uppercase; padding-left: 6px; padding-right: 6px; }
.app-entry .app-entry__seg--1 { flex-grow: 1.5; }
.app-entry .app-entry__seg--2 { flex-grow: .7; }
.app-entry .app-entry__seg--3 { flex-grow: 1.3; }
.app-entry .app-entry__seg::placeholder { letter-spacing: 1.5px; }
.app-entry__dash { flex: none; font-family: var(--font-display); font-size: 22px; line-height: 1; opacity: .5; }
.app-entry--bts .app-entry__inner { max-width: 440px; }
.app-entry--bts .app-entry__brand { margin-top: auto; padding: 16px 0 20px; }
.app-entry--bts .app-entry__panel { background: #fff; border: 1px solid rgba(18,48,42,.1); border-radius: 20px; padding: 16px 18px 20px; box-shadow: 0 26px 50px -34px rgba(0,86,78,.5); }
.app-entry--bts .app-entry__panel .app-entry__tabs { margin-bottom: 16px; }
.app-entry--bts .app-entry__panel .app-entry__link { margin-top: 14px; }
.app-entry--bts .app-entry__dash { color: #3A4A44; }
.app-entry__partner { display: flex; justify-content: center; margin: 4px 0 0; }
.app-entry__partner[hidden] { display: none; }
.app-entry__partner .bts-partner__logo { width: 42px; }
.app-entry__partner .bts-partner__text { color: #12302A; max-width: 300px; }
@media (max-width: 380px) {
.app-entry .app-entry__seg { font-size: 18px; letter-spacing: 1px; padding-left: 4px; padding-right: 4px; }
.app-entry--bts .app-entry__panel { padding: 14px 14px 18px; }
}
.app-entry--bts .app-entry__install b { color: #12302A; }
.app-entry--bts .app-entry__install-btn { color: #fff; background: #00564E; border-color: #00564E; }
.app-entry--bts .app-entry__install-btn:hover { background: #007A6E; }
.app-entry--bts .app-entry__foot { color: #5C6A62; }
/* App mode: an installed web app is for people who already have access, so it
   drops the sales surfaces (demo request, landing sections, access mailto). */
html.is-app .demo-req, html.is-app [data-demo-open], html.is-app .landing-info, html.is-app .landing-footer,
html.is-app a[href*="mailto:ait@allittakes.org?subject=Playgility%20access"] { display: none !important; }
html.is-app body { -webkit-tap-highlight-color: transparent; }
.app-account-link { position: fixed; left: 12px; right: auto; bottom: max(12px, env(safe-area-inset-bottom)); /* left side: the feedback bubble owns the right corner (Tanner 9/2 screenshot) */ z-index: 60; font-size: 12px; font-weight: 700; color: var(--body); background: var(--white); border: 1px solid var(--border); border-radius: 999px; padding: 7px 12px; box-shadow: 0 2px 8px rgba(0,0,0,.12); text-decoration: none; }
/* ── Home-screen nudge card (app-bridge.js, phones, once) ─────────────── */
.a2hs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; padding: 0 10px max(10px, env(safe-area-inset-bottom)); transform: translateY(110%); transition: transform .26s ease; pointer-events: none; }
.a2hs.is-in { transform: none; pointer-events: auto; }
.a2hs__card { display: flex; gap: 14px; align-items: flex-start; max-width: 520px; margin: 0 auto; background: var(--white); color: var(--ink); border: 1px solid var(--border); border-radius: 18px; padding: 16px 16px 14px; box-shadow: 0 18px 48px -12px rgba(20,40,80,.35); }
.a2hs__icon { width: 52px; height: 52px; border-radius: 13px; flex-shrink: 0; border: 1px solid var(--border); }
.a2hs__body { min-width: 0; flex: 1; }
.a2hs__title { font-family: var(--font-heading); font-weight: 800; font-size: 17px; line-height: 1.2; margin-bottom: 4px; }
.a2hs__text { font-size: 13.5px; line-height: 1.55; color: var(--body); margin: 0 0 10px; }
.a2hs__text b { color: var(--ink); }
.a2hs__text svg { vertical-align: -3px; margin: 0 1px; }
.a2hs__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.a2hs__btn { font: inherit; font-weight: 800; font-size: 13.5px; padding: 9px 14px; border-radius: 10px; border: 1px solid var(--border); background: var(--bg-page); color: var(--ink); cursor: pointer; }
.a2hs__btn--go { background: var(--blue); border-color: var(--blue); color: var(--white); }
.a2hs--bts .a2hs__btn--go { background: #00564E; border-color: #00564E; }
@media print {
.a2hs { display: none !important; }
}
/* ── Phones: the print sheets reflow into one readable column ─────────────
   Tanner 9/2: "you have to scroll to read." html.pp-phone is set by the lesson
   plan template when the viewport is 700px or narrower (and kept in step by
   plan-print.js). Print and the Letter fit pass take the class off first, so
   paper output stays US Letter. Download PDF on a phone captures this layout
   as one tall page per document instead.
   ───────────────────────────────────────────────────────────────────────── */
html.pp-phone .plan-mat { padding: 12px 10px 28px; overflow-x: hidden; }
html.pp-phone .plan-paper-stack, html.pp-phone #plan-paper-stack { width: 100%; gap: 14px; }
/* The action bar wraps instead of clipping its buttons. */
html.pp-phone .plan-action-bar { height: auto; flex-wrap: wrap; padding: 10px 14px; gap: 10px; }
html.pp-phone .plan-action-bar__right { margin-left: 0; width: 100%; flex-wrap: wrap; gap: 8px; }
html.pp-phone .plan-action-bar__btn { font-size: 12.5px; padding: 8px 11px; }
/* Row 988 (10/5): the activity sheet's bar had no phone rules (pp-phone is lesson plans only), so
   "Revisit the module" and "Save as PDF" broke into word stacks at 375px. */
.plan-action-bar__btn { white-space: nowrap; }
@media (max-width: 640px) {
.plan-action-bar { height: auto; flex-wrap: wrap; padding: 10px 14px; gap: 10px; }
.plan-action-bar__right { margin-left: 0; width: 100%; flex-wrap: wrap; gap: 8px; }
.plan-action-bar__btn { font-size: 12.5px; padding: 8px 11px; }
}
@media (max-width: 480px) {
.pab-long { display: none; }
}
/* ── Phones: big headings shrink to fit their line ─────────────────────────
   Tanner 9/2: "big text like this should be shrunk to fit on one line, that's
   what I mean by mobile optimized." Every display heading 24px and up gets a
   phone size here; the deliberate desktop line breaks come out on phones.
   ───────────────────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
.reg-brand__title br { display: none; }
/* the BTS mark keeps its three lines, only smaller */
.reg-brand__title { font-size: 27px; }
.reg-form__title { font-size: 23px; }
.landing-bts__mark-name { font-size: 30px; }
.landing-brand h1 { font-size: 23px; }
/* PHYSICAL EDUCATION THAT BUILDS stays one line at 375px */
.landing-mtss__title, .landing-info h2, .landing-bts h2 { font-size: 24px; }
.landing-demo h2 { font-size: 23px; }
.setup-intro__title { font-size: 26px; }
.dp__title { font-size: 26px; }
.pl-title { font-size: 25px; }
.pl-empty__title { font-size: 21px; }
.dash-greeting__title { font-size: 25px; }
.dash-hero__title { font-size: 23px; }
.stat-card__number { font-size: 28px; }
.mhiy-goody__name { font-size: 23px; }
.plan-letterhead__title { font-size: 24px; }
.ldtpe-calpage__title { font-size: 23px; }
.std-lesson__title { font-size: 22px; }
}
/* Library page titles (curriculum, activities): were inline 28px, now sizeable on phones. */
.lib-title { font-size: 28px; color: var(--ink); }
/* ── Phones: signed-in screens (sweep 9/2 with Tanner's session) ──────────
   Every fix here came from a 375px walk: the dashboard topbar forced the page
   416px wide, the greeting button fell off the right edge, planner chips ran
   past the screen, and the Feedback pill sat on top of card buttons.
   ───────────────────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
.lib-title { font-size: 22px; }
/* Year tabs (training, curriculum, activities): one full-width row per year
     instead of pills wrapping into a ragged stack. */
.cur-tabs { flex-direction: column; gap: 8px; }
.cur-tabs .cur-tab { width: 100%; justify-content: flex-start; padding: 11px 16px; }
/* Dashboard shell: nothing may push the page wider than the phone. */
.dash-main { min-width: 0; max-width: 100vw; overflow-x: hidden; }
.topbar { padding: 0 14px; gap: 10px; }
.topbar__search { min-width: 0; }
.topbar__right { gap: 10px; flex-shrink: 0; }
.topbar__year-pill { display: none; }
/* the hero card says the same thing */
.dash-content { padding: 14px 14px 28px; }
/* Row 599: tighter rhythm on phones. Cards and the hero lose their desktop
     padding, the two-column grid stacks with a shorter gap, the greeting sits closer. */
.dash-grid { grid-template-columns: 1fr; gap: 14px; }
.dash-grid__left, .dash-grid__right { gap: 14px; }
.dash-content .card { padding: 16px; }
.dash-hero { padding: 20px 18px; margin-bottom: 14px; border-radius: 14px; }
.dash-greeting { margin-bottom: 14px; }
.dash-quick__tile { padding: 12px 10px; }
.dash-greeting__row { flex-wrap: wrap; gap: 10px 14px; }
.dash-greeting__plan-btn { margin-left: 0; white-space: normal; }
/* Year planner: chip rows wrap, exception rows stack their controls. */
.pl-presets { flex-wrap: wrap; row-gap: 8px; }
.pl-chip { padding: 6px 11px; }
.pl-exc__row { flex-wrap: wrap; gap: 8px 10px; }
.pl-exc__date { min-width: 0; }
/* Feedback pill: a compact circle that stays out of the way of card buttons. */
.fbw { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); }
.fbw-btn { width: 46px; height: 46px; padding: 0; font-size: 0; display: inline-flex; align-items: center; justify-content: center; }
.fbw-btn svg { width: 20px; height: 20px; }
/* Year calendar: the focus select gets the room, the week number gets less. */
.ldtpe-calpage { padding: 22px 14px 60px; }
.ldtpe-cal__controls { gap: 14px; }
.ldtpe-cal__table { font-size: 13px; }
.ldtpe-cal__table th, .ldtpe-cal__table td { padding: 8px 6px; }
.ldtpe-cal__table th:first-child, .ldtpe-cal__table td:first-child { width: 28px; padding-left: 8px; }
.ldtpe-cal__focus { max-width: none; width: 100%; min-width: 120px; padding: 7px 6px; font-size: 13px; }
}
/* ── Games on phones (Tanner 9/2) ─────────────────────────────────────────
   The module box is a desktop nicety. Under 700px the content column and the
   beat card drop their side padding and border so a practice game can run
   edge to edge; the arena itself is zoomed to a phone design width by
   LDTPE_GAME_FIT in trn-games.js (fellas shrink with the field). Text inside
   the game root (HUD, strip) keeps a little breathing room. */
/* Labels that ride on fellas, lanes or lines stay in field coordinates (no
   counter-zoom, it would move them); they just get phone-sized type. */
.trn-game--phone .hdr-lanelabel, .trn-game--phone .hdr-finishword,
.trn-game--phone .hrg-lanelbl, .trn-game--phone .cbl-downlabel,
.trn-game--phone .ogt-eyeband, .trn-game--phone .hya-nm,
.trn-game--phone .hls-goalline .hls-lbl { font-size: 14px !important; }
.trn-game--phone .hls-bub, .trn-game--phone .atd-dyn > div { font-size: 15px !important; }
.trn-game--phone .atd-floatword, .trn-game--phone .hrg-floatword,
.trn-game--phone .bbp-clickcue { font-size: 20px !important; }
/* Row 587 (Tanner 9/2): on phones the Transcendent Thinking card is only under
   Building Trusted Spaces. Dashboards hide it, the BTS hub shows it. */
.bts-hub__goody{display:none}
@media (max-width: 700px) {
.dash-main .mhiy-goody, .cdash .mhiy-goody{display:none}
.bts-hub__goody{display:block;max-width:1100px;margin:0 auto;padding:0 16px 24px}
}
/* ── School-year calendar builder (rows 580/582, 9/2) ───────────────────── */
/* One settings panel above the calendar (9/8): dates, focus year, breaks as pills. */
.ldtpe-cal__setup{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:16px 18px 12px;margin-bottom:16px}
.ldtpe-cal__setuprow{display:flex;gap:28px;flex-wrap:wrap}
.ldtpe-cal__setupgrp{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.ldtpe-cal__setuplbl{font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ldtpe-cal__breakrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ldtpe-cal__chip--add{border-style:solid}
.ldtpe-cal__note{margin:2px 0 0}
.ldtpe-cal__savehint{flex:1 1 220px;margin:0}
.ldtpe-cal__dates,.ldtpe-cal__addbreak,.ldtpe-cal__layout{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end}
.ldtpe-cal__addbreak{margin-top:4px;padding:12px;border:1px dashed var(--border);border-radius:12px}
.ldtpe-cal__addbreak[hidden]{display:none}
.ldtpe-cal__field{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:800;letter-spacing:.03em;color:var(--muted);text-transform:uppercase}
.ldtpe-cal__field .adm-input,.ldtpe-cal__field .adm-select{min-width:200px;font-size:15px;padding:10px 12px;text-transform:none;letter-spacing:0;font-weight:600}
.ldtpe-cal__field--grow{flex:1;min-width:200px}
.ldtpe-cal__sugg{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ldtpe-cal__sugg:empty{display:none}
.ldtpe-cal__sugglbl{font-size:12.5px;font-weight:800;color:var(--muted);letter-spacing:.03em;text-transform:uppercase}
.ldtpe-cal__chip{border:1px dashed var(--blue);background:var(--panel-blue,#E7F1FA);color:var(--blue-dark);border-radius:999px;padding:6px 12px;font-weight:800;font-size:13px;cursor:pointer}
.ldtpe-cal__chip:hover{background:#fff}
.ldtpe-cal__breaks{display:flex;flex-wrap:wrap;gap:8px}
.ldtpe-cal__breaks:empty{display:none}
.ldtpe-cal__break{display:flex;align-items:center;gap:8px;background:var(--panel,#F4F6F8);border:1px solid var(--border);border-radius:999px;padding:5px 8px 5px 12px;font-size:13px}
.ldtpe-cal__breakname{font-weight:800;color:var(--ink)}
.ldtpe-cal__breakdates{color:var(--body-alt)}
.ldtpe-cal__strip{display:flex;gap:2px;height:14px;margin:6px 0 16px;border-radius:6px;overflow:hidden}
.ldtpe-cal__strip span{flex:1;min-width:3px}
.ldtpe-cal__months{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.ldtpe-cal__month{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:12px 14px 6px}
.ldtpe-cal__monthname{font-family:var(--font-heading);font-weight:800;font-size:16px;color:var(--ink);margin-bottom:6px}
.ldtpe-cal__week{display:flex;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--border)}
.ldtpe-cal__week--break{opacity:.75}
.ldtpe-cal__weekdates{flex:0 0 118px;display:flex;flex-direction:column;font-size:12.5px;color:var(--body-alt);line-height:1.35}
.ldtpe-cal__weekdates b{color:var(--ink);font-size:13px}
.ldtpe-cal__weekdates em{font-style:normal;color:var(--gold-dark,#9A5010);font-weight:700;font-size:11.5px}
.ldtpe-cal__weekfocus{flex:1;min-width:0;display:flex;align-items:center;gap:10px}
.ldtpe-cal__weekfocus i{flex:none;width:10px;height:34px;border-radius:5px}
.ldtpe-cal__weeksel{flex:1;min-width:0}
.ldtpe-cal__weeksel .ldtpe-cal__focus{width:100%;max-width:none;font-size:14px;padding:8px 10px}
.ldtpe-cal__weekname{font-weight:700;color:var(--ink);font-size:14px;line-height:1.3;display:flex;flex-direction:column}
.ldtpe-cal__weekname small{color:var(--body-alt);font-weight:600;font-size:12px}
.ldtpe-cal__actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:18px}
.ldtpe-cal__check{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--body)}
.ldtpe-cal__empty{display:none}
@media (max-width: 640px) {
.ldtpe-cal__setuprow{gap:12px}
.ldtpe-cal__field .adm-input,.ldtpe-cal__field .adm-select{min-width:0;width:100%}
.ldtpe-cal__dates .ldtpe-cal__field,.ldtpe-cal__layout .ldtpe-cal__field{flex:1 1 100%}
.ldtpe-cal__addbreak .ldtpe-cal__field{flex:1 1 calc(50% - 7px)}
.ldtpe-cal__addbreak .ldtpe-cal__field--grow,.ldtpe-cal__addbreak .btn{flex:1 1 100%}
.ldtpe-cal__months{grid-template-columns:1fr}
.ldtpe-cal__week{flex-wrap:wrap;gap:6px 10px}
.ldtpe-cal__weekdates{flex:1 1 100%;flex-direction:row;gap:8px;align-items:baseline}
.ldtpe-cal__weekfocus{flex:1 1 100%}
}
/* Keyboard focus (audit 9/14): inputs that removed the outline get a visible ring back. */
.reg-code__input:focus-visible, .setup-slider__input:focus-visible, .pl-term__name:focus-visible,
.landing-login input:focus-visible, .trn-textarea:focus-visible, .trn-closing-add__input:focus-visible,
.adm-input:focus-visible, .adm-select:focus-visible, .trn-jot__input:focus-visible {
  outline: 2px solid var(--blue, #1F72AE);
  outline-offset: 2px;
}
.cdash input:focus-visible, .cdash button:focus-visible, .cdash a:focus-visible { outline: 2px solid var(--bd-teal, #007A6E); outline-offset: 2px; }

/* ═══════════ Advice from the field (9/16): clip cards on the BTS hub and /advice/ ═══════════ */
.bts-voices{max-width:860px;margin:46px auto 0;text-align:center}
.bts-voices__eyebrow{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.12em;color:#007A6E;margin-bottom:8px}
.bts-voices__title{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:30px;color:#12302A;margin:0 0 8px}
.bts-voices__lead{font-size:14.5px;line-height:1.6;color:#3A4A44;max-width:600px;margin:0 auto 22px}
.bts-voices__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;text-align:left}
.bts-voices__card{background:#fff;border:1px solid rgba(18,48,42,.08);border-radius:16px;overflow:hidden;box-shadow:0 12px 34px -20px rgba(18,48,42,.4);display:flex;flex-direction:column}
.bts-voices__card:last-child:nth-child(odd){grid-column:1 / -1}
.bts-voices__card--featured{grid-column:1 / -1;border-color:rgba(0,168,150,.45);box-shadow:0 18px 44px -22px rgba(0,122,110,.5);display:grid;grid-template-columns:1.15fr .85fr}
.bts-voices__poster{position:relative;display:block;width:100%;aspect-ratio:16/9;background:var(--bh-media,#0E2B26);border:0;padding:0;cursor:pointer;overflow:hidden}
.bts-voices__poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.bts-voices__poster:hover img{transform:scale(1.03)}
.bts-voices__poster--plain{background:radial-gradient(120% 120% at 20% 0%,var(--bh-media2,#00564E) 0%,var(--bh-media,#0E2B26) 70%)}
.bts-voices__posterplay{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:rgba(255,255,255,.92);color:#00564E;display:grid;place-items:center;box-shadow:0 10px 30px -10px rgba(0,0,0,.6)}
.bts-voices__posterplay svg{width:24px;height:24px}
.bts-voices__card--featured .bts-voices__poster{aspect-ratio:auto;height:100%;min-height:280px}
.bts-voices__body{padding:16px 20px 16px;display:flex;flex-direction:column;gap:6px;min-width:0}
.bts-voices__tag{align-self:flex-start;font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:#00A896;border-radius:999px;padding:4px 10px;margin-bottom:4px}
.bts-voices__libhead{grid-column:1 / -1;font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#007A6E;margin:14px 0 -4px;text-align:left}
.bts-voices__name{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:21px;line-height:1.15;color:#12302A}
.bts-voices__card--featured .bts-voices__name{font-size:26px}
.bts-voices__who{display:flex;flex-direction:column;gap:1px;margin-top:2px}
.bts-voices__who b{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:14.5px;color:#007A6E}
.bts-voices__who span{font-size:12.5px;line-height:1.4;color:#5C6A62}
.bts-voices__sub{font-size:13.5px;line-height:1.5;color:#3A4A44;margin:4px 0 4px}
.bts-voices__desc{font-size:14px;line-height:1.6;color:#3A4A44;margin:0 0 6px}
.bts-voices__act{margin-top:auto;padding-top:6px;display:flex;align-items:center;flex-wrap:wrap;gap:4px 0}
.bts-voices__len{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:12px;letter-spacing:.06em;color:#3A4A44;margin-left:10px}
.bts-voices__play{background:#00564E;color:#fff;border:0;cursor:pointer;font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:14px;padding:9px 18px;border-radius:10px}
.bts-voices__play:hover{background:#007A6E}
.bts-voices__watched{font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:12px;letter-spacing:.06em;color:#C98A0C;margin-left:8px}
.bts-voices__more{display:inline-block;margin-top:18px;background:#fff;border:2px solid #00564E;color:#00564E;text-decoration:none;font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;font-size:15px;padding:11px 22px;border-radius:12px}
.bts-voices__more:hover{background:#00564E;color:#fff}
.bts-advice .bts-voices{margin-top:8px}
.bts-advice .bts-voices__grid{margin-bottom:6px}
.bts-advice__player{margin:18px 0 6px;background:#fff;border:1px solid rgba(18,48,42,.08);border-radius:16px;padding:14px;box-shadow:0 10px 30px -22px rgba(18,48,42,.35);text-align:left}
.bts-advice__playerhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-family:'Barlow Semi Condensed',sans-serif;font-weight:800;color:#12302A}
.bts-advice__playerhead button{background:none;border:0;cursor:pointer;font:inherit;font-size:13.5px;color:#3A4A44}
.bts-advice__playerhead button:hover{color:#00564E}
.bts-advice__frame{position:relative;padding-top:56.25%}
.bts-advice__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:10px}

/* Advice cards on the dark shell (hub + /advice/; the light card rules above stay for any light surface). */
.bts-hub .bts-voices__title{color:#fff}
.bts-hub .bts-voices__eyebrow,.bts-hub .bts-voices__libhead{color:var(--bh-mid)}
.bts-hub .bts-voices__lead{color:var(--bh-soft)}
.bts-hub .bts-voices__card{background:rgba(255,255,255,.06);border-color:rgba(var(--bh-glow-rgb),.2);box-shadow:0 18px 40px -24px rgba(0,0,0,.6)}
.bts-hub .bts-voices__card--featured{border-color:rgba(var(--bh-glow-rgb),.45)}
.bts-hub .bts-voices__name{color:#fff}
.bts-hub .bts-voices__who b{color:var(--bh-glow)}
.bts-hub .bts-voices__who span,.bts-hub .bts-voices__len{color:var(--bh-dim)}
.bts-hub .bts-voices__sub,.bts-hub .bts-voices__desc{color:var(--bh-soft)}
.bts-hub .bts-voices__watched{color:var(--bh-lamp)}
.bts-hub .bts-voices__play{background:var(--bh-glow);color:var(--bh-deep)}
.bts-hub .bts-voices__play:hover{background:var(--bh-glow2)}
.bts-hub .bts-voices__more{background:transparent;border-color:rgba(var(--bh-glow-rgb),.6);color:var(--bh-ink)}
.bts-hub .bts-voices__more:hover{background:var(--bh-glow);border-color:var(--bh-glow);color:var(--bh-deep)}
.bts-hub .bts-advice__player{background:rgba(var(--bh-scrim-rgb),.6);border-color:rgba(var(--bh-glow-rgb),.2);box-shadow:none}
.bts-hub .bts-advice__playerhead{color:#fff}
.bts-hub .bts-advice__playerhead button{color:var(--bh-dim)}
.bts-hub .bts-advice__playerhead button:hover{color:#fff}
/* Rows 899/900 (Tanner 9/21, twice widened the same day: "it transitions too fast"): the hub ground is ONE slow
   ramp laid over the edition's radial room, in pixels from the top so it reads the same on every edition and
   screen: the edition color through the header, a first lift under the Continue button, the edition's paper
   by the end of the timeline, white by the foot. The header and Continue block keep light ink (the ground is
   lifted a quarter at most there); from the timeline down (.bts-paper) every token the cards and shelves read
   is re-pointed to dark-on-light, and the timeline cards are white so their text reads on any ground. */
.bts-hub{--bh-ramp:linear-gradient(to bottom,rgba(var(--bh-p-tint2-rgb),0) 0,rgba(var(--bh-p-tint2-rgb),0) 480px,rgba(var(--bh-p-tint2-rgb),.24) 760px,rgba(var(--bh-p-tint2-rgb),.62) 1250px,var(--bh-p-tint2) 1800px,#fff 2700px);background-image:var(--bh-ramp),var(--bh-bg-img)}
.bts-paper{--bh-ink:var(--bh-p-ink);--bh-soft:var(--bh-p-body);--bh-dim:var(--bh-p-body);--bh-dim2:var(--bh-p-muted);--bh-mid:var(--bh-p-deep);--bh-glow:var(--bh-p-deep);--bh-glow2:var(--bh-p-accent);--bh-glow-rgb:var(--bh-p-deep-rgb);--bh-deep:#fff;--bh-lamp:#9A5010;--bh-media:var(--bh-p-deep);--bh-media2:var(--bh-p-accent);color:var(--bh-ink)}
.bts-paper .bts-wrap--paper{padding-top:0;padding-bottom:70px}
.bts-paper .bts-tl__card{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 14px 34px -22px rgba(0,0,0,.35)}
.bts-paper .bts-tl__card:hover{background:#fff;border-color:rgba(var(--bh-p-deep-rgb),.45)}
.bts-paper .bts-tl__name{color:var(--bh-p-ink)}
.bts-paper .bts-tl__meta{color:color-mix(in srgb,var(--part-accent) 50%,var(--bh-p-ink))}
.bts-paper .bts-tl__dot--done{box-shadow:0 0 0 4px rgba(255,255,255,.9)}
.bts-paper .bts-tl__dot--next{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.9),0 0 18px var(--part-accent)}
.bts-paper .bts-tl__dot--ahead{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.9)}
.bts-paper .bts-voices__title,.bts-paper .bts-voices__name,.bts-paper .bts-advice__playerhead,.bts-paper .bts-bonus__title,.bts-paper .bts-bonus__name,.bts-paper .bts-bonus__playerhead{color:var(--bh-p-ink)}
.bts-paper .bts-advice__playerhead button:hover,.bts-paper .bts-bonus__playerhead button:hover{color:var(--bh-p-deep)}
.bts-paper .bts-voices__card,.bts-paper .bts-bonus__card{background:#fff;border-color:var(--bh-p-rule);box-shadow:0 14px 34px -22px rgba(0,0,0,.28)}
.bts-paper .bts-bonus__card:hover{background:#fff;border-color:rgba(var(--bh-p-deep-rgb),.45)}
.bts-paper .bts-voices__card--featured{border-color:rgba(var(--bh-p-deep-rgb),.45)}
.bts-paper .bts-advice__player,.bts-paper .bts-bonus__playerwrap{background:#fff;border-color:var(--bh-p-rule)}
.bts-paper .bts-voices__more{background:#fff;border-color:var(--bh-p-deep);color:var(--bh-p-deep)}
.bts-paper .bts-voices__more:hover{background:var(--bh-p-deep);border-color:var(--bh-p-deep);color:#fff}
.bts-paper .bts-bonus__chip{border-color:var(--bh-p-rule);color:var(--bh-p-ink)}
.bts-paper .bts-bonus__chip:hover{border-color:var(--bh-p-deep);color:var(--bh-p-deep)}
.bts-paper .bts-bonus__posterplay{background:rgba(255,255,255,.92);color:var(--bh-p-deep)}
.bts-paper .bts-voices__tag{background:var(--bh-p-deep)}
.bts-paper .bts-prax--share .bts-prax__card{background:#fff;border-color:var(--bh-p-rule);box-shadow:0 14px 34px -22px rgba(0,0,0,.22)}
.bts-paper .bts-prax--share .bts-prax__card:hover{background:#fff;border-color:rgba(var(--bh-p-deep-rgb),.45)}
.bts-paper .bts-prax--share .bts-prax__name{color:var(--bh-p-ink)}
.bts-paper .bts-prax--share .bts-prax__sub{color:var(--bh-p-body)}
.bts-paper .bts-prax--share .bts-prax__go{color:var(--bh-p-deep)}
.bts-paper .bts-prax--share .bts-prax__badge{background:rgba(var(--bh-p-deep-rgb),.12);color:var(--bh-p-deep)}
@media (max-width:860px){.bts-voices__grid{grid-template-columns:1fr}.bts-voices__card:last-child:nth-child(odd),.bts-voices__card--featured,.bts-voices__libhead{grid-column:auto}.bts-voices__card--featured{display:flex}.bts-voices__card--featured .bts-voices__poster{aspect-ratio:16/9;height:auto;min-height:0}}

/* Partner lockup (rows 763/805, Lori 9/18): the CASC seal and one line, for the school counselor edition
   only (ldtpe_bts_partner_lockup). hub = centered under the lead in the dark room; side = the dashboard
   side menu under the logo; doc = document pages such as /counselor-standards/. */
.bts-partner{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.bts-partner__logo{flex:none;width:46px;height:auto;background:#fff;border-radius:50%;padding:2px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.bts-partner__text{display:flex;flex-direction:column;gap:1px;max-width:230px;text-align:left;color:#12302A;line-height:1.25}
.bts-partner__pre{font-family:'Mulish',sans-serif;font-weight:600;font-size:11.5px;opacity:.78}
.bts-partner__name{font-family:'Barlow Semi Condensed',sans-serif;font-weight:700;font-size:15px}
.bts-partner--hub{display:flex;justify-content:center;margin:18px auto 0}
.bts-partner--hub .bts-partner__text{color:#DFF5F1}
.bts-partner--side{display:flex;margin:-12px 12px 18px;gap:9px}
.bts-partner--side .bts-partner__logo{width:38px}
.bts-partner--side .bts-partner__text{color:#C9E9E2;max-width:170px}
.bts-partner--side .bts-partner__pre{font-size:10.5px}
.bts-partner--side .bts-partner__name{font-size:13.5px}
.bts-partner--doc{margin:0 0 18px}
.bts-partner--doc .bts-partner__logo{width:54px;box-shadow:none}
.bts-partner--doc .bts-partner__name{font-size:16px}
@media (max-width:640px){.bts-partner--side{margin:0 8px 10px;justify-content:center}}

/* ── School counselor edition: the surfaces that keep their palette inline ─────
   The practice room and the profile setup page are shared BTS screens; both hang
   their whole look on a handful of tokens, so the counselor film-set palette is
   one swap on each. Scoped to bts-ed-c, so no other edition can match (9/21). */
.bts-ed-c #ldtpe-practice{
  --ats-teal:#7A5ADB; --ats-teal-text:#5A3FA6; --ats-teal-dark:#45308A; --ats-teal-light:#F0E8E3;
  --ats-purple:#9E3E84; --ats-purple-light:#F7E6F0;
  --ink:#111111; --mut:#3A3A3A; --line:#E4D9D3; --paper:#FFFFFF;
  background:#F4EFEC;
}
.bts-ed-c #ldtpe-practice .composer .send:hover{background:#6B4CCB}
.bts-ed-c .setup-page--bts{--blue:#5A3FA6;--blue-dark:#45308A;--blue-darker:#33245F;--blue-light:#F0E8E3;background:linear-gradient(180deg,#FFFFFF 0%,#F4EFEC 100%)}
.bts-ed-c .setup-page--bts .setup-header__brand{color:#111111}
.bts-ed-c .setup-page--bts .setup-header__brand:hover{color:#45308A}
.bts-ed-c .setup-page--bts .setup-intro__title{color:#111111}