:root{
  /* Shared navigation metrics. The bar must look identical across the
     marketing site and the app, so a visitor moving between them sees no
     shift. These values are duplicated in site/policy.css, site/article.css,
     site/index.html and web/static/app.css, and a test asserts they match. */
  --nav-height:64px;
  --nav-max-width:1080px;
  --nav-gap:24px;
  --nav-links-gap:22px;
  --nav-wordmark-size:1.35rem;
  --nav-link-size:.92rem;
  --nav-link-weight:500;
  --nav-pill-height:42px;
  --nav-pill-padding:.55rem 1.1rem;
  --app-sidebar-width:236px;

  --night:#10131F;
  --dusk:#1A2032;
  --dusk-2:#222A40;
  --lamplight:#F5B84A;
  --lamplight-soft:#F5B84A26;
  --settled:#7FC8A9;
  --attention:#E8927C;
  --moon:#E9ECF5;
  --dim:#97A0B8;
  --line:#2C3450;
  --display:"Fraunces","Iowan Old Style",Palatino,Georgia,serif;
  --body:"Figtree",-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,monospace;
  --radius:14px;
  --width:1080px;
}

*{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth}
body{
  min-height:100vh;
  margin:0;
  display:flex;
  flex-direction:column;
  overflow-x:hidden;
  background:var(--night);
  color:var(--moon);
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--lamplight);color:var(--night)}
a{color:var(--lamplight);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:2px solid var(--lamplight);
  outline-offset:3px;
  border-radius:6px;
}
button,input{font:inherit}
button{cursor:pointer}
.wrap{width:min(100%,calc(var(--width) + 48px));margin:0 auto;padding-inline:24px}
.page-glow{
  position:fixed;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(52% 42% at 78% 20%,var(--lamplight-soft),transparent 72%),
    radial-gradient(30% 28% at 12% 86%,#7FC8A90c,transparent 72%);
}

.site-nav{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(16,19,31,.9);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.nav-inner{min-height:64px;max-width:var(--nav-max-width);display:flex;align-items:center;gap:var(--nav-gap)}
.wordmark{
  display:flex;
  align-items:center;
  gap:9px;
  flex:none;
  color:var(--moon);
  font-family:var(--display);
  font-size:var(--nav-wordmark-size);
  font-weight:600;
  letter-spacing:-.01em;
}
.wordmark:hover{text-decoration:none}
.moon-dot{width:13px;height:13px;flex:none}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:var(--nav-links-gap);min-width:0}
.nav-link{color:var(--dim);font-size:var(--nav-link-size);font-weight:var(--nav-link-weight);white-space:nowrap}
.nav-link:hover,.nav-link.active{color:var(--moon);text-decoration:none}
.nav-link.active{border-bottom:1px solid var(--lamplight)}
.nav-form{display:flex;align-items:center;margin:0}
.nav-button{padding:0;border:0;background:transparent}
.nav-account-button{
  display:inline-flex;
  min-height:var(--nav-pill-height);
  align-items:center;
  justify-content:center;
  padding:var(--nav-pill-padding);
  border-radius:999px;
  background:var(--lamplight);
  color:#221A05;
  font-size:var(--nav-link-size);
  font-weight:700;
  white-space:nowrap;
}
.nav-account-button:hover,.nav-account-button.active{color:#221A05;text-decoration:none;box-shadow:0 6px 24px -8px var(--lamplight)}
.nav-account-shortcut{
  display:none;
  min-height:40px;
  align-items:center;
  margin-left:auto;
  padding:.45rem 1rem;
  border:1px solid #59627c;
  border-radius:999px;
  color:var(--moon);
  font-size:.82rem;
  font-weight:700;
  white-space:nowrap;
}
.nav-account-shortcut:hover,.nav-account-shortcut.active{border-color:var(--lamplight);background:var(--lamplight);color:#221A05;text-decoration:none}
.app-mobile-nav{display:none}

.app-wrap{flex:1;padding-top:56px;padding-bottom:80px}
.site-footer{border-top:1px solid var(--line);padding:30px 0 38px;color:var(--dim);font-size:.8rem}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.footer-inner p{margin:0;max-width:42rem}
.footer-links{display:flex;gap:18px;flex-wrap:wrap}
.footer-links a{color:var(--dim)}
.footer-links a:hover{color:var(--moon)}

.messages{padding:0;margin:0 0 24px;list-style:none}
.messages li{padding:.8rem 1rem;border:1px solid;border-radius:10px;background:var(--dusk)}
.messages .error{color:#ffd7ce;border-color:#E8927C70;background:#3a242b}
.messages .success{color:#c7f2df;border-color:#7FC8A970;background:#1c352f}

.eyebrow,.kicker{
  margin:0 0 .8rem;
  color:var(--lamplight);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.kicker{color:var(--dim)}
h1,h2,h3,p{margin-top:0}
h1,h2{font-family:var(--display);font-weight:400;letter-spacing:-.01em}
h1{font-size:clamp(2.3rem,5vw,3.8rem);line-height:1.08;margin-bottom:1.15rem}
h1 em{color:var(--lamplight);font-weight:500}
h2{font-size:clamp(1.45rem,2.7vw,2rem);line-height:1.16;margin-bottom:.7rem}
h3{font-size:1.04rem;margin-bottom:.45rem}
.lede{max-width:38rem;margin-bottom:1.8rem;color:var(--dim);font-size:1.08rem}
.panel-copy{margin-bottom:1.25rem;color:var(--dim)}
.panel-copy strong{color:var(--moon)}
.fine-print,.muted{color:var(--dim);font-size:.82rem;line-height:1.55}
.fine-print{margin:.9rem 0 0}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.auth-page .app-wrap{display:grid;align-items:center;padding-top:54px;padding-bottom:70px}
.auth-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;width:100%}
.auth-copy{max-width:34rem}
.auth-copy .lede{max-width:32rem}
.trust-list{display:grid;gap:.7rem;margin:0;padding:0;list-style:none;color:var(--dim);font-size:.92rem}
.trust-list li{display:flex;align-items:center;gap:.75rem}
.trust-mark{
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  flex:none;
  border:1px solid #7FC8A966;
  border-radius:50%;
  color:var(--settled);
  box-shadow:0 0 20px #7FC8A91c;
  font-size:.72rem;
}
.auth-card,.panel{
  position:relative;
  background:linear-gradient(160deg,var(--dusk-2),var(--dusk));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:0 28px 80px -42px #000,0 0 80px -46px var(--lamplight);
}
.auth-card{padding:42px;overflow:hidden}
.auth-card::before{
  content:"";
  position:absolute;
  inset:-45% -35% auto 36%;
  height:260px;
  background:radial-gradient(circle,#F5B84A1f,transparent 70%);
  pointer-events:none;
}
.auth-card>*{position:relative}
.auth-moon{
  width:54px;
  height:54px;
  margin-bottom:28px;
  overflow:hidden;
  border-radius:50%;
  background:radial-gradient(circle at 36% 34%,#FFE4A4,var(--lamplight) 57%,#C47F19 100%);
  box-shadow:0 0 28px #F5B84A70,0 0 70px #F5B84A24;
}
.auth-moon::after{content:"";display:block;width:52px;height:52px;margin:-10px 0 0 17px;border-radius:50%;background:var(--dusk-2)}
.mail-mark{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  margin-bottom:28px;
  border:1px solid #7FC8A966;
  border-radius:50%;
  color:var(--settled);
  box-shadow:0 0 30px #7FC8A922;
}
.mail-mark svg{width:27px;height:27px}
.form-stack{display:grid;gap:12px;margin-top:1.4rem}
.passkey-action{display:grid;gap:.65rem}
.passkey-button{width:100%;background:var(--moon);color:var(--night)}
.passkey-button:hover{box-shadow:0 6px 24px -8px #E9ECF580}
.passkey-feedback{min-height:1.3rem;margin:.55rem 0 0;color:var(--dim);font-size:.82rem}
.passkey-feedback.success{color:var(--settled)}
.passkey-feedback.error{color:var(--attention)}
.auth-divider{display:flex;align-items:center;gap:12px;margin:1rem 0;color:var(--dim);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em}
.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:var(--line)}
.form-stack label,.alias-form label,.delete-form label{color:var(--dim);font-size:.85rem;font-weight:600}
input{
  width:100%;
  min-height:48px;
  padding:.8rem 1rem;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--night);
  color:var(--moon);
}
input::placeholder{color:#5B6480}
input:hover{border-color:#47516f}
input:focus{border-color:var(--lamplight)}
.btn{
  display:inline-flex;
  min-height:46px;
  align-items:center;
  justify-content:center;
  padding:.68rem 1.25rem;
  border:0;
  border-radius:999px;
  background:var(--lamplight);
  color:#221A05;
  font-size:.92rem;
  font-weight:700;
  line-height:1.2;
  transition:transform .15s ease,box-shadow .15s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 24px -8px var(--lamplight);text-decoration:none}
.btn.ghost{border:1px solid var(--line);background:transparent;color:var(--moon)}
.btn.ghost:hover{border-color:var(--dim);box-shadow:none}
.btn.compact{min-height:40px;padding:.52rem 1rem;font-size:.82rem}
.btn.danger{background:var(--attention);color:#2d1310}

.page-heading{margin-bottom:34px}
.page-back{display:inline-block;margin-bottom:20px;color:var(--dim);font-size:.82rem;font-weight:650}
.page-back:hover{color:var(--moon);text-decoration:none}
.page-heading h1{font-size:clamp(2rem,4vw,3.15rem)}
.page-heading .lede{margin-bottom:0}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.settings-panel{padding:28px}
.settings-wide{grid-column:1/-1}
.identity-value{
  overflow-wrap:anywhere;
  padding:.8rem 1rem;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--night);
  color:var(--moon);
  font-family:var(--mono);
  font-size:.9rem;
}
.schedule-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:0;padding:0;list-style:none;color:var(--moon);font-size:.9rem}
.schedule-list li{display:flex;align-items:center;gap:.6rem}
.schedule-dot{width:7px;height:7px;flex:none;border-radius:50%;background:var(--lamplight);box-shadow:0 0 12px #F5B84A88}
.panel-heading-row{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.alias-form{padding:18px 0;border-top:1px solid var(--line)}
.check-control{display:flex;align-items:center;gap:.65rem;margin:1rem 0 .9rem;color:var(--moon);font-size:.95rem;font-weight:600}
.check-control input[type="checkbox"]{width:1.15rem;height:1.15rem;min-height:0;flex:none;padding:0;border-radius:4px;accent-color:var(--lamplight)}
.inline-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin-top:.45rem}
.connection-row{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:18px 0;border-top:1px solid var(--line)}
.connection-host{margin:.65rem 0 0;color:var(--moon);overflow-wrap:anywhere}
.status-pill{display:inline-flex;padding:.24rem .62rem;border:1px solid;border-radius:999px;font-size:.72rem;font-weight:700;text-transform:capitalize}
.status-active{color:var(--settled);border-color:#7FC8A966;background:#7FC8A912}
.status-degraded,.status-needs_reauth,.status-revoked{color:var(--attention);border-color:#E8927C66;background:#E8927C12}
.status-paused{color:var(--lamplight);border-color:#F5B84A66;background:#F5B84A12}
.text-button{padding:0;border:0;background:transparent;color:var(--lamplight);font-weight:650}
.attention-text{color:var(--attention)!important}
.empty-state{margin:1rem 0 0;padding:1rem;border:1px dashed var(--line);border-radius:10px;color:var(--dim)}
.passkey-enrollment{max-width:680px}
.passkey-list{display:grid;margin-top:1.2rem;border-top:1px solid var(--line)}
.passkey-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(260px,1fr) auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.passkey-summary{display:grid;gap:.2rem}
.passkey-summary span{color:var(--dim);font-size:.8rem}
.passkey-rename{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.passkey-rename input{min-height:42px}
.danger-panel{border-color:#E8927C4d;background:linear-gradient(160deg,#302333,var(--dusk))}
.delete-form{margin-top:1.3rem}

ol.muted{padding-left:1.25rem}
table{display:block;width:100%;overflow-x:auto;border-collapse:collapse}
tbody{display:table;width:100%;min-width:620px}
th,td{padding:.75rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{color:var(--dim);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase}

@media (max-width:820px){
  .auth-layout{grid-template-columns:1fr;gap:32px}
  .auth-copy{max-width:39rem}
  .auth-card{max-width:39rem;width:100%}
  .settings-grid{grid-template-columns:1fr}
  .settings-wide{grid-column:auto}
}
@media (max-width:720px){
  .public-nav-link{display:none}
}
@media (max-width:620px){
  body{font-size:16px}
  .wrap{padding-inline:18px}
  .nav-inner{min-height:60px;gap:12px}
  .wordmark{font-size:1.2rem}
  .nav-links{gap:12px}
  .nav-dashboard{display:none}
  .nav-link{font-size:.8rem}
  .app-wrap{padding-top:38px;padding-bottom:56px}
  .auth-page .app-wrap{padding-top:36px}
  .auth-card,.settings-panel{padding:24px 20px}
  .footer-inner{flex-direction:column}
  .panel-heading-row,.connection-row{align-items:flex-start;flex-direction:column}
  .inline-control{grid-template-columns:1fr}
  .inline-control .btn{width:100%}
  .passkey-row{grid-template-columns:1fr;gap:12px}
  .passkey-rename{grid-template-columns:1fr auto}
  .schedule-list{grid-template-columns:1fr}
}
@media (max-width:420px){
  .nav-link{font-size:.76rem}
  .nav-links{gap:9px}
  .wordmark{font-size:1.08rem;gap:7px}
  .moon-dot{width:11px;height:11px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn{transition:none}
}

/* Authenticated app shell: two navigations with two different jobs.

   The top bar is the shared one. It spans the full width and is identical on
   every surface, signed in or out — same wordmark, same public links, same
   Account pill — so nothing shifts when a visitor crosses between
   bybedtime.com and the app. It is never restyled here.

   The sidebar beneath it carries the app's own sections, which only exist once
   you are signed in. It is a separate component rather than a restyling of
   .site-nav, and it takes its type from the same --nav-* tokens as the bar, so
   the two cannot drift apart. Until 2026-07-25 the sidebar was built by
   overriding the top bar and hardcoded .82rem links, which no signed-out
   measurement could see. */
.dashboard-page{background:var(--night)}
.dashboard-page .page-glow{background:radial-gradient(48% 34% at 72% 4%,#F5B84A14,transparent 76%)}
.authenticated{
  display:grid;
  grid-template-columns:var(--app-sidebar-width) minmax(0,1fr);
  grid-template-rows:auto minmax(0,1fr) auto;
}
.authenticated .site-nav{grid-column:1/-1;grid-row:1}
/* Signed in, the row runs the full width so the wordmark sits above the sidebar
   column rather than floating in the middle of the content column. 32px is the
   sidebar's own 19px padding plus its links' 13px, so the wordmark lines up with
   the sidebar link text beneath it. Type and bar height stay shared. */
.authenticated .site-nav .nav-inner{
  width:100%;
  max-width:none;
  margin:0;
  padding-inline:32px 24px;
}
.authenticated .app-sidebar{grid-column:1;grid-row:2}
.authenticated .app-wrap{grid-column:2;grid-row:2}
.authenticated .site-footer{grid-column:2;grid-row:3}
.app-sidebar{
  display:flex;
  flex-direction:column;
  gap:4px;
  position:sticky;
  top:var(--nav-height);
  align-self:start;
  min-height:calc(100vh - var(--nav-height));
  padding:22px 19px 24px;
  border-right:1px solid var(--line);
  background:#0d101b;
}
/* No font-size or weight here on purpose: .nav-link already resolves both from
   --nav-link-size and --nav-link-weight, which the top bar uses too. */
.app-sidebar .nav-link{
  display:flex;
  min-height:45px;
  align-items:center;
  padding:0 13px;
  border-radius:9px;
}
.app-sidebar .nav-link:hover{background:#171c2b;color:var(--moon);text-decoration:none}
.app-sidebar .nav-link.active{position:relative;background:#20273a;color:var(--moon);border-bottom:0}
.app-sidebar .nav-link.active::before{content:"";width:3px;height:18px;margin-right:10px;border-radius:3px;background:var(--lamplight)}
.app-sidebar .nav-form{margin-top:auto}
.app-sidebar .nav-button{width:100%;justify-content:flex-start}
.authenticated .page-back{display:none}
.dashboard-page .app-wrap{width:100%;margin:0;padding:0;max-width:none}
.dashboard-shell{min-height:100vh}
.dashboard-toolbar{
  position:sticky;
  top:0;
  z-index:40;
  min-height:68px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:10px 30px;
  border-bottom:1px solid var(--line);
  background:#10131fee;
  backdrop-filter:blur(14px);
}
.dashboard-student-tabs{display:flex;gap:5px;min-width:0;overflow-x:auto;scrollbar-width:none}
.dashboard-student-tabs::-webkit-scrollbar{display:none}
.dashboard-student-tabs button{
  min-height:36px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:8px;
  background:transparent;
  color:var(--dim);
  white-space:nowrap;
  font-size:.78rem;
  font-weight:650;
}
.dashboard-student-tabs button.active{border-color:#59627c;background:var(--dusk-2);color:var(--moon)}
.dashboard-toolbar-right{display:flex;align-items:center;gap:18px;margin-left:auto;flex:none}
.dashboard-source-mini{color:var(--dim);font-size:.72rem;white-space:nowrap}
.dashboard-source-mini i,.dashboard-verification i{
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:7px;
  border-radius:50%;
  background:var(--attention);
}
.source-mini-verified i,.source-card-verified i{background:var(--settled);box-shadow:0 0 12px #7FC8A966}
.surface-control{display:flex;align-items:center;gap:8px;padding:6px 9px;border:1px solid var(--line);border-radius:999px;background:#0c101b}
.surface-label{color:var(--dim);font-size:.68rem;font-weight:700}
.surface-label.active{color:var(--moon)}
.surface-switch{position:relative;width:44px;height:24px;padding:0;border:0;border-radius:999px;background:#30384f}
.surface-switch span{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--moon);box-shadow:0 2px 7px #0008;transition:transform .2s ease,background .2s ease}
.surface-switch[aria-checked="true"]{background:#d3ad62}
.surface-switch[aria-checked="true"] span{transform:translateX(20px);background:#fff9e9}
.dashboard-content{width:min(1220px,calc(100% - 52px));margin:0 auto;padding:38px 0 72px}
.dashboard-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;margin-bottom:25px}
.dashboard-heading h1{max-width:720px;margin:7px 0 0;font-size:clamp(2.5rem,4.8vw,3.8rem);line-height:1.01;letter-spacing:-.04em}
.dashboard-heading h1 em{color:var(--lamplight);font-style:normal;font-weight:500}
.dashboard-verification{min-width:285px;max-width:340px;padding:13px 0;border-top:1px solid var(--attention);border-bottom:1px solid var(--line)}
.dashboard-verification strong{display:block;font-size:.78rem}
.dashboard-verification span,.dashboard-verification small{display:block;color:var(--dim);font-size:.67rem;line-height:1.5}
.dashboard-verification a{display:inline-block;margin-top:6px;font-size:.72rem;font-weight:700}
.source-card-verified{border-top-color:var(--settled)}
.dashboard-summary{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:17px;border:1px solid var(--line);border-radius:11px;background:#151b2b;overflow:hidden}
.summary-cell{padding:13px 17px}
.summary-cell+.summary-cell{border-left:1px solid var(--line)}
.summary-cell strong{display:block;font-family:var(--display);font-size:1.55rem;font-weight:400;line-height:1.05}
.summary-cell span{color:var(--dim);font-size:.68rem}
.summary-action strong{color:var(--attention)}
.summary-done strong{color:var(--settled)}
.dashboard-filters{display:flex;align-items:center;gap:6px;margin-bottom:13px;overflow-x:auto;scrollbar-width:none}
.dashboard-filters::-webkit-scrollbar{display:none}
.dashboard-filters button{min-height:35px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--dim);white-space:nowrap;font-size:.72rem;font-weight:700}
.dashboard-filters button.active{border-color:var(--moon);background:var(--moon);color:var(--night)}
.dashboard-filters small{margin-left:auto;color:var(--dim);font-size:.67rem;white-space:nowrap}
.dashboard-grid{display:grid;gap:18px}
.dashboard-student-block{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(310px,.75fr);gap:18px;align-items:start}
.dashboard-student-block[hidden],.dashboard-group[hidden],.activity-row[hidden]{display:none!important}
.dashboard-panel{border:1px solid var(--line);border-radius:13px;background:var(--dusk);overflow:hidden}
.dashboard-panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:20px 21px 17px;border-bottom:1px solid var(--line)}
.dashboard-panel-heading.compact{align-items:center}
.dashboard-panel-heading h2{margin:0;font-size:clamp(1.35rem,2.4vw,1.65rem)}
.dashboard-panel-heading span,.dashboard-panel-heading p{display:block;margin:4px 0 0;color:var(--dim);font-size:.67rem}
.dashboard-panel-heading button,.dashboard-panel-heading a{padding:4px 0;border:0;background:transparent;color:var(--lamplight);font-size:.67rem;font-weight:700;white-space:nowrap}
.dashboard-brief{border-radius:22px 22px 12px 12px;background:linear-gradient(158deg,var(--dusk-2),#171d2e 64%,#121624);box-shadow:0 30px 80px -58px #000}
.dashboard-queue{padding:3px 21px 8px}
.dashboard-group{position:relative;padding:21px 0 6px 21px}
.dashboard-group+.dashboard-group{border-top:1px solid var(--line)}
.dashboard-group>h3{position:relative;margin:0 0 6px;color:var(--dim);font-family:var(--body);font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.dashboard-group>h3 span{color:inherit}
.dashboard-group>h3::before{content:"";position:absolute;left:-21px;top:3px;width:8px;height:8px;border:2px solid var(--dusk-2);border-radius:50%;background:var(--attention);box-shadow:0 0 0 1px var(--attention)}
.group-watch>h3::before{background:var(--lamplight);box-shadow:0 0 0 1px #ab791a}
.group-done>h3::before{background:var(--settled);box-shadow:0 0 0 1px #4e9678}
.dashboard-item{display:grid;grid-template-columns:minmax(0,1fr) 126px 80px;gap:12px;align-items:center;min-height:67px;padding:12px 0;border-bottom:1px solid #ffffff0b}
.dashboard-item:last-child{border-bottom:0}
.dashboard-item h4{margin:0 0 3px;font-size:.85rem}
.dashboard-item p{margin:0;color:var(--dim);font-size:.67rem}
.dashboard-item time{color:var(--dim);font-size:.67rem}
.dashboard-item button{min-height:34px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--moon);font-size:.65rem;font-weight:700}
.dashboard-item button:hover{border-color:var(--lamplight);color:var(--lamplight)}
.dashboard-reason{grid-column:1/-1;margin:-2px 0 5px!important;padding:8px 10px;border-radius:6px;background:#0f1422;color:#b4bbcc!important}
.dashboard-empty{padding:28px 0}
.dashboard-filter-empty{margin:18px 21px 24px;padding:22px;border:1px dashed var(--line);border-radius:9px;text-align:center}
.dashboard-filter-empty h3{margin:0 0 4px;font-size:.88rem}
.dashboard-filter-empty p{margin:0;color:var(--dim);font-size:.7rem}
.dashboard-empty.compact{padding:22px}
.dashboard-empty h3{margin-bottom:4px}
.dashboard-empty p{margin:0;color:var(--dim);font-size:.78rem}
.dashboard-rail{display:grid;gap:16px}
.course-list{display:grid}
.course-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;padding:15px 19px;border-bottom:1px solid #ffffff0b}
.course-row:last-child{border-bottom:0}
.course-row h3{margin:0 0 2px;font-size:.78rem}
.course-row p{margin:0;color:var(--dim);font-size:.65rem}
.course-row>strong{font-family:var(--display);font-size:1.4rem;font-weight:400;text-align:right}
.course-row>strong span{color:var(--dim);font-family:var(--body);font-size:.67rem}
.course-empty{padding:22px;color:var(--dim);font-size:.75rem}
.dashboard-confidence{padding:16px 18px;border:1px solid #E8927C44;border-radius:12px;background:#2c1d25}
.dashboard-confidence strong{display:block;margin-bottom:4px;color:#ffd6cd;font-size:.77rem}
.dashboard-confidence p{margin:0;color:#d4aaa0;font-size:.67rem}
.source-confidence-verified{border-color:#7FC8A944;background:#15271f}
.source-confidence-verified strong{color:#d6f2e5}
.source-confidence-verified p{color:#9fc8b6}
.dashboard-activity{grid-column:1/-1}
.activity-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.activity-row{display:grid;grid-template-columns:74px 1fr;gap:12px;padding:16px 20px}
.activity-row+.activity-row{border-left:1px solid var(--line)}
.activity-row time{color:var(--dim);font-family:var(--mono);font-size:.59rem}
.activity-row strong{font-size:.73rem}
.activity-row p{margin:2px 0 0;color:var(--dim);font-size:.65rem}
.dashboard-onboarding{padding:34px;grid-column:1/-1}
.dashboard-onboarding p{max-width:42rem;color:var(--dim)}
/* Embedded billing */
.billing-page .app-wrap{width:min(100%,calc(1160px + 48px))}
.checkout-heading{max-width:760px;margin:0 auto 34px;text-align:center}
.checkout-heading .checkout-back{display:inline-block;margin-bottom:26px;color:var(--dim);font-size:.82rem;font-weight:600}
.checkout-heading .checkout-back:hover{color:var(--moon)}
.checkout-heading h1{margin-bottom:.8rem}
.checkout-heading h1 em{font-style:normal}
.checkout-heading .lede{max-width:630px;margin-inline:auto;color:var(--dim)}
.checkout-layout{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:22px;align-items:start}
.checkout-summary{position:sticky;top:88px;overflow:hidden;border:1px solid #F5B84A45;border-radius:var(--radius);background:linear-gradient(155deg,#25283a,#181d2d 72%);box-shadow:0 24px 70px -50px #000}
.checkout-summary-top{padding:29px 28px 23px;border-bottom:1px solid var(--line)}
.checkout-summary-top h2{margin-bottom:1.1rem;font-size:2rem}
.checkout-price{display:flex;align-items:baseline;gap:10px;margin-bottom:2px}
.checkout-price span{color:var(--moon);font-family:var(--display);font-size:3.5rem;font-weight:500;line-height:1}
.checkout-price small{color:var(--dim);font-size:.78rem;font-weight:600}
.checkout-value{margin:8px 0 0;color:var(--dim);font-size:.8rem}
.checkout-benefits{display:grid;gap:14px;margin:0;padding:24px 28px;list-style:none}
.checkout-benefits li{display:grid;grid-template-columns:19px 1fr;gap:8px;color:#d7dbea;font-size:.82rem;line-height:1.45}
.checkout-benefits li span{color:var(--settled);font-weight:800}
.checkout-trial-note{margin:0 18px 18px;padding:17px 18px;border:1px solid #7FC8A93d;border-radius:10px;background:#142821}
.checkout-trial-note strong{display:block;margin-bottom:5px;color:#d6f2e5;font-size:.78rem}
.checkout-trial-note p{margin:0;color:#9fc8b6;font-size:.72rem;line-height:1.5}
.checkout-payment{min-width:0;padding:24px;background:#171c2b}
.checkout-payment-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.checkout-payment-heading h2{margin:0}
.stripe-secure-mark{flex:none;padding:6px 9px;border:1px solid var(--line);border-radius:999px;color:var(--dim);font-size:.66rem;font-weight:700}
.stripe-secure-mark span{margin-right:3px;color:var(--settled)}
.checkout-privacy{margin:12px 0 0;color:var(--dim);font-size:.74rem;line-height:1.45}
.payment-element-shell{margin-top:16px}
.checkout-loading{margin:9px 0 0;color:var(--dim);font-size:.74rem;line-height:1.4}
.checkout-loading[hidden]{display:none}
.checkout-error{padding:18px;border:1px solid #E8927C70;border-radius:10px;background:#3a242b;color:#ffd7ce}
.checkout-submit{width:100%;min-height:48px;margin-top:14px;border-radius:10px}
.checkout-submit:disabled{cursor:not-allowed;opacity:.55;transform:none;box-shadow:none}
.checkout-submit.is-processing{cursor:wait}
.checkout-fallback{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px;margin-top:18px;padding-top:15px;border-top:1px solid var(--line);color:var(--dim);font-size:.72rem}
.checkout-fallback p{margin:0}
.checkout-fallback form{margin:0}
.text-button{padding:0;border:0;background:transparent;color:var(--lamplight);font-size:inherit;font-weight:700}
.text-button:hover{text-decoration:underline}
.checkout-assurances{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:22px;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--line)}
.checkout-assurances span{padding:15px 17px;background:#151a28;color:var(--dim);font-size:.68rem;line-height:1.45}
.checkout-assurances strong{display:block;margin-bottom:2px;color:var(--moon);font-size:.72rem}

/* C's warm paper perspective changes only the main brief surface. */
.paper-surface .dashboard-brief{border-color:#d4d0c4;background:#ece8dc;color:#1a1d25;box-shadow:0 28px 70px -50px #000}
.paper-surface .dashboard-brief .dashboard-panel-heading{border-color:#cfcbc0}
.paper-surface .dashboard-brief .dashboard-panel-heading span,
.paper-surface .dashboard-brief .dashboard-panel-heading p,
.paper-surface .dashboard-brief .dashboard-item p,
.paper-surface .dashboard-brief .dashboard-item time,
.paper-surface .dashboard-brief .dashboard-group>h3{color:#696c76}
.paper-surface .dashboard-brief .dashboard-group+.dashboard-group,
.paper-surface .dashboard-brief .dashboard-item{border-color:#1a1d2518}
.paper-surface .dashboard-brief .dashboard-group>h3::before{border-color:#ece8dc}
.paper-surface .dashboard-brief .dashboard-item button{border-color:#bdb9ae;background:#f4f1e8;color:#1a1d25}
.paper-surface .dashboard-brief .dashboard-item button:hover{border-color:#7e796d;color:#1a1d25}
.paper-surface .dashboard-brief .dashboard-reason{background:#dedacd;color:#535762!important}

@media (max-width:980px){
  /* Below this width the sidebar gives way to the fixed bottom bar, and the
     top bar keeps behaving exactly as it does on the marketing pages. */
  .authenticated{display:flex;padding-bottom:72px}
  .app-sidebar{display:none}
  .dashboard-page .app-wrap{width:100%;margin:0}
  .authenticated .page-back{display:inline-block}
  .dashboard-toolbar{position:static;flex-wrap:wrap;padding:9px 16px}
  .dashboard-student-tabs{order:2;width:100%;padding-top:9px;border-top:1px solid var(--line)}
  .dashboard-toolbar-right{margin-left:0;width:100%;justify-content:space-between}
  .dashboard-content{width:calc(100% - 30px);padding-top:28px}
  .dashboard-heading{display:block}
  .dashboard-verification{margin-top:20px}
  .dashboard-student-block{grid-template-columns:1fr}
  .activity-list{grid-template-columns:1fr}
  .activity-row+.activity-row{border-left:0;border-top:1px solid var(--line)}
  .app-mobile-nav{position:fixed;z-index:60;left:10px;right:10px;bottom:9px;display:flex;justify-content:space-around;padding:7px;border:1px solid var(--line);border-radius:13px;background:#121724ed;backdrop-filter:blur(12px);box-shadow:0 16px 44px #0008}
  .app-mobile-nav a{min-width:65px;padding:7px;color:var(--dim);text-align:center;font-size:.68rem;font-weight:650;text-decoration:none}
  .app-mobile-nav a.active{color:var(--lamplight)}
  .authenticated{padding-bottom:72px}
}
@media (max-width:620px){
  .dashboard-content{width:calc(100% - 24px);padding-top:23px}
  .dashboard-source-mini{display:none}
  .dashboard-heading h1{font-size:2.45rem}
  .dashboard-summary{grid-template-columns:repeat(2,1fr)}
  .summary-cell:nth-child(3){border-left:0;border-top:1px solid var(--line)}
  .summary-cell:nth-child(4){border-top:1px solid var(--line)}
  .dashboard-filters small{display:none}
  .dashboard-panel-heading{padding:18px 16px 15px}
  .dashboard-queue{padding-inline:16px}
  .dashboard-item{grid-template-columns:minmax(0,1fr) auto}
  .dashboard-item time{grid-column:1}
  .dashboard-item button{grid-column:2;grid-row:1/3;width:76px}
  .dashboard-reason{grid-column:1/-1}
  .activity-row{padding-inline:16px}
}

@media (max-width:880px){
  .checkout-layout{grid-template-columns:1fr}
  .checkout-summary{position:static}
  .checkout-benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .checkout-assurances{grid-template-columns:1fr}
}

@media (max-width:620px){
  .billing-page .app-wrap{padding-top:34px;padding-inline:16px}
  .checkout-heading{margin-bottom:24px;text-align:left}
  .checkout-heading .checkout-back{margin-bottom:22px}
  .checkout-heading h1{font-size:2.45rem}
  .checkout-summary-top,.checkout-benefits{padding-inline:21px}
  .checkout-benefits{grid-template-columns:1fr}
  .checkout-payment{padding:18px 16px}
  .checkout-payment-heading{display:block}
  .stripe-secure-mark{display:inline-block;margin-top:9px}
  .checkout-fallback{display:block}
  .checkout-fallback form{margin-top:2px}
}
@media (prefers-reduced-motion:reduce){
  .surface-switch span{transition:none}
}
