/* Long-form pages in the Paper look: the writing and the study guide keep their own layout and content; this sheet
   loads after their styles, tokens.css and pages.css. The title sits on a shader stage in dark glass (with the desk
   figure on its paper card), and the article reads on a calm light sheet: Inter, generous leading, hairline rules. */
:root{
  --sheet:#f6f4ef;
  --bg:#0b0b0f; --paper:#fffefb; --ink:#17151d; --muted:#4c4957; --line:rgba(23,21,29,.11); --line-strong:rgba(23,21,29,.22);
  --accent:#4a3bcf; --accent-dark:#33268f; --accent-soft:rgba(74,59,207,.07); --accent-2:#a8402a;
  --band:#efecfa; --soft:#f8f0e6; --white:#fffefb; --code:#1d1b26; --code-text:#f3f1ec; --code-bg:rgba(23,21,29,.065);
  --green:#0f5e4f; --green-2:#137561; --green-soft:#e3f1eb; --blue:#2b54b3; --blue-soft:#e8eefb;
  --gold:#835509; --gold-soft:#fbefd0; --red:#a1382e; --red-soft:#fae4e0; --purple:#5a44a4; --purple-soft:#eeeafa;
  --shadow:0 1px 0 rgba(255,255,255,.8) inset,0 20px 50px -34px rgba(20,18,30,.3);
}
/* the chrome is dark: the stage, the bars and the footer */
.p-stage,.p-foot,.p-read nav[aria-label="Primary"],.p-read .topbar{
  --ink:#f3f1ec; --muted:#cfccd8; --line:rgba(255,255,255,.12); --line-strong:rgba(255,255,255,.2); --paper:rgba(255,255,255,.05); --white:rgba(255,255,255,.06);
  --accent:#ffd447; --accent-dark:#ffe27c; --accent-soft:rgba(255,212,71,.1); --code:#f3f1ec; --green:#7be0b4; --green-2:#7be0b4; --gold-soft:rgba(255,212,71,.1)}

html:has(.p-read){background:#0b0b0f;scroll-padding-top:84px}
body.p-read{margin:0;background:#0b0b0f;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
:where(.p-read) :is(h1,h2,h3,h4){font-family:var(--sans)}
.p-read :is(code,pre,kbd,.formula){font-family:var(--mono)}
.p-read :focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}

/* ---------- bars ---------- */
.p-read :is(nav[aria-label="Primary"],.topbar){position:sticky;top:0;z-index:30;background:rgba(11,11,15,.93);border-bottom:1px solid var(--line);
  -webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3)}
.p-read .nav-inner,.p-read .topbar-inner{min-height:64px;padding:10px 0;gap:16px}
.p-read .topbar-inner{width:min(var(--max),calc(100% - 32px))}
.p-read .brand{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;min-width:44px;flex:none;color:var(--ink);font:600 14.5px/1 var(--sans);letter-spacing:-.01em;text-transform:none;white-space:nowrap;text-decoration:none}
.p-read .brand .p-mono{width:34px;height:34px;font-size:12.5px}
.p-read :is(.nav-links,.topbar .nav){display:flex;align-items:center;flex-wrap:wrap;gap:2px;min-width:0}
.p-read :is(.nav-links a,.topbar .nav a){display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:999px;color:var(--muted);
  font:500 13.5px/1 var(--sans);text-decoration:none;white-space:nowrap;transition:background .2s var(--ease),color .2s var(--ease)}
.p-read :is(.nav-links a,.topbar .nav a):hover{color:var(--ink);background:rgba(255,255,255,.08);text-decoration:none}
.p-read .print-button{min-height:44px;margin-left:6px;padding:0 16px;border:0;border-radius:999px;background:#f3f1ec;color:#0b0b0f;font:600 13.5px/1 var(--sans);cursor:pointer}
.p-read .print-button:hover{background:#fff}
.p-read .progress{height:3px;z-index:40;background:linear-gradient(90deg,#7be0b4,#5b8cff,#9f50d3)}
.p-read .skip-link{left:16px;top:-90px;width:auto;height:auto;overflow:visible;position:fixed;z-index:90;display:inline-flex;align-items:center;min-height:44px;
  padding:0 18px;border-radius:999px;background:#f3f1ec;color:#0b0b0f;font:600 14px/1 var(--sans)}
.p-read .skip-link:focus{left:16px;top:14px}

/* ---------- the stage: title in glass, the desk on its card ---------- */
.p-grain-violet,.p-grain-mint{--p-noise:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .7 -.08'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.p-grain-violet{background-color:#0b0b0f;background-image:var(--p-noise),
  radial-gradient(58% 82% at 100% 0%,#ffd447 0,#f75092 24%,rgba(115,0,255,.75) 44%,rgba(115,0,255,0) 72%),
  radial-gradient(50% 76% at 0% 100%,#ffd447 0,#f75092 20%,rgba(115,0,255,.7) 40%,rgba(115,0,255,0) 70%)}
.p-grain-mint{background-color:#04100e;background-image:var(--p-noise),
  radial-gradient(58% 82% at 100% 0%,#5b8cff 0,#7be0b4 24%,rgba(13,106,98,.8) 44%,rgba(13,106,98,0) 72%),
  radial-gradient(50% 76% at 0% 100%,#5b8cff 0,#7be0b4 20%,rgba(13,106,98,.75) 40%,rgba(13,106,98,0) 70%)}
.p-neuro{background-color:#07080f;background-image:radial-gradient(7% 11% at 84% 82%,rgba(223,233,255,.75) 0,rgba(223,233,255,0) 100%),
  radial-gradient(34% 46% at 84% 82%,rgba(91,140,255,.34) 0,rgba(91,140,255,.1) 46%,rgba(91,140,255,0) 72%),
  radial-gradient(80% 60% at 100% 100%,rgba(71,120,255,.14) 0,rgba(71,120,255,0) 70%),radial-gradient(60% 50% at 8% 0%,rgba(71,166,255,.14) 0,rgba(71,166,255,0) 70%)}
.p-read .p-stage{background:#0b0b0f}
.p-fx{position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none}
.p-fx>canvas{border-radius:inherit}
.p-read>main:has(>.p-stage){width:auto;max-width:none;margin:0;padding:0}
.p-read .p-stage{margin:12px 12px 0}
.p-band{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,440px);gap:clamp(16px,2.2vw,28px);align-items:start;
  width:min(1320px,100%);margin:0 auto;padding:clamp(6px,1.4vw,16px) clamp(14px,3.4vw,48px) clamp(16px,3.4vw,48px)}
.p-band.p-solo{grid-template-columns:minmax(0,860px) minmax(0,1fr);padding-top:clamp(28px,5vw,72px);padding-bottom:clamp(28px,6vw,96px)}
.p-read .p-band>:is(header,.hero){width:auto;margin:0;padding:clamp(24px,3.4vw,46px);border:0;border-radius:26px;background:rgba(11,11,15,.76);color:var(--ink);
  -webkit-backdrop-filter:blur(26px) saturate(1.2);backdrop-filter:blur(26px) saturate(1.2);box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 30px 80px -40px rgba(0,0,0,.9);min-width:0}
.p-band .container{max-width:none;padding:0;margin:0;width:auto}
.p-band .hero-grid{grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
.p-read .p-band :is(.kicker,.eyebrow){display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;color:#cfccd8;font:500 12px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.p-read .p-band :is(.kicker,.eyebrow)::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px var(--accent);flex:none}
.p-read .p-band h1{max-width:17ch;margin:0;font:600 clamp(2.4rem,4.1vw,4.1rem)/1 var(--sans);letter-spacing:-.045em;color:var(--ink);overflow-wrap:normal}
.p-read .p-band :is(.subtitle,.hero-copy,.lead){max-width:40em;margin:22px 0 0;color:#dcd9e4;font-size:clamp(1.02rem,1.3vw,1.18rem);line-height:1.62}
.p-read .p-band .hero-copy strong{color:#fff;font-weight:600}
/* writing tags and the reading map */
.p-read .p-band .meta{gap:8px;margin-top:24px}
.p-read .p-band .pill{min-height:32px;padding:0 12px;border:0;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:0 0 0 1px var(--line-strong) inset;
  color:#e6e3ee;font:500 11.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.p-read .p-band .reading-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:none;margin-top:28px}
.p-read .p-band .reading-map a{display:block;min-height:66px;padding:14px 16px;border:0;border-radius:16px;background:rgba(255,255,255,.06);box-shadow:0 0 0 1px var(--line) inset;
  color:#fff;font:600 15px/1.25 var(--sans);letter-spacing:-.01em;text-decoration:none;transition:background .2s var(--ease)}
.p-read .p-band .reading-map a:hover{background:rgba(255,255,255,.12)}
.p-read .p-band .reading-map span{margin-top:5px;color:var(--muted);font:400 12.5px/1.35 var(--mono);letter-spacing:0}
/* the quick facts */
.p-read .p-band .fact-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:0;border:0;border-top:1px solid var(--line);border-radius:0;background:none}
.p-read .p-band .fact{align-content:start;padding:18px 18px 4px 0;border:0}
.p-read .p-band .fact:nth-child(even){padding-left:18px;padding-right:0;border-left:1px solid var(--line)}
.p-read .p-band .fact span{color:var(--accent);font:500 11px/1.3 var(--mono);letter-spacing:.14em}
.p-read .p-band .fact strong{color:#e9e6f0;font-size:.95rem;font-weight:500;line-height:1.5;overflow-wrap:break-word}
/* the study guide's buttons and notice */
.p-read .p-band .hero-actions{gap:10px;margin-top:28px}
.p-read .p-band .button{min-height:48px;padding:0 20px;border:0;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:0 0 0 1px var(--line-strong) inset;
  color:#fff;font:600 15px/1.1 var(--sans);text-decoration:none;transition:background .2s var(--ease)}
.p-read .p-band .button:hover{background:rgba(255,255,255,.14);text-decoration:none}
.p-read .p-band .button.primary{background:#f3f1ec;color:#0b0b0f;box-shadow:none}
.p-read .p-band .button.primary:hover{background:#fff}
.p-read .p-band .notice{max-width:none;margin-top:28px;padding:14px 16px;border:0;border-radius:14px;background:rgba(255,212,71,.08);box-shadow:0 0 0 1px rgba(255,212,71,.24) inset;
  color:#efe7cf;font-size:.95rem;line-height:1.55}
.p-band>.p-card{margin:0}

/* ---------- the reading sheet ---------- */
.p-sheet{position:relative;margin:12px 12px 0;padding:clamp(12px,2.4vw,32px) clamp(4px,1.6vw,20px);border-radius:30px;background:var(--sheet);color:var(--ink);line-height:1.7}
.p-sheet.p-col{padding-inline:max(22px,calc((100% - 1060px) / 2))}
:where(.p-sheet) :where(p,li):where(:not(.toc *)){font-size:17px}
.p-read .p-sheet :is(.article-section,.section-card) :is(p,ul,ol){max-width:70ch}
.p-read .p-sheet :is(.article-section,.section-card) :is(.grid,.grid-2,.grid-3,.flow-chart,.metric-grid,.path,.question-list,.checklist) :is(p,ul,ol){max-width:none}
.p-read .p-sheet h2{font-weight:650;letter-spacing:-.03em;line-height:1.08}
.p-read .p-sheet section>h2,.p-read .p-sheet .section-head h2{font-size:clamp(1.75rem,2.8vw,2.45rem);margin-bottom:.7em}
.p-read .p-sheet h3{font-weight:650;letter-spacing:-.015em}
.p-read .p-sheet strong{font-weight:650}
.p-read .p-sheet a{color:var(--accent-dark);text-decoration:none}
.p-read .p-sheet :is(p,li,td,.answer) a{text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset:3px}
.p-read .p-sheet :is(p,li,td,.answer) a:hover{text-decoration-color:currentColor}
.p-read .p-sheet code{padding:.12em .38em;border-radius:6px;background:var(--code-bg);color:var(--ink);font-size:.86em}
.p-read .p-sheet .formula code{background:none;padding:0;color:inherit}
.p-read .p-sheet :is(.kicker,.eyebrow,.toc-title,.fact span,.flow-node span,.metric span,th,.tag,h4){font-family:var(--mono);letter-spacing:.1em}
.p-read .p-sheet :is(.eyebrow,.toc-title){font-size:.74rem;font-weight:500;color:var(--accent-dark)}
.p-read .p-sheet .lead{font-size:1.16rem;line-height:1.62;color:var(--ink)}
.p-read .p-sheet :is(.card,.step,.band,.callout,.formula,.quote,.flow-node,.metric,.mini-card,.diagram-wrap,.toc,.diagram,.math,details,.path-step,.check,table){border-radius:16px}
.p-read .p-sheet :is(.article-section,.section-card){border-radius:24px;border-color:var(--line);background:var(--paper)}
.p-read .p-sheet .section-card{box-shadow:var(--shadow)}
.p-read .p-sheet .quote{border-left-width:3px;border-left-color:var(--accent);border-radius:0 16px 16px 0;font:400 italic clamp(1.5rem,2.4vw,1.85rem)/1.3 var(--serif);letter-spacing:-.005em;color:var(--ink)}
.p-read .p-sheet .formula{border-left-color:var(--accent);font-size:.9rem}
.p-read .p-sheet .step .num{font-family:var(--mono);font-weight:600}
.p-read .p-sheet .step-number{border-radius:999px;font-family:var(--mono);font-weight:600}
.p-read .p-sheet .callout{border-color:var(--line)}
.p-read .p-sheet .diagram text{font-family:var(--sans)}
.p-read .p-sheet .toc{background:var(--paper);box-shadow:none}
.p-read .p-sheet .toc h2{font:500 .74rem/1.3 var(--mono);letter-spacing:.14em;color:var(--accent-dark);margin-bottom:.4rem}
.p-read .p-sheet aside.toc ol{gap:0;list-style-position:inside}
.p-read .p-sheet aside.toc li{margin:0}
.p-read .p-sheet aside.toc a,.p-read .p-sheet nav.toc a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);font-size:.92rem;line-height:1.25}
.p-read .p-sheet nav.toc a{display:flex}
.p-read .p-sheet .toc a{text-decoration:none}
.p-read .p-sheet .toc a:hover,.p-read .p-sheet .toc a.active{color:var(--accent-dark)}
.p-read .p-sheet details summary{min-height:44px}
.p-read .p-sheet table{border-color:var(--line)}
.p-read .p-sheet th{font-size:.72rem;font-weight:600}
.p-read .p-sheet .math{font-size:1.06rem}

/* ---------- footer ---------- */
.p-read .p-foot{width:auto;margin:0;padding:18px clamp(24px,3vw,40px) 26px;border:0;font-size:12.5px}
.p-read .p-foot p{max-width:none;margin:0;font-size:inherit;color:var(--muted)}

@media (max-width:980px){
  .p-band,.p-band.p-solo{grid-template-columns:minmax(0,1fr)}
  .p-band>.p-card{max-width:600px}
  /* one tidy bar: the name, then the section links scroll sideways */
  .p-read .nav-inner,.p-read .topbar-inner{flex-direction:row;align-items:center;min-height:60px;padding:8px 0;gap:6px}
  .p-read :is(.nav-links,.topbar .nav){flex:1;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;
    -webkit-mask:linear-gradient(90deg,transparent,#000 12px,#000 88%,transparent);mask:linear-gradient(90deg,transparent,#000 12px,#000 88%,transparent);padding-inline:10px}
  .p-read :is(.nav-links,.topbar .nav)::-webkit-scrollbar{display:none}
  .p-read :is(.nav-links a,.topbar .nav a,.print-button){flex:none}
}
@media (max-width:760px){
  .p-read .p-band .fact-strip{grid-template-columns:minmax(0,1fr)}
  .p-read .p-band .fact:nth-child(even){padding-left:0;border-left:0}
  .p-read .p-band .fact{padding:14px 0 0}
  .p-read .p-band .fact+.fact{border-top:1px solid var(--line);margin-top:12px}
}
@media (max-width:700px){
  html:has(.p-read){scroll-padding-top:72px}
  .p-read .p-stage{margin:8px 6px 0;border-radius:26px}
  .p-fx{bottom:auto;height:min(100%,880px);-webkit-mask:linear-gradient(#000 62%,transparent);mask:linear-gradient(#000 62%,transparent)}
  .p-band,.p-band.p-solo{padding:clamp(96px,28vw,132px) 8px 8px;gap:8px}
  .p-bar+.p-band{padding-top:56px}
  .p-read .p-band>:is(header,.hero){padding:26px 20px 24px;border-radius:22px}
  .p-read .p-band h1{font-size:clamp(2.05rem,9.6vw,2.7rem);line-height:1.02;letter-spacing:-.04em}
  .p-read .p-band :is(.kicker,.eyebrow){margin-bottom:16px;font-size:11px}
  .p-read .p-band :is(.subtitle,.hero-copy,.lead){margin-top:16px;font-size:1.02rem}
  .p-read .p-band .reading-map{grid-template-columns:minmax(0,1fr)}
  .p-read .p-band .hero-actions{flex-direction:column;align-items:stretch}
  .p-read .p-band .button{width:100%}
  .p-band>.p-card{padding:12px 10px 12px}
  .js .p-band .ink-mount:not(.ink-fig){padding-top:104px}
  .p-sheet,.p-sheet.p-col{margin:8px 6px 0;padding:8px 18px 20px;border-radius:24px;line-height:1.64}
  .p-read .p-sheet:has(.layout,.shell){padding-inline:0}
  :where(.p-sheet) :where(p,li):where(:not(.toc *)){font-size:16.5px}
  .p-read .p-sheet :is(.article-section,.section-card){padding:28px 6px 26px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;box-shadow:none;margin-bottom:0}
  .p-read .p-sheet .shell{width:auto;padding-inline:14px}
  .p-read .p-sheet .container{padding-inline:14px}
  .p-read .p-sheet .layout{padding-top:8px}
  .p-read .p-sheet .toc{margin-top:8px}
  .p-read .p-sheet .quote{font-size:1.45rem;padding:18px 20px}
  .p-read .p-sheet .lead{font-size:1.08rem}
  .p-read nav[aria-label="Primary"] .container{padding-inline:10px}
  .p-read .topbar-inner{width:calc(100% - 20px)}
  .p-read .p-foot{padding:14px 20px 22px}
}
@media (max-width:400px){
  .p-read .brand .p-name{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  .p-read :is(.nav-links a,.topbar .nav a,.reading-map a,.button){transition:none}
}
@media print{
  html:has(.p-read),body.p-read{background:#fff}
  .p-read .p-stage{margin:0;background:none;box-shadow:none}
  .p-read .p-fx,.p-read .p-card,.p-read .p-bar,.p-read .p-foot,.p-read nav[aria-label="Primary"]{display:none!important}
  .p-read .p-band{display:block;padding:0}
  .p-read .p-band>:is(header,.hero){background:none;box-shadow:none;padding:0 0 20px;-webkit-backdrop-filter:none;backdrop-filter:none}
  .p-read .p-stage{--ink:#000;--muted:#333;--accent:#333}
  .p-read .p-band :is(h1,.subtitle,.hero-copy,.lead,.fact strong,.notice,.reading-map a){color:#000!important}
  .p-sheet{margin:0;padding:0;border-radius:0;background:#fff}
}