/* V33: a single reading axis, quieter references, and a clear example task. */
:root { --sp-section:clamp(72px,8vw,116px); --sp-head:clamp(28px,4vw,44px); }
.brand { gap:18px; }
.brand .word { display:inline; font-size:19px; font-weight:500; text-transform:none; letter-spacing:0; }
.brand .sep { display:block; }
.chapters a { flex-direction:row; align-items:center; gap:7px; padding:12px 9px; font-weight:500; }
.chapters a b { color:#ff8150; font-size:12px; }
.chapters a.active { background:rgba(255,255,255,.07); }
.navlinks .pill { font-weight:500; font-size:14px; letter-spacing:0; text-transform:none; padding:10px 16px; }
.hero .eye { display:flex; flex-wrap:wrap; align-items:center; gap:12px; font-weight:500; letter-spacing:.06em; }
.hero .eye a { color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; }
.hero .eye span { opacity:.5; }
.hero .lede { max-width:29em; }
.eye { font-size:13px; font-weight:600; letter-spacing:.08em; }
.ch-head > div { max-width:840px; }
.ch-head h2 { max-width:25ch; text-wrap:pretty; }
.ch-head .lede { max-width:38em; }
.v33-body { margin-top:20px; max-width:38em; font-size:18px; line-height:1.6; color:var(--char7); }
.v33-name { font-size:16px; color:var(--char5); margin-top:20px; max-width:40em; }
.v32-fragment { border:0; border-left:3px solid var(--ember); border-radius:0 16px 16px 0; padding:30px 36px; }
.v32-fragment .eye { color:var(--char5); }
.v32-fragment dl { margin-top:26px; padding-top:22px; }
.v32-memory-strip { gap:28px; padding:8px 0 24px; }
.v32-memory-strip > span { position:relative; padding-left:40px; }
.v33-memory-icon { position:absolute; left:0; top:1px; width:25px; height:25px; color:var(--char5); }
.v32-memory-strip > span:last-child .v33-memory-icon { color:var(--ember); }
.v32-memory-strip b { font-size:16px; }
.v32-fold { border-radius:10px; }
.v32-fold > summary { padding-top:19px; padding-bottom:19px; font-size:17px; }
.v32-fold > summary::after { top:15px; }
#story .head { text-align:left; max-width:760px; margin:0; }
#story .head .lede { color:rgba(255,255,255,.82); }
.v32-why .compare { gap:40px; margin:26px 0 34px; }
.v32-why .side { padding:22px 24px 24px; border:0; background:var(--ash); border-radius:12px; }
.v32-why .side.done { background:#fff5ed; }
.v32-why .side .eye { color:var(--char5); font-size:12px; margin-bottom:4px; }
.v32-why .side.done .eye { color:#ab3800; }
.v32-why .side q { font-size:clamp(21px,1.8vw,26px); line-height:1.4; }
.v32-why .v32-fold-body > h3 { font-size:28px; max-width:30ch; }
.v32-why .v32-fold-body > .lede { margin-bottom:30px; font-size:18px; }
.v33-timing-label { margin-top:28px; }
.v32-question { border-top:0; padding-top:12px; margin-top:28px; }
.v32-question .eye { color:var(--char5); }
.v32-example-top { gap:18px; }
.v32-stages button { min-width:136px; border-radius:8px; font-size:13px; }
.v32-stages button span { font-size:17px; }
.v32-flow-status { color:var(--char7); font-size:16px; min-height:54px; }
.v32-stage-panel { border-radius:16px; }
.v32-stage { padding:36px 40px; }
.v32-stage .ch-head .eye { color:var(--char5); }
.v32-stage.dark .ch-head .eye { color:rgba(255,255,255,.62); }
.v32-stage .ch-head .lede { font-size:18px; max-width:42em; }
.v32-stage .ch-head h3 { font-size:clamp(26px,2.5vw,34px); max-width:28ch; }
.v32-stage .loopgrid, .v32-stage .authgrid { display:block; max-width:none; }
.v32-capture .panel { padding:30px; border-radius:12px; min-height:0; }
.panel .pane:not(.sel) { display:none; }
.panel .pane.sel { display:flex; }
.panel .pane > h3 { font-size:24px; }
.panel .pane > p { max-width:43em; }
.panel .pane .whisper { gap:14px; }
.v32-confirm-actions { gap:12px; }
.v32-confirm-actions .ctrl, #accountEditor .ctrl { border-radius:999px; padding:11px 17px; }
.v32-confirm-actions button:disabled { opacity:.45; cursor:not-allowed; }
.v32-capture-controls { margin-top:22px; }
.v32-capture-controls .ctrl { padding:10px 18px; font-size:15px; }
.v32-account-status { max-width:48em; }
.v33-diagram { margin-top:28px; }
.v33-diagram .loopfig { max-width:360px; margin:0 auto; }
.v32-capture .v33-diagram { background:#333335; color:white; border-color:var(--lineD); }
.v32-capture .v33-diagram[open] > summary { border-color:var(--lineD); }
.v32-capture .v33-diagram > summary::after { color:var(--amber); }
.v33-diagram .ladderfig { max-width:880px; margin:0 auto; }
.v33-diagram .mladder { margin-top:0; }
.v32-confirmed-account { margin:0 0 24px; padding:22px 24px; font-size:19px; line-height:1.5; color:var(--char); border-left:3px solid var(--ember); border-radius:0 10px 10px 0; }
.v32-review .review .k { font-size:13px; color:var(--char5); margin-top:24px; margin-bottom:12px; }
.v32-review .outcomes { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.v32-review .outcomes button { margin:0; width:100%; border-radius:10px; padding:16px 14px; font-size:17px; line-height:1.3; }
.v32-review .outcomes small { font-size:13px; line-height:1.4; margin-top:7px; }
.v32-review .verdict { min-height:0; margin-top:24px; padding:22px 24px; background:var(--ash); border:0; border-radius:10px; font-size:17px; }
.v32-review .verdict b { font-weight:600; }
.v32-use .v32-case-label { font-size:16px; font-weight:500; }
.v32-use .v32-case-help { font-size:15px; margin-top:10px; }
.v32-use .diff { margin-top:28px; }
.v32-use .gsum { display:block; background:#343436; border-radius:12px; padding:26px; }
.v32-use .gsum .gr { border-top:1px solid var(--lineD); margin-top:22px; padding-top:22px; }
.v32-use .gsum .gr .k { font-size:13px; }
.gsum .v33-returned-account { color:#fff; font-size:20px; line-height:1.5; margin:0 0 18px; max-width:40em; }
.gsum ul { display:block; padding-left:19px; list-style:disc; }
.gsum li { border:0; padding:3px 0; border-radius:0; font-size:16px; }
.gsum li.none { list-style:none; margin-left:-19px; }
.v33-trace-link { margin:26px 0 0; font-size:16px; line-height:1.6; color:var(--char5); max-width:46em; }
.v33-trace-link a { color:var(--char7); text-underline-offset:4px; }
.v32-business { display:block; margin-top:38px; padding-top:34px; }
.v32-business h3 { max-width:33ch; font-size:clamp(26px,2.7vw,36px); }
.v32-business .btn { margin-top:24px; }
.v32-business .v33-body { max-width:41em; }
.papergrid { align-items:start; grid-template-columns:minmax(160px,250px) minmax(0,1fr); gap:50px; }
.papergrid .ptitle { font-size:clamp(25px,2.3vw,34px); }
.papergrid .ptitle i { color:rgba(255,255,255,.88); }
.papergrid .cover { box-shadow:none; }
.papergrid .btns { gap:16px 24px; margin-top:28px; }
.papergrid .link { font-size:16px; }
.read { align-items:start; line-height:1.45; }
.read b { font-weight:500; }
#paper #chap { margin:0 0 44px; padding:0 0 30px; border-top:0; border-bottom:1px solid var(--lineD); }
#paper #chap .subhead { margin-bottom:22px; }
#paper #chap .lede { max-width:48em; font-size:18px; line-height:1.6; }
#paper #chap h3 { font-size:28px; max-width:none; }
#paper #chap > .link { font-size:17px; }
#build .buildgrid { gap:40px; }
#build .links a { font-size:17px; }
.v33-record-origin { margin:20px 0 0; color:var(--char5); font-size:16px; max-width:48em; }
.faq { max-width:900px; }
.faq summary { font-size:20px; padding:22px 0; }
.faq details p { max-width:44em; font-size:17px; line-height:1.6; }
.closing { padding:clamp(70px,8vw,110px) 0; }
.closing h2 { max-width:19ch; font-size:clamp(36px,4vw,56px); }
.closing .lede { max-width:35em; }
@media (min-width:1100px) {
  .chapters { display:flex; }
  .burger { display:none; }
  .navlinks { margin-left:4px; }
}
@media (max-width:1099px) {
  .chapters { display:none; }
  .burger { display:inline-flex; }
  .navlinks { margin-left:auto; }
}
@media (max-width:1040px) {
  .hero { padding:0 0 56px; }
  .hero .photo,.hero .shade { height:clamp(220px,42vw,360px); }
  .hero .shade { background:linear-gradient(180deg,rgba(40,40,41,.12),rgba(40,40,41,0) 35%,rgba(40,40,41,.3) 72%,var(--char)); }
  .hero .wrap { margin-top:-12px; }
}
@media (max-width:800px) {
  .v32-stage { padding:28px; }
  .v32-review .outcomes { grid-template-columns:1fr 1fr; }
  .v32-why .compare { grid-template-columns:1fr; gap:16px; }
  .papergrid { grid-template-columns:minmax(120px,180px) minmax(0,1fr); gap:28px; }
  .papergrid .read { display:block; }
  .papergrid .read span { display:block; margin-top:3px; }
  .papergrid .pmeta { font-size:14px; }
  .v32-memory-strip { gap:22px; }
  .v32-stages button { min-width:0; }
}
@media (max-width:600px) {
  .nav .row { min-height:72px; gap:14px; }
  .brand { gap:14px; }
  .brand .word { font-size:18px; }
  .brand .bblogo { width:64px; flex-basis:64px; height:30px; }
  .brand .sep { height:28px; }
  .hero { padding-top:0; min-height:0; }
  .herotext { max-width:100%; }
  .hero h1 { font-size:clamp(38px,8.9vw,54px); max-width:13ch; }
  .hero .lede { font-size:19px; }
  .hero .eye { font-size:12px; }
  .v32-stage { padding:24px 18px; }
  .v32-capture .panel { padding:22px 18px; }
  .v32-stage .ch-head .lede { font-size:17px; }
  .v32-fragment { padding:26px 22px; }
  .v32-memory-strip > span { padding-left:0; padding-top:34px; }
  .v32-memory-strip b { font-size:16px; }
  .v32-memory-strip span { font-size:14px; }
  .v32-stages button { padding:11px 10px; }
  .v32-reset { max-width:52px; line-height:1.35; text-align:right; }
  .v32-confirmed-account { padding:18px; font-size:18px; }
  .v32-review .verdict { padding:18px; }
  .v32-use .gsum { padding:22px 18px; }
  .drow { grid-template-columns:minmax(0,1fr) 24px; gap:10px; padding:18px 0; }
  .drow.head { display:none; }
  .drow .dk { grid-column:1; grid-row:1; font-size:16px; color:#fff; }
  .drow .m { grid-column:2; grid-row:1; }
  .drow .req { grid-column:1 / -1; grid-row:2; font-size:15px; color:rgba(255,255,255,.75); }
  .drow .req::before { content:'Requires: '; color:rgba(255,255,255,.6); font-weight:400; }
  .drow .opts { grid-column:1 / -1; grid-row:3; }
  .gpill { min-height:36px; padding:7px 13px; }
  .v33-trace-link { font-size:15px; }
  .papergrid { grid-template-columns:1fr; }
  .papergrid > div:first-child { display:grid; grid-template-columns:110px 1fr; gap:20px; align-items:end; }
  .papergrid .cover { width:110px; }
  .papergrid .pmeta { display:block; margin:0; }
  .papergrid .pmeta span { display:block; }
  .faq summary { font-size:18px; }
  .v32-fold > summary { font-size:16px; }
  .v32-fold-body { padding:22px 18px; }
  .link { white-space:normal; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation:none!important; transition:none!important; }
}
@media print {
  .v32-stage-panel[hidden] { display:block!important; }
  .v32-stage-panel { break-inside:avoid; margin:20px 0; }
  .v32-stages,.v32-reset,.v32-confirm-actions,.v32-capture-controls,.v32-stage-actions { display:none; }
}

.about-page { background:#fff; }
.about-page .nav .row { max-width:1200px; }
.about-back { margin-left:auto; color:#fff; font-size:15px; text-decoration:none; text-underline-offset:5px; }
.about-back:hover { text-decoration:underline; }
.about-wrap { max-width:960px; margin:0 auto; padding:0 var(--pad); }
.about-intro { padding:clamp(64px,9vw,112px) 0 52px; }
.about-intro h1 { font-size:clamp(40px,5.8vw,68px); max-width:22ch; line-height:1.08; text-wrap:pretty; }
.about-prose { max-width:42em; font-size:18px; line-height:1.7; color:var(--char7); }
.about-prose p + p { margin-top:20px; }
.about-lead { margin-top:30px; font-size:21px; line-height:1.6; }
.about-section { border-top:1px solid var(--line); padding:44px 0 48px; }
.about-section > .eye { color:var(--char5); font-size:12px; margin-bottom:16px; }
.about-section h2 { font-size:clamp(28px,3vw,36px); max-width:26ch; line-height:1.2; margin-bottom:24px; text-wrap:pretty; }
.about-projects { margin:28px 0 0; }
.about-project { display:grid; grid-template-columns:145px minmax(0,1fr); gap:28px; padding:22px 0; border-top:1px solid var(--line); }
.about-project dt { font-size:20px; font-weight:500; color:var(--char); }
.about-project dt a { color:var(--char); text-decoration:underline; text-decoration-color:var(--ember); text-underline-offset:6px; text-decoration-thickness:1px; }
.about-project dd { margin:0; font-size:17px; line-height:1.65; color:var(--char7); }
.about-invitation { border-top:3px solid var(--ember); padding:36px 0 76px; }
.about-invitation h2 { font-size:clamp(28px,3vw,36px); max-width:26ch; margin-bottom:20px; }
.about-invitation p:not(.eye) { max-width:40em; font-size:18px; line-height:1.65; color:var(--char7); }
.about-invitation .btn { margin-top:26px; }
.about-footer { padding:30px 0; }
.about-footer .wrap { max-width:1200px; display:flex; align-items:center; gap:18px 28px; flex-wrap:wrap; }
.about-footer span { margin-left:auto; color:rgba(255,255,255,.65); font-size:14px; }
@media(max-width:600px) {
  .about-wrap { padding:0 24px; }
  .about-intro { padding-top:54px; padding-bottom:38px; }
  .about-lead { font-size:19px; }
  .about-section { padding:34px 0; }
  .about-prose { font-size:17px; }
  .about-project { grid-template-columns:1fr; gap:12px; }
  .about-footer span { width:100%; margin-left:0; }
  .about-page .brand .sep,.about-page .brand .word { display:none; }
}
