@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;src:url("/daylight/inter-opsz-v20-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;src:url("/daylight/inter-opsz-v20-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Ready Aviator, Daylight: the app (REA-29 step 0, round 2; founder, 14 Oct 2026: "daylight is the best", with more work asked
   on the brand and the look). Every value below is the landing's (archive/landing-probes/b-daylight, version 36), plus the
   states an app needs. The identity is light by the brief, so the page sets every colour itself on any host theme. */
html:has(.dl){color-scheme:light;
  /* the paper and its ink */
  --bg:#faf8f1;--ground:#efebe0;--card:#fffdf7;--sunk:#f3f0e7;--fg:#0d1b2a;--fg2:#45515e;--fg3:#56626e;
  --line:rgba(13,27,42,.1);--line2:rgba(13,27,42,.16);
  /* the one action */
  --accent:#ff8f1f;--accent-hover:#ffa03c;--accent-ink:#1b0f02;--accent-soft:rgba(255,143,31,.14);--accent-text:#8a4a00;
  --accent-glow:0 1px 0 rgba(255,255,255,.35) inset,0 10px 30px -10px rgba(255,143,31,.65);
  /* our 3D screens, and the cream they speak in */
  --night:#07182d;--night-card:#0d2039;--cream:#fdf7ea;--slate:#9db6cc;
  /* the Ask box is cream (founder pick A, 14 Oct 2026); your own question in it, and a chip under the pointer, sit a step deeper */
  --cream-deep:#f6eddc;
  /* answers: correct and wrong, the same in practice, review and mocks */
  --ok:#007a52;--ok-base:#00bc7d;--ok-fill:rgba(0,188,125,.1);--ok-line:rgba(0,188,125,.38);
  --no:#c9252c;--no-base:#ee343b;--no-fill:rgba(238,52,59,.08);--no-line:rgba(238,52,59,.36);
  /* the worked solution (the explanation canon: the sky panel, purple terms, a teal tip, a green answer) */
  --sky:linear-gradient(180deg,rgba(157,182,204,.3),rgba(157,182,204,.16));--sky-ink:#1d3d61;
  --term:#5b3fa0;--term-fill:rgba(126,87,201,.12);--term-line:rgba(126,87,201,.32);
  --tip:#0f6b64;--tip-fill:rgba(20,148,140,.1);--tip-line:rgba(20,148,140,.3);
  /* shape */
  --r-band:40px;--r-card:24px;--r-inner:16px;--r-ctl:14px;--ctl:44px;
  --card-shadow:0 0 0 1px var(--line) inset,0 24px 48px -36px rgba(13,27,42,.36);
  --card-shadow-sm:0 0 0 1px var(--line) inset,0 10px 24px -20px rgba(13,27,42,.32);
  /* motion: one ease, short times; nothing waits on a flourish */
  --ease:cubic-bezier(.22,1,.36,1);--quick:.16s;--move:.32s;
  /* type: the landing's one scale, sized for an app */
  --font:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --t-display:clamp(2.25rem,4.4vw,3.5rem);--t-title:clamp(1.75rem,2.2vw,2.125rem);--t-h2:clamp(1.1875rem,1.5vw,1.3125rem);
  --t-h3:1.0625rem;--t-body:1.0625rem;--t-small:.9375rem;--t-meta:.8125rem;--t-tiny:.6875rem;
  --w-head:600;--w-ui:500;
  --g:20px;--gap:14px;--pad:20px}
@media (min-width:760px){html:has(.dl){--g:32px;--gap:18px;--pad:24px}}
@media (prefers-contrast:more){html:has(.dl){--line:rgba(13,27,42,.28);--line2:rgba(13,27,42,.4)}}
@media (min-width:1200px){html:has(.dl){--g:48px;--gap:20px;--pad:26px}}

/* the page */
.dl *:where(:not(.v16-root *)),.dl *:where(:not(.v16-root *))::before,.dl *:where(:not(.v16-root *))::after{box-sizing:border-box}
html:has(.dl){-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg);-webkit-tap-highlight-color:transparent}
body:has(.dl){margin:0;background-color:var(--bg);color:var(--fg);font-family:var(--font);font-size:var(--t-body);line-height:1.5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"cv11" 1,"ss01" 1;
  background-image:url("/daylight/grain-2x.webp");
  background-image:image-set(url("/daylight/grain-1x.webp") 1x,url("/daylight/grain-2x.webp") 2x,url("/daylight/grain-3x.webp") 3x);background-size:180px 180px}
.dl :where(a):where(:not(.v16-root *)){color:inherit;text-decoration:none}
.dl :where(button):where(:not(.v16-root *)){font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.dl :where(img):where(:not(.v16-root *)){display:block;max-width:100%}
.dl :where(p,h1,h2,h3,h4,ul,ol,figure,dl,dd):where(:not(.v16-root *)){margin:0;padding:0}
.dl :where(ul,ol):where(:not(.v16-root *)){list-style:none}
.dl :where(input):where(:not(.v16-root *)){font:inherit;color:inherit}
.dl .i:where(:not(.v16-root *)){width:1em;height:1em;flex:none;stroke-width:1.75}
.dl .num:where(:not(.v16-root *)){font-variant-numeric:tabular-nums}
.dl .sr:where(:not(.v16-root *)){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dl [hidden]:where(:not(.v16-root *)){display:none!important}
.dl :focus-visible:where(:not(.v16-root *)){outline:2px solid var(--fg);outline-offset:3px}
.dl :where(:not(.v16-root *))::selection{background:rgba(255,143,31,.28)}
/* ---------- the app's frame ---------- */
.dl .app:where(:not(.v16-root *)){position:relative;min-height:100vh;min-height:100dvh}
.dl .main:where(:not(.v16-root *)){min-width:0;padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
.dl .scr:where(:not(.v16-root *)){min-height:60vh}
.dl .wrap:where(:not(.v16-root *)){width:100%;max-width:1120px;margin-inline:auto;padding-inline:max(var(--g),env(safe-area-inset-left,0px)) max(var(--g),env(safe-area-inset-right,0px))}
.dl .wrap.narrow:where(:not(.v16-root *)){max-width:760px}
@media (prefers-reduced-motion:no-preference){
  /* backwards, never both: an animation that fills forwards keeps the screen a layer of its own (a transform in effect), so a
     sheet or dialog inside it sits under the dim layer, darkened and unreachable (founder, 14 Oct 2026) */
}

/* the logo */
.dl .logo:where(:not(.v16-root *)){display:inline-flex;align-items:center;min-height:44px;color:var(--fg)}
.dl .logo svg:where(:not(.v16-root *)){display:block;height:24px;width:auto}
.dl .mark:where(:not(.v16-root *)){display:inline-grid;place-items:center;color:var(--fg)}
.dl .mark svg:where(:not(.v16-root *)){width:100%;height:100%}

/* a screen's bar: the logo and you on a main screen, the way back and the title deeper in */
.dl .bar:where(:not(.v16-root *)){position:sticky;top:0;z-index:30;padding-top:env(safe-area-inset-top,0px);background:var(--bg);box-shadow:0 1px 0 transparent;transition:box-shadow .2s}
.dl .bar.lined:where(:not(.v16-root *)){box-shadow:0 1px 0 var(--line)}
.dl .bar-in:where(:not(.v16-root *)){display:grid;grid-template-columns:minmax(44px,1fr) minmax(0,max-content) minmax(44px,1fr);align-items:center;gap:6px;height:56px}
.dl .bar .back:where(:not(.v16-root *)),.dl .bar-logo:where(:not(.v16-root *)){grid-column:1;justify-self:start;max-width:100%;min-width:0}
.dl .bar .back span:where(:not(.v16-root *)){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl .bar .back:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:2px;min-height:44px;margin-left:-10px;padding:0 10px 0 4px;border-radius:12px;
  font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);transition:color .15s,transform var(--quick) var(--ease)}
.dl .bar .back .i:where(:not(.v16-root *)){font-size:22px;stroke-width:2}
.dl .bar .back:active:where(:not(.v16-root *)){transform:scale(.96)}
.dl .bar-title:where(:not(.v16-root *)){grid-column:2;min-width:0;font-size:var(--t-small);font-weight:var(--w-head);text-align:center;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;opacity:0;transition:opacity .2s}
.dl .bar.lined .bar-title:where(:not(.v16-root *)){opacity:1}
/* the title takes no room until it shows, so the way back keeps its whole name on a page's first screen */
.dl .bar:not(.lined) .bar-title:where(:not(.v16-root *)){display:none}
@starting-style{.dl .bar.lined .bar-title:where(:not(.v16-root *)){opacity:0}}
.dl .bar .back.tight span:where(:not(.v16-root *)){display:none}
.dl .bar-end:where(:not(.v16-root *)){grid-column:3;justify-self:end;display:flex;align-items:center;gap:4px}
.dl .iconbtn:where(:not(.v16-root *)){display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--fg2);transition:background-color .15s,transform var(--quick) var(--ease)}
.dl .iconbtn .i:where(:not(.v16-root *)){font-size:21px}
.dl .iconbtn:active:where(:not(.v16-root *)){transform:scale(.96)}
.dl .iconbtn[aria-pressed="true"]:where(:not(.v16-root *)){color:var(--fg)}
@media (hover:hover) and (pointer:fine){.dl .iconbtn:hover:where(:not(.v16-root *)){background:rgba(13,27,42,.06)}.dl .bar .back:hover:where(:not(.v16-root *)){color:var(--fg)}}
.dl .ava:where(:not(.v16-root *)){display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--fg);color:var(--cream);font-size:14px;font-weight:600;
  box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--line2);transition:transform var(--quick) var(--ease)}
.dl .ava-btn:where(:not(.v16-root *)){display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%}
.dl .ava-btn:active .ava:where(:not(.v16-root *)){transform:scale(.96)}

/* ---------- option A: five tabs, one for each thing we do (Home, Practice, Exams, RTR, Cadet) ---------- */
.dl .tabbar:where(:not(.v16-root *)){position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;
  padding:6px max(16px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  background:var(--bg);box-shadow:0 -1px 0 var(--line)}
.dl .app .tabbar:where(:not(.v16-root *)){display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.dl .tab:where(:not(.v16-root *)){position:relative;display:grid;justify-items:center;align-content:center;gap:3px;min-height:52px;border-radius:14px;color:var(--fg3);
  font-size:var(--t-tiny);font-weight:var(--w-ui);letter-spacing:.01em;transition:color .15s,transform var(--quick) var(--ease)}
.dl .tab .ic:where(:not(.v16-root *)){position:relative;display:grid;place-items:center;width:52px;height:30px;border-radius:999px;transition:background-color .2s var(--ease)}
.dl .tab .i:where(:not(.v16-root *)){font-size:22px;stroke-width:1.75}
.dl .tab[aria-current="page"]:where(:not(.v16-root *)){color:var(--fg)}
.dl .tab[aria-current="page"] .ic:where(:not(.v16-root *)){background:rgba(13,27,42,.08)}
.dl .tab[aria-current="page"] .i:where(:not(.v16-root *)){stroke-width:2.1}
.dl .tab:active:where(:not(.v16-root *)){transform:scale(.96)}
.dl .badge:where(:not(.v16-root *)){position:absolute;top:-3px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--fg);color:var(--cream);
  font-size:10.5px;font-weight:600;line-height:18px;text-align:center;box-shadow:0 0 0 2px var(--bg)}

/* on a laptop the five sit in a sidebar: a panel that floats on the paper (founder pick D, 14 Oct 2026; the options are in
   archive/identity-probes/sidebar-options/). Every room, Review with its quiet count, the tools together, and you with your plan
   in one row at the foot. It folds to icons, as the live sidebar does, and a label names an icon under the pointer */
.dl .side:where(:not(.v16-root *)){display:none}
@media (min-width:1000px){
  .dl .app:where(:not(.v16-root *)){display:grid;grid-template-columns:272px minmax(0,1fr)}
  html[data-folded] .dl .app:where(:not(.v16-root *)){grid-template-columns:96px minmax(0,1fr)}
  .dl .app .tabbar:where(:not(.v16-root *)){display:none}
  .dl .app .side:where(:not(.v16-root *)){position:sticky;top:12px;display:flex;flex-direction:column;gap:20px;height:calc(100vh - 24px);margin:12px;padding:14px 12px 12px;
    overflow-x:hidden;overflow-y:auto;border-radius:var(--r-card);background:var(--card);box-shadow:var(--card-shadow)}
  .dl .app .main:where(:not(.v16-root *)){padding-bottom:64px}
  .dl .app .bar.root:where(:not(.v16-root *)){display:none}
}
.dl .sb-top:where(:not(.v16-root *)){display:flex;align-items:center;justify-content:space-between;gap:6px;padding:2px 0 0 10px}
.dl .side .sb-logo:where(:not(.v16-root *)){padding:0}
.dl .side .sb-logo svg:where(:not(.v16-root *)){height:32px}
.dl .sb-markonly:where(:not(.v16-root *)){display:none;width:30px;height:30px}
.dl .sb-fold:where(:not(.v16-root *)){flex:none;color:var(--fg3)}
.dl .sb-fold .i:where(:not(.v16-root *)){font-size:20px}
.dl .sb-nav:where(:not(.v16-root *)){display:grid;gap:2px}
.dl .sb-nav a:where(:not(.v16-root *)){position:relative;display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border-radius:var(--r-ctl);color:var(--fg2);
  font-size:var(--t-small);font-weight:var(--w-ui);white-space:nowrap;transition:background-color .15s,color .15s,transform var(--quick) var(--ease)}
.dl .sb-nav a .i:where(:not(.v16-root *)){font-size:20px}
.dl .sb-nav a[aria-current="page"]:where(:not(.v16-root *)){background:var(--sunk);color:var(--fg)}
.dl .sb-nav a[aria-current="page"] .i:where(:not(.v16-root *)){stroke-width:2}
.dl .sb-nav a:active:where(:not(.v16-root *)){transform:scale(.97)}
/* the one number the navigation carries, said quietly: a figure, not a black pill */
.dl .sb-nav .ct:where(:not(.v16-root *)){margin-left:auto;font-style:normal;font-size:var(--t-meta);font-weight:600;color:var(--fg3)}
.dl .sb-nav .new:where(:not(.v16-root *)){margin-left:auto;font-style:normal;font-size:var(--t-tiny);font-weight:600;letter-spacing:.02em;padding:2px 8px;border-radius:999px;
  background:rgba(13,27,42,.06);color:var(--fg2)}
.dl .sb-group h4:where(:not(.v16-root *)){padding:0 12px;margin-bottom:4px;font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg3)}
.dl .sb-foot:where(:not(.v16-root *)){margin-top:auto;display:grid;gap:6px}
.dl .sb-me:where(:not(.v16-root *)){display:flex;align-items:center;gap:10px;width:100%;min-width:0;min-height:56px;padding:8px 10px;border-radius:var(--r-ctl);text-align:left;
  transition:background-color .15s}
.dl .sb-me .ava:where(:not(.v16-root *)){width:34px;height:34px;flex:none;box-shadow:none}
.dl .sb-me .lb:where(:not(.v16-root *)){flex:1 1 auto;min-width:0}
.dl .sb-me b:where(:not(.v16-root *)){display:block;font-size:var(--t-small);font-weight:var(--w-ui);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dl .sb-me .lb span:where(:not(.v16-root *)){display:block;font-size:var(--t-meta);color:var(--fg3);line-height:1.35;white-space:nowrap}
.dl .sb-me > .i:where(:not(.v16-root *)){flex:none;font-size:18px;color:var(--fg3)}
.dl .app[data-new] .sb-nav .ct:where(:not(.v16-root *)){display:none}
@media (hover:hover) and (pointer:fine){
  .dl .sb-nav a:not([aria-current="page"]):hover:where(:not(.v16-root *)),.dl .sb-me:hover:where(:not(.v16-root *)),.dl .sb-fold:hover:where(:not(.v16-root *)){background:rgba(13,27,42,.04);color:var(--fg)}
}
/* folded to icons: the names stay for a screen reader, and a pill names a row under the pointer */
html[data-folded] .dl .side .lb:where(:not(.v16-root *)),html[data-folded] .dl .side h4:where(:not(.v16-root *)),html[data-folded] .dl .side .new:where(:not(.v16-root *)),html[data-folded] .dl .side .sb-me > .i:where(:not(.v16-root *)){
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html[data-folded] .dl .side .sb-top:where(:not(.v16-root *)){flex-direction:column;gap:8px;padding:2px 0 0}
html[data-folded] .dl .side .sb-logo > svg:where(:not(.v16-root *)){display:none}
html[data-folded] .dl .side .sb-markonly:where(:not(.v16-root *)){display:inline-grid}
html[data-folded] .dl .side .sb-nav a:where(:not(.v16-root *)){justify-content:center;padding:0}
html[data-folded] .dl .side .sb-group:where(:not(.v16-root *)){padding-top:12px;box-shadow:0 -1px 0 var(--line)}
html[data-folded] .dl .side .sb-me:where(:not(.v16-root *)){justify-content:center;padding:8px 0}
html[data-folded] .dl .side .sb-nav .ct:where(:not(.v16-root *)){position:absolute;top:5px;left:calc(50% + 4px);min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:var(--fg);color:var(--cream);font-size:10.5px;line-height:18px;text-align:center}
.dl .rail-tip:where(:not(.v16-root *)){position:fixed;z-index:60;padding:6px 10px;border-radius:10px;background:var(--fg);color:var(--cream);font-size:var(--t-meta);
  font-weight:var(--w-ui);white-space:nowrap;pointer-events:none;opacity:0;transform:translate(-4px,-50%);transition:opacity .12s,transform .12s var(--ease)}
.dl .rail-tip.on:where(:not(.v16-root *)){opacity:1;transform:translate(0,-50%)}
@media (prefers-reduced-motion:reduce){.dl .rail-tip:where(:not(.v16-root *)),.dl .rail-tip.on:where(:not(.v16-root *)){transform:translate(0,-50%)}}

/* ---------- the sheet: you, your plan and the tools ---------- */
.dl .scrim:where(:not(.v16-root *)){position:fixed;inset:0;z-index:70;background:rgba(7,24,45,.32);opacity:0;pointer-events:none;transition:opacity .2s}
.dl .scrim.on:where(:not(.v16-root *)){opacity:1;pointer-events:auto}
.dl .sheet:where(:not(.v16-root *)){position:fixed;left:0;right:0;bottom:0;z-index:80;display:grid;gap:6px;max-height:86vh;max-height:86dvh;overflow-y:auto;
  padding:10px max(16px,env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  border-radius:28px 28px 0 0;background:var(--card);box-shadow:0 -20px 50px -20px rgba(7,24,45,.4);transform:translateY(104%);
  transition:transform .2s var(--ease),visibility 0s .2s;visibility:hidden}
.dl .sheet.on:where(:not(.v16-root *)){transform:none;visibility:visible;transition:transform .32s var(--ease)}
.dl .sheet .grab:where(:not(.v16-root *)){justify-self:center;width:40px;height:5px;margin-bottom:6px;border-radius:999px;background:var(--line2)}
/* every sheet's handle drags it (app.js): no page scroll under the finger, and a hit area a thumb can find */
.dl .grab:where(:not(.v16-root *)){position:relative;touch-action:none}
.dl .grab:where(:not(.v16-root *))::after{content:"";position:absolute;inset:-16px -60px}
.dl .scrim:where(:not(.v16-root *)){touch-action:none}
.dl .sheet .who:where(:not(.v16-root *)){display:flex;align-items:center;gap:12px;padding:8px 6px 14px;box-shadow:0 1px 0 var(--line)}
.dl .sheet .who .ava:where(:not(.v16-root *)){flex:none;width:44px;height:44px;font-size:17px;color:var(--cream);box-shadow:none}
.dl .sheet .who b:where(:not(.v16-root *)){display:block;font-size:var(--t-h3);font-weight:var(--w-head)}
.dl .sheet .who span:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg2)}
.dl .sheet a:where(:not(.v16-root *)),.dl .sheet button.row:where(:not(.v16-root *)){display:flex;align-items:center;gap:14px;width:100%;min-height:52px;padding:0 10px;border-radius:var(--r-ctl);font-size:var(--t-small);font-weight:var(--w-ui)}
.dl .sheet a .i:where(:not(.v16-root *)),.dl .sheet button.row .i:where(:not(.v16-root *)){font-size:20px;color:var(--fg2)}
.dl .sheet a span.aside:where(:not(.v16-root *)){margin-left:auto;font-size:var(--t-meta);color:var(--fg3);font-weight:400}
.dl .sheet h4:where(:not(.v16-root *)){padding:12px 10px 2px;font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg3)}
@media (hover:hover) and (pointer:fine){.dl .sheet a:hover:where(:not(.v16-root *)),.dl .sheet button.row:hover:where(:not(.v16-root *)){background:rgba(13,27,42,.05)}}
@media (min-width:760px){
  .dl .sheet:where(:not(.v16-root *)){left:auto;right:24px;bottom:auto;top:76px;width:360px;max-height:calc(100vh - 88px);max-height:calc(100dvh - 88px);border-radius:24px;
    transform:translateY(-8px) scale(.98);opacity:0;transform-origin:top right;
    transition:transform .2s var(--ease),opacity .2s var(--ease),visibility 0s .2s}
  .dl .sheet.on:where(:not(.v16-root *)){transform:none;opacity:1;transition:transform .2s var(--ease),opacity .2s var(--ease)}
  .dl .sheet .grab:where(:not(.v16-root *)){display:none}
  .dl .scrim:where(:not(.v16-root *)){background:transparent}
  .dl .scrim.dim:where(:not(.v16-root *)){background:rgba(7,24,45,.32)}
}
@media (min-width:1000px){
  .dl .sheet[data-sheet-panel]:where(:not(.v16-root *)){left:24px;right:auto;top:auto;bottom:92px;width:320px;max-height:calc(100dvh - 116px);transform-origin:bottom left}
  .dl .sheet[data-sheet-panel]:not(.on):where(:not(.v16-root *)){transform:translateY(8px) scale(.98)}
  .dl .sheet a:where(:not(.v16-root *)){min-height:44px}
}
@media (prefers-reduced-motion:reduce){
  .dl .scr:where(:not(.v16-root *)){animation:none!important}
  .dl .scrim:where(:not(.v16-root *)){transition:opacity .2s!important}
  .dl .sheet:where(:not(.v16-root *)){transform:none!important;opacity:0;transition:opacity .2s,visibility 0s .2s!important}
  .dl .sheet.on:where(:not(.v16-root *)){opacity:1;transition:opacity .2s!important}
}
/* ---------- the waits (founder pick B, 14 Oct 2026: "B for loading"; the four options are in archive/identity-probes/loading-options/) ----------
   A screen that is still loading is drawn as itself, painted pale: its cards keep their shape, each line of text and each picture is a
   pale block and each control a pale shape, so nothing jumps when it arrives. Nothing shows for the first 0.2 s, so a fast screen never
   flashes. Past a second, one fun fact fades in above it with one honest progress element (founder rule, 10 Oct 2026): a bar that fills
   only where we know how much is left, and otherwise moves without claiming a number. The blocks themselves never move */
html:has(.dl){--gh:rgba(13,27,42,.07);--gh-text:rgba(13,27,42,.085)}
/* the screen is read for its outline while it is laid out but unseen, then taken out entirely, so nothing in it runs unseen */
.dl .scr.awaiting-pre:where(:not(.v16-root *)){position:absolute!important;visibility:hidden!important;pointer-events:none;inset:0 auto auto 0;width:100%}
.dl .scr.awaiting:where(:not(.v16-root *)){display:none!important}
.dl .ghost:where(:not(.v16-root *)){pointer-events:none;user-select:none}
.dl .ghost :not(.bar):not(.bar *):not(.wait-fact):not(.wait-fact *):where(:not(.v16-root *)){color:transparent!important;text-shadow:none!important}
.dl .ghost .gt:where(:not(.v16-root *)){background:linear-gradient(var(--gh-text),var(--gh-text)) 0 54%/100% 60% no-repeat;border-radius:8px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.dl .ghost .gh-ctl:where(:not(.v16-root *)){background:var(--gh)!important;background-image:none!important;box-shadow:none!important;border-color:transparent!important}
.dl .ghost .gh-ctl .gt:where(:not(.v16-root *)){background:none}
.dl .ghost .gh-pic:where(:not(.v16-root *)){visibility:hidden}
.dl .ghost .gh-pale:where(:not(.v16-root *)){background:var(--gh)!important;background-image:none!important;box-shadow:none!important}
@media (prefers-reduced-motion:no-preference){
  .dl .ghost:where(:not(.v16-root *)){animation:wait-show .01s linear .2s both}
}
@media (prefers-reduced-motion:reduce){
  .dl .ghost:where(:not(.v16-root *)){animation:wait-show .01s step-end .2s both}
}
@keyframes wait-show{from{opacity:0}to{opacity:1}}

/* the fact, and the one bar under it */
.dl .wait-fact:where(:not(.v16-root *)){display:grid;justify-items:center;gap:16px;padding:6px 0 18px;text-align:center;animation:wait-fact .4s var(--ease) 1s both}
.dl .ghost:where(:not(.v16-root *)){position:relative}
.dl .ghost .wait-fact:where(:not(.v16-root *)){position:absolute;left:0;right:0;z-index:2;margin-top:-6px;padding:18px var(--g);
  background:linear-gradient(rgba(250,248,241,0),var(--bg) 18px,var(--bg) calc(100% - 18px),rgba(250,248,241,0))}
.dl .wait-fact p:where(:not(.v16-root *)){max-width:30ch;font-size:var(--t-h3);line-height:1.5;color:var(--fg);text-wrap:balance}
@keyframes wait-fact{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.dl .wait-fact:where(:not(.v16-root *)){animation-timing-function:step-end}}
.dl .wait-bar:where(:not(.v16-root *)){position:relative;display:block;width:min(220px,64%);height:4px;border-radius:999px;background:rgba(13,27,42,.1);overflow:hidden}
.dl .wait-bar i:where(:not(.v16-root *)){position:absolute;top:0;bottom:0;left:0;width:34%;border-radius:inherit;background:var(--fg)}
/* the bar that claims no number runs at an even speed and leaves the track only for an instant; with reduced motion it fills the track
   and breathes, so a still segment is never read as an amount */
@media (prefers-reduced-motion:no-preference){
  .dl .wait-bar:not(.fill) i:where(:not(.v16-root *)){animation:wait-run 1.4s linear infinite}
  .dl .wait-bar.fill i:where(:not(.v16-root *)){transition:transform .5s var(--ease)}
}
@media (prefers-reduced-motion:reduce){.dl .wait-bar:not(.fill) i:where(:not(.v16-root *)){width:100%;animation:wait-breathe 1.6s ease-in-out infinite alternate}}
@keyframes wait-run{from{transform:translateX(-100%)}to{transform:translateX(294%)}}
@keyframes wait-breathe{from{opacity:.25}to{opacity:.6}}
.dl .wait-bar.fill i:where(:not(.v16-root *)){width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0))}

/* the animation's wait: its own night stage, the way back on top, the fact and a bar that fills as its parts arrive */
.dl .wait-night:where(:not(.v16-root *)){position:fixed;inset:0;z-index:95;display:grid;grid-template-rows:auto 1fr auto;background:var(--night);color:var(--cream);
  opacity:0;visibility:hidden;transition:opacity .2s var(--ease),visibility 0s .2s}
.dl .wait-night.on:where(:not(.v16-root *)){opacity:1;visibility:visible;transition:opacity .2s var(--ease)}
.dl .wait-top:where(:not(.v16-root *)){display:flex;align-items:center;min-height:60px;padding:calc(8px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))}
.dl .wait-back:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 12px 0 6px;border-radius:12px;color:rgba(253,247,234,.82);
  font-size:var(--t-small);font-weight:var(--w-ui);transition:color .15s,background-color .15s,transform var(--quick) var(--ease)}
.dl .wait-back .i:where(:not(.v16-root *)){font-size:20px;stroke-width:2}
.dl .wait-back:active:where(:not(.v16-root *)){transform:scale(.96)}
@media (hover:hover) and (pointer:fine){.dl .wait-back:hover:where(:not(.v16-root *)){color:var(--cream);background:rgba(253,247,234,.06)}}
.dl .wait-back:focus-visible:where(:not(.v16-root *)){outline-color:var(--cream)}
.dl .wait-stage:where(:not(.v16-root *)){display:grid;place-items:center;margin:8px max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px));border-radius:var(--r-card);
  background:rgba(253,247,234,.05)}
.dl .wait-stage .wait-fact:where(:not(.v16-root *)){animation:none}
.dl .wait-stage .wait-fact p:where(:not(.v16-root *)){color:var(--cream)}
.dl .wait-stage .wait-bar:where(:not(.v16-root *)){background:rgba(253,247,234,.16)}
.dl .wait-stage .wait-bar i:where(:not(.v16-root *)){background:var(--cream)}
.dl .wait-dock:where(:not(.v16-root *)){display:flex;justify-content:center;gap:14px;padding:16px 16px calc(22px + env(safe-area-inset-bottom,0px))}
.dl .wait-dock span:where(:not(.v16-root *)){width:44px;height:44px;border-radius:50%;background:rgba(253,247,234,.08)}
.dl .wait-dock span.w:where(:not(.v16-root *)){width:120px;border-radius:999px}
@media (min-width:1000px){.dl .wait-stage:where(:not(.v16-root *)){width:min(960px,calc(100% - 64px));justify-self:center}}

/* the Debrief, while it is written: its lines, pale, in the note's own place */
.dl .wait-lines:where(:not(.v16-root *)){display:none;gap:10px;padding:4px 0 6px}
.dl .wait-lines span:where(:not(.v16-root *)){display:block;height:14px;border-radius:7px;background:rgba(13,27,42,.08)}
.dl .wait-lines span:nth-child(1):where(:not(.v16-root *)){width:92%}.dl .wait-lines span:nth-child(2):where(:not(.v16-root *)){width:76%}.dl .wait-lines span:nth-child(3):where(:not(.v16-root *)){width:84%}
.dl .note.debrief[data-writing] > :not(.note-who):not(.wait-lines):not([data-writing-status]):where(:not(.v16-root *)){display:none}
.dl .note.debrief[data-writing] .wait-lines:where(:not(.v16-root *)){display:grid}
/* an outline is drawn in pale lines only: no ink border, no focus ring, no placeholder text */
.dl .ghost :not(.bar):not(.bar *):not(.wait-fact):not(.wait-fact *):where(:not(.v16-root *)){border-color:rgba(13,27,42,.07)!important;outline:none!important}
.dl .ghost input:where(:not(.v16-root *))::placeholder,.dl .ghost textarea:where(:not(.v16-root *))::placeholder{color:transparent!important}
/* and nothing in it keeps live ink: no option ring, no chosen row, no current card, no underline */
.dl .ghost .opt-r .r:where(:not(.v16-root *)){box-shadow:0 0 0 2px var(--gh)!important}
.dl .ghost .qwrap.now .q:where(:not(.v16-root *)){box-shadow:var(--card-shadow)!important}
.dl .ghost [aria-pressed="true"]:not(.gh-ctl):where(:not(.v16-root *)){box-shadow:none!important;background:transparent!important}
.dl .ghost *:where(:not(.v16-root *)){text-decoration-color:transparent!important}
/* ---------- the parts every screen is made of. One of each, drawn once ---------- */

/* a page's head: its name, and at most one line under it */
.dl .head:where(:not(.v16-root *)){display:grid;gap:6px;padding-block:20px 18px}
.dl .head h1:where(:not(.v16-root *)){font-size:var(--t-title);font-weight:var(--w-head);letter-spacing:-.015em;line-height:1.1;text-wrap:balance;overflow-wrap:anywhere}
.dl .head p:where(:not(.v16-root *)){font-size:var(--t-small);color:var(--fg2);text-wrap:pretty}
@media (min-width:1000px){.dl .head:where(:not(.v16-root *)){padding-block:40px 24px}}

/* buttons: amber for the one thing to do now, ink for a strong second, a hairline for the rest */
.dl .btn:where(:not(.v16-root *)){display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 22px;border-radius:999px;font-size:var(--t-small);font-weight:var(--w-ui);
  letter-spacing:-.005em;white-space:nowrap;-webkit-user-select:none;user-select:none;
  transition:transform var(--quick) var(--ease),background-color .2s,box-shadow .2s,color .2s}
.dl .btn .i:where(:not(.v16-root *)){font-size:18px;stroke-width:2}
.dl .btn:active:where(:not(.v16-root *)){transform:scale(.97)}
.dl .btn-act:where(:not(.v16-root *)){background:var(--accent);color:var(--accent-ink);box-shadow:var(--accent-glow)}
.dl .btn-ink:where(:not(.v16-root *)){background:var(--fg);color:var(--cream)}
.dl .btn-line:where(:not(.v16-root *)){background:var(--card);color:var(--fg);box-shadow:0 0 0 1px var(--line2) inset}
.dl .btn-sm:where(:not(.v16-root *)){height:44px;padding:0 16px}
.dl .btn-wide:where(:not(.v16-root *)){width:100%}
@media (hover:hover) and (pointer:fine){.dl .btn-act:hover:where(:not(.v16-root *)){background:var(--accent-hover)}.dl .btn-ink:hover:where(:not(.v16-root *)){background:#1b2c40}.dl .btn-line:hover:where(:not(.v16-root *)){box-shadow:0 0 0 1px var(--fg3) inset}}
.dl .go:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:4px;min-height:44px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg);transition:opacity .1s}
.dl .go .i:where(:not(.v16-root *)){font-size:17px;stroke-width:2;transition:transform .2s var(--ease)}
.dl .go:active:where(:not(.v16-root *)){opacity:.6}
.dl .go.quiet:where(:not(.v16-root *)){color:var(--fg2)}
@media (hover:hover) and (pointer:fine){.dl .go:hover .i:where(:not(.v16-root *)){transform:translateX(3px)}}

/* a card, and its head: a name on the left, one quiet way on at the right */
.dl .card:where(:not(.v16-root *)){position:relative;min-width:0;background:var(--card);border-radius:var(--r-card);box-shadow:var(--card-shadow);padding:var(--pad)}
.dl .card-head:where(:not(.v16-root *)){display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px;margin-bottom:14px}
.dl .card-head h2:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-head);letter-spacing:-.005em}
.dl .card-head .go:where(:not(.v16-root *)){min-height:44px;margin-block:-10px;color:var(--fg2)}
.dl .card-head .meta:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg3)}
.dl .pill:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;font-size:var(--t-meta);font-weight:var(--w-ui);
  background:rgba(13,27,42,.06);color:var(--fg2);white-space:nowrap}
.dl .pill.warm:where(:not(.v16-root *)){background:var(--accent-soft);color:var(--accent-text)}
.dl .pill.ink:where(:not(.v16-root *)){background:var(--fg);color:var(--cream)}
.dl .pill .i:where(:not(.v16-root *)){font-size:14px}

/* the cabin window: the landing's frame for every photograph */
.dl .win:where(:not(.v16-root *)){position:relative;display:block;flex:none;aspect-ratio:2/3;padding:9px;border-radius:46% / 31%;background:linear-gradient(160deg,#fbf9f4,#e8e2d5);
  box-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 -1px 1px rgba(13,27,42,.07) inset,0 24px 44px -28px rgba(13,27,42,.55);transition:transform var(--quick) var(--ease)}
.dl .win i:where(:not(.v16-root *)){position:relative;display:block;width:100%;height:100%;border-radius:44% / 30%;overflow:hidden;background:#2a3442;isolation:isolate}
.dl .win img:where(:not(.v16-root *)){position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.dl .win i:where(:not(.v16-root *))::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:0 0 0 1px rgba(13,27,42,.2) inset,0 10px 22px rgba(0,0,0,.32) inset;background:linear-gradient(118deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,0) 34%)}
.dl .win.xs:where(:not(.v16-root *)){width:46px;padding:4px}
.dl .win.xs i:where(:not(.v16-root *))::after{box-shadow:0 0 0 1px rgba(13,27,42,.2) inset,0 4px 10px rgba(0,0,0,.3) inset}
.dl .win.sm:where(:not(.v16-root *)){width:84px;padding:6px}

/* a row in a list: one thing, one way in */
.dl .rows:where(:not(.v16-root *)){display:grid}
.dl .row:where(:not(.v16-root *)){display:flex;align-items:center;gap:14px;min-height:64px;padding-block:10px;box-shadow:0 1px 0 var(--line);transition:background-color .15s}
.dl .rows > li:last-child .row:where(:not(.v16-root *)),.dl .rows > .row:last-child:where(:not(.v16-root *)){box-shadow:none}
.dl .row .copy:where(:not(.v16-root *)){flex:1 1 auto;min-width:0;display:grid;gap:2px}
.dl .row .copy b:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-ui);line-height:1.3;overflow-wrap:anywhere}
.dl .row .copy span:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg3)}
.dl .row .end:where(:not(.v16-root *)){flex:none;display:flex;align-items:center;gap:10px;font-size:var(--t-meta);color:var(--fg2)}
.dl .row .chev:where(:not(.v16-root *)){font-size:18px;color:var(--fg3)}
.dl .row:active:where(:not(.v16-root *)){background:rgba(13,27,42,.03)}
.dl .ico:where(:not(.v16-root *)){flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--sunk);color:var(--fg2)}
.dl .ico .i:where(:not(.v16-root *)){font-size:19px}

/* progress: a thin rail; a ring where the figure decides what to do next */
.dl .rail:where(:not(.v16-root *)){display:block;height:6px;border-radius:999px;background:rgba(13,27,42,.08);overflow:hidden}
.dl .rail i:where(:not(.v16-root *)){display:block;height:100%;width:100%;border-radius:inherit;background:var(--fg);transform-origin:0 50%;transform:scaleX(var(--p,0))}
.dl .ring:where(:not(.v16-root *)){--p:0;position:relative;flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:conic-gradient(var(--fg) calc(var(--p) * 1turn),rgba(13,27,42,.1) 0);font-size:11px;font-weight:600}
.dl .ring:where(:not(.v16-root *))::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--card)}
.dl .ring b:where(:not(.v16-root *)){position:relative;font-weight:600;font-variant-numeric:tabular-nums}
.dl .ring.xl:where(:not(.v16-root *)){width:96px;height:96px;font-size:22px}
.dl .ring.xl:where(:not(.v16-root *))::before{inset:8px}

/* the ink tick: done, drawn once */
.dl .tick:where(:not(.v16-root *)){display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--fg)}
.dl .tick svg:where(:not(.v16-root *)){width:13px;height:13px;fill:none;stroke:var(--cream);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.dl .tick path:where(:not(.v16-root *)){stroke-dasharray:1;stroke-dashoffset:0}
@media (prefers-reduced-motion:no-preference){.dl .tick.draw path:where(:not(.v16-root *)){animation:tick-draw .35s var(--ease) .05s both}@keyframes tick-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}}

/* the teacher's note: our AI. It always names itself, and a note never looks like a figure. Since 15 Oct 2026 the note is glass
   over moving light (ainote.css, Aryan's pick B), drawn over this; Ask and the RTR film's calls keep the cream it speaks in */
.dl .note:where(:not(.v16-root *)){position:relative;display:grid;gap:12px;padding:18px 18px 16px;border-radius:22px 22px 22px 8px;background:var(--cream);
  box-shadow:0 0 0 1px rgba(13,27,42,.07) inset,0 1px 2px rgba(13,27,42,.06),0 18px 36px -26px rgba(13,27,42,.45)}
.dl .note-who:where(:not(.v16-root *)){display:flex;align-items:center;gap:10px;font-size:var(--t-meta);color:var(--fg2)}
.dl .note-who b:where(:not(.v16-root *)){color:var(--fg);font-weight:var(--w-head);font-size:var(--t-small)}
.dl .note-who .when:where(:not(.v16-root *)){margin-left:auto;color:var(--fg3)}
.dl .tmark:where(:not(.v16-root *)){display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--fg);color:var(--cream)}
.dl .tmark svg:where(:not(.v16-root *)){width:17px;height:17px}
.dl .note p:where(:not(.v16-root *)){font-size:var(--t-body);line-height:1.55;color:var(--fg);text-wrap:pretty}
.dl .note .acts:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:2px}
.dl .note .acts .go:where(:not(.v16-root *)){min-height:44px}
/* while it is written: three steady dots, then the lines in place */
.dl .typing:where(:not(.v16-root *)){display:inline-flex;gap:5px;align-items:center;height:22px}
.dl .typing i:where(:not(.v16-root *)){width:7px;height:7px;border-radius:50%;background:var(--fg3);opacity:.35}
@media (prefers-reduced-motion:no-preference){
  .dl .typing i:where(:not(.v16-root *)){animation:dot 1s ease-in-out infinite}.dl .typing i:nth-child(2):where(:not(.v16-root *)){animation-delay:.15s}.dl .typing i:nth-child(3):where(:not(.v16-root *)){animation-delay:.3s}
  @keyframes dot{0%,100%{opacity:.25;transform:none}40%{opacity:.9;transform:translateY(-2px)}}

}

/* a segmented switch (IndiGo or Air India; this week or all time) */
.dl .segs:where(:not(.v16-root *)){display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:rgba(13,27,42,.06)}
.dl .segs button:where(:not(.v16-root *)){min-height:44px;padding:0 16px;border-radius:999px;white-space:nowrap;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);
  transition:background-color .2s,color .2s,box-shadow .2s,transform var(--quick) var(--ease)}
@media (max-width:389px){.dl .segs button:where(:not(.v16-root *)){padding:0 12px;font-size:var(--t-meta)}}
.dl .segs button[aria-pressed="true"]:where(:not(.v16-root *)){background:var(--card);color:var(--fg);box-shadow:0 1px 2px rgba(13,27,42,.12),0 0 0 1px rgba(13,27,42,.05)}

/* the search field */
.dl .field:where(:not(.v16-root *)){position:relative;display:flex;align-items:center}
.dl .field .i:where(:not(.v16-root *)){position:absolute;left:16px;font-size:18px;color:var(--fg3);pointer-events:none}
.dl .field input:where(:not(.v16-root *)){width:100%;height:50px;padding:0 16px 0 46px;border:0;border-radius:999px;background:var(--card);box-shadow:0 0 0 1px var(--line2) inset;font-size:16px;
  color:var(--fg);transition:box-shadow .2s}
.dl .field input:where(:not(.v16-root *))::placeholder{color:var(--fg3)}
.dl .field input:focus:where(:not(.v16-root *)){outline:none;box-shadow:0 0 0 2px var(--fg) inset}

/* the night screen: our 3D, always in its dark frame, with a call in cream over it */
.dl .film:where(:not(.v16-root *)){position:relative;overflow:hidden;border-radius:var(--r-card);background:var(--night);isolation:isolate}
.dl .film img:where(:not(.v16-root *)){width:100%;height:100%;object-fit:cover}
.dl .film:where(:not(.v16-root *))::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,24,45,0) 40%,rgba(7,24,45,.55));pointer-events:none}
.dl .call:where(:not(.v16-root *)){position:absolute;z-index:1;max-width:calc(100% - 28px);padding:8px 13px 9px;border-radius:16px 16px 5px 16px;background:var(--cream);color:var(--fg);
  font-size:var(--t-meta);line-height:1.35;box-shadow:0 10px 24px -14px rgba(2,8,16,.6)}
.dl .call b:where(:not(.v16-root *)){display:flex;align-items:center;gap:6px;margin-bottom:2px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#875519}
.dl .call b .i:where(:not(.v16-root *)){font-size:13px;stroke-width:2.4}

/* a toast: one line, at the foot, gone on its own. As wide as its words and never wider than the screen, centred over the content
   (beside the sidebar on a laptop), and lifted over a pinned bar or the CX-3 button (app.js) */
.dl .toast:where(:not(.v16-root *)){position:fixed;left:16px;right:16px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:85;display:flex;align-items:center;gap:10px;
  width:fit-content;max-width:calc(100% - 32px);margin-inline:auto;
  padding:12px 16px;border-radius:22px;background:var(--fg);color:var(--cream);font-size:var(--t-small);box-shadow:0 18px 40px -18px rgba(7,24,45,.6);
  transform:translateY(16px);opacity:0;pointer-events:none;transition:transform .25s var(--ease),opacity .25s var(--ease)}
.dl .toast.on:where(:not(.v16-root *)){transform:none;opacity:1}
.dl .toast .i:where(:not(.v16-root *)){font-size:18px}
@media (min-width:1000px){.dl .toast:where(:not(.v16-root *)){bottom:32px;left:288px}html[data-folded] .dl .toast:where(:not(.v16-root *)){left:112px}.dl .app[data-focus] ~ .toast:where(:not(.v16-root *)){left:16px}}
@media (prefers-reduced-motion:reduce){.dl .toast:where(:not(.v16-root *)),.dl .toast.on:where(:not(.v16-root *)){transform:none}}


/* every control answers a press (founder rule; Emil pass, 14 Oct 2026): a row's tint lands at once and eases away, a text link dims, a
   round control presses in */
.dl :is(.row,.chr,.mrow,.prow,.gr-open,.cd-rr,.yr-h,.qfold,.ck,.mk-pin-info,.mi,.sheet a,.sheet button.row):active:where(:not(.v16-root *)){background:rgba(13,27,42,.06);transition-duration:0s}
.dl :is(.more,.cd-date,.in-back,.pw .show,.in-foot a,.fld-row a):active:where(:not(.v16-root *)){opacity:.6}
.dl .cd-x:where(:not(.v16-root *)),.dl .xcell:where(:not(.v16-root *)){transition:transform var(--quick) var(--ease),background-color .15s,box-shadow .15s}
.dl :is(.cd-x,.xcell,.segs button,.subj-chips button,.exseg button):active:where(:not(.v16-root *)){transform:scale(.96)}
/* a row on a laptop: its arrow moves toward where it leads */
.dl a.row > .i:last-child:where(:not(.v16-root *)){transition:transform .2s var(--ease),color .15s}
@media (hover:hover) and (pointer:fine){.dl a.row:hover > .i:last-child:where(:not(.v16-root *)){color:var(--fg);transform:translateX(2px)}}
/* a phone's own habits: a long press on a control opens no link preview and selects no words, and a quick second tap never zooms */
.dl :is(.tab,.sc,.row,.sheet a,.opt,.xcell,.chip,.mrow,.prow,.segs button,.exseg button,.subj-chips button,.sb-nav a):where(:not(.v16-root *)){-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.dl :where(a,button,label,input,summary):where(:not(.v16-root *)){touch-action:manipulation}
/* the exam room is one screen tall: a pull never reloads it, and nothing bounces under the clock */
html:has(.dl .app[data-focus]){overscroll-behavior-y:none}
/* nothing scrolls behind a sheet or a dialog, and a sheet's own scroll stops at its edge */
html.locked:has(.dl){overflow:hidden}
/* the scrollbar's width is held as padding while the page is held (app.js); a button fixed at the right edge stays where it was */
html.locked .dl .cx3-pill:where(:not(.v16-root *)){translate:calc(var(--sbw,0px) * -1) 0}
.dl :is(.sheet,.xmap,.mk-pane,.rtr-pane,.cd-pane):where(:not(.v16-root *)){overscroll-behavior:contain}
.dl .instant:where(:not(.v16-root *)){transition:none!important}
/* ---------- the bar, per screen: a main screen shows the logo and you; a screen deeper in shows the way back ---------- */
.dl .bar:not(.root) .bar-logo:where(:not(.v16-root *)),.dl .bar:not(.root) .ava-btn:where(:not(.v16-root *)){display:none}
.dl .bar.root .back:where(:not(.v16-root *)),.dl .bar.root .bar-title:where(:not(.v16-root *)){display:none}
.dl .bar.root .bar-end:where(:not(.v16-root *)){margin-left:auto}
@media (min-width:1000px){
  .dl .bar:where(:not(.v16-root *)){position:relative;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none!important}
  .dl .bar .bar-title:where(:not(.v16-root *)){display:none}
  .dl .bar-in:where(:not(.v16-root *)){height:auto;padding-top:22px}
}
.dl .eyebrow:where(:not(.v16-root *)){font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg3)}
.dl .sec:where(:not(.v16-root *)){margin:30px 0 12px;font-size:var(--t-small);font-weight:var(--w-head);color:var(--fg)}
.dl .big:where(:not(.v16-root *)){display:flex;align-items:baseline;gap:10px}
.dl .big b:where(:not(.v16-root *)){font-size:clamp(1.75rem,2.6vw,2.25rem);font-weight:var(--w-head);letter-spacing:-.035em;line-height:1}
.dl .big span:where(:not(.v16-root *)){font-size:var(--t-small);color:var(--fg2)}

.dl .scr:has(> .wrap.narrow) .bar .wrap:where(:not(.v16-root *)){max-width:760px}
.dl .fld:where(:not(.v16-root *)){display:grid;gap:7px}
.dl .fld label:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:var(--w-ui)}
.dl .fld-row:where(:not(.v16-root *)){display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.dl .fld-row a:where(:not(.v16-root *)){display:inline-flex;align-items:center;min-height:44px;margin-block:-11px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
.dl .fld input:where(:not(.v16-root *)){width:100%;height:50px;padding:0 14px;border:0;border-radius:var(--r-ctl);background:var(--card);box-shadow:0 0 0 1px var(--line2) inset;
  font-size:16px;color:var(--fg);transition:box-shadow .15s}
.dl .fld input:where(:not(.v16-root *))::placeholder{color:var(--fg3)}
.dl .fld input:focus:where(:not(.v16-root *)){outline:none;box-shadow:0 0 0 2px var(--fg) inset}
.dl .fld .hint:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg3)}
/* ============ When something goes wrong (founder pick B, 15 Oct 2026: "b"; the four ways are in
   archive/identity-probes/error-options/): today's card in Daylight. The mark, the code, the words and two buttons, the one amber
   the thing to do; in the room between the bar and the tabs for a signed-in student, under the logo on the bare page for a
   visitor, the whole app down and the account on hold. Nothing is red: red means a wrong answer ============ */
.dl .er-room:where(:not(.v16-root *)){display:grid;place-items:center;min-height:calc(100svh - 56px - 96px - env(safe-area-inset-top,0px));
  padding:20px max(var(--g),env(safe-area-inset-left,0px)) 28px max(var(--g),env(safe-area-inset-right,0px))}
@media (min-width:1000px){.dl .er-room:where(:not(.v16-root *)){min-height:calc(100vh - 64px)}}
.dl .in-body.er-bare:where(:not(.v16-root *)){display:grid;grid-template-columns:minmax(0,1fr);place-items:center;align-content:center;padding-bottom:72px}
.dl .eb:where(:not(.v16-root *)){width:100%;max-width:460px;display:grid;justify-items:center;gap:10px;padding:34px 22px 22px;text-align:center}
@media (min-width:760px){.dl .eb:where(:not(.v16-root *)){padding:44px 40px 36px}}
.dl .eb-mark:where(:not(.v16-root *)){width:46px;height:46px;margin-bottom:6px}
.dl .er-code:where(:not(.v16-root *)){font-size:var(--t-meta);font-weight:var(--w-ui);letter-spacing:.16em;color:var(--fg3);font-variant-numeric:tabular-nums}
.dl .er-h:where(:not(.v16-root *)){font-size:var(--t-title);font-weight:var(--w-head);letter-spacing:-.015em;line-height:1.12;text-wrap:balance}
.dl .er-lead:where(:not(.v16-root *)){max-width:36ch;font-size:var(--t-small);line-height:1.55;color:var(--fg2);text-wrap:pretty}
.dl .eb-ref:where(:not(.v16-root *)){font-size:var(--t-meta);color:var(--fg3)}
.dl .eb-ref b:where(:not(.v16-root *)){font-weight:var(--w-ui);color:var(--fg2);font-variant-numeric:tabular-nums;letter-spacing:.03em;-webkit-user-select:all;user-select:all}
.dl .er-acts:where(:not(.v16-root *)){display:grid;gap:10px;width:100%;margin-top:14px}
@media (min-width:560px){.dl .er-acts:where(:not(.v16-root *)){display:flex;justify-content:center;width:auto}.dl .er-acts .btn:where(:not(.v16-root *)){min-width:156px}}

/* a chapter that lost its connection: the strip under the bar says what offline stops; an answer tapped meanwhile is held, ringed,
   with one line and Try again, which sends that same answer; where the rest of the chapter would be, one line and Try again */
.dl .eb-off:where(:not(.v16-root *)){position:sticky;top:calc(56px + env(safe-area-inset-top,0px));z-index:29;display:flex;align-items:center;justify-content:center;gap:10px;min-height:40px;
  padding:8px max(var(--g),env(safe-area-inset-left,0px));background:var(--sunk);box-shadow:0 1px 0 var(--line);
  font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg2);text-align:center}
.dl .eb-off i:where(:not(.v16-root *)){flex:none;width:7px;height:7px;border-radius:50%;background:var(--fg3)}
@media (min-width:1000px){.dl .eb-off:where(:not(.v16-root *)){top:12px;width:fit-content;max-width:calc(100% - 2 * var(--g));margin:12px auto 0;padding-inline:18px;border-radius:999px;box-shadow:0 0 0 1px var(--line) inset}}
.dl .q .opt-r[aria-pressed="true"]:where(:not(.v16-root *)){background:var(--card);box-shadow:0 0 0 1.5px var(--fg) inset}
.dl .q .opt-r[aria-pressed="true"] .r:where(:not(.v16-root *)){box-shadow:0 0 0 2px var(--fg) inset}
.dl .q .opt-r[aria-pressed="true"] .r:where(:not(.v16-root *))::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--fg)}
.dl .eb-fail:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.dl .eb-fail p:where(:not(.v16-root *)){font-weight:var(--w-head);letter-spacing:-.01em}
.dl .eb-rest:where(:not(.v16-root *)){display:grid;justify-items:center;gap:12px;margin-top:var(--gap);padding:20px 16px 72px;text-align:center}
.dl .eb-rest p:where(:not(.v16-root *)){font-size:var(--t-small);color:var(--fg2)}
.dl .app[data-lock="off"] [data-scr="chapter"] .qlist:where(:not(.v16-root *)){padding-bottom:0}
/* offline, the question you were on opens under the strip with the folded row above it in full, and the card's Try again clear of
   the CX-3 button */
.dl .app[data-lock="off"] [data-scr="chapter"] .qwrap:where(:not(.v16-root *)){scroll-margin-top:calc(178px + env(safe-area-inset-top,0px))}
/* ---------- the glow (REA-29, 15 Oct 2026). Aryan, on the public pages in Daylight: "like how these latest few pages had that bg
   color glow of sorts that we had in the landing page, i liked it, why dont we incorporate it in our other pages as well?". The
   landing's glow, value for value (archive/landing-probes/b-daylight/glow-base.css and glow-3.css): a soft cloud of a sun and sky
   pair under what a page shows, strongest at its sides and foot, where it shows. Aryan's picks, page by page, from the glow round
   (archive/identity-probes/glow-round/): B, one glow under the page's main card, for Home, RTR Part 2 and Cadet prep; C, a quieter
   glow under every card, for Practice, a subject, a chapter's questions, Review, Exams, Mock results, Plans, the question bank and a
   chapter's five. A screen the round did not show follows its room's pick: Saved questions Review's, a past paper, the solutions
   and the attempt history Exams', the RTR result RTR's, a game's start, its result and Selection Day Cadet's, the getting-in
   subject list and the first question Practice's, Settings, Help and checkout Plans', and an error's one card takes C. The focus
   rooms keep their own look with none (the exam room, the voice paper, the demo flight and a game being played), as does the brand
   board. The AI note carries its own light (ainote.css), so no glow sits under it. Each room takes the landing's own pair for its
   section. Nothing moves. ---------- */
/* the body's paper then paints the canvas, so a glow under a card shows on the paper and under every card with nothing isolated:
   the sheets and dialogs inside a screen keep their layers above the tab bar */
html:has(.dl){background:none}
/* clipped at the app's own edges, not the content column's, so a cloud fades out across the gap beside the sidebar */
.dl .app:where(:not(.v16-root *)){overflow-x:clip}
.dl .scr:where(:not(.v16-root *)){--g1:255,172,112;--g2:248,204,110;--ga:.62}
.dl [data-scr="home"]:where(:not(.v16-root *)){--g1:255,156,86;--g2:255,192,150;--ga:1}
.dl :is([data-scr="review"],[data-scr="saved"]):where(:not(.v16-root *)){--g1:110,204,182;--g2:132,184,245}
.dl :is([data-scr="exams"],[data-scr="results"],[data-scr="solutions"],[data-scr="paper"],[data-scr^="history"]):where(:not(.v16-root *)){--g1:112,164,235;--g2:255,184,132}
.dl :is([data-scr="rtr"],[data-scr="rtrresult"]):where(:not(.v16-root *)){--g1:112,170,240;--g2:110,208,188;--ga:1}
.dl :is([data-scr="cadet"],[data-scr="cgame"],[data-scr="ctgame"],[data-scr="cresult"],[data-scr="cday"]):where(:not(.v16-root *)){--g1:250,168,150;--g2:252,206,128;--ga:1}
.dl :is([data-scr="plans"],[data-scr="plans-out"],[data-scr="checkout"],[data-scr^="settings"],[data-scr="help"],[data-scr="policies"]):where(:not(.v16-root *)){--g1:255,156,86;--g2:250,180,160}

/* B: one glow, under the page's main card */
.dl :is([data-scr="home"] .cont-a,[data-scr="rtr"] .rtr-band,[data-scr="rtrresult"] .rc-sum,[data-scr="cadet"] .cd-next,
  :is([data-scr="cgame"],[data-scr="ctgame"]) section[class="card"],[data-scr="cresult"] .res-sum,[data-scr="cday"] :is(section[class="card"],.res-sum)):where(:not(.v16-root *))::before,
.dl /* C: a quieter glow under every card */
:is([data-scr="practice"],[data-scr="subject"],[data-scr="msubject"],[data-scr="chapter"],[data-scr="first"],[data-scr="start"],[data-scr="review"],
  [data-scr="saved"],[data-scr="exams"],[data-scr="results"],[data-scr="solutions"],[data-scr="paper"],[data-scr^="history"],[data-scr="plans"],
  [data-scr="plans-out"],[data-scr="checkout"],[data-scr^="settings"],[data-scr="help"],[data-scr="policies"],[data-scr="qbank"],[data-scr="qsubject"],
  [data-scr="qpractice"],[data-scr^="e404"],[data-scr="eoops"],[data-scr="ecrash"],[data-scr="ehold"])
  :is(.card:not(.pa-rail),.q,.subjects,.subj-head .win):where(:not(.v16-root *))::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;inset:var(--gi,8% -9% max(-16%,-88px) -9%);filter:blur(var(--gb,40px));
  background:radial-gradient(34% 44% at 14% 60%,rgba(var(--g1),calc(.74 * var(--ga))),rgba(var(--g1),0) 72%),
    radial-gradient(36% 46% at 86% 54%,rgba(var(--g2),calc(.74 * var(--ga))),rgba(var(--g2),0) 72%),
    radial-gradient(58% 36% at 52% 90%,rgba(var(--g1),calc(.48 * var(--ga))),rgba(var(--g1),0) 72%)}
/* three cards sit beside their list on a laptop only: Exams' paper card and a past paper's question squares become sheets on a
   phone, and a subject's books become a row of chips, so they glow on a laptop only (a sheet is its own layer, and a glow there would
   sit on its paper) */
@media (min-width:1000px){
  .dl :is([data-scr="exams"] .mk-pane,:is([data-scr="subject"],[data-scr="msubject"]) .bk-rail,[data-scr="paper"] .pa-rail):where(:not(.v16-root *))::before{
    content:"";position:absolute;z-index:-1;pointer-events:none;inset:var(--gi,8% -9% max(-16%,-88px) -9%);filter:blur(var(--gb,40px));
    background:radial-gradient(34% 44% at 14% 60%,rgba(var(--g1),calc(.74 * var(--ga))),rgba(var(--g1),0) 72%),
      radial-gradient(36% 46% at 86% 54%,rgba(var(--g2),calc(.74 * var(--ga))),rgba(var(--g2),0) 72%),
      radial-gradient(58% 36% at 52% 90%,rgba(var(--g1),calc(.48 * var(--ga))),rgba(var(--g1),0) 72%)}
}
/* a host that was not positioned becomes so, so its glow sits under it; the RTR band's picture keeps its rounded corners itself,
   since the band no longer clips it */
.dl :is(.subjects,.q,.rtr-band):where(:not(.v16-root *)){position:relative}
.dl .rtr-band:where(:not(.v16-root *)){overflow:visible}
.dl .rtr-band img:where(:not(.v16-root *)){border-radius:var(--r-card) var(--r-card) 0 0}
@media (min-width:1000px){.dl .rtr-band img:where(:not(.v16-root *)){border-radius:0 var(--r-card) var(--r-card) 0}}
/* a picture is small beside a card, so its cloud reaches further out, as the public pages' windows do, though not as far as the
   title beside it: the glow is never behind what a student reads */
.dl .subj-head .win:where(:not(.v16-root *)){--gi:4% -24% -26% -110%}
@media (max-width:899px){
  .dl .scr:where(:not(.v16-root *)){--gb:30px}
  .dl .scr :is(.card,.q,.rtr-band,.subjects):where(:not(.v16-root *)){--gi:6% -7% max(-10%,-56px) -7%}
}

.dl :where(h1,h2,h3,h4,h5,h6):where(:not(.v16-root *)){font-family:inherit}
.dl .ring:where(:not(.v16-root *)){box-shadow:none}
html:has(.dl){scroll-padding-top:calc(56px + env(safe-area-inset-top,0px));scroll-padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
@media (min-width:1000px){html:has(.dl){scroll-padding-top:0;scroll-padding-bottom:0}}