/* CPA Notes. SEGMENT: COLORS AND BACKGROUNDS.
   Clean, premium look: soft neutral page, white sheets, hairline rules, one brand green.
   Red margin rule and highlighter stay as small study accents.
   Change a color here and it changes everywhere it is used. */

/* Light theme palette */
:root{
 --paper:#F5F5F7; --sheet:#FFFFFF; --ink:#1D1D1F; --muted:#6E6E73; --rule:#E2E2E7;
 --green:#0A7A61; --green-soft:#E4F4EF; --marker:#FFE066; --margin:#E0675A; --chip:#F0F0F3; --on-green:#fff;
 --shadow:0 2px 6px rgba(0,0,0,.04),0 18px 40px -18px rgba(0,0,0,.16);
 --shadow-lg:0 4px 12px rgba(0,0,0,.05),0 34px 70px -30px rgba(0,0,0,.28);
 --glass:rgba(250,250,252,.72); --glass-line:rgba(0,0,0,.08);
 --hero-glow:radial-gradient(60% 55% at 78% 30%,rgba(10,122,97,.14),transparent 70%),radial-gradient(50% 50% at 15% 10%,rgba(29,95,209,.10),transparent 70%);
 --grad-text:linear-gradient(100deg,#0A7A61 0%,#1D5FD1 55%,#6D3FD6 100%);
 --ease:cubic-bezier(.25,.1,.25,1); --ease-out:cubic-bezier(.16,1,.3,1);
 /* textbook accents: one per page in turn, also used by charts and gist sections */
 --a1:#0B7A62; --a2:#1D5FD1; --a3:#B45309; --a4:#6D3FD6; --a5:#BE185D; --a6:#0E7490; --on-acc:#fff;
 --cover:linear-gradient(140deg,#0B7A62 0%,#1D5FD1 52%,#6D3FD6 100%);
 /* dashboard section tiles: a soft tint matching each section's book color */
 /* admin dashboard (#/admin): blue accent, status colors, sidebar */
 --adm-acc:#1D5FD1; --adm-acc-soft:#EAF1FD; --ok:#047857; --ok-soft:#E3F5EC; --warn:#B45309; --warn-soft:#FDF2E3; --bad:#BE123C; --bad-soft:#FCEBEE; --adm-side:#FAFAFC;
 /* admin charts: one color per section, checked for color-blind separation in this stacking order */
 --sec-aud:#12876A; --sec-reg:#C026D3; --sec-bar:#C2570C; --sec-far:#2563EB; --sec-isc:#0891B2; --sec-tcp:#7C3AED;
 --t-aud:#EDF7F3; --t-far:#EEF3FB; --t-bar:#FBF3EA; --t-reg:#FBF0F1; --t-tcp:#F4F0FB; --t-isc:#ECF6F8; --t-ea1:#FBF0F6; --t-ea2:#F4F6EA; --t-ea3:#F1F3F6;
}
/* Dark theme palette (follows the device unless the reader picks light) */
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
 --adm-acc:#7FAEFF; --adm-acc-soft:#16233A; --ok:#34D399; --ok-soft:#0F2A20; --warn:#FBBF24; --warn-soft:#2D2310; --bad:#FB7185; --bad-soft:#33151C; --adm-side:#111113;
 --sec-aud:#1FA37F; --sec-reg:#D04FD9; --sec-bar:#D9731F; --sec-far:#4F86F7; --sec-isc:#22A8A0; --sec-tcp:#8F63F0;
 --paper:#0B0B0D; --sheet:#161618; --ink:#F5F5F7; --muted:#A1A1A6; --rule:#2A2A2E;
 --green:#3CC8A2; --green-soft:#14302A; --marker:#B8942A; --margin:#E8837A; --chip:#232326; --on-green:#062019;
 --shadow:0 2px 6px rgba(0,0,0,.3),0 18px 40px -18px rgba(0,0,0,.7); --shadow-lg:0 4px 12px rgba(0,0,0,.35),0 34px 70px -30px rgba(0,0,0,.85);
 --glass:rgba(22,22,24,.72); --glass-line:rgba(255,255,255,.09);
 --hero-glow:radial-gradient(60% 55% at 78% 30%,rgba(60,200,162,.16),transparent 70%),radial-gradient(50% 50% at 15% 10%,rgba(127,174,255,.12),transparent 70%);
 --grad-text:linear-gradient(100deg,#3CC8A2 0%,#7FAEFF 55%,#B9A0FF 100%);
 --a1:#3CC8A2; --a2:#7FAEFF; --a3:#F0B45A; --a4:#B9A0FF; --a5:#F58CBB; --a6:#5FD0E6; --on-acc:#0E1622;
 --cover:linear-gradient(140deg,#0A5445 0%,#1B3F8F 52%,#4B2C9C 100%); color-scheme:dark;
 --t-aud:#122823; --t-far:#141F31; --t-bar:#2A2019; --t-reg:#2B181D; --t-tcp:#201B31; --t-isc:#11262C; --t-ea1:#2A1824; --t-ea2:#212614; --t-ea3:#1C1F26}}
/* Dark theme palette (reader picked dark) */
:root[data-theme="dark"]{
 --adm-acc:#7FAEFF; --adm-acc-soft:#16233A; --ok:#34D399; --ok-soft:#0F2A20; --warn:#FBBF24; --warn-soft:#2D2310; --bad:#FB7185; --bad-soft:#33151C; --adm-side:#111113;
 --sec-aud:#1FA37F; --sec-reg:#D04FD9; --sec-bar:#D9731F; --sec-far:#4F86F7; --sec-isc:#22A8A0; --sec-tcp:#8F63F0;
 --paper:#0B0B0D; --sheet:#161618; --ink:#F5F5F7; --muted:#A1A1A6; --rule:#2A2A2E;
 --green:#3CC8A2; --green-soft:#14302A; --marker:#B8942A; --margin:#E8837A; --chip:#232326; --on-green:#062019;
 --shadow:0 2px 6px rgba(0,0,0,.3),0 18px 40px -18px rgba(0,0,0,.7); --shadow-lg:0 4px 12px rgba(0,0,0,.35),0 34px 70px -30px rgba(0,0,0,.85);
 --glass:rgba(22,22,24,.72); --glass-line:rgba(255,255,255,.09);
 --hero-glow:radial-gradient(60% 55% at 78% 30%,rgba(60,200,162,.16),transparent 70%),radial-gradient(50% 50% at 15% 10%,rgba(127,174,255,.12),transparent 70%);
 --grad-text:linear-gradient(100deg,#3CC8A2 0%,#7FAEFF 55%,#B9A0FF 100%);
 --a1:#3CC8A2; --a2:#7FAEFF; --a3:#F0B45A; --a4:#B9A0FF; --a5:#F58CBB; --a6:#5FD0E6; --on-acc:#0E1622;
 --cover:linear-gradient(140deg,#0A5445 0%,#1B3F8F 52%,#4B2C9C 100%); color-scheme:dark;
 --t-aud:#122823; --t-far:#141F31; --t-bar:#2A2019; --t-reg:#2B181D; --t-tcp:#201B31; --t-isc:#11262C; --t-ea1:#2A1824; --t-ea2:#212614; --t-ea3:#1C1F26}

/* Backgrounds of each study area. Each one starts as the plain sheet color.
   To give an area its own background, replace var(--sheet) with a color,
   e.g. --bg-mcq:#EEF6FF;  For dark mode add the same name inside both dark blocks above. */
:root{
 --bg-page:var(--paper);          /* whole site behind everything */
 --bg-textbook:var(--sheet);      /* textbook page */
 --bg-example:var(--chip);        /* example box inside the textbook */
 --bg-flash:var(--sheet);         /* flashcard front */
 --bg-flash-back:var(--green-soft); /* flashcard back */
 --bg-mcq:var(--sheet);           /* each MCQ card */
 --bg-sim:var(--sheet);           /* simulation tables and statement tables */
 --bg-recall:var(--sheet);        /* quick recall list */
 --bg-mnemonic:var(--sheet);      /* mnemonic cards */
}
/* CPA Notes. SEGMENT: FONTS AND SPACING.
   Typefaces, base text size, page width and the small text helpers used everywhere.
   One family throughout, as Apple and Microsoft do: the device's own system face where it has a good one
   (San Francisco on Apple devices, Segoe UI Variable on Windows), Inter everywhere else. */
:root{
 --display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;  /* headings */
 --body:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;        /* reading text */
 --mono:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;        /* small labels */
 --track-tight:-.022em;    /* headline letter spacing */
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
#pn{scroll-margin-top:70px}
body{margin:0;background:var(--bg-page);color:var(--ink);font:17px/1.58 var(--body);letter-spacing:-.011em;min-height:100vh;display:flex;flex-direction:column;
 -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
main{flex:1}
a{color:var(--green);text-underline-offset:.18em}
button{font:inherit;cursor:pointer;color:inherit}
img{max-width:100%}
::selection{background:var(--green-soft);color:var(--ink)}
:focus-visible{outline:3px solid var(--green);outline-offset:2px;border-radius:6px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:22px}
h1,h2,h3,h4{font-family:var(--display);line-height:1.1;letter-spacing:var(--track-tight);text-wrap:balance;margin:0}
.mark{background:linear-gradient(transparent 55%,var(--marker) 55%);padding:0 .1em}
.eyebrow{font:600 13px/1.2 var(--body);letter-spacing:.02em;color:var(--green);margin:0 0 12px}
.note{font-size:14.5px;color:var(--muted)}
.sub{color:var(--muted);max-width:44em;margin:12px 0 28px;font-size:18px;line-height:1.5}
/* CPA Notes. SEGMENT: PAGE LAYOUT.
   Header, buttons, home page, course hubs, chapter list, sign-in, search, blog, founder, footer. */

/* header */
header.top{position:sticky;top:0;z-index:20;background:var(--paper);background:var(--glass);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--glass-line)}
.bar{display:flex;align-items:center;gap:14px;padding-block:8px;min-height:60px;flex-wrap:wrap;transition:padding .2s ease,min-height .2s ease}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:700 20px var(--display);letter-spacing:-.02em}
.logo svg{width:32px;height:32px;flex:none;border-radius:8px;transition:transform .25s ease}
.logo .mk{color:var(--green);background:linear-gradient(transparent 70%,var(--marker) 70%)}
nav.main{display:flex;gap:2px;flex-wrap:wrap;margin-left:auto}
nav.main a{position:relative;text-decoration:none;color:var(--ink);opacity:.78;padding:8px 13px;border-radius:999px;font-size:15px;font-weight:500;transition:opacity .2s var(--ease),background-color .2s var(--ease)}
nav.main a:hover{opacity:1;background:var(--chip)}
nav.main a[aria-current="page"]{opacity:1;color:var(--ink);font-weight:600}
nav.main a[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:2px;width:16px;height:2px;margin-left:-8px;border-radius:2px;background:var(--green)}
/* a thin green-to-gold line along the bottom shows how far down the page you are (--sp is set while scrolling) */
header.top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;transform-origin:0 50%;-webkit-transform:scaleX(var(--sp,0));transform:scaleX(var(--sp,0));background:var(--green);background:linear-gradient(90deg,var(--green),var(--marker));pointer-events:none}
header.top.scrolled{box-shadow:0 10px 28px -20px rgba(0,0,0,.35)}
header.top.scrolled .bar{padding-block:4px;min-height:52px}
.logo:hover svg{transform:rotate(-6deg) scale(1.06)}
nav.main a:focus:not(:focus-visible),.tabs a:focus:not(:focus-visible){outline:none}
nav.main a:focus-visible,.tabs a:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.tools{display:flex;align-items:center;gap:8px}
.icon{width:40px;height:40px;border-radius:50%;border:0;background:transparent;display:grid;place-items:center;transition:background-color .2s var(--ease)}
.icon:hover{background:var(--chip)}
.icon svg{width:19px;height:19px;stroke:var(--ink);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.userchip{font-weight:700;font-size:15px;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:8px}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--green);color:var(--on-green);display:grid;place-items:center;font:800 14px var(--display)}

/* buttons and pills */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:0;border-radius:999px;padding:11px 22px;font-size:16px;font-weight:600;letter-spacing:-.01em;text-decoration:none;transition:transform .25s var(--ease-out),filter .2s var(--ease),background-color .2s var(--ease),box-shadow .25s var(--ease)}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:scale(.97)}
.btn.primary{background:var(--green);color:var(--on-green);box-shadow:0 8px 20px -10px var(--green)}
.btn.ghost{background:transparent;color:var(--green);border:1px solid currentColor}
.btn.ghost:hover{background:var(--green-soft);filter:none}
.btn.sm{min-height:36px;padding:7px 16px;font-size:14.5px}
.pill{font:500 12.5px var(--mono);background:var(--chip);border-radius:999px;padding:5px 11px;color:var(--ink);white-space:nowrap}
.pill.core{background:var(--green-soft);color:var(--green)}
.meta{display:flex;gap:8px;flex-wrap:wrap}

/* home */
.hero{position:relative;padding-block:84px 64px;display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center}
.hero::before{content:"";position:absolute;top:-60px;right:0;bottom:-40px;left:0;background:var(--hero-glow);z-index:-1;pointer-events:none}
.hero h1{font-size:clamp(40px,6.2vw,76px);font-weight:700;letter-spacing:-.035em;line-height:1.03}
.hero h1 .mark{padding:0;color:var(--green);background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p.lede{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--muted);max-width:32em;margin:22px 0 32px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.heroart{position:relative;justify-self:center;width:min(100%,420px);-webkit-transform:perspective(1000px) rotateX(var(--rx,0)) rotateY(var(--ry,0));transform:perspective(1000px) rotateX(var(--rx,0)) rotateY(var(--ry,0));transition:transform .6s var(--ease-out);animation:herofloat 9s ease-in-out infinite}
.heroart .ph{-webkit-animation:heroin 1s var(--ease-out) both;animation:heroin 1s var(--ease-out) both}
@keyframes herofloat{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes heroin{from{opacity:0;-webkit-transform:translateY(18px) scale(.97);transform:translateY(18px) scale(.97)}}
.hero>div:first-child>*{-webkit-animation:herotext .8s var(--ease-out) both;animation:herotext .8s var(--ease-out) both}
.hero>div:first-child>:nth-child(2){animation-delay:.08s}.hero>div:first-child>:nth-child(3){animation-delay:.16s}.hero>div:first-child>:nth-child(4){animation-delay:.24s}
@keyframes herotext{from{opacity:0;-webkit-transform:translateY(14px);transform:translateY(14px)}}
.heroart .ph{aspect-ratio:1;border-radius:36px;overflow:hidden;box-shadow:var(--shadow-lg);background:#111}
.heroart .ph img{width:100%;height:100%;object-fit:cover;display:block}
.heroart.wide{width:min(100%,540px)}
.heroart .ph.hvid{position:relative;aspect-ratio:16/10;background:#2A2018}
.ph.hvid video{display:block;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.replay{position:absolute;right:14px;top:14px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(20,20,22,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s var(--ease-out),background-color .2s}
.replay:hover{background:rgba(20,20,22,.65);-webkit-transform:rotate(-30deg);transform:rotate(-30deg)}
.replay svg{width:20px;height:20px}
.replay[hidden]{display:none}
.heroart.wide .f1{left:-24px;top:22px}.heroart.wide .f2{right:-18px;top:auto;bottom:6%}.heroart.wide .f3{left:16px;bottom:-20px}
.float{position:absolute;background:var(--sheet);background:var(--glass);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);border:1px solid var(--glass-line);border-radius:16px;padding:10px 14px;font-weight:600;font-size:14.5px;line-height:1.25;box-shadow:var(--shadow);display:flex;gap:10px;align-items:center;animation:floaty 6s ease-in-out infinite}
.f2{animation-delay:-2s}.f3{animation-delay:-4s}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.float small{font:400 12.5px var(--body);color:var(--muted);display:block}
.f1{left:-28px;top:32px}.f2{right:-22px;top:46%}.f3{left:12px;bottom:-18px}
.dot{width:10px;height:10px;border-radius:50%;background:var(--green);flex:none}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-block:8px 40px}
.fact{padding:24px 22px;background:var(--sheet);border-radius:20px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.fact b{display:block;font:700 clamp(26px,2.9vw,38px)/1.05 var(--display);letter-spacing:-.03em;margin-bottom:8px;font-variant-numeric:tabular-nums}
.fact span{display:block;color:var(--muted);font-size:15px;line-height:1.4}
section.block{padding-block:clamp(40px,6vw,72px)}
.block h2{font-size:clamp(30px,4.4vw,48px);letter-spacing:-.03em;line-height:1.06}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--sheet);border:1px solid var(--rule);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:10px;min-width:0}
a.card{text-decoration:none;color:inherit;transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .2s}
a.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:transparent}
.card .tag{font:500 12px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.card h3{font-size:21px;letter-spacing:-.02em;line-height:1.2}
.card p{margin:0;color:var(--muted)}
.card .meta{margin-top:auto;padding-top:4px}
.code{font:700 14px var(--display);background:var(--ink);color:var(--paper);border-radius:999px;padding:4px 12px;align-self:flex-start}
.kit{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:kit}
.kit .card{position:relative;border:0;padding:28px 26px;box-shadow:0 1px 2px rgba(0,0,0,.04);counter-increment:kit}
.kit .card::before{content:"0" counter(kit);font:600 13px var(--body);letter-spacing:.04em;color:var(--green);background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;align-self:flex-start}
.kit b{font:700 22px var(--display);letter-spacing:-.02em}
.law{background:var(--green-soft);border-radius:28px;padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:1fr 1.3fr;gap:24px}
.law ul{margin:0;padding-left:18px}.law li{margin-bottom:6px}
.mentor{display:grid;grid-template-columns:240px 1fr;gap:32px;align-items:center;background:var(--sheet);border:1px solid var(--rule);border-radius:24px;padding:28px}
.mentor img{width:100%;max-width:240px;aspect-ratio:1;object-fit:cover;border-radius:50%;border:6px solid var(--marker)}
.mentor ul{margin:10px 0 0;padding-left:18px}
.band{position:relative;overflow:hidden;background:#111114;color:#F5F5F7;border-radius:28px;padding:clamp(28px,5vw,56px);display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
 background-image:radial-gradient(70% 120% at 100% 0,rgba(60,200,162,.28),transparent 60%),radial-gradient(60% 120% at 0 100%,rgba(127,174,255,.18),transparent 60%)}
.band h2{color:#fff}
.band .btn{background:#fff;color:#1D1D1F}

/* progress bars */
.prog{height:8px;background:var(--chip);border-radius:99px;overflow:hidden}
.prog i{display:block;height:100%;background:var(--green);border-radius:99px;transition:width .3s}
.progrow{display:flex;align-items:center;gap:10px;font:500 12.5px var(--mono);color:var(--muted)}
.progrow .prog{flex:1}

/* course and chapter hub: heading, breadcrumb, tabs */
.hubhead{padding-block:40px 0}
.hubhead h1{font-size:clamp(32px,4.6vw,52px);letter-spacing:-.032em;line-height:1.05}
.crumb{font-size:14.5px;color:var(--muted);margin:0 0 10px}
.crumb a{color:var(--muted)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--rule);margin-top:24px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{text-decoration:none;padding:12px 14px;border-bottom:2px solid transparent;font-weight:500;color:var(--muted);white-space:nowrap;transition:color .2s var(--ease),border-color .2s var(--ease)}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-selected="true"]{color:var(--ink);font-weight:600;border-color:var(--ink)}
.panel{padding-block:22px 10px}
.areahead{font:600 13px var(--body);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:28px 0 12px}

/* chapter list */
.chlist{display:grid;gap:8px}
.chrow{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center;background:var(--sheet);border:1px solid var(--rule);border-radius:18px;padding:14px 18px;text-decoration:none;color:inherit;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out),border-color .2s}
.chrow:hover{border-color:transparent;box-shadow:var(--shadow);transform:translateY(-2px)}
.chrow.ready .chn{background:var(--green-soft)}
.chn{font:700 18px var(--display);color:var(--green);text-align:center;width:44px;height:44px;line-height:44px;border-radius:14px;background:var(--chip)}
.chb{min-width:0}
.chb b{display:block;font-size:17px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.chb small{display:block;color:var(--muted);font-size:14.5px;line-height:1.4;margin-top:2px}
.chs{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:260px}

/* sign-in and search */
.auth{max-width:440px;margin:48px auto;background:var(--sheet);border:1px solid var(--rule);border-radius:28px;padding:36px 32px;box-shadow:var(--shadow-lg)}
.auth label{display:block;font-weight:600;margin:14px 0 6px}
.auth input,.auth select,.search input{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--rule);border-radius:14px;background:var(--paper);color:var(--ink);font:inherit;font-size:16px;transition:border-color .2s,box-shadow .2s}
.auth input:focus,.auth select:focus,.search input:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 4px var(--green-soft)}
.auth .err{color:var(--margin);font-weight:600;min-height:1.4em;margin-top:10px}
.search{max-width:760px}
.hit{display:block;text-decoration:none;color:inherit;background:var(--sheet);border:1px solid var(--rule);border-radius:18px;padding:14px 16px;margin-top:10px}
.hit:hover{border-color:var(--green)}
.hit small{font:500 12px var(--mono);color:var(--muted)}
.hit p{margin:4px 0 0;color:var(--muted);font-size:15.5px}

/* blog */
.card.post h3{font-size:20px}
.article{max-width:780px}
.article h2{font-size:28px;margin:36px 0 10px}
.article p,.article li{max-width:70ch}
.article .lede{font-size:21px;line-height:1.5;color:var(--muted);margin:16px 0 22px}
.article ul{padding-left:20px}.article li{margin-bottom:7px}
ol.steps{list-style:none;counter-reset:st;padding:0;margin:18px 0}
ol.steps li{counter-increment:st;position:relative;padding:0 0 18px 54px;border-left:2px solid var(--rule);margin-left:18px}
ol.steps li:last-child{border-left-color:transparent;padding-bottom:0}
ol.steps li::before{content:counter(st);position:absolute;left:-19px;top:-4px;width:36px;height:36px;border-radius:50%;background:var(--green);color:var(--on-green);display:grid;place-items:center;font:800 16px var(--display)}
ol.steps b{display:block;font:700 18px var(--display)}
ol.steps span{color:var(--muted)}

/* founder */
.founder{display:grid;grid-template-columns:320px 1fr;gap:0;background:var(--sheet);border:1px solid var(--rule);border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
.fphoto{position:relative;background:#0b1320;min-height:360px}
.fphoto img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.08) saturate(.85)}
.fname{position:absolute;top:auto;right:0;bottom:0;left:0;padding:44px 18px 16px;background:linear-gradient(transparent,rgba(8,14,24,.92));color:#fff}
.fname b{display:block;font:800 22px var(--display)}
.fname span{font-size:14.5px;opacity:.85}
.fname{padding-right:58px}
.flink{position:absolute;right:16px;bottom:18px;width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:#0A66C2;color:#fff;box-shadow:0 4px 10px -4px rgba(10,102,194,.8);transition:transform .2s var(--ease-out),box-shadow .2s}
.flink:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px);box-shadow:0 12px 22px -8px rgba(10,102,194,.9)}
.flink:focus-visible{outline:2px solid #fff;outline-offset:2px}
.flink svg{width:14px;height:14px}
.flink::before{content:"";position:absolute;top:-9px;right:-9px;bottom:-9px;left:-9px}
.fbody{padding:clamp(24px,3.4vw,40px);min-width:0}
.fbody h2{font-size:clamp(24px,3vw,32px);margin-bottom:10px}
.fbody p{max-width:62ch;margin:0 0 16px}
.scorecard{border:1px solid var(--rule);border-radius:18px;overflow:hidden;max-width:520px}
.sc-head{display:flex;justify-content:space-between;gap:10px;background:var(--ink);color:var(--paper);padding:8px 14px;font:500 12.5px var(--mono);text-transform:uppercase;letter-spacing:.05em}
.sc-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.sc-grid div{position:relative;padding:14px 10px 16px;text-align:center;border-left:1px solid var(--rule)}
.sc-grid div:first-child{border-left:0}
.sc-grid b{display:block;font:700 34px/1 var(--display);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.sc-grid span{font:500 12.5px var(--mono);color:var(--muted)}
.sc-grid i{position:absolute;left:0;bottom:0;height:5px;background:var(--green)}
.fstats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}
.fstats b{display:block;font:800 20px var(--display);color:var(--green)}
.fstats span{font-size:14.5px;color:var(--muted);line-height:1.35;display:block}
.qhead{margin:16px 0 8px !important;font:600 11.5px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.meta.qcol{flex-direction:column;align-items:flex-start}

/* footer */
footer{background:var(--sheet);border-top:1px solid var(--rule);margin-top:64px;padding-block:40px;color:var(--muted);font-size:13.5px;line-height:1.55}
footer .cols{display:flex;gap:28px;flex-wrap:wrap;justify-content:space-between}
footer a{color:var(--muted);text-decoration:none}
footer a:hover{color:var(--ink);text-decoration:underline}

/* BOOK COVERS. One cover per CPA section, used on the home page and the CPA Course page.
   Sizes are in cqw so the cover scales with its card. To recolour a book change --bk and --bk2. */
.books{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.bookcard{text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:14px;container-type:inline-size;transition:transform .45s var(--ease-out);min-width:0}
.bookcard:hover{transform:translateY(-8px)}
.bcover{--bk:#0E4A3A;--bk2:#07261E;--gold:#E6B94A;position:relative;aspect-ratio:2/3;border-radius:1.2cqw 3.4cqw 3.4cqw 1.2cqw;overflow:hidden;background:linear-gradient(165deg,var(--bk),var(--bk2));color:#fff;
 padding:7cqw 7cqw 6cqw 10cqw;display:flex;flex-direction:column;box-shadow:inset 4cqw 0 5cqw -4cqw rgba(0,0,0,.7),inset 1.2cqw 0 0 rgba(255,255,255,.07),0 24px 44px -24px rgba(19,34,56,.7)}
.b-far{--bk:#14356A;--bk2:#0A1B38}.b-reg{--bk:#7A1F30;--bk2:#3D0E17}.b-tcp{--bk:#4B2880;--bk2:#271343}.b-bar{--bk:#96450F;--bk2:#4F2207}.b-isc{--bk:#0B5766;--bk2:#052C35}
.bdeco{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}
.bcover > span,.bcover > em,.bpanel{position:relative}
.bbrand{align-self:flex-start;background:rgba(0,0,0,.34);padding:2.2cqw 3cqw;line-height:1.15}
.bbrand b{display:block;font:800 5.4cqw var(--display);letter-spacing:.06em;border:.5cqw solid #fff;padding:.4cqw 1.6cqw}
.bbrand small{display:block;font:700 2.9cqw var(--body);margin-top:1.2cqw}
.bcode{position:absolute!important;right:4cqw;top:20cqw;font:800 30cqw/1 var(--display);opacity:.1;letter-spacing:-.03em}
.btitle{margin-top:auto;font:800 11.5cqw/1.02 var(--display);color:var(--gold);letter-spacing:-.01em;text-wrap:balance}
.bcover em{font:italic 500 4.4cqw Georgia,serif;color:var(--gold);margin:1.6cqw 0 6cqw}
.bpanel{background:rgba(0,0,0,.3);padding:4.6cqw 5cqw;font-size:3.7cqw;line-height:1.5}
.bpanel b{display:block;color:var(--gold);font:800 4.3cqw var(--display);margin-bottom:1.4cqw}
.bpanel ul{list-style:none;margin:0;padding:0}
.bpanel li{padding-left:4.4cqw;position:relative}
.bpanel li::before{content:"";position:absolute;left:.4cqw;top:1.9cqw;width:1.8cqw;height:1.8cqw;background:var(--gold);transform:rotate(45deg)}
.bauth{font:500 5cqw Georgia,serif;margin-top:5cqw}
.bmeta{display:grid;gap:8px}
.mockband{background-color:#0B1A33;background-image:radial-gradient(70% 120% at 100% 0,rgba(127,174,255,.35),transparent 60%),radial-gradient(60% 120% at 0 100%,rgba(60,200,162,.22),transparent 60%);color:#fff}.mockband h2{color:#fff}
.mockband .cta{gap:8px}
.mockband.ea{background-color:#1A0E18;background-image:radial-gradient(70% 120% at 100% 0,rgba(245,140,187,.32),transparent 60%),radial-gradient(60% 120% at 0 100%,rgba(185,160,255,.2),transparent 60%)}
.mockband .cta .btn{min-width:64px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.22)}
.mockband .cta .btn:hover{background:#fff;color:#1D1D1F;filter:none}

/* EA book covers: same design as the CPA covers, three more colors */
.b-ea1{--bk:#9C1B66;--bk2:#4C0B31}.b-ea2{--bk:#55650F;--bk2:#2A3306}.b-ea3{--bk:#3A4656;--bk2:#191F28}
.factlabel{font:600 13px var(--body);letter-spacing:.02em;color:var(--green);margin:0 0 12px}
.hubhead .facts{margin-block:6px 26px}

/* DASHBOARD (My dashboard page). Greeting and resume card, section tiles, study planner beside the study guide,
   then the chosen section in detail: five rings, focus cards and the chapter table. */
.hubhead.dashwrap{padding-top:14px;padding-bottom:10px}
.dashh{font-size:21px;margin:18px 0 10px}
.dsub{font-size:19px;margin:24px 0 12px}
.dhero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:center}
.dhero h1{margin:0;font-size:clamp(26px,3vw,34px)}
.dhero .sub{margin:8px 0 0;color:var(--muted);font-size:15px;overflow-wrap:anywhere}
.resume{position:relative;display:flex;gap:16px;align-items:center;padding:14px 18px;border-radius:18px;background:#1D5FD1;background:var(--cover);color:#fff;text-decoration:none;box-shadow:var(--shadow);overflow:hidden;transition:transform .18s}
.resume:hover{transform:translateY(-3px)}
.resume::after{content:"";position:absolute;right:-50px;top:-70px;width:190px;height:190px;border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none}
.rface{flex:none;width:66px;height:66px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 10px 20px -10px rgba(0,0,0,.5);animation:rbob 3.4s ease-in-out infinite}
.rface svg{width:50px;height:50px}
.rbub{position:relative;z-index:1;display:flex;flex-direction:column;gap:4px;min-width:0;animation:rpop .5s ease-out .15s both}
.rbub>b{font:600 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;opacity:.85}
.rbub>span{font-size:15px;line-height:1.4}
.rbub em{align-self:flex-start;font-style:normal;font-weight:700;font-size:14.5px;background:#fff;color:#132238;border-radius:999px;padding:7px 15px;margin-top:4px}
.rbub em i{display:inline-block;font-style:normal;transition:transform .18s}
.resume:hover em i{transform:translateX(4px)}
@keyframes rbob{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-7px) rotate(-6deg)}50%{transform:translateY(0) rotate(0)}70%{transform:translateY(-3px) rotate(5deg)}}
@keyframes rpop{from{opacity:0;transform:translateY(8px)}}
.dsecs{--bk:#0E4A3A;--bk2:#07261E;display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px}
.dsec{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1.5px solid var(--rule);border-radius:16px;background:var(--sheet);background:var(--tint,var(--sheet));color:var(--ink);text-decoration:none;min-width:0;transition:transform .15s,box-shadow .15s,border-color .15s}
.dsec:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.dsec[aria-current="true"]{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.dsh{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}
.dcode{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(150deg,var(--bk),var(--bk2));color:#fff;font:800 15px var(--display);letter-spacing:.02em}
.dname{font:700 15px/1.3 var(--display)}
.dring{--v:0;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--green) calc(var(--v) * 1%),var(--chip) 0)}
.dring b{width:43px;height:43px;border-radius:50%;background:var(--sheet);background:var(--tint,var(--sheet));display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 13px/1 var(--mono)}
.dring small{font:500 9px var(--body);color:var(--muted);margin-top:2px;text-transform:uppercase;letter-spacing:.04em}
.dstat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 10px}
.dstat>span{display:flex;flex-direction:column;font-size:12px;color:var(--muted);line-height:1.3}
.dstat b{font:800 18px var(--display);color:var(--ink)}
.dstat small{font:500 12px var(--body);color:var(--muted)}
.dbar{display:block;height:6px;border-radius:99px;background:var(--chip);overflow:hidden}
.dbar i{display:block;height:100%;border-radius:inherit;background:var(--green);transition:width .4s}
.dshead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0 16px}
.dsoon{margin:0 0 10px;font-size:13.5px}
.dsec.b-aud{--tint:var(--t-aud)}.dsec.b-far{--tint:var(--t-far)}.dsec.b-bar{--tint:var(--t-bar)}.dsec.b-reg{--tint:var(--t-reg)}.dsec.b-tcp{--tint:var(--t-tcp)}.dsec.b-isc{--tint:var(--t-isc)}.dsec.b-ea1{--tint:var(--t-ea1)}.dsec.b-ea2{--tint:var(--t-ea2)}.dsec.b-ea3{--tint:var(--t-ea3)}
.dgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:16px;margin-top:14px;align-items:start}
.dplan,.dguide{background:var(--sheet);border:1px solid var(--rule);border-radius:18px;padding:18px 20px;min-width:0}
.dplan h2,.dguide h2{font-size:20px;margin:0}
.phead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.phead .eyebrow,.dguide .eyebrow{margin-bottom:6px}
.phead .btn{flex:none;white-space:nowrap}
.pintro,.psub{color:var(--muted);font-size:14.5px;margin:8px 0 0}
.pform{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:14px}
.pform label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--muted);min-width:0}
.pform input{width:100%;min-width:0;padding:10px 12px;border:1.5px solid var(--rule);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:16px}
.pform input:focus{outline:2px solid var(--green);outline-offset:1px}
.pfb{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.pdel{margin-left:auto;padding:6px;border:0;background:none;color:var(--margin);font:inherit;font-size:14.5px;text-decoration:underline;cursor:pointer}
.perr{grid-column:1 / -1;margin:0;color:var(--margin);font-size:14px}
.perr:empty{display:none}
.psync{color:var(--muted)}
.psync.saved::before{content:"\2713  ";color:var(--green);font-weight:700}
.psync.offline{color:var(--a3)}
.pstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}
.pstats>*{display:flex;flex-direction:column;gap:1px;padding:7px 10px;border:0;border-radius:10px;background:var(--chip);color:var(--muted);font:500 12px/1.25 var(--body);text-align:left}
.pstats b{font:800 18px var(--display);color:var(--ink)}
.pstats .dbar{height:4px;margin-top:5px}
.pstats small{font:500 12px var(--body);color:var(--muted)}
.pstats button{cursor:pointer}
.pstats button:hover{outline:1.5px solid var(--rule)}
.pstats button.warn b{color:var(--margin)}
.pochs{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pochs b{font-size:13.5px;margin-right:4px}
.pochs a{display:inline-flex;gap:6px;max-width:100%;padding:5px 10px;border:1px solid var(--margin);border-radius:99px;color:var(--ink);font-size:13px;font-weight:600;text-decoration:none}
.pochs a span{font-weight:400;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.pochs a:hover{background:var(--chip)}
.pprog{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:13.5px;color:var(--muted);white-space:nowrap}
.pprog .dbar{flex:1;height:8px}
.plate{margin-top:12px;padding:10px 14px;border-radius:12px;background:var(--chip);border-left:4px solid var(--a3);font-size:14px}
.ptabs{display:flex;gap:4px;margin-top:12px;padding:4px;background:var(--chip);border-radius:12px;overflow-x:auto}
.ptabs button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 10px;border:0;border-radius:9px;background:none;color:var(--muted);font:600 14px var(--body);white-space:nowrap;cursor:pointer}
.ptabs button[aria-selected="true"]{background:var(--sheet);color:var(--ink);box-shadow:0 1px 3px rgba(19,34,56,.18)}
.ptabs i{font:700 11.5px var(--mono);font-style:normal;background:var(--margin);color:#fff;border-radius:99px;padding:1px 7px}
.plist{margin-top:12px;display:flex;flex-direction:column;gap:14px}
/* on a wide screen the planner card matches the guide beside it and its task list scrolls inside */
@media (min-width:901px){.dgrid{align-items:stretch}.dplan{display:flex;flex-direction:column}.dplan .plist{flex:1 1 auto;height:0;min-height:112px;overflow-y:auto;padding-right:6px}}
.pday h4{display:flex;justify-content:space-between;gap:10px;margin:0 0 8px;font:700 14px var(--body);color:var(--ink)}
.pday h4 span{font:500 12.5px var(--mono);color:var(--muted)}
.ptask{--k:var(--a1);display:flex;align-items:center;gap:12px;margin-bottom:8px;padding:10px 12px;border:1px solid var(--rule);border-left:4px solid var(--k);border-radius:12px;background:var(--sheet);cursor:pointer;transition:opacity .2s}
.ptask:last-child{margin-bottom:0}
.ptask input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--green)}
.pk{flex:none;min-width:60px;padding:3px 7px;border-radius:6px;background:var(--chip);color:var(--k);font:600 11px var(--mono);text-transform:uppercase;letter-spacing:.05em;text-align:center}
.pt{display:flex;flex-direction:column;min-width:0}
.pt a{color:var(--ink);font-weight:600;font-size:15px;line-height:1.35;text-decoration:none;overflow-wrap:anywhere}
.pt a:hover{color:var(--green);text-decoration:underline}
.pt small{color:var(--muted);font-size:12.5px}
.ptask.done{opacity:.6}
.ptask.done .pt a{text-decoration:line-through}
.pnext{margin:4px 0 -6px;font:600 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.k-read{--k:var(--a2)}.k-mcq{--k:var(--a1)}.k-tbs{--k:var(--a4)}.k-mock{--k:var(--a5)}.k-rev{--k:var(--a3)}.k-rec{--k:var(--a6)}
.pempty{margin:0;padding:18px;border-radius:12px;background:var(--chip);color:var(--muted);font-size:15px;text-align:center}
.pcatch{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:10px 14px;border-radius:12px;background:var(--chip);font-size:14.5px}
.pweek{border:1px solid var(--rule);border-radius:12px;padding:0 14px}
.pweek summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:12px 0;font-size:13.5px;color:var(--muted);cursor:pointer;list-style:none}
.pweek summary::-webkit-details-marker{display:none}
.pweek summary::before{content:"";align-self:center;width:7px;height:7px;border:solid var(--muted);border-width:0 2px 2px 0;transform:rotate(-45deg);transition:transform .2s}
.pweek[open] summary::before{transform:rotate(45deg)}
.pweek summary b{color:var(--ink);font-size:15px}
.pweek[open] summary{border-bottom:1px dashed var(--rule);margin-bottom:12px}
.pweek .pday{margin-bottom:12px}
.dguide ol{list-style:none;counter-reset:g;margin:12px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.dguide li{counter-increment:g;position:relative;padding:2px 0 0 34px;font-size:13px;line-height:1.42;color:var(--muted)}
.dguide li:not(.gend)::before{content:counter(g);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--green-soft);color:var(--green);font:800 13px/26px var(--display);text-align:center}
.dguide li b{font-size:14px;color:var(--ink)}
.dguide li b::after{content:". "}
.dguide li.gend{counter-increment:none;align-self:start;margin:0;padding:9px 12px;line-height:1.4;border-radius:12px;background:var(--green-soft);color:var(--green);font-weight:600;font-size:13px}
.dsecd{margin-top:12px}
.dsecd>summary{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:9px 16px;border:1.5px solid var(--rule);border-radius:12px;background:var(--sheet);cursor:pointer;list-style:none;font:700 15.5px var(--display);color:var(--green)}
.dsecd>summary::-webkit-details-marker{display:none}
.dsecd>summary::after{content:"";order:-1;width:8px;height:8px;border:solid var(--green);border-width:0 2px 2px 0;transform:rotate(45deg);margin:-3px 2px 0;transition:transform .2s}
.dsecd[open]>summary::after{transform:rotate(-135deg);margin-top:3px}
.dsecd>summary small{font:400 13.5px var(--body);color:var(--muted)}
.dsecd>summary:hover{border-color:var(--green)}
.dsecd[open]>summary{margin-bottom:16px;border-color:var(--green)}
.dmore summary{padding:10px 0;color:var(--green);font-weight:700;cursor:pointer}
.dash{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:14px}
.dcard{background:var(--sheet);border:1px solid var(--rule);border-radius:14px;padding:20px 14px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.dcard strong{font:700 16px var(--display)}
.dcard span{font-size:13.5px;color:var(--muted);line-height:1.35}
.ring{--v:0;width:104px;aspect-ratio:1;border-radius:50%;margin-bottom:10px;display:grid;place-items:center;background:conic-gradient(var(--green) calc(var(--v) * 1%),var(--chip) 0)}
.ring b{width:80px;aspect-ratio:1;border-radius:50%;background:var(--sheet);display:grid;place-items:center;font:800 22px var(--display)}
.dcard.big{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.dcard.big span{color:var(--paper);opacity:.75}
.dcard.big .ring{background:conic-gradient(var(--marker) calc(var(--v) * 1%),rgba(128,128,128,.35) 0)}
.dcard.big .ring b{background:var(--ink);color:var(--paper)}
.focus{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
.focus .card{text-decoration:none;color:inherit;gap:6px;padding:16px}
.focus .card:hover{border-color:var(--green)}
.pill.warn{background:#FBE3E0;color:#A3291C}
.dtbl td:first-child{min-width:220px}

/* MOCK EXAM CARDS. An exam ticket in the colours of its book (--bk and --bk2 come from the b-<section> class). */
.mocks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.mock{--gold:#E6B94A;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:4px;min-width:0;padding:20px 20px 18px;border-radius:18px;text-decoration:none;color:#fff;
 background:linear-gradient(140deg,var(--bk,#0E4A3A),var(--bk2,#07261E));box-shadow:0 18px 34px -22px var(--bk2,#07261E);transition:transform .18s,box-shadow .18s}
.mock::before{content:"";position:absolute;right:-46px;top:-46px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.2),rgba(255,255,255,0) 68%)}
.mock::after{content:"";position:absolute;left:0;right:0;bottom:58px;border-top:2px dashed rgba(255,255,255,.26)}
.mock > *{position:relative}
.mock:hover{transform:translateY(-5px) rotate(-.4deg);box-shadow:0 26px 40px -22px var(--bk2,#07261E)}
.mdial{position:absolute!important;right:16px;top:14px;width:64px;color:var(--gold)}
.mdial svg{display:block;width:100%;height:auto}
.mdial text{font-family:var(--display)}
.mock:hover .mring{animation:mtick 1.4s ease-out}
@keyframes mtick{from{stroke-dasharray:0 164}}
.mtag{font:500 11.5px var(--mono);text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.mcode{font:800 44px/1 var(--display);letter-spacing:-.02em;color:var(--gold);margin-top:4px}
.mname{font:600 15px/1.3 var(--body);opacity:.92;max-width:calc(100% - 76px);min-height:2.6em}
.mstats{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 30px}
.mstats span{flex:1 1 0;min-width:74px;background:rgba(0,0,0,.26);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:8px 10px;font:600 12px/1.25 var(--body);opacity:.95}
.mstats b{display:block;font:800 22px/1.1 var(--display);color:#fff}
.mgo{align-self:flex-start;background:var(--gold);color:#132238;font:800 14.5px var(--display);padding:8px 16px;border-radius:99px}
.mgo i{font-style:normal;display:inline-block;transition:transform .18s}
.mock:hover .mgo i{transform:translateX(4px)}
.mock.soon .mcode{color:#fff;opacity:.92}
.mock.soon .mgo{background:rgba(255,255,255,.14);color:#fff;font-weight:600;border:1px dashed rgba(255,255,255,.5)}

/* FOLLOW US. Shown in the footer for each profile address set in config.js. */
.follow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.follow b{font:700 14px var(--display);color:var(--ink);margin-right:4px}
.soc{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;transition:transform .15s}
.soc:hover{transform:translateY(-2px)}.soc svg{width:19px;height:19px;fill:currentColor}
.s-facebook{background:#1877F2}.s-linkedin{background:#0A66C2}.s-instagram{background:radial-gradient(circle at 30% 107%,#FDD56D 0,#F56A3C 30%,#D6249F 60%,#285AEB 95%)}
.s-tiktok{background:#111;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}.s-youtube{background:#FF0000}

/* page changes fade in gently */
/* opacity only: a transform here would make the fixed reader and exam size themselves to the page instead of the screen */
@keyframes pagein{from{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:none;transform:none}}
main#app.pagein{animation:pagein .5s var(--ease-out)}
html{scroll-behavior:smooth;scroll-padding-top:84px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}main#app.pagein{animation:none}nav.main a::after,.tabs a::after,.logo svg,header.top,.bar{transition:none}}
/* SCROLL REVEAL. reveal() in app.js adds .reveal to page sections after a page is drawn, and .in as each scrolls into view.
   Without JavaScript, or with reduced motion, nothing is hidden. */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
/* CPA Notes. SEGMENT: TEXTBOOK.
   The reading page: contents list, the ruled page, lessons, example and trap boxes, diagram frame. */

.reader{display:grid;grid-template-columns:270px 1fr;gap:24px;align-items:start}
.toc{position:sticky;top:76px;background:var(--sheet);border:1px solid var(--rule);border-radius:14px;padding:8px;max-height:calc(100vh - 96px);overflow:auto}
.toc a{display:flex;gap:10px;align-items:baseline;padding:10px;border-radius:9px;text-decoration:none;color:var(--ink);font-weight:600;font-size:calc(15.5px * var(--fz,1));line-height:1.3}
.toc a:hover{background:var(--chip)}
.toc a[aria-current="true"]{background:var(--green-soft)}
.toc .num{font:800 calc(15px * var(--fz,1)) var(--display);color:var(--green);min-width:22px}
.toc small{display:block;font:500 calc(11.5px * var(--fz,1)) var(--mono);color:var(--muted);margin-top:3px}

/* the page itself, with the red margin rule */
.page{background:var(--bg-textbook);border:1px solid var(--rule);border-radius:14px;padding:26px 26px 26px 58px;position:relative;min-width:0;overflow:hidden}
.page::before{content:"";position:absolute;left:40px;top:0;bottom:0;width:2px;background:var(--margin);opacity:.55}
.page > *{position:relative}
.page .wm{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.05;font:700 15px var(--mono);line-height:5;word-spacing:60px;overflow:hidden;transform:rotate(-18deg) scale(1.5);color:var(--ink)}
.page h2{font-size:clamp(22px,2.8vw,30px);margin-bottom:4px}

/* lessons */
.topic{padding-block:20px;border-top:1px dashed var(--rule)}
.topic:first-of-type{border-top:0}
.topic h3{font-size:calc(20px * var(--fz,1));margin-bottom:6px;display:flex;gap:10px;align-items:baseline}
.topic h3 span{font:500 calc(13px * var(--fz,1)) var(--mono);color:var(--muted)}
.topic p{margin:0 0 10px;max-width:68ch}
ul.covers{margin:6px 0 12px;padding-left:20px;max-width:68ch}
ul.covers li{margin-bottom:5px}

/* why it matters, example and exam trap boxes */
.why{background:var(--green-soft);border-radius:12px;padding:14px 16px;margin:14px 0 4px;max-width:72ch}
.example{background:var(--bg-example);border-left:4px solid var(--marker);padding:10px 14px;border-radius:0 10px 10px 0;font-size:calc(16px * var(--fz,1));max-width:68ch}
.example b{font:500 calc(12px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);display:block}
.trap{border-left:4px solid var(--margin);background:var(--sheet);background:color-mix(in srgb,var(--margin) 9%,var(--sheet));padding:10px 14px;border-radius:0 10px 10px 0;font-size:calc(16px * var(--fz,1));max-width:68ch;margin-top:8px}
.trap b{font:500 calc(12px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--margin);display:block}
.plan,.auth{border-left:4px solid var(--green);background:var(--sheet);background:color-mix(in srgb,var(--green) 8%,var(--sheet));padding:10px 14px;border-radius:0 10px 10px 0;font-size:calc(16px * var(--fz,1));max-width:68ch;margin-top:8px}
.auth{border-left-color:var(--muted);background:var(--sheet)}
.plan b,.auth b{font:500 calc(12px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--green);display:block}
.auth b{color:var(--muted)}

/* mark as done, view-only, pager, locked chapters */
.done{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-weight:600;font-size:calc(15px * var(--fz,1));cursor:pointer}
.done input{width:18px;height:18px;accent-color:var(--green)}
.viewonly{user-select:none;-webkit-user-select:none}
.pager{display:flex;justify-content:space-between;gap:12px;margin-top:18px;flex-wrap:wrap}
.lock{background:var(--green-soft);border-radius:12px;padding:22px;margin-top:14px}

/* frame around a diagram (the drawings are in assets/diagrams) */
figure.fig{margin:10px 0 14px;max-width:720px}
figure.fig .svgwrap{background:var(--paper);border:1px solid var(--rule);border-radius:12px;padding:12px;overflow-x:auto}
figure.fig svg{width:100%;height:auto;min-width:420px;display:block}
figure.fig figcaption{font-size:calc(14.5px * var(--fz,1));color:var(--muted);margin-top:6px}

/* CHAPTER COVER. The first thing shown on the Textbook tab. No watermark here. */
.chcover{background:var(--cover);color:#fff;border-radius:6px 16px 16px 6px;padding:34px 34px 30px 50px;position:relative;overflow:hidden;box-shadow:inset 20px 0 24px -20px rgba(0,0,0,.45),var(--shadow)}
.chcover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;background:rgba(0,0,0,.28)}
.cvtag{font:500 calc(13px * var(--fz,1)) var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.92;margin:0}
.cvnum{font:800 calc(20px * var(--fz,1)) var(--display);margin:22px 0 0}
.cvnum b{display:block;font-size:calc(88px * var(--fz,1));line-height:.95}
.chcover h2{font-size:clamp(28px,4.4vw,46px);margin:10px 0 16px;color:#fff;max-width:22ch}
.cvwhy{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);border-radius:12px;padding:12px 14px;max-width:72ch;font-size:calc(16px * var(--fz,1))}
.cvhead{font:500 calc(12px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.08em;margin:22px 0 8px;opacity:.92}
.cvtoc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.cvtoc a{height:100%;display:flex;gap:10px;align-items:baseline;background:rgba(255,255,255,.95);color:#132238;border-radius:10px;padding:9px 12px;font-size:calc(15px * var(--fz,1));font-weight:600;line-height:1.3;text-decoration:none}
.cvtoc a:hover{background:#fff}
.cvtoc a span{font:700 calc(12.5px * var(--fz,1)) var(--mono);color:#1D5FD1;min-width:30px}
.btn.cvstart{background:#FFE066;color:#132238;margin-top:20px}

/* THE READER. Opens over the page. The chapter is laid out by app.js as sheets, each exactly one screen tall,
   scrolled one after another like the pages of a PDF. Each sheet takes one accent colour (--acc). */
html.reading{overflow:hidden}
.rd{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:var(--paper);background:color-mix(in srgb,var(--ink) 12%,var(--paper));display:flex;flex-direction:column;--acc:var(--a1)}
.rdbar{display:flex;align-items:center;gap:10px;padding:8px 14px;background:#1E2B3A;color:#fff;flex:none}
.rdbar button,.rdbar a{color:#fff}
.rdib{flex:none;width:38px;height:38px;display:grid;place-items:center;border-radius:10px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);cursor:pointer;text-decoration:none}
.rdib:hover,.rdnav button:hover,.rdfz button:hover{background:rgba(255,255,255,.16)}
.rdib svg,.rdnav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.rdtt{display:flex;flex-direction:column;min-width:0;max-width:34%;line-height:1.2}
.rdtt b{font:800 15px var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rdtt small{font:500 12.5px var(--body);opacity:.72;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rdnav{display:flex;gap:6px;margin:0 auto}
.rdnav button{display:flex;align-items:center;gap:4px;height:38px;padding:0 14px;border-radius:10px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);font:700 14.5px var(--body);cursor:pointer}
.rdpg{display:flex;align-items:center;gap:7px;font:500 13.5px var(--mono);white-space:nowrap;opacity:.95}
.rdpg input{width:52px;height:36px;text-align:center;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:rgba(0,0,0,.2);color:#fff;font:600 15px var(--mono)}
.rdfz{display:flex;border:1px solid rgba(255,255,255,.22);border-radius:10px;overflow:hidden}
.rdfz button{width:40px;height:36px;border:0;background:rgba(255,255,255,.06);font:700 15px var(--display);cursor:pointer}
.rdfz button + button{border-left:1px solid rgba(255,255,255,.22)}
.rdfz sup{font-size:.7em}
.rdprog{height:3px;background:rgba(19,34,56,.18);flex:none}
.rdprog i{display:block;height:100%;width:0;background:var(--marker);transition:width .25s}
.rdmain{flex:1;min-height:0;display:flex;position:relative}
.rdside{flex:0 0 20%;min-width:230px;max-width:360px;overflow-y:auto;overscroll-behavior:contain;background:var(--sheet);border-right:1px solid var(--rule);padding:14px 10px 20px}
.rd:not(.rdopen) .rdside{display:none}
.rdsh{margin:0 8px 8px;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.rdside ol{list-style:none;margin:0;padding:0}
.rdside li button{display:flex;align-items:flex-start;gap:8px;width:100%;text-align:left;border:0;background:none;border-radius:9px;padding:8px 10px;color:var(--ink);font:500 14.5px/1.35 var(--body);cursor:pointer}
.rdside li button:hover{background:var(--chip)}
.rdside li button.on{background:var(--green-soft);color:var(--green);font-weight:700;box-shadow:inset 3px 0 0 var(--green)}
.rdn{flex:none;min-width:34px;font:700 12px/1.6 var(--mono);color:var(--muted)}
.rdl{flex:1}
.rdck{flex:none;width:16px;font-style:normal;color:var(--green);font-weight:800}
.rdside .done .rdck::after{content:"✓"}
.rdchap{display:flex;justify-content:space-between;gap:8px;margin:14px 8px 0;padding-top:12px;border-top:1px solid var(--rule)}
.rdchap a{font:700 13.5px var(--body);color:var(--green);text-decoration:none}
.rdscrim{display:none}
.rdscroll{flex:1 1 auto;min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y proximity;padding:8px 8px 0;outline:0}

.sheet{--acc:var(--a1);position:relative;height:calc(var(--rh,100vh) - 16px);width:min(940px,100%);margin:0 auto 12px;background:var(--bg-textbook);border-radius:4px 10px 10px 4px;overflow:hidden;
 display:flex;flex-direction:column;padding:0 30px 0 40px;scroll-snap-align:start;scroll-margin-top:8px;box-shadow:0 1px 0 var(--rule),0 14px 30px -18px rgba(19,34,56,.5);font-size:16px;font-size:calc(16px * var(--fz,1));line-height:1.55}
.sheet::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:var(--acc)}
.sheet > *{position:relative}
.sheet.c0{--acc:var(--a2)}.sheet.c1{--acc:var(--a1)}.sheet.c2{--acc:var(--a2)}.sheet.c3{--acc:var(--a3)}.sheet.c4{--acc:var(--a4)}.sheet.c5{--acc:var(--a5)}.sheet.c6{--acc:var(--a6)}
.sheet .wm{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.04;font:700 16px var(--mono);line-height:5.4;word-spacing:70px;letter-spacing:.04em;overflow:hidden;transform:rotate(-18deg) scale(1.5);color:var(--ink)}
.sb{flex:1;min-height:0;overflow:hidden;padding-top:12px}
/* a page with little on it is only as tall as its content (set by layout() in app.js) */
.sheet.fit{height:auto;min-height:220px}
.sheet.fit .sb{flex:none;overflow:visible}
.sheet.long .sb{overflow-y:auto}
.sb > *{margin-top:0;margin-bottom:10px}
.sb > p{max-width:none}

/* running head and foot of a sheet */
.lh,.lf{display:flex;justify-content:space-between;gap:12px;font:500 calc(11px * var(--fz,1)) var(--mono);letter-spacing:.05em;color:var(--muted);flex:none}
.lh{padding:10px 0 7px;border-bottom:1px solid var(--rule);text-transform:uppercase}
.lh span{white-space:nowrap}.lh span:last-child{overflow:hidden;text-overflow:ellipsis}
.lf{padding:7px 0 9px;border-top:1px solid var(--rule)}
.lf span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lf span:first-child{flex:1;min-width:0}
.lf span:nth-child(2){color:var(--acc);font-weight:700}

/* lesson pieces on a sheet */
h3.lt{display:flex;gap:10px;align-items:center;background:var(--acc);color:var(--on-acc);padding:9px 14px;border-radius:10px;font-size:calc(19px * var(--fz,1))}
h3.lt span{font:700 calc(13px * var(--fz,1)) var(--mono);background:var(--on-acc);color:var(--acc);border-radius:7px;padding:3px 8px}
.sb h2{font-size:clamp(21px,2.6vw,27px)}
.sb ul.covers{max-width:none}
.sb ul.covers li::marker{color:var(--acc)}
.sb .example,.sb .trap,.sb .plan,.sb .auth,.ladder{max-width:none}
.sb .example{border-left-color:var(--acc);font-size:calc(15.5px * var(--fz,1))}
.ladder{display:grid;gap:8px}
.example.lv1{border-left-color:var(--a1)}.example.lv1 > b:first-child{color:var(--a1)}
.example.lv2{border-left-color:var(--a3)}.example.lv2 > b:first-child{color:var(--a3)}
.example.lv3{border-left-color:var(--a5)}.example.lv3 > b:first-child{color:var(--a5)}
.example .sn b,.trap .sn b,.plan .sn b,.auth .sn b{display:inline;font:inherit;font-weight:700;color:inherit;text-transform:none;letter-spacing:0}
.example.cont > b:first-child::after,.trap.cont > b:first-child::after,.plan.cont > b:first-child::after,.auth.cont > b:first-child::after{content:" (continued)"}
.sb figure.fig{max-width:none}
.sb figure.fig svg{max-height:calc(var(--rh,100vh) * .46);min-width:0}
.sb .done{margin-top:2px}

/* exam points: words marked **like this** in the chapter data get a highlighter stroke in running text */
.sb > p b,.sb li b,.example .sn b,.trap .sn b,.gsec td b,.ctbl td b{background:linear-gradient(transparent 55%,var(--marker) 55%);background:linear-gradient(transparent 55%,color-mix(in srgb,var(--marker) 75%,transparent) 55%);padding:0 .12em;border-radius:2px}
.flow li > b{background:none}

/* standards at a glance: a coloured bar per topic, label on the left, points on the right */
.gsrc{font:500 calc(12.5px * var(--fz,1)) var(--mono);color:var(--muted)}
.gsec{--acc:var(--a1)}
.gsec.k2{--acc:var(--a2)}.gsec.k3{--acc:var(--a3)}.gsec.k4{--acc:var(--a4)}.gsec.k5{--acc:var(--a5)}.gsec.k6{--acc:var(--a6)}
.gsec h4{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--acc);color:var(--on-acc);margin:0;padding:7px 12px;border-radius:10px 10px 0 0;font:800 calc(16px * var(--fz,1)) var(--display)}
.gsec h4 span{font:700 calc(12.5px * var(--fz,1)) var(--mono)}
.gsec h4 em{margin-left:auto;font:500 calc(12px * var(--fz,1)) var(--mono);background:var(--on-acc);color:var(--acc);border-radius:6px;padding:2px 8px}
.gsec.cont h4::after,.ctbl.cont caption::after{content:" (continued)";font-weight:500;opacity:.8}
.gsec table{width:100%;border-collapse:collapse;border:1.5px solid var(--acc);border-top:0;font-size:calc(15px * var(--fz,1));line-height:1.4}
.gsec th{width:24%;text-align:left;vertical-align:top;background:var(--bg-textbook);background:color-mix(in srgb,var(--acc) 10%,var(--bg-textbook));padding:7px 12px;font-weight:700}
.gsec td{padding:6px 12px}
.gsec tr + tr > *{border-top:1px solid var(--rule)}
.gsec ul{margin:0;padding-left:18px}
.gsec li{margin:1px 0}
.gsec li::marker{color:var(--acc)}
.gnote{font-size:calc(13.5px * var(--fz,1));color:var(--muted);font-style:italic}

/* flowcharts and bar charts inside a lesson */
.cap{font:500 calc(12px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 8px!important}
.flow ol{list-style:none;margin:0;padding:0;display:flex;gap:10px 28px;flex-wrap:wrap;counter-reset:f}
.flow li{counter-increment:f;flex:1 1 140px;position:relative;background:var(--bg-textbook);background:color-mix(in srgb,var(--acc) 9%,var(--bg-textbook));border:1.5px solid var(--rule);border-color:color-mix(in srgb,var(--acc) 45%,var(--rule));border-radius:12px;padding:8px 12px;font-size:calc(14.5px * var(--fz,1));line-height:1.35}
.flow li b{display:block;font-size:calc(15px * var(--fz,1))}
.flow li b::before{content:counter(f);display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--acc);color:var(--on-acc);font:700 calc(12px * var(--fz,1)) var(--mono);margin-right:7px;vertical-align:1px}
.flow li span{display:block;margin-top:2px}
.flow li em{display:inline-block;margin-top:5px;font:500 calc(12px * var(--fz,1)) var(--mono);background:var(--acc);color:var(--on-acc);border-radius:6px;padding:2px 7px}
.flow li:not(:last-child)::after{content:"";position:absolute;right:-22px;top:50%;width:15px;height:15px;transform:translateY(-50%);background:var(--acc);clip-path:polygon(0 35%,55% 35%,55% 0,100% 50%,55% 100%,55% 65%,0 65%)}
.flow.v ol{flex-direction:column;gap:20px}
.flow.v li{flex:none}
.flow.v li:not(:last-child)::after{right:auto;left:26px;top:auto;bottom:-18px;transform:rotate(90deg)}
.crow{display:grid;grid-template-columns:minmax(110px,34%) 1fr auto;gap:10px;align-items:center;margin-bottom:6px;font-size:calc(14.5px * var(--fz,1));line-height:1.3}
.cb{height:15px;background:var(--chip);border-radius:8px;overflow:hidden}
.cb i{display:block;height:100%;border-radius:8px;background:var(--a1)}
.cb i.k2{background:var(--a2)}.cb i.k3{background:var(--a3)}.cb i.k4{background:var(--a4)}.cb i.k5{background:var(--a5)}.cb i.k6{background:var(--a6)}
.cv{font:500 calc(13px * var(--fz,1)) var(--mono);white-space:nowrap}
.cnote{font-size:calc(13.5px * var(--fz,1));color:var(--muted);margin:4px 0 0!important}

/* CARTOON THOUGHT. A study-desk character with a thought bubble, one per lesson (the `toon` field). */
.toon{display:flex;align-items:flex-end;gap:14px;margin:14px 0 12px;max-width:68ch}
.sb .toon{max-width:none}
.tface{flex:none;width:62px;height:62px;filter:drop-shadow(0 4px 6px rgba(19,34,56,.18))}
.tface svg{width:100%;height:100%;display:block}
.tbub{position:relative;background:var(--sheet);border:2px solid var(--ink);border-radius:20px;padding:9px 15px 10px;box-shadow:4px 4px 0 var(--marker);font-size:calc(15.5px * var(--fz,1));line-height:1.45;margin-bottom:10px}
.tbub b{display:block;font:600 calc(11.5px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:2px}
.tbub span{font-style:italic}
.tbub span b{display:inline;font:inherit;font-weight:700;font-style:italic;color:inherit;text-transform:none;letter-spacing:0;margin:0}
.tbub::before,.tbub::after{content:"";position:absolute;background:var(--sheet);border:2px solid var(--ink);border-radius:50%}
.tbub::before{width:12px;height:12px;left:-14px;bottom:8px}
.tbub::after{width:7px;height:7px;left:-24px;bottom:1px}
.toon.t1 .tbub{box-shadow:4px 4px 0 var(--a2)}.toon.t2 .tbub{box-shadow:4px 4px 0 var(--a1)}.toon.t3 .tbub{box-shadow:4px 4px 0 var(--a3)}

/* CONVERSATION. People on the engagement talk a point through (the `talk` field). Lines pop in one after another when the page is reached. */
.talk{margin:14px 0 12px;display:flex;flex-direction:column;gap:9px}
.talk .cap{margin:0 0 2px}
.tk{display:flex;align-items:flex-end;gap:10px;max-width:92%}
.tk.r{flex-direction:row-reverse;align-self:flex-end}
.tkf{flex:none;width:46px;height:46px;border-radius:50%;overflow:hidden;background:var(--paper);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--a1)}
.tk.r .tkf{box-shadow:-2px 2px 0 var(--a3)}
.tkf svg{width:100%;height:100%;display:block}
.tkb{background:var(--sheet);border:1.5px solid var(--rule);border-radius:16px 16px 16px 4px;padding:7px 13px 8px;font-size:calc(15px * var(--fz,1));line-height:1.42}
.tk.r .tkb{border-radius:16px 16px 4px 16px;background:var(--bg-example)}
.tkb > b{display:block;font:700 calc(12.5px * var(--fz,1)) var(--display);margin-bottom:1px;background:none;padding:0}
.tkb > b i{font:500 calc(11px * var(--fz,1)) var(--mono);font-style:normal;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-left:7px}
.talk.anim .tk{opacity:0}
.talk.anim.go .tk{animation:tkin .45s cubic-bezier(.2,.9,.3,1.25) both;animation-delay:calc(var(--i) * .5s)}
.talk.anim.go .tkf svg{animation:tknod .5s ease-in-out 2;animation-delay:calc(var(--i) * .5s + .35s)}
@keyframes tkin{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}
@keyframes tknod{50%{transform:translateY(-3px) rotate(-4deg)}}
@media (prefers-reduced-motion: reduce){.talk.anim .tk{opacity:1;animation:none!important}.talk.anim.go .tkf svg{animation:none}}

/* SAMPLE DOCUMENT. A report, letter or working paper shown as a sheet of paper, with the lines that matter marked (the `doc` field). */
.doc{margin:14px 0;max-width:840px}
.doc .cap i{font:500 calc(11px * var(--fz,1)) var(--mono);font-style:normal;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-left:9px;border:1px solid var(--rule);border-radius:99px;padding:1px 8px}
.dbody{background:var(--sheet);border:1px solid var(--rule);border-top:5px solid var(--acc,var(--a1));border-radius:3px 3px 10px 10px;padding:14px 18px 12px;box-shadow:3px 4px 0 var(--rule);font:calc(15px * var(--fz,1))/1.5 Georgia,"Times New Roman",serif}
.dbody h5{margin:10px 0 3px;font:700 calc(13px * var(--fz,1)) var(--display);text-transform:uppercase;letter-spacing:.05em}
.dbody h5:first-child{margin-top:0}
.dbody p{margin:0 0 7px}
.dbody .dsig{font-style:italic;color:var(--muted);margin-top:4px}
.dk{position:relative;margin:0 -8px 8px;padding:6px 8px 5px 12px;border-left:4px solid var(--marker);background:var(--bg-example);border-radius:0 8px 8px 0}
.dk p{margin:0}
.dk em{display:block;margin-top:3px;font:600 calc(12.5px * var(--fz,1))/1.35 var(--body);font-style:normal;color:var(--margin)}
.dk em::before{content:"Why it matters: ";font-weight:700}
.dbody b{background:linear-gradient(transparent 55%,var(--marker) 55%);padding:0 .12em;border-radius:2px}
/* CPA Notes. SEGMENT: PRACTICE.
   Flashcards, MCQs, simulation headings, quick recall notes, mnemonics and video cards. */

/* flashcards */
.deck{max-width:620px;margin:0 auto;text-align:center}
.fc{perspective:1000px;width:100%;height:280px;border:0;background:none;padding:0;margin-block:14px}
.fc .in{position:relative;width:100%;height:100%;transition:transform .45s;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}
.fc.flip .in{transform:rotateY(180deg)}
.fc .face{position:absolute;top:0;right:0;bottom:0;left:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:visibility 0s .22s;border-radius:18px;border:1px solid var(--rule);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:28px;background:var(--bg-flash);box-shadow:var(--shadow);font:800 26px/1.25 var(--display)}
.fc .back{visibility:hidden}.fc.flip .back{visibility:visible}.fc.flip .face:not(.back){visibility:hidden}
.fc .back{transform:rotateY(180deg);background:var(--bg-flash-back);font:600 20px/1.45 var(--body)}
.fc small{font:500 12px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.deckbtns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* MCQs */
.qbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.score{font:500 14px var(--mono);color:var(--muted)}
.q{background:var(--bg-mcq);border:1px solid var(--rule);border-radius:14px;padding:18px;margin-bottom:14px}
.q p.stem{margin:0 0 10px;font-weight:600}
.opts{display:grid;gap:8px}
.opts button{text-align:left;background:var(--paper);border:1.5px solid var(--rule);border-radius:10px;padding:10px 12px}
.opts button:hover{border-color:var(--green)}
.opts button.right{border-color:var(--green);background:var(--green-soft)}
.opts button.wrong{border-color:var(--margin)}
.expl{margin-top:10px;font-size:15.5px;border-left:4px solid var(--marker);padding-left:12px}
/* detailed explanation: the correct answer, each wrong answer, and the textbook passage */
.expl .xl{display:block;font:600 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:12px 0 4px}
.expl .xa p,.expl .xw p,.expl .tref p{margin:0 0 6px}
.expl .xo{font-weight:700}
.expl .xsk{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0 0;font-size:13px;color:var(--muted)}
.expl .xa{background:var(--green-soft);border-radius:10px;padding:2px 12px 6px;margin-top:8px}
.expl .xa .xl{color:var(--green)}
.expl .xw ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.expl .xw li{border:1px solid var(--rule);border-radius:10px;padding:8px 12px;background:var(--sheet)}
.expl .xw li.mine{border-color:var(--margin);background:#FDF0EE;background:color-mix(in srgb,var(--margin) 8%,var(--sheet))}
.expl .xw li em{font:500 11.5px var(--mono);font-style:normal;text-transform:uppercase;color:var(--margin);margin-left:6px}
.expl .tref blockquote{margin:0 0 6px;padding:8px 12px;border-left:3px solid var(--green);background:var(--chip);border-radius:0 9px 9px 0;font-style:italic}
.expl .trefsrc{font-size:14px;color:var(--muted)}
.sim .simref{margin-top:14px}

/* simulations: heading of each task (the table itself is in 06-tables.css) */
.sim{margin-bottom:30px}
.sim h3{font-size:22px;margin-bottom:4px}

/* quick recall notes and mnemonics */
ol.recall{background:var(--bg-recall);border:1px solid var(--rule);border-radius:14px;padding:18px 18px 18px 44px;margin:0;max-width:80ch}
ol.recall li{margin-bottom:8px}
ol.recall li::marker{font:800 16px var(--display);color:var(--green)}
.mn{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.mn .card{background:var(--bg-mnemonic)}
.mn .card b{font:800 22px var(--display);color:var(--green)}
.mn .card p{color:var(--ink)}

/* video classes */
.vid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.vid .card{flex-direction:row;align-items:center;gap:14px}
.vid .card.live{flex-direction:column;align-items:stretch}
.vid iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:10px}
.play{width:46px;height:46px;flex:none;border-radius:50%;background:var(--chip);display:grid;place-items:center}
.play svg{width:18px;height:18px;fill:var(--muted)}

/* exam-style simulations: exhibits you read, then answers you pick or type */
.sim .pill.core{display:inline-block;margin-bottom:6px}
.exhs{border:1px solid var(--rule);border-radius:12px;background:var(--sheet);margin:10px 0 12px;overflow:hidden}
.exhtabs{display:flex;gap:2px;overflow-x:auto;background:var(--chip);padding:6px 6px 0}
.exhtabs button{border:0;background:transparent;padding:8px 12px;border-radius:9px 9px 0 0;font-weight:600;font-size:14.5px;white-space:nowrap;color:var(--muted)}
.exhtabs button[aria-selected="true"]{background:var(--sheet);color:var(--ink);box-shadow:0 -2px 0 var(--green) inset}
.exh{padding:12px 14px;font-size:15.5px}
.exh p{margin:0 0 8px}
.exh .tbswrap{border-radius:8px}
table.exht{min-width:0;font-size:14.5px}
table.exht td,table.exht th{padding:6px 10px}
/* exhibit kinds: email, conversation, document (report excerpt, letter, memo) */
.exh.mail .mailh{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:0 0 12px;padding:0 0 10px;border-bottom:1px solid var(--rule);font-size:14px}
.exh.mail .mailh dt{color:var(--muted);font-weight:600}
.exh.mail .mailh dd{margin:0;min-width:0;overflow-wrap:anywhere}
.exh.chat .said{display:grid;grid-template-columns:minmax(90px,auto) 1fr;gap:10px;margin:0 0 8px;padding:8px 10px;border-radius:10px;background:var(--chip)}
.exh.chat .said b{color:var(--a2)}
.exh.chat .said:nth-of-type(even) b{color:var(--a3)}
.exh.paper{margin:10px;padding:16px 18px;background:var(--sheet);border:1px solid var(--rule);border-radius:4px;box-shadow:var(--shadow);font-family:Georgia,'Times New Roman',serif}
.exh.paper .doch{font-weight:700;text-align:center;margin-bottom:12px;letter-spacing:.02em}
.exh .sign{margin-top:12px;font-style:italic;color:var(--muted)}
/* PDF file: a page in a viewer with a file bar; the page stays white in dark mode, like a real PDF */
.exh.pdf{padding:0;background:#525659}
.pdfbar{display:flex;align-items:center;gap:8px;padding:7px 12px;background:#323639;color:#f1f1f1;font:600 13px var(--body)}
.pdfbar b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.pdfbar span:last-child{margin-left:auto;font-weight:500;opacity:.75;white-space:nowrap}
.pdfic{background:#d93025;color:#fff;border-radius:3px;padding:1px 5px;font-size:10.5px;letter-spacing:.04em}
.pdfpg{--ink:#1d1d1f;--muted:#5b5b60;--rule:#d4d4d8;--sheet:#fff;--chip:#f2f2f4;--paper:#fff;margin:12px;padding:22px 26px;background:#fff;color:#1d1d1f;box-shadow:0 2px 10px rgba(0,0,0,.45);font-family:Georgia,'Times New Roman',serif}
.pdfpg .doch{font-weight:700;text-align:center;margin-bottom:14px;letter-spacing:.02em;text-transform:uppercase;font-size:14.5px}
.pdfpg table.exht{background:#fff;color:#1d1d1f}
/* exhibit links above a simulation: each opens the exhibit in its own window */
.exlinks{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:10px 0 8px;padding:8px 10px;border:1px solid var(--rule);border-radius:10px;background:var(--chip)}
.exlinks > span{font-weight:700;font-size:13.5px;margin-right:2px}
.exlinks button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--rule);background:var(--sheet);color:var(--ink);border-radius:7px;padding:5px 9px;font:600 13.5px var(--body);cursor:pointer;text-align:left}
.exlinks button:hover{border-color:var(--green)}
.exlinks button i{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.exlinks .xall{margin-left:auto;background:transparent;border-style:dashed}
.sim .pill.area{display:inline-block;margin:0 0 6px 6px;white-space:normal;background:var(--chip)}
.sim .pill.area.lvH{background:#FBE3E0;color:#A3291C}
.sim .pill.area.lvM{background:#FDF0D8;color:#8A4B06}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sim .pill.area.lvH{background:#3A1E1B;color:#F5A097}:root:not([data-theme="light"]) .sim .pill.area.lvM{background:#3A2C12;color:#F0B45A}}
:root[data-theme="dark"] .sim .pill.area.lvH{background:#3A1E1B;color:#F5A097}
:root[data-theme="dark"] .sim .pill.area.lvM{background:#3A2C12;color:#F0B45A}
@media (max-width:560px){.exh.chat .said{grid-template-columns:1fr;gap:2px}.exh.paper{margin:6px;padding:12px}}
input.amt{width:100%;min-width:160px;padding:9px 10px;border:1.5px solid var(--rule);border-radius:9px;background:var(--paper);color:var(--ink);font:inherit;font-variant-numeric:tabular-nums}
table.tbs tr.ok input.amt{border-color:var(--green);background:var(--green-soft)}
table.tbs tr.no input.amt{border-color:var(--margin)}
.aibtn{margin-left:6px;vertical-align:baseline}

/* AI tutor panel */
.aip{position:fixed;right:14px;bottom:14px;z-index:90;width:min(430px,calc(100vw - 28px));max-height:min(640px,calc(100vh - 28px));max-height:min(640px,calc(100dvh - 28px));display:flex;flex-direction:column;background:var(--sheet);border:1px solid var(--rule);border-radius:16px;box-shadow:0 26px 60px -20px rgba(19,34,56,.6)}
.aip header{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--rule)}
.aip header b{font:800 16px var(--display)}
.aip header span{font:500 12px var(--mono);color:var(--muted);margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aimsgs{flex:1;overflow-y:auto;padding:12px;display:grid;gap:8px;align-content:start;min-height:160px}
.aim{border-radius:12px;padding:8px 12px;font-size:15.5px;line-height:1.5;max-width:95%}
.aim p{margin:0 0 8px}.aim p:last-child{margin:0}
.aim.ai{background:var(--chip)}
.aim.me{background:var(--green-soft);justify-self:end}
.aim.err{border:1.5px solid var(--margin);background:transparent}
.aip form{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--rule)}
.aip form input{flex:1;min-width:0;padding:9px 10px;border:1.5px solid var(--rule);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit}
.aip .note{margin:0;padding:0 12px 10px;font-size:12.5px}

/* mock exam: intro page */
.exintro{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start}
.exintro h2{font-size:clamp(24px,3vw,32px);margin-bottom:8px}

/* mock exam: the exam screen, laid out like the test centre software */
.exam{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:var(--paper);display:flex;flex-direction:column}
.exbar{display:flex;align-items:center;gap:14px;padding:9px 14px;background:#132238;color:#fff;flex:none;flex-wrap:wrap}
.exbar b{font:800 16px var(--display)}
.exbar span{font:500 13px var(--mono);opacity:.85}
.exbar .extime{margin-left:auto;font:700 18px var(--mono);opacity:1;background:rgba(255,255,255,.12);padding:4px 10px;border-radius:8px}
.exbar .extime.low{background:var(--margin)}
.exbar .btn.ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.exnav{display:flex;gap:5px;flex-wrap:wrap;padding:8px 14px;background:var(--sheet);border-bottom:1px solid var(--rule);flex:none;max-height:92px;overflow-y:auto}
.exnav button{min-width:34px;height:30px;border-radius:7px;border:1.5px solid var(--rule);background:var(--paper);font:500 13px var(--mono);position:relative}
.exnav button.done{background:var(--green-soft);border-color:var(--green)}
.exnav button.on{outline:3px solid var(--ink);outline-offset:1px}
.exnav button.flag::after{content:"";position:absolute;right:-3px;top:-3px;width:10px;height:10px;border-radius:50%;background:var(--margin)}
.exbody{flex:1;min-height:0;overflow-y:auto;padding:20px max(16px,calc((100vw - 900px) / 2))}
.exq{font:500 12.5px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 8px}
.exbody .stem{font-size:18.5px;font-weight:600;margin:0 0 14px}
.exbody .opts label{display:flex;gap:10px;align-items:flex-start;background:var(--sheet);border:1.5px solid var(--rule);border-radius:10px;padding:11px 12px;cursor:pointer}
.exbody .opts label.pick{border-color:var(--green);background:var(--green-soft)}
.exbody .opts input{margin-top:5px;accent-color:var(--green)}
.exfoot{display:flex;gap:10px;align-items:center;padding:10px 14px;background:var(--sheet);border-top:1px solid var(--rule);flex:none;flex-wrap:wrap}
.exfoot > span{margin-right:auto}
.exfoot button:disabled{opacity:.4}
.exflag{display:inline-flex;gap:8px;align-items:center;font-weight:600;font-size:15px;cursor:pointer}
/* mock exam tools: toolbar, pacing guide, review screen, split exhibit view, calculator and spreadsheet */
.extoolbar{display:flex;gap:6px;flex-wrap:wrap}
.extoolbar button{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:8px;padding:5px 10px;font:600 13px var(--body);cursor:pointer}
.extoolbar button:hover{background:rgba(255,255,255,.2)}
.extoolbar button[aria-pressed="true"]{background:#fff;color:#132238}
.exbar .expace{margin-left:auto;font:500 12.5px var(--mono)}
.exbar .expace + .extime{margin-left:0}
.exbar .expace.behind{color:#ffc2b5;opacity:1}
.exrev h2{font-size:24px;margin:0 0 6px}
.exrev .linkish{background:none;border:0;padding:0;font:inherit;color:inherit;text-align:left;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.exrev .pill.st-ok{background:var(--green-soft);color:var(--green)}
.exrev .pill.st-part{background:var(--chip)}
.exrev .pill.st-no,.exrev .pill.st-flag{background:var(--margin);color:#fff}
@media (min-width:900px){
 .exam.split .exbody{padding:16px 20px}
 .exam.split .sim{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px;align-items:start}
 .exam.split .sim > *{grid-column:1 / -1}
 .exam.split .sim > .exhs{grid-column:1;position:-webkit-sticky;position:sticky;top:0;max-height:calc(100vh - 210px);overflow:auto}
 .exam.split .sim > .tbswrap{grid-column:2}
}
.extool{position:fixed;z-index:80;width:272px;background:var(--paper);color:var(--ink);border:1px solid var(--rule);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.32)}
.extool.xsheet{width:616px;width:min(640px,calc(100vw - 24px))}
.extool.xexh{width:500px;width:min(520px,calc(100vw - 24px));height:460px;height:min(560px,calc(100vh - 130px));display:flex;flex-direction:column;overflow:hidden}
.extool.xexh.max{left:8px !important;top:8px !important;width:auto !important;height:auto !important;right:8px;bottom:8px}
.xexhb{max-height:60vh;overflow:auto;padding:10px 12px}
.xexhb .exh.pdf{min-height:100%}
.xexh .xexhb{flex:1 1 auto;min-height:0;max-height:none;-webkit-overflow-scrolling:touch}
.xexh header b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.extool header [data-max]{font-size:17px}
.extool header [data-max] + [data-close]{margin-left:0}
.xgrip{position:absolute;right:0;bottom:0;width:18px;height:18px;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 50%,var(--muted) 50%,var(--muted) 58%,transparent 58%,transparent 70%,var(--muted) 70%,var(--muted) 78%,transparent 78%)}
/* in the mock, exhibits are read in their windows (or side by side in split view), as at the test centre */
.exam .exbody:not(.rep) .sim > .exhs{display:none}
.exam.split .exbody:not(.rep) .sim > .exhs{display:block}
.xexhb .exh{display:block;margin:0}
.extool header{display:flex;align-items:center;gap:8px;padding:8px 10px 8px 12px;background:#132238;color:#fff;border-radius:12px 12px 0 0;cursor:move;touch-action:none;-webkit-user-select:none;user-select:none}
.extool header b{font:700 14px var(--body)}
.extool header button{margin-left:auto;background:none;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;padding:0 4px}
.calcd{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:10px 12px;background:var(--sheet);border-bottom:1px solid var(--rule)}
.calcd:focus{outline:2px solid var(--green);outline-offset:-2px}
.calcm{font:500 12px var(--mono);color:var(--muted);min-width:24px}
.calcv{font:700 24px var(--mono);overflow:hidden;white-space:nowrap}
.calck{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:10px}
.calck button{height:40px;border-radius:8px;border:1px solid var(--rule);background:var(--sheet);color:var(--ink);font:600 15px var(--mono);cursor:pointer}
.calck button.fn{font-size:13px;color:var(--muted)}
.calck button.op{background:var(--chip)}
.calck button.eq{background:var(--green);border-color:var(--green);color:#fff;grid-row:span 2}
.calck button:active{transform:translateY(1px)}
.sheetbar{display:flex;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--rule)}
.sheetbar b{font:600 13px var(--mono);min-width:34px;color:var(--muted)}
.sheetbar input{flex:1;min-width:0;font:500 16px var(--mono);padding:5px 8px;border:1px solid var(--rule);border-radius:6px;background:var(--paper);color:var(--ink)}
.sheetg{overflow:auto;max-height:46vh}
.sheetg table{border-collapse:collapse;font:500 14px var(--mono)}
.sheetg th{background:var(--sheet);color:var(--muted);font-weight:600;padding:3px 6px;border:1px solid var(--rule);position:-webkit-sticky;position:sticky;top:0}
.sheetg tbody th{position:static;min-width:28px}
.sheetg td{border:1px solid var(--rule);padding:0}
.sheetg input{width:96px;border:0;padding:5px 6px;font:500 16px var(--mono);background:transparent;color:var(--ink);text-align:right}
.sheetg input:focus{outline:2px solid var(--green);outline-offset:-2px;text-align:left;background:var(--paper)}
.sheetnote{font-size:12.5px;color:var(--muted);padding:6px 10px 10px;margin:0}
.exscore{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}
.exscore div{background:var(--sheet);border:1px solid var(--rule);border-radius:14px;padding:16px}
.exscore b{display:block;font:800 34px var(--display);color:var(--green)}
.exscore span{font-size:14.5px;color:var(--muted)}
.rep .prog{display:inline-block;width:120px;height:8px;background:var(--chip);border-radius:6px;overflow:hidden;vertical-align:middle;margin-right:8px}
.rep .prog i{display:block;height:100%;background:var(--green)}
.revh{font-size:22px;margin:26px 0 10px}
.rep .q.isno{border-left:5px solid var(--margin)}
.rep .q.isok{border-left:5px solid var(--green)}
.rep.onlyno .isok{display:none}
.rep .opts button em{font:500 12px var(--mono);color:var(--muted);margin-left:6px}
.rep .opts button:disabled{color:inherit;cursor:default}

/* BLUEPRINT TAB: representative tasks and skill levels per chapter */
.bpintro{background:var(--sheet);border:1px solid var(--rule);border-radius:14px;padding:22px 24px;margin:6px 0 22px}
.bpintro h2{margin:4px 0 10px;font-size:26px}
.bpintro p{margin:0 0 10px;line-height:1.55}
.bpsum{display:flex;flex-wrap:wrap;gap:8px}
.sk{display:inline-block;font:600 12px var(--mono);border-radius:999px;padding:3px 10px;white-space:nowrap;--k:var(--a2);color:var(--k);background:var(--chip);background:color-mix(in srgb,var(--k) 13%,var(--sheet));border:1px solid var(--k)}
.sk.s0{--k:var(--a2)}.sk.s1{--k:var(--a1)}.sk.s2{--k:var(--a3)}.sk.s3{--k:var(--a5)}
.bpdef{margin-top:12px}
.bpdef summary{cursor:pointer;font-weight:600}
.bpdef dl{margin:10px 0 0;display:grid;grid-template-columns:max-content 1fr;gap:8px 14px;align-items:baseline}
.bpdef dd{margin:0;line-height:1.5}
.bpg{margin:0 0 22px}
.bpg h3{font-size:20px;margin:0 0 10px;display:flex;gap:10px;align-items:baseline}
.bpg h4{font-size:16px;margin:14px 0 8px;display:flex;gap:10px;align-items:baseline;color:var(--muted)}
.bpcode{font:600 13px var(--mono);color:var(--green);white-space:nowrap}
.bptasks{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bptasks li{display:grid;grid-template-columns:240px 1fr;gap:12px;align-items:start;background:var(--sheet);border:1px solid var(--rule);border-radius:10px;padding:10px 14px;line-height:1.5}
.bptasks li .sk{justify-self:start;margin-top:2px}
/* IRS outline tab (EA): progress, coach tip, study path, topic rows */
.oprog{height:8px;border-radius:99px;background:var(--chip);overflow:hidden;margin:10px 0 4px}
.oprog span{display:block;height:100%;background:var(--green);border-radius:99px;transition:width .5s ease}
.ocoach{display:flex;gap:12px;align-items:flex-start;margin-top:14px;background:var(--green-soft);border-radius:12px;padding:12px 14px}
.ocoach .tkf{flex:0 0 44px;width:44px;height:44px}.ocoach .tkf svg{width:44px;height:44px;border-radius:50%}
.ocoach p{margin:0;line-height:1.5}.ocoach p b:first-child{display:block;font-size:13px;color:var(--green);margin-bottom:2px}
.opath{margin:0 0 24px}
.eapath{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.eapath a{display:flex;flex-direction:column;gap:2px;height:100%;padding:12px;border:1px solid var(--rule);border-radius:12px;background:var(--sheet);color:inherit;text-decoration:none;transition:border-color .2s,transform .2s}
.eapath a:hover,.eapath a:focus-visible{border-color:var(--green);transform:translateY(-2px)}
.eapath .sn{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--chip);font:700 13px var(--mono);margin-bottom:4px}
.eapath .sn svg{width:15px;height:15px}
.eapath li.ok .sn{background:var(--green);color:var(--on-green)}
.eapath small{color:var(--muted);line-height:1.35}
.otasks li{grid-template-columns:220px 1fr}
.otasks li.ok{border-color:var(--green)}
.oxl{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.lchips{display:flex;flex-wrap:wrap;gap:6px}
.lchip{display:inline-flex;align-items:center;gap:4px;font:600 12px var(--mono);padding:4px 10px;min-height:28px;border-radius:999px;border:1px solid var(--rule);color:inherit;text-decoration:none}
.lchip:hover,.lchip:focus-visible{border-color:var(--green)}
.lchip svg{width:12px;height:12px}
.lchip.done{background:var(--green);border-color:var(--green);color:var(--on-green)}
.otext{margin:0;font-weight:600}
.osub{margin:4px 0 0;color:var(--muted);font-size:14px}
.also{margin:6px 0 0;font-size:14px}
@media (prefers-reduced-motion:reduce){.oprog span,.eapath a{transition:none}.eapath a:hover{transform:none}}
@media (max-width:1000px){.eapath{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){
 .bpintro{padding:18px 16px}
 .bpdef dl{grid-template-columns:1fr}
 .bptasks li{grid-template-columns:1fr;gap:6px}
 .otasks li{grid-template-columns:1fr}
 .eapath{grid-template-columns:1fr 1fr}
 .eapath li:last-child{grid-column:1 / -1}
 .ocoach .tkf{flex-basis:36px;width:36px;height:36px}.ocoach .tkf svg{width:36px;height:36px}
 .sk{white-space:normal}
}
/* CPA Notes. SEGMENT: TABLES.
   Simulation answer tables, and the financial statement and journal entry tables inside lessons. */

/* simulation tables */
.tbswrap{overflow-x:auto;background:var(--bg-sim);border:1px solid var(--rule);border-radius:14px}
table.tbs{border-collapse:collapse;width:100%;min-width:520px}
table.tbs td,table.tbs th{padding:12px 14px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
table.tbs tr:last-child td{border-bottom:0}
table.tbs th{font:500 calc(12.5px * var(--fz,1)) var(--mono);text-transform:uppercase;color:var(--muted)}
table.tbs select{width:100%;min-width:200px;padding:9px 10px;border:1.5px solid var(--rule);border-radius:9px;background:var(--paper);color:var(--ink);font:inherit}
table.tbs tr.ok select{border-color:var(--green);background:var(--green-soft)}
table.tbs tr.no select{border-color:var(--margin)}
table.tbs .fix{display:block;font-size:calc(14.5px * var(--fz,1));color:var(--muted);margin-top:4px}

/* statements and journal entries inside lessons.
   Row styles: b = bold subtotal, t = total with a top rule, h = green heading, i = indented line. */
.led{max-width:620px;margin:10px 0 14px}
.led table.tbs{min-width:0;font-size:calc(16px * var(--fz,1))}
.led caption{caption-side:top;text-align:left;padding:10px 14px 6px;font:500 calc(12px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.led td,.led th{padding:7px 14px!important}
.led .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.led td.cr{padding-left:38px!important}
.led tr.b td{font-weight:700}
.led tr.t td{font-weight:700;border-top:2px solid var(--ink)}
.led tr.h td{font:800 calc(15px * var(--fz,1)) var(--display);color:var(--green);padding-top:12px!important}
.led tr.i td:first-child{padding-left:30px!important}

/* comparison tables inside a lesson (lesson field: tbl). First column is the row label. */
.ctbl{overflow-x:auto;margin:14px 0;max-width:840px;border:1.5px solid var(--rule);border-color:color-mix(in srgb,var(--acc) 55%,var(--rule));border-radius:12px;background:var(--bg-textbook)}
.ctbl table{border-collapse:collapse;width:100%;min-width:460px;font-size:calc(15.5px * var(--fz,1));line-height:1.4}
.ctbl caption{caption-side:top;text-align:left;padding:9px 12px;background:var(--acc);color:var(--on-acc);font:800 calc(15.5px * var(--fz,1)) var(--display)}
.ctbl th,.ctbl td{padding:8px 12px;text-align:left;vertical-align:top}
.ctbl thead th{background:var(--bg-textbook);background:color-mix(in srgb,var(--acc) 16%,var(--bg-textbook));font:500 calc(12.5px * var(--fz,1)) var(--mono);text-transform:uppercase}
.ctbl tbody th{font-weight:700;background:var(--bg-textbook);background:color-mix(in srgb,var(--acc) 7%,var(--bg-textbook));min-width:120px}
.ctbl tbody tr + tr > *,.ctbl thead + tbody tr:first-child > *{border-top:1px solid var(--rule)}
.ctbl td{border-left:1px solid var(--rule)}

/* comparison tables on a reader sheet */
.sb .ctbl,.sb .led{max-width:none;margin:0 0 10px}
.sb .ctbl table{font-size:calc(14.5px * var(--fz,1));line-height:1.35}
.sb .ctbl th,.sb .ctbl td{padding:6px 10px}

/* T-accounts inside a lesson (lesson field: tacc). Debits left, credits right, the balance under a rule on its own side. */
.tacc{margin:14px 0;max-width:840px}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:12px}
.tac{background:var(--bg-textbook);border:1.5px solid var(--rule);border-color:color-mix(in srgb,var(--acc,var(--a1)) 45%,var(--rule));border-radius:12px;padding:8px 10px 10px;font-size:calc(14.5px * var(--fz,1));line-height:1.35;font-variant-numeric:tabular-nums}
.tac p{margin:0!important}
.tac .tn{text-align:center;font:800 calc(15px * var(--fz,1)) var(--display);color:var(--acc,var(--a1));padding-bottom:5px;border-bottom:2.5px solid var(--ink)}
.tt,.tbal{display:grid;grid-template-columns:1fr 1fr}
.tt > div{padding:4px 0 6px;min-height:2.4em}
.tt .tdr{padding-right:8px}
.tt .tcr{padding-left:8px;border-left:2.5px solid var(--ink)}
.tsd{display:block;font:500 calc(11px * var(--fz,1)) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:2px}
.tcr .tsd{text-align:right}
.tac p:not(.tn){display:flex;justify-content:space-between;gap:8px;padding:2px 0}
.tac .ta{white-space:nowrap;font-weight:600}
.tbal{border-top:1.5px solid var(--ink)}
.tbal p{font-weight:800;padding-top:4px!important}
.tbal .bdr{grid-column:1;padding-right:8px}
.tbal .bcr{grid-column:2;padding-left:8px;border-left:2.5px solid var(--ink)}
.tbal .bdr span:first-child,.tbal .bcr span:first-child{color:var(--acc,var(--a1))}
.tacc.cont .cap::after{content:" (continued)"}
.sb .tacc{max-width:none;margin:0 0 10px}
.sb .tgrid{gap:10px}
.sb .tac{font-size:calc(13.5px * var(--fz,1));padding:6px 9px 8px}
/* CPA Notes. SEGMENT: ADMIN DASHBOARD (#/admin, built by assets/js/admin.js).
   Dense, data-first owner pages: collapsible sidebar, sticky top bar, cards, tables, charts, drawers.
   Colors come from the --adm-*, --ok, --warn and --bad tokens in 01-colors.css. Loads before 07-phone-print.css. */

html.adm-on header.top, html.adm-on footer{display:none}
html.adm-on body{background:var(--paper)}
html.adm-on #app{max-width:none;margin:0;padding:0}

.adm{display:flex;min-height:100vh;color:var(--ink);font-size:14px;line-height:1.45}
.adm *{box-sizing:border-box}
.adm button{font:inherit;color:inherit}
.ai{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.adm-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.adm-mute{color:var(--muted);margin:0}
.adm code{font-size:12.5px;background:var(--chip);padding:1px 5px;border-radius:5px}

/* sidebar */
.adm-side{position:sticky;top:0;height:100vh;width:232px;flex:none;display:flex;flex-direction:column;gap:4px;padding:14px 10px;background:var(--adm-side);border-right:1px solid var(--rule);transition:width .2s var(--ease)}
.adm[data-side="mini"] .adm-side{width:60px}
.adm-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 14px;font-weight:600;font-size:14px;white-space:nowrap}
.adm-brand b{color:var(--adm-acc);font-weight:700}
.adm-logo{width:26px;height:26px;flex:none}
.adm-nav{display:flex;flex-direction:column;gap:2px}
.adm-navi{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:8px;border:0;background:none;color:var(--muted);text-decoration:none;font-weight:500;cursor:pointer;white-space:nowrap;text-align:left}
.adm-navi:hover{background:var(--chip);color:var(--ink)}
.adm-navi[aria-current="page"]{background:var(--adm-acc-soft);color:var(--adm-acc)}
.adm-navi span{flex:1;overflow:hidden;text-overflow:ellipsis}
.adm-badge{font-style:normal;font-size:11px;font-weight:700;min-width:20px;padding:1px 6px;border-radius:99px;background:var(--warn-soft);color:var(--warn);text-align:center}
.adm-badge.bad{background:var(--bad-soft);color:var(--bad)}
.adm[data-side="mini"] .adm-navi span,.adm[data-side="mini"] .adm-brand span{display:none}
.adm[data-side="mini"] .adm-navi{position:relative;justify-content:center;padding:9px 0}
.adm[data-side="mini"] .adm-badge{position:absolute;top:2px;right:2px;min-width:16px;padding:0 4px;font-size:10px}
.adm-sidefoot{margin-top:auto;display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--rule);padding-top:8px}
.adm-scrim{display:none}

/* top bar */
.adm-main{flex:1;min-width:0;display:flex;flex-direction:column}
.adm-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;padding:10px 22px;background:var(--glass);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--rule)}
.adm-title{flex:1;min-width:0}
.adm-crumb{margin:0;font-size:11.5px;color:var(--muted);font-weight:500}
.adm-title h1{margin:0;font-size:18px;font-weight:650;letter-spacing:-.01em;line-height:1.2}
.adm-search{display:flex;align-items:center;gap:8px;width:280px;height:34px;padding:0 10px;border:1px solid var(--rule);border-radius:9px;background:var(--sheet);color:var(--muted);cursor:pointer}
.adm-search span{flex:1;text-align:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.adm-search kbd{font-family:inherit;font-size:11px;font-weight:600;line-height:1;padding:3px 5px;border:1px solid var(--rule);border-radius:5px;background:var(--chip)}
.adm-sel select{height:34px;padding:0 28px 0 10px;border:1px solid var(--rule);border-radius:9px;background:var(--sheet);color:var(--ink);font:inherit;font-weight:500;cursor:pointer}
.adm-ib{display:inline-grid;place-items:center;width:34px;height:34px;flex:none;border:1px solid var(--rule);border-radius:9px;background:var(--sheet);color:var(--ink);cursor:pointer}
.adm-ib:hover,.adm-search:hover{border-color:var(--muted)}
.adm-ib.sm{width:28px;height:28px;border-radius:7px}
.adm-ib[aria-pressed="true"]{background:var(--adm-acc-soft);color:var(--adm-acc);border-color:transparent}
.adm-menu{display:none}
.adm :focus-visible{outline:2px solid var(--adm-acc);outline-offset:2px}

/* body, cards, KPIs */
.adm-body{padding:20px 22px 48px;display:flex;flex-direction:column;gap:16px;max-width:1440px;width:100%}
.adm-body:focus{outline:none}
.adm-card{background:var(--sheet);border:1px solid var(--rule);border-radius:12px;padding:16px;min-width:0}
.adm-card.adm-flush{padding:0;overflow:hidden}
.adm-ch{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.adm-ch h2{margin:0;font-size:14.5px;font-weight:650}
.adm-ch .adm-mute{font-size:12.5px;margin-top:2px}
.adm-h2{display:flex;align-items:center;gap:8px;margin:6px 0 -4px;font-size:13px;font-weight:650;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.adm-kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.adm-kpi{padding:14px 16px}
.adm-kl{margin:0;font-size:12.5px;color:var(--muted);font-weight:500}
.adm-kv{margin:4px 0 2px;font-size:26px;font-weight:650;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.15}
.adm-ks{margin:0;font-size:12px;color:var(--muted)}
.adm-ks b{color:var(--ink)}
.adm-kpi.warnk{border-color:var(--warn)}
.adm-kpi.warnk .adm-kv{color:var(--warn)}
.adm-kpi.badk{border-color:var(--bad)}
.adm-kpi.badk .adm-kv{color:var(--bad)}
.adm-goal{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.adm-bar{height:6px;border-radius:99px;background:var(--chip);overflow:hidden;flex:1}
.adm-bar i{display:block;height:100%;border-radius:99px;background:var(--adm-acc)}
.adm-bar.warn i{background:var(--warn)}
.adm-bar.bad i{background:var(--bad)}
.adm-tl{display:inline-flex;align-items:center;gap:5px;padding:0;border:0;background:none;color:var(--adm-acc);font-size:12.5px;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.adm-tl:hover{text-decoration:underline}
.adm-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.adm-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.adm-tools{display:flex;align-items:center;gap:8px}

/* segmented buttons and pills */
.adm-seg{display:inline-flex;gap:2px;padding:2px;border-radius:9px;background:var(--chip)}
.adm-seg.wrap{flex-wrap:wrap}
.adm-seg button{border:0;background:none;padding:5px 10px;border-radius:7px;font-size:12.5px;font-weight:500;color:var(--muted);cursor:pointer;white-space:nowrap}
.adm-seg button em{font-style:normal;margin-left:4px;font-size:11.5px;opacity:.8;font-variant-numeric:tabular-nums}
.adm-seg button[aria-pressed="true"]{background:var(--sheet);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.adm-seg.sm{margin-bottom:10px}
.adm-pill{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;border-radius:99px;font-size:11.5px;font-weight:600;background:var(--chip);color:var(--muted);white-space:nowrap}
.adm-pill.ok{background:var(--ok-soft);color:var(--ok)}
.adm-pill.warn{background:var(--warn-soft);color:var(--warn)}
.adm-pill.bad{background:var(--bad-soft);color:var(--bad)}
.adm-pill.ok::before,.adm-pill.warn::before,.adm-pill.bad::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.adm-warnt{color:var(--warn)}

/* buttons and inputs */
.adm-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 12px;border:1px solid var(--rule);border-radius:9px;background:var(--sheet);color:var(--ink);font-size:13px;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.adm-btn:hover{border-color:var(--muted)}
.adm-btn:disabled{opacity:.45;cursor:default}
.adm-btn.pri{background:var(--adm-acc);border-color:var(--adm-acc);color:#fff}
.adm-btn.danger{color:var(--bad);border-color:var(--bad-soft);background:var(--bad-soft)}
.adm-btn.sm{height:28px;padding:0 9px;font-size:12px;border-radius:7px}
.adm-btn.wide{width:100%}
:root[data-theme="dark"] .adm-btn.pri{color:#0B1222}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .adm-btn.pri{color:#0B1222}}
.adm-in{width:100%;height:36px;padding:0 10px;border:1px solid var(--rule);border-radius:9px;background:var(--sheet);color:var(--ink);font:inherit}
.adm-in:focus{outline:2px solid var(--adm-acc);outline-offset:-1px;border-color:transparent}
.adm-lab{display:block;font-size:12.5px;font-weight:600;margin:0 0 6px}
.adm-acts{display:flex;flex-wrap:wrap;gap:8px}
.adm-acts.end{justify-content:flex-end;margin-top:16px}
.adm-acts.col{flex-direction:column;margin-top:16px}
.adm-acts.col .adm-btn{justify-content:flex-start}
.adm-rowacts{display:flex;gap:6px;justify-content:flex-end}
.adm-sbox{position:relative;display:flex;align-items:center;flex:1;min-width:200px;max-width:380px}
.adm-sbox .ai{position:absolute;left:10px;color:var(--muted)}
.adm-sbox .adm-in{padding-left:32px}
.adm-sbox.big{max-width:none}
.adm-sbox.big .adm-in{height:46px;font-size:15px;border:0;border-bottom:1px solid var(--rule);border-radius:0;outline:none}

/* tables */
.adm-bar2{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--rule)}
.adm-tw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.adm-t{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.adm-t th{text-align:left;font-size:12px;font-weight:600;color:var(--muted);padding:8px 12px;border-bottom:1px solid var(--rule);white-space:nowrap;background:var(--sheet)}
.adm-t td{padding:8px 12px;border-bottom:1px solid var(--rule);vertical-align:middle}
.adm-rows td:nth-child(n+2){white-space:nowrap}
.adm-t tbody tr:last-child td{border-bottom:0}
.adm-t tfoot td{border-top:1px solid var(--rule);border-bottom:0;font-weight:600}
.adm-t .r{text-align:right}
.adm-t th button{border:0;background:none;padding:0;font:inherit;color:inherit;cursor:pointer;display:inline-flex;gap:4px}
.adm-t th[aria-sort="ascending"],.adm-t th[aria-sort="descending"]{color:var(--ink)}
.adm-rows tbody tr{cursor:pointer}
.adm-rows tbody tr:hover,.adm-rows tbody tr:focus{background:var(--chip);outline:none}
.adm-rows tbody tr:focus-visible{box-shadow:inset 3px 0 0 var(--adm-acc)}
.adm-card .adm-tw{margin:0 -16px -16px}
.adm-card .adm-tw .adm-t th:first-child,.adm-card .adm-tw .adm-t td:first-child{padding-left:16px}
.adm-flush .adm-tw{margin:0}
.adm-pager{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-top:1px solid var(--rule);font-size:12.5px}
.adm-pager div{display:flex;gap:6px}
.adm-who{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:0;border:0;background:none;text-align:left;cursor:pointer}
.adm-who b{font-weight:600;font-size:13px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-who span{font-size:12px;color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
button.adm-who:hover b{color:var(--adm-acc)}
.adm-skill{white-space:nowrap}
.adm-skill span{display:inline-block;margin-left:8px;font-size:12px;color:var(--muted)}

/* trays and lists */
.adm-tray,.adm-meter,.adm-list,.adm-reads,.adm-trail,.adm-hist,.adm-pl,.adm-legend{list-style:none;margin:0;padding:0}
.adm-tray li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--rule)}
.adm-tray li:first-child{border-top:0;padding-top:0}
.adm-tray li>span:last-child{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex:none}
.adm-tray small{font-size:11.5px;color:var(--muted)}
.adm-meter li{display:grid;grid-template-columns:minmax(0,1.3fr) 1fr auto;align-items:center;gap:12px;padding:8px 0;border-top:1px solid var(--rule)}
.adm-meter li:first-child{border-top:0}
.adm-meter b{font-size:12.5px;font-variant-numeric:tabular-nums}
.adm-reads li{display:grid;grid-template-columns:56px minmax(0,1fr) 70px 40px;align-items:center;gap:10px;padding:6px 0;font-size:13px}
.adm-tc{display:flex;align-items:center;gap:6px;font-weight:700;font-size:12px;white-space:nowrap}
.adm-tc i{width:8px;height:8px;border-radius:2px;flex:none}
.adm-tt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-tb{height:6px;border-radius:99px;background:var(--chip);overflow:hidden}
.adm-tb i{display:block;height:100%;background:var(--adm-acc);border-radius:99px}
.adm-reads b{text-align:right;font-variant-numeric:tabular-nums}
.adm-list li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--rule);font-size:13px}
.adm-list li:first-child{border-top:0}
.adm-list span{color:var(--muted);font-size:12px;text-align:right}
.adm-hist li{position:relative;display:grid;grid-template-columns:90px 1fr;gap:12px;padding:0 0 14px 16px;font-size:13px}
.adm-hist li::before{content:"";position:absolute;left:0;top:6px;width:8px;height:8px;border-radius:50%;background:var(--rule)}
.adm-hist li.cur::before{background:var(--ok)}
.adm-hist li::after{content:"";position:absolute;left:3.5px;top:16px;bottom:0;width:1px;background:var(--rule)}
.adm-hist li:last-child::after{display:none}
.adm-hist time{color:var(--muted);font-variant-numeric:tabular-nums}
.adm-hist p{margin:0}
.adm-legend{display:flex;flex-wrap:wrap;gap:4px 14px;margin:-4px 0 8px;font-size:12px;color:var(--muted)}
.adm-legend li{display:flex;align-items:center;gap:6px}
.adm-legend i,.adm-tip i{display:inline-block;width:9px;height:9px;border-radius:2px}

/* charts */
.adm-multi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.adm-ml{margin:0 0 4px;font-size:12.5px;color:var(--muted)}
.adm-ml b{color:var(--ink);font-size:15px;margin-left:4px;font-variant-numeric:tabular-nums}
.adm-chart{position:relative;height:120px;touch-action:pan-y}
.adm-chart.tall{height:220px}
.adm-chart svg{display:block;overflow:visible}
.adm-chart:focus-visible{outline-offset:4px;border-radius:4px}
.adm-gl{stroke:var(--rule);stroke-width:1}
.adm-ax{fill:var(--muted);font-size:10.5px;font-variant-numeric:tabular-nums}
.adm-line{fill:none;stroke:var(--adm-acc);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.adm-area{fill:var(--adm-acc);opacity:.1}
.adm-cross{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3;opacity:0}
.adm-dot{fill:var(--adm-acc);stroke:var(--sheet);stroke-width:2}
.adm-band{fill:var(--chip)}
.adm-tip{position:absolute;top:-6px;z-index:5;transform:translateY(-100%);pointer-events:none;padding:7px 10px;border-radius:8px;background:var(--ink);color:var(--paper);font-size:12px;line-height:1.4;white-space:nowrap;box-shadow:var(--shadow)}
.adm-tip span{opacity:.75}
.adm-tip p{margin:2px 0 0;display:flex;align-items:center;gap:6px}
.adm-tip p b{margin-left:auto;padding-left:10px}

/* empty states, skeletons, notes */
.adm-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:36px 16px;color:var(--muted)}
.adm-empty .ai{width:28px;height:28px}
.adm-empty h2{margin:0;color:var(--ink);font-size:16px}
.adm-empty p{margin:0;max-width:420px;font-size:13px}
.adm-empty p b{color:var(--ink)}
.adm-empty.sm{flex-direction:row;text-align:left;padding:10px 0;gap:10px}
.adm-empty.sm .ai{width:20px;height:20px}
.ai.ok{color:var(--ok)}
.ai.bad{color:var(--bad)}
.adm-sk{height:12px;border-radius:6px;margin:6px 0;background:var(--chip);background-image:linear-gradient(90deg,transparent,rgba(127,127,127,.12),transparent);background-size:200% 100%;animation:admsk 1.3s linear infinite}
.adm-sk.big{height:28px;width:55%;margin:10px 0}
.adm-sk.chart{height:160px;margin-top:14px}
@keyframes admsk{from{background-position:200% 0}to{background-position:-200% 0}}
.adm-demo{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-radius:10px;background:var(--warn-soft);color:var(--warn);font-size:13px}
.adm-demo .ai{margin-top:2px}
.adm-demo p{margin:0}
.adm-note{font-size:12.5px;color:var(--muted);background:var(--chip);padding:8px 10px;border-radius:8px;margin:14px 0 0}
.adm-err{display:flex;align-items:center;gap:6px;color:var(--bad);font-size:13px;margin:8px 0 0}

/* sign-in gate */
.adm-gate{min-height:100vh;display:grid;place-items:center;padding:16px;background:var(--paper)}
.adm-gatecard{width:100%;max-width:400px;padding:24px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-lg)}
.adm-gatecard .adm-brand{padding:0 0 4px}
.adm-gatecard h1{margin:0;font-size:20px}
.adm-gatecard .adm-mute{font-size:13px}
.adm-link{display:inline-flex;align-items:center;gap:6px;justify-content:center;color:var(--muted);font-size:13px;text-decoration:none}

/* drawers, modals, palette, toasts */
.adm-ov{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60}
.adm-ov-s{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.35);opacity:0;transition:opacity .18s}
.adm-ov.in .adm-ov-s{opacity:1}
.adm-ov-p{position:absolute;background:var(--sheet);color:var(--ink);box-shadow:var(--shadow-lg);overflow:auto;transition:transform .22s var(--ease-out),opacity .18s}
.adm-ov-x{position:absolute;top:12px;right:12px;z-index:2}
.adm-drawer .adm-ov-p{top:0;right:0;bottom:0;width:min(520px,100%);padding:20px 22px 32px;border-left:1px solid var(--rule);transform:translateX(30px);opacity:0}
.adm-drawer.narrow .adm-ov-p{width:min(340px,100%)}
.adm-drawer.in .adm-ov-p{transform:none;opacity:1}
.adm-drawer h3{margin:20px 0 8px;font-size:13px;font-weight:650;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.adm-modal .adm-ov-p{top:14vh;left:50%;width:min(440px,calc(100% - 32px));margin-left:calc(min(440px,calc(100% - 32px)) / -2);padding:20px;border-radius:14px;border:1px solid var(--rule);transform:translateY(8px);opacity:0;max-height:76vh}
.adm-modal.in .adm-ov-p{transform:none;opacity:1}
.adm-modal h2{margin:0 0 6px;font-size:16px;padding-right:36px}
.adm-modal .adm-in{margin-top:12px}
.adm-pal .adm-ov-p{width:min(600px,calc(100% - 32px));margin-left:calc(min(600px,calc(100% - 32px)) / -2);padding:0}
.adm-pal .adm-ov-x{display:none}
.adm-pl{max-height:52vh;overflow:auto;padding:6px}
.adm-pl li{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13.5px}
.adm-pl li b{font-weight:500}
.adm-pl li span{margin-left:auto;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-pl li[aria-selected="true"]{background:var(--adm-acc-soft);color:var(--adm-acc)}
.adm-pl li.adm-mute{cursor:default}
.adm-id{display:flex;align-items:center;gap:14px;padding-right:40px}
.adm-id h2{margin:0;font-size:18px}
.adm-id p{margin:2px 0 0}
.adm-av{display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:50%;background:var(--adm-acc-soft);color:var(--adm-acc);font-weight:700;font-size:16px}
.adm-av .ai{width:22px;height:22px}
.adm-drawer .adm-acts{margin-top:16px}
.adm-dl{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:16px 0 0;background:var(--rule);border:1px solid var(--rule);border-radius:10px;overflow:hidden}
.adm-dl div{background:var(--sheet);padding:10px 12px}
.adm-dl dt{font-size:11.5px;color:var(--muted)}
.adm-dl dd{margin:2px 0 0;font-weight:600;font-variant-numeric:tabular-nums}
.adm-dl.one{grid-template-columns:1fr}
.adm-dl.one div{display:flex;justify-content:space-between;align-items:center;gap:10px}
.adm-dl.one dd{margin:0;font-weight:500;font-size:13px;text-align:right}
.adm-trail li{display:grid;grid-template-columns:64px 1fr;gap:10px;padding:7px 0;border-top:1px solid var(--rule);font-size:13px}
.adm-trail li:first-child{border-top:0}
.adm-trail time{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.adm-trail p{margin:0}
.adm-trail p span{font-size:12px;color:var(--muted)}
.adm-trail .t-limit b{color:var(--bad)}
.adm-trail .t-signup b{color:var(--ok)}
.adm-kill .adm-acts{margin-top:10px}
.adm-toasts{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.adm-toast{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;background:var(--ink);color:var(--paper);font-size:13px;box-shadow:var(--shadow-lg);animation:admin .2s var(--ease-out)}
.adm-toast .ai{color:var(--ok)}
.adm-toast.bad .ai{color:var(--bad)}
.adm-toast.out{opacity:0;transform:translateY(6px);transition:.3s}
@keyframes admin{from{opacity:0;transform:translateY(8px)}}
@media (prefers-reduced-motion: reduce){.adm-sk,.adm-toast{animation:none}.adm-ov-p,.adm-side{transition:none}}

/* tablet and phone */
@media (max-width:1180px){.adm-multi{grid-template-columns:repeat(2,minmax(0,1fr))}.adm-grid3{grid-template-columns:1fr}.adm-search{width:200px}}
@media (max-width:900px){
 .adm-side{position:fixed;left:0;z-index:70;width:248px;transform:translateX(-100%);transition:transform .22s var(--ease-out);box-shadow:var(--shadow-lg)}
 .adm[data-side="mini"] .adm-side{width:248px}
 .adm[data-side="mini"] .adm-navi span,.adm[data-side="mini"] .adm-brand span{display:inline}
 .adm[data-side="mini"] .adm-navi{justify-content:flex-start;padding:8px 10px}
 .adm[data-side="mini"] .adm-badge{position:static}
 .adm.navopen .adm-side{transform:none}
 .adm-scrim{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:65;background:rgba(0,0,0,.35)}
 .adm-scrim[hidden]{display:none}
 #admcol{display:none}
 .adm-menu{display:inline-grid}
 .adm-grid2{grid-template-columns:1fr}
 .adm-search{width:auto}
 .adm-search span,.adm-search kbd{display:none}
}
@media (max-width:640px){
 .adm-top{padding:8px 16px;flex-wrap:wrap}
 .adm-title{order:-1;flex-basis:calc(100% - 44px)}
 .adm-menu{order:-2}
 .adm-sel{flex:1}
 .adm-sel select{width:100%}
 .adm-body{padding:14px 16px 40px}
 .adm-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .adm-kv{font-size:22px}
 .adm-multi{grid-template-columns:1fr}
 .adm-ch{flex-wrap:wrap}
 .adm-in,.adm-sel select{font-size:16px}
 .adm-dl{grid-template-columns:repeat(2,1fr)}
 .adm-meter li{grid-template-columns:1fr auto}
 .adm-meter .adm-bar{grid-column:1 / -1;grid-row:2}
 .adm-reads li{grid-template-columns:52px minmax(0,1fr) 36px}
 .adm-reads .adm-tb{display:none}
 .adm-drawer .adm-ov-p{padding:18px 16px 28px}
 .adm-toasts{left:16px;right:16px}
}

/* owner sign-in extras */
.adm-alt{font-size:13px;color:var(--muted)}
.adm-alt summary{cursor:pointer;padding:4px 0}
.adm-alt[open]{display:flex;flex-direction:column;gap:8px}
.adm-pass{display:flex;flex-direction:column;gap:6px}
.adm-pass .adm-lab{margin:8px 0 0}
.adm-modal .adm-pass .adm-in{margin-top:0}
.adm-hint{font-size:12px}
/* CPA Notes. SEGMENT: PHONE AND TABLET SIZES, MOTION, PRINT.
   This file must load last, because it adjusts rules from the files before it. */

@media (prefers-reduced-motion: reduce){.fc .in,.btn,a.card,.chrow,.bookcard{transition:none}.heroart,.heroart .ph,.hero>div:first-child>*,.float{animation:none}.reveal{opacity:1;transform:none}}

/* tablet and below */
@media (max-width:900px){.founder{grid-template-columns:1fr}.fphoto{min-height:0;height:340px}.fphoto img{object-fit:contain;object-position:center bottom}.chrow{grid-template-columns:36px 1fr}.chs{grid-column:2;justify-content:flex-start;max-width:none}}
@media (max-width:900px){
 .hero{grid-template-columns:1fr;padding-block:36px 30px}.grid3,.kit{grid-template-columns:1fr 1fr}.law,.mentor{grid-template-columns:1fr}
 .facts{grid-template-columns:1fr 1fr}.fact:nth-child(3){border-left:0}.mn,.vid{grid-template-columns:1fr}
 .reader{grid-template-columns:1fr}.toc{position:static;max-height:none;display:flex;overflow-x:auto;gap:4px}.toc a{min-width:200px}
 .f1{left:0}.f2{right:0}
}

/* phone */
@media (max-width:560px){.heroart.wide .f2{display:none}.pill{white-space:normal}.hero{gap:36px}.facts{gap:10px}.fact{padding:18px 16px}.btn{padding:11px 20px}.band{border-radius:22px}.founder,.law{border-radius:22px}.fstats{grid-template-columns:1fr}.sc-grid b{font-size:26px}.fbody{padding:20px}}
@media (max-width:560px){
 .grid3,.kit{grid-template-columns:1fr}
 .page{padding:20px 16px 20px 30px}.page::before{left:16px}.fc{height:240px}.fc .face{font-size:21px}.userchip span.nm{display:none}
}

/* book covers, the reader, the exam and the AI panel on smaller screens */
@media (max-width:900px){.exintro{grid-template-columns:1fr}}
/* phones, including a phone with Safari's page zoom turned down: logo and tools on one line, the menu on its own line below, and each shelf of books as one row to swipe */
@media (max-width:700px){
 nav.main{margin-left:0;order:3;width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}nav.main::-webkit-scrollbar{display:none}nav.main a{white-space:nowrap}.tools{margin-left:auto}.bar{gap:8px 12px}
 .books{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;margin-inline:-20px;padding:4px 20px 14px;scrollbar-width:none}.books::-webkit-scrollbar{display:none}
 .bookcard{flex:0 0 44%;scroll-snap-align:start;scroll-margin-left:20px}.bookcard:hover{transform:none}
}
@media (max-width:460px){.bookcard{flex-basis:58%}}
/* the pinned header stays two slim rows on a phone: logo and buttons, then the menu */
@media (max-width:480px){
 .bar{gap:4px 8px;padding-block:8px}header.top.scrolled .bar{padding-block:4px}
 .logo{font-size:18px;gap:8px}.logo svg{width:30px;height:30px}
 .tools{gap:6px}.icon{width:34px;height:34px;border-radius:9px}.icon svg{width:16px;height:16px}
 .tools .btn.sm{padding:7px 11px;font-size:14px}
 .userchip{font-size:14px;gap:6px}.avatar{width:30px;height:30px;font-size:13px}
 nav.main a{padding:6px 11px}
}
@media (max-width:350px){.logo span{font-size:16px}.tools .btn.sm{padding:6px 9px;font-size:13px}.userchip .nm,.tools .su{display:none}}
/* tablets: logo and buttons on one row, the menu on a row of its own; small laptops: one tighter row */
@media (min-width:701px) and (max-width:900px){
 nav.main{margin-left:0;order:3;width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}nav.main::-webkit-scrollbar{display:none}nav.main a{white-space:nowrap}.tools{margin-left:auto}.bar{gap:6px 12px}
}
@media (min-width:901px) and (max-width:1100px){nav.main{gap:0}nav.main a{padding:8px 10px}.bar{gap:10px}}
html{scroll-padding-top:84px}
@media (max-width:700px){html{scroll-padding-top:110px}}
@media (max-width:900px){.mocks{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.mocks{grid-template-columns:1fr}.mcode{font-size:38px}}
@media (prefers-reduced-motion: reduce){.mock,.mgo i{transition:none}.mock:hover .mring{animation:none}}
@media (max-width:900px){.focus{grid-template-columns:1fr 1fr}.dhero,.dgrid{grid-template-columns:1fr}}
@media (max-width:560px){.pform{grid-template-columns:1fr}.dplan,.dguide{padding:16px}.resume{padding:16px;gap:12px}.rface{width:60px;height:60px}.rface svg{width:46px;height:46px}.phead{flex-wrap:wrap}.ptabs button{padding:8px 6px;font-size:13.5px}.pk{min-width:0}.ptask{gap:10px;padding:10px}.pdel{margin-left:0}.dguide ol{grid-template-columns:1fr}.pstats{grid-template-columns:1fr 1fr}.pochs a span{max-width:150px}.dstat{grid-template-columns:1fr 1fr}.dsoon{margin-top:-4px}.dsecd>summary small{flex-basis:100%}}
@media (prefers-reduced-motion: reduce){.rface,.rbub{animation:none}}
@media (max-width:560px){.tk{max-width:100%;gap:7px}.tkf{width:36px;height:36px}.tkb{font-size:14.5px;padding:6px 10px 7px}.dbody{padding:11px 12px 9px;font-size:14.5px}}
@media (max-width:560px){.toon{gap:11px}.tface{width:46px;height:46px}.tbub{font-size:14.5px;padding:8px 12px 9px}}
@media (max-width:560px){.focus{grid-template-columns:1fr}.dash{grid-template-columns:1fr 1fr}.dcard.big{grid-column:1 / -1}.ring{width:88px}.ring b{width:68px;font-size:19px}}
@media (max-width:560px){
 .chcover{padding:24px 16px 22px 24px}.cvnum b{font-size:64px}.cvtoc{grid-template-columns:1fr}
 .rdbar{gap:6px;padding:6px 8px}.rdtt,.rdfz{display:none}.rdnav button{padding:0 9px}.rdnav span{display:none}.rdpg input{width:44px}
 .rdscroll{padding:6px 5px 0}.sheet{padding:0 14px 0 20px;font-size:15px;font-size:calc(15px * var(--fz,1));height:calc(var(--rh,100vh) - 12px);margin-bottom:8px}.sheet::before{width:5px}
 h3.lt{font-size:16.5px;padding:8px 10px}.lh span:first-child{display:none}
 .gsec th,.gsec td{display:block;width:auto}.gsec tr + tr > td{border-top:0}.gsec th{padding-bottom:3px}
 .flow ol{flex-direction:column;gap:20px}.flow li{flex:none}.flow li:not(:last-child)::after{right:auto;left:26px;top:auto;bottom:-18px;transform:rotate(90deg)}
 .crow{grid-template-columns:1fr auto}.crow .cl{grid-column:1 / -1}
 .ctbl table{min-width:0;font-size:14px}.ctbl th,.ctbl td{padding:6px 8px}.ctbl tbody th{min-width:84px}
 .exscore{grid-template-columns:1fr}.exbar{gap:8px}.exbar span:not(.extime){display:none}.exbody .stem{font-size:17px}
 .extoolbar{order:3;width:100%}.extoolbar button{padding:5px 8px;font-size:12.5px}.extoolbar [data-split],.extoolbar [data-tool="exh"]{display:none}
 .extool,.extool.xsheet{left:8px !important;right:8px;width:auto;top:auto !important;bottom:calc(8px + env(safe-area-inset-bottom))}
 .extool.xexh{left:0 !important;right:0;top:0 !important;bottom:0;width:auto !important;height:auto !important;border-radius:0;border:0}
 .extool.xexh header{border-radius:0;padding-top:calc(8px + env(safe-area-inset-top))}.xexh [data-max],.xgrip{display:none}
 .exlinks{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:6px 8px}.exlinks button{flex:none;white-space:nowrap}.exlinks .xall{margin-left:0}.pdfpg{margin:8px;padding:14px 14px}
 .extool header{cursor:default}.sheetg{max-height:40vh}.sheetg input{width:84px}.exbar .expace + .extime{margin-left:auto}
 .exfoot{flex-wrap:nowrap;gap:6px;padding:8px 10px}.exfoot .btn{padding:9px 11px;font-size:14px;white-space:nowrap}.exflag{font-size:14px;gap:6px}.exflag span{display:none}
 .exbody{padding:14px 14px 18px}.exnav{max-height:76px;padding:6px 10px}
 .exbar{padding:7px 10px;row-gap:6px}.exbar b{font-size:14px}.exbar .extime{font-size:15px;padding:3px 8px}.exbar [data-quit]{padding:5px 10px;font-size:12.5px;min-height:0}
 .aip{right:0;bottom:0;width:100vw;border-radius:16px 16px 0 0;max-height:80vh;max-height:80dvh}
}

/* iPhone and iPad Safari.
   Text fields under 16px make Safari zoom the page when tapped, and it stays zoomed. Full-screen layers keep clear of the home bar and the notch. */
@media (max-width:900px){input,select,textarea{font-size:16px!important}}
@supports (padding:env(safe-area-inset-bottom)){
 body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
 .rd,.exam{padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
 .aip{padding-bottom:env(safe-area-inset-bottom)}
}
.rdscroll,.exbody,.ctbl,.tbswrap,.sheet.long .sb{-webkit-overflow-scrolling:touch}
button,a.btn,.tabs a,label.done,select{touch-action:manipulation}

/* the reader's contents become a drawer on tablets and phones */
@media (max-width:900px){.rdside{position:absolute;top:0;bottom:0;left:0;z-index:3;width:min(84vw,340px);max-width:none;min-width:0;display:block!important;transform:translateX(-103%);transition:transform .22s ease;box-shadow:12px 0 30px -12px rgba(0,0,0,.45)}.rd.rdopen .rdside{transform:none}.rd.rdopen .rdscrim{display:block;position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:rgba(10,16,26,.42)}.rdtt{max-width:40%}}
/* notes are read on screen only */
@media print{body > *{display:none!important}body::after{content:"CPA Notes can be read online at cpanotes.com. Printing is switched off.";display:block;padding:40px;font:600 18px sans-serif}}
/* tablets: logo and tools on one line, the menu on its own line below */
@media (max-width:900px){nav.main{margin-left:0;order:3;width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}nav.main::-webkit-scrollbar{display:none}nav.main a{white-space:nowrap}.tools{margin-left:auto}}