/* self-hosted fonts (site/fonts/): Fraunces for display, Source Serif 4 for everything else —
   variable weight, latin subset, font-display swap so text never waits on the font.
   No italic faces are shipped: every em/i in the product is set to font-style:normal, so a
   browser would never fetch an italic file — the upright faces are the only ones that render. */
@font-face{font-family:Fraunces;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/Fraunces-latin.woff2) format('woff2')}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/SourceSerif4-latin.woff2) format('woff2')}
:root{--canvas:#f5f3ed;--paper:#fffefa;--paper2:#f0efe7;--ink:#202a23;--muted:#5b645d;--faint:#656e67;--forest-text:#294637;--gold-text:#816740;--rose-text:#7a503e;--blue-text:#46586a;--line:#e3e1d7;--forest:#294637;--forest2:#3f624d;--sage:#dfe8dc;--sage2:#edf2e9;--gold:#b28d53;--goldbg:#f4eddf;--rose:#f1e3dc;--blue:#e4eaf0;--shadow:0 18px 50px #1f2c2410;--r:22px;--focus-ring:#4f6b52;--font-display:"Fraunces","Noto Serif SC",Georgia,"Times New Roman",serif;--font-body:"Source Serif 4",Georgia,serif;--ring-fill:#6e8d70;--ring-track:#e4e6db;--bar-zero:#c07a6a;--glass:#fbfaf5ed;--deep-line:#d5dfd0;--link-line:#cbd7c7;--link-line2:#7e997d;--node-fill:#eef2ea;--node-line:#8fa58c;--radar-ring:#dfe4d9;--radar-shape:#6f8d73;--radar-spoke:#e6e9e1;--spark:#8ba589;--rose-line:#dcc3b8}
/* ── dark mode: respects system preference + manual toggle via .dark class ── */
@media(prefers-color-scheme:dark){:root:not(.light){--canvas:#141a15;--paper:#1c231d;--paper2:#181e19;--ink:#d4dcd2;--muted:#8a978e;--faint:#828f86;--focus-ring:#9ab49c;--line:#2d3830;--forest:#4a7b5c;--forest-text:#7fb894;--forest2:#5c9a72;--sage:#2d3a31;--sage2:#242e26;--goldbg:#3a3328;--rose:#3a2e2a;--blue:#2a343c;--shadow:0 18px 50px #00000060;background:#0f1411;--ring-track:#2d3830;--bar-zero:#c07a6a;--glass:#19201ae6;--deep-line:#38443b;--link-line:#3a4a3e;--link-line2:#6b8a72;--node-fill:#242e26;--node-line:#74907d;--radar-ring:#33403a;--radar-shape:#5c9a72;--radar-spoke:#2d3830;--spark:#84a389;--rose-line:#5c443c}}
:root.dark{--canvas:#141a15;--paper:#1c231d;--paper2:#181e19;--ink:#d4dcd2;--muted:#8a978e;--faint:#828f86;--focus-ring:#9ab49c;--line:#2d3830;--forest:#4a7b5c;--forest-text:#7fb894;--forest2:#5c9a72;--sage:#2d3a31;--sage2:#242e26;--goldbg:#3a3328;--rose:#3a2e2a;--blue:#2a343c;--shadow:0 18px 50px #00000060;--ring-track:#2d3830;--bar-zero:#c07a6a;--glass:#19201ae6;--deep-line:#38443b;--link-line:#3a4a3e;--link-line2:#6b8a72;--node-fill:#242e26;--node-line:#74907d;--radar-ring:#33403a;--radar-shape:#5c9a72;--radar-spoke:#2d3830;--spark:#84a389;--rose-line:#5c443c}
html.dark body{background:#0f1411!important}
html.dark body .sidebar{background:#19201a;border-right-color:#2d3830}
html.dark body .topbar{background:#19201a;border-bottom-color:#2d3830}
/* components painted with literal light colors above need matching dark values;
   the html.dark body prefix outranks every single-class light rule */
html.dark body .navbtn{color:#9aa79d}
html.dark body .navbtn:hover{background:#212a23}
html.dark body .navbtn.active{background:#242e26}
html.dark body .quota-mini{background:#1c231d}
html.dark body .track{background:#2d3830}
html.dark body .crumb b{color:#c3d2c5}
html.dark body .iconbtn{color:#9aa79d}
html.dark body .stat{background:#1c231d}
html.dark body .pill.neutral{background:#242e26}
html.dark body .next-card{border-bottom-color:#26302a}
html.dark body .quote-card{background:#1f2620}
html.dark body .focusitem{background:#1c231d}
html.dark body .segmented{background:#242e26}
html.dark body .segmented button.active{background:#1c231d}
html.dark body .topic.selected{background:#26332a;border-color:#4a6b4d;box-shadow:inset 0 0 0 1px #3f5a44}
html.dark body .topic:hover{border-color:#4a5f4d}
html.dark body .input,html.dark body .textarea,html.dark body .select{border-color:#3a463c;background:#1a211b}
html.dark body .chip{background:#202822;border-color:#3a463c;color:#9aa79d}
html.dark body .chip:hover,html.dark body .chip.active{border-color:#4a6b4d;background:#242e26;color:#c3d2c5}
html.dark body .message.assistant{background:#232d25;border-color:#324035}
html.dark body .message .evidence-tag{border-color:#3a4a3e}
html.dark body .composer{background:#1c231ded}
html.dark body .progresssteps span{background:#2d3830}
html.dark body .insight-head{background:#232d25;border-color:#324035}
html.dark body .hypothesis.primary{background:#26332a;border-color:#3a4a3e}
html.dark body .hypothesis.primary .hyp-choose{color:#d4dcd2}
html.dark body .hyp-choose{border-color:#3a463c}
html.dark body .hypothesis:hover .hyp-choose,html.dark body .hypothesis:focus-visible .hyp-choose{border-color:#4a5f4d}
html.dark body .feedbackbar button{background:#1c231d;color:#9aa79d}
html.dark body .feedbackbar button.active{background:#242e26;border-color:#4a6b4d}
html.dark body .timeline:before{background:#2d3830}
html.dark body .timeline-item:before{border-color:#4a7b5c}
html.dark body .compare td{border-bottom-color:#26302a}
html.dark body .settingrow{border-bottom-color:#26302a}
html.dark body .switch{background:#3a463c}
html.dark body .drawer{background:#19201a}
html.dark body .draweritem:hover{background:#212a23}
html.dark body .drawerfooter{background:#1c231d;color:#8a978e}
html.dark body .grab{background:#3a463c}
html.dark body .mobile-nav{background:#19201aed}
html.dark body .mobile-nav button.active{background:#242e26}
html.dark body .report-ready{background:#1c231d;border-color:#324035}
html.dark body .hyp-proof{border-top-color:#26302a}
html.dark body .nextsteps .soft{border-top-color:#26302a}
html.dark body .gate .textarea{background:#1a211bf2;border-color:#3a463c}
html.dark body .linkmap{background:#1c231d}
html.dark body .order-row{border-bottom-color:#26302a}
html.dark body .depth-against{border-top-color:#26302a}
html.dark body #foldEvidence .orig-quote{border-bottom-color:#26302a}
html.dark body .user-mini>#miniGo:hover{background:#212a23}
html.dark body .avatar{background:#2a352c}
html.dark body .avatar.clay{background:#3f3733}
html.dark body .avatar.slate{background:#323b40}
html.dark body .avatar.honey{background:#3d3728}
html.dark body .avatar.moss{background:#2c3a2e}
html.dark body .avatar.plum{background:#3a3238}
html.dark body .btn.outline{border-color:#3a463c}
html.dark body .mini-line .line{background:#2d3830}
html.dark body .archive-card:hover{border-color:#4a5f4d}
html.dark body .progressring{background:conic-gradient(var(--ring-fill) 0 var(--ring-pct,0%),var(--ring-track) var(--ring-pct,0%) 100%)}
html.dark body .barrow .bar{background:#2d3830}
html.dark body .callout{background:#1c231d}
html.dark body .process-hero{background:#232d25;border-color:#324035}
html.dark body .process-step{border-top-color:#2d3830}
html.dark body .process-step .stepnum{background:#2a352c}
html.dark body .auth-err{background:#33272a;border-color:#52413c}
html.dark body .taskfail{background:#33272a;border-color:#52413c}
html.dark body .offlinewarn{background:#332e24;border-color:#524531}
html.dark body .ledger td{border-bottom-color:#26302a}
html.dark body .be-badge{background:#3a3328;border-color:#524531}
html.dark body .be-panel{background:#1c231d}
html.dark body .be-log{background:#181e19}
html.dark body .axis-row{border-bottom-color:#26302a}
html.dark body .api-gate{background:#1c231d;border-color:#524531}
html.dark .demo-banner{background:#242e26}
html.dark body .pack{background:#1c231d}
html.dark body .oauth button{border-color:#3a463c}
html.dark body .ob-legal{border-top-color:#2d3830}
html.dark body .ob-legal a,html.dark body .consent a{border-bottom-color:#4a5f4d}
html.dark body .gate-stage{background:#181e19}
html.dark body .tstate.done{background:#26332a}
html.dark body .ob-dots i{background:#3a463c}
html.dark body .notif.read .dot{background:#3a463c}
html.dark body .plan-card.here{border-color:#4a5f4d;background:#1c231d}
html.dark body .plan-card.best{border-color:#4a5f4d}
html.dark body .caps li.off:before{color:#55605a}
html.dark body .guided-fold>summary{color:#7ea887}
html.dark body .pattern.flash{box-shadow:0 0 0 3px #5c9a7259}
html.dark body .pf-marks button[aria-pressed=true]{box-shadow:0 0 0 2px #4a7b5c}
html.dark body .rail button:hover{border-color:#4a5f4d}
html.dark body .link-node:hover circle{fill:#2d3a31}
:root.dark{--gold-text:#d3b582;--rose-text:#d8a08c;--blue-text:#93b0c8}
@media(prefers-color-scheme:dark){:root:not(.light){--gold-text:#d3b582;--rose-text:#d8a08c;--blue-text:#93b0c8}}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#e7e6df;color:var(--ink);font-family:var(--font-body);letter-spacing:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}button:disabled{opacity:.45;cursor:not-allowed}.app{min-height:100dvh;max-width:1440px;margin:auto;background:var(--canvas);display:grid;grid-template-columns:244px minmax(0,1fr);box-shadow:0 0 70px #1c292411}.sidebar{background:#fbfaf5;border-right:1px solid var(--line);padding:28px 16px 20px;display:flex;flex-direction:column;min-height:100dvh;position:sticky;top:0;height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.brand{display:flex;align-items:center;gap:11px;padding:0 10px 28px}.brandmark{height:38px;width:38px;border-radius:13px;background:var(--forest);display:grid;place-items:center;color:#f8f6ee;font-size:23px;position:relative;overflow:hidden}.brandmark:after{content:"";position:absolute;width:45px;height:45px;border:1px solid #ffffff75;transform:rotate(45deg);border-radius:8px}.brandname{font-size:16px;font-weight:760;letter-spacing:.06em}.brandname small{display:block;font-size:9px;letter-spacing:.18em;color:var(--faint);font-weight:600;margin-top:4px}.navlabel{font-size:10px;color:var(--faint);letter-spacing:.14em;text-transform:uppercase;padding:0 12px;margin:14px 0 8px}.navbtn{border:0;background:transparent;color:#5f6a60;width:100%;padding:12px 13px;min-height:44px;display:flex;align-items:center;gap:12px;border-radius:13px;text-align:left;font-size:13px;margin:2px 0;transition:.18s}.navbtn .ico{width:22px;font-size:17px;text-align:center;color:var(--forest2)}.navbtn:hover{background:#f1f2eb}.navbtn.active{background:#e7eee4;color:var(--forest-text);font-weight:750}.navbtn.active .ico{color:var(--forest-text)}.navdivider{height:1px;background:var(--line);margin:16px 10px}.sidebar-bottom{margin-top:auto}.quota-mini{margin:16px 4px 12px;background:#f2f1e9;border:1px solid var(--line);border-radius:17px;padding:15px}.quota-mini .qtop{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.quota-mini strong{font:500 23px var(--font-display);display:block;margin:10px 0 8px}.track{height:4px;background:#dedfd4;border-radius:9px;overflow:hidden}.track i{display:block;height:100%;width:0;background:#6f8d73;border-radius:9px}.track i.is-zero{background:var(--bar-zero)}.quota-mini button{border:0;background:none;padding:11px 0 0;color:var(--forest-text);font-size:11px;font-weight:750;position:relative}.quota-mini button:before{content:"";position:absolute;inset:-6px -4px}.user-mini{display:flex;gap:10px;align-items:center;padding:12px 9px 2px}
/* the corner of the app is where you check which account you are in, and it should take you there */
.user-mini>#miniGo{display:flex;gap:10px;align-items:center;min-width:0;border:0;background:transparent;padding:0;cursor:pointer;text-align:left;border-radius:12px}
.user-mini>#miniGo:hover{background:#f0f1e9}
.user-mini>#miniGo .mini-txt{min-width:0}
.user-mini>#miniGo b,.user-mini>#miniGo small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-mini>#openMore{margin-left:auto;border:0;background:transparent;color:var(--muted);font-size:18px;cursor:pointer}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#dfe6da;color:var(--forest-text);font:600 15px var(--font-display)}.user-mini b{display:block;font-size:11px}.user-mini small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.maincol{min-width:0}.topbar{height:74px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,54px);background:#f8f7f1d9;backdrop-filter:blur(14px);position:sticky;top:0;z-index:8}.crumb{font-size:11px;color:var(--faint)}.crumb b{color:#35443a;font-weight:700}.top-actions{display:flex;align-items:center;gap:10px}.iconbtn{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:#5f6b60;display:grid;place-items:center;font-size:16px;position:relative}.notifdot{position:absolute;right:7px;top:7px;width:6px;height:6px;border-radius:50%;background:#c59e5d;border:1px solid var(--paper)}.mobile-brand{display:none}.content{max-width:1120px;padding:36px clamp(18px,4vw,56px) 80px;margin:0 auto}.screen{display:none;animation:rise .24s ease}.screen.active{display:block}@keyframes rise{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}.eyebrow{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--forest2);font-weight:760}.title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:9px 0 10px}.h1{font:500 clamp(29px,3.3vw,43px)/1.2 var(--font-display);letter-spacing:-.045em;margin:0}.lede{font-size:13px;line-height:1.85;color:var(--muted);max-width:650px;margin:10px 0 0}.h2{font-size:17px;font-weight:690;margin:0}.h3{font-size:13px;font-weight:750;margin:0}.sectionhead{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:31px 0 14px}.sectionhead p{font-size:11px;color:var(--muted);margin:5px 0 0}.textbtn{border:0;background:transparent;color:var(--forest-text);font-size:12px;font-weight:750;padding:8px 10px;position:relative}.textbtn:before{content:"";position:absolute;inset:-6px -4px}.clickable{cursor:pointer}.clickable:hover .arrow{color:var(--forest-text)}.btn{border:1px solid transparent;background:var(--forest);color:#fffdf7;border-radius:999px;padding:12px 18px;font-size:11px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .15s,background .15s}.btn:hover{background:#365842;transform:translateY(-1px)}.btn.secondary{background:var(--sage);color:var(--forest-text)}.btn.outline{background:transparent;border-color:#d6d8cd;color:var(--ink)}.btn.ghost{background:transparent;color:var(--forest-text);border-color:transparent}.btn.small{padding:11px 15px;font-size:11px;min-height:40px}.btn.full{width:100%}.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:0 3px 12px #25332804}.panel.flat{box-shadow:none}.grid{display:grid;gap:16px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.main-side{grid-template-columns:minmax(0,1.45fr) minmax(270px,.8fr)}.hero{background:var(--forest);color:#f9f7ef;border-radius:27px;padding:clamp(23px,3vw,38px);position:relative;overflow:hidden;min-height:278px;display:flex;align-items:center}.hero:before,.hero:after{content:"";position:absolute;border:1px solid #d9e7d526;border-radius:50%;width:270px;height:270px;right:-60px;top:-60px;box-shadow:0 0 0 30px #ffffff05,0 0 0 60px #ffffff04}.hero:after{width:170px;height:170px;right:-12px;top:-10px;border-color:#d9e7d53c}.hero-copy{max-width:530px;position:relative;z-index:1}.hero .eyebrow{color:#bdcfbb}.hero h2{font:500 clamp(27px,3vw,38px)/1.35 var(--font-display);margin:16px 0 10px;letter-spacing:-.035em}.hero p{color:#d0ddd0;font-size:12px;line-height:1.9;max-width:450px;margin:0 0 20px}.hero .btn{background:#f4f2e9;color:var(--forest-text)}.hero-orbit{position:absolute;right:11%;bottom:25px;width:115px;height:115px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#f0e3c2 0,#a8bea4 28%,#55765d 59%,#294637 76%);box-shadow:0 0 0 14px #ffffff08,0 0 55px #dce9c61b}.hero-orbit:before,.hero-orbit:after{content:"";position:absolute;inset:-18px;border:1px solid #e2eddd38;border-radius:50%;transform:rotate(35deg) scaleX(.55)}.hero-orbit:after{transform:rotate(-35deg) scaleX(.55)}.statrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}.stat{border:1px solid var(--line);background:#fbfaf5;border-radius:18px;padding:16px 18px}.stat .label{font-size:10px;color:var(--muted)}.stat strong{display:block;font:500 26px var(--font-display);margin:10px 0 4px}.stat small{font-size:10px;color:var(--muted)}.stat small em{font-style:normal;color:var(--forest2)}.split{display:flex;align-items:center;justify-content:space-between;gap:12px}.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;background:var(--sage2);color:#4d6650;padding:6px 9px;font-size:10px;font-weight:700}.pill.gold{background:var(--goldbg);color:var(--gold-text)}.pill.rose{background:var(--rose);color:var(--rose-text)}.pill.blue{background:var(--blue);color:var(--blue-text)}.pill.neutral{background:#eeeee8;color:var(--muted)}.dot{width:6px;height:6px;border-radius:50%;background:#7f9b7e}.rule{height:1px;background:var(--line);margin:17px 0}.next-card{display:flex;align-items:flex-start;gap:14px;padding:15px 0;border-bottom:1px solid #eeece4}.next-card:last-child{border-bottom:0;padding-bottom:0}.symbol{height:40px;width:40px;border-radius:14px;display:grid;place-items:center;background:var(--sage2);color:var(--forest-text);font-size:18px;flex-shrink:0}.symbol.gold{background:var(--goldbg);color:var(--gold-text)}.symbol.rose{background:var(--rose);color:var(--rose-text)}.next-card b{font-size:12px;display:block;margin:2px 0 5px}.next-card p{font-size:11px;line-height:1.75;color:var(--muted);margin:0}.next-card .arrow{margin-left:auto;color:var(--faint);padding:4px}.quote-card{background:#f0eee5;border-radius:19px;padding:21px;position:relative}.quote-card blockquote{font:500 21px/1.65 var(--font-display);margin:11px 0 15px;letter-spacing:-.035em}.quote-card small{font-size:10px;color:var(--faint)}.mini-line{display:flex;align-items:center;gap:10px;font-size:10px;color:var(--muted);margin:11px 0}.mini-line .line{height:1px;flex:1;background:#d7dbd0}.focuslist{display:grid;gap:10px}.focusitem{display:flex;gap:12px;padding:13px;border:1px solid var(--line);border-radius:15px;background:#fffefa;align-items:flex-start}.focusitem .num{font:500 18px var(--font-display);color:var(--forest2);flex-shrink:0;min-width:2ch;font-variant-numeric:tabular-nums}.focusitem b{font-size:11px;display:block;margin:1px 0 4px}.focusitem p{font-size:11px;line-height:1.7;color:var(--muted);margin:0}.segmented{display:inline-flex;gap:3px;background:#eeeee7;border-radius:12px;padding:4px}.segmented button{border:0;background:transparent;color:var(--muted);border-radius:9px;padding:9px 14px;font-size:11px;min-height:44px}.segmented button.active{background:var(--paper);color:var(--forest-text);box-shadow:0 1px 4px #1e2d220d;font-weight:750}.topicgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:21px 0}.topic{border:1px solid var(--line);background:var(--paper);border-radius:19px;padding:19px;text-align:left;min-height:153px;color:var(--ink);transition:.18s;position:relative}.topic:hover{border-color:#b7c8b5;transform:translateY(-2px);box-shadow:var(--shadow)}.topic.selected{border-color:#7e9a7d;background:#eff4ec;box-shadow:inset 0 0 0 1px #9bb29a}.topic .topic-icon{font-size:22px;display:block;margin-bottom:17px;color:var(--forest2)}.topic b{display:block;font-size:13px;margin-bottom:7px}.topic p{font-size:11px;color:var(--muted);line-height:1.7;margin:0}.topic .check{position:absolute;right:14px;top:14px;color:var(--forest-text);display:none}.topic.selected .check{display:block}.fieldlabel{font-size:12px;font-weight:750;display:block;margin:18px 0 8px}.input,.textarea,.select{width:100%;border:1px solid #dcded4;background:#fffefa;border-radius:14px;padding:13px 14px;color:var(--ink);font-size:12px;line-height:1.8}.textarea{min-height:128px;resize:vertical}.input::placeholder,.textarea::placeholder{color:var(--faint)}.fieldhelp{font-size:11px;color:var(--muted);line-height:1.7;margin-top:7px}.promptchips{display:flex;flex-wrap:wrap;gap:8px;margin:11px 0}.chip{border:1px solid #dfe1d7;border-radius:999px;background:#fbfaf6;color:#5f6c60;padding:10px 14px;font-size:11px;min-height:40px}.chip:hover,.chip.active{border-color:#9bb19a;background:#edf2e9;color:var(--forest-text)}.session-layout{display:grid;grid-template-columns:minmax(0,1fr) 255px;gap:20px;align-items:start}.session-main{min-width:0}.session-aside{position:sticky;top:95px}.session-title{font:500 25px/1.4 var(--font-display);margin:8px 0}.sessionmeta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0 20px}.thread{display:grid;gap:18px}.message{max-width:90%;border-radius:18px;padding:16px 17px;font-size:12px;line-height:1.9;position:relative}.message .who{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.06em;font-weight:800;margin-bottom:8px;color:var(--forest2)}.message.assistant{background:#e9eee5;border:1px solid #dce5d8;border-top-left-radius:5px}.message.user{background:var(--forest);color:#fffdf7;margin-left:auto;border-top-right-radius:5px}.message.user .who{color:#c7d8c4}.message .evidence-tag{display:inline-flex;margin-top:9px;border:1px solid #d0ddcd;color:var(--forest2);border-radius:7px;padding:4px 7px;font-size:9px}.reply-suggestions{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}.composer{position:sticky;bottom:12px;margin-top:18px;background:var(--glass);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:18px;padding:9px;display:flex;gap:8px;align-items:flex-end;box-shadow:0 8px 30px #2331260b}.composer textarea{border:0;background:transparent;resize:none;min-height:46px;max-height:130px;flex:1;outline:none;padding:9px;font-size:12px;line-height:1.7;color:var(--ink)}.composer .send{width:44px;height:44px;border:0;border-radius:13px;background:var(--forest);color:#fff;font-size:17px}.aside-note{font-size:10px;line-height:1.8;color:var(--muted);margin:10px 0 0}.aside-list{display:grid;gap:13px;margin-top:15px}.aside-line{display:flex;gap:9px;align-items:flex-start;font-size:10px;line-height:1.7;color:var(--muted)}.aside-line i{font-style:normal;color:var(--forest2)}.progresssteps{display:flex;gap:5px;margin:16px 0 22px}.progresssteps span{height:3px;background:#e1e3d8;flex:1;border-radius:8px;transition:background .3s}.progresssteps span.done{background:#789576}.insight-head{background:#e9eee5;border:1px solid #dce5d8;border-radius:23px;padding:clamp(22px,3vw,34px);position:relative;overflow:hidden}.insight-head:after{content:"◈";position:absolute;right:22px;top:5px;font-size:110px;color:#5c7a5f12}.insight-head .quote{font:500 clamp(23px,2.5vw,32px)/1.5 var(--font-display);margin:15px 0 13px;max-width:720px}.insight-head .support{font-size:11px;line-height:1.85;color:var(--muted);max-width:650px}
.insight-head .reframe{margin:17px 0 5px;padding:2px 0 2px 17px;border-left:2px solid var(--forest2);max-width:650px}
.insight-head .reframe b{display:block;font:700 9px/1 var(--font-body),serif;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}
.insight-head .reframe span{font:500 15px/1.62 var(--font-display);color:var(--forest-text)}.evidence-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:15px}.evidence-box{border:1px solid var(--line);background:var(--paper);border-radius:18px;padding:18px}.evidence-box .evidence-label{font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--forest2);display:flex;align-items:center;gap:7px}.evidence-box blockquote{font:500 16px/1.7 var(--font-display);margin:12px 0}.evidence-box p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.hypothesis{border:1px solid var(--line);border-radius:16px;padding:15px;margin-top:10px;background:var(--paper)}.hypothesis .hypotop{display:flex;justify-content:space-between;gap:10px;align-items:center}.hypothesis b{font-size:12px}.hypothesis p{font-size:11px;line-height:1.8;color:var(--muted);margin:9px 0 0}.hypothesis.primary{background:#f0f3eb;border-color:#d8e2d4}.feedbackbar{display:flex;flex-wrap:wrap;gap:8px;margin:13px 0}.feedbackbar button{border:1px solid var(--line);background:#fffefa;color:#606c61;border-radius:11px;padding:12px 15px;font-size:11px;min-height:44px}.feedbackbar button.active{background:#e9f0e5;border-color:#8ba589;color:var(--forest-text)}.archive-tools{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:20px 0}.searchbox{display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--paper);border-radius:13px;padding:0 12px;min-width:220px;flex:1;max-width:350px}.searchbox input{border:0;outline:none;background:transparent;padding:11px 0;font-size:11px;width:100%;color:var(--ink)}.timeline{position:relative;margin:10px 0 0;padding-left:26px}.timeline:before{content:"";position:absolute;left:6px;top:8px;bottom:12px;width:1px;background:#d9ded3}.timeline-item{position:relative;padding:0 0 22px}.timeline-item:before{content:"";position:absolute;left:-24px;top:6px;width:9px;height:9px;border:2px solid #88a086;background:var(--canvas);border-radius:50%}.timeline-date{font-size:10px;color:var(--faint);margin-bottom:8px}.timeline-card{background:var(--paper);border:1px solid var(--line);border-radius:17px;padding:17px}.timeline-card h3{font:500 17px var(--font-display);margin:0 0 8px}.timeline-card p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.timeline-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}.archive-card{cursor:pointer;transition:.15s}.archive-card:hover{border-color:#b4c5b1;transform:translateY(-1px)}.patternmap{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pattern{border:1px solid var(--line);background:var(--paper);border-radius:17px;padding:17px}.pattern .pattern-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.pattern h3{font:500 17px var(--font-display);margin:13px 0 8px}.pattern p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.compare{width:100%;border-collapse:collapse;font-size:11px}.compare th{text-align:left;font-size:10px;color:var(--faint);font-weight:650;padding:12px 10px;border-bottom:1px solid var(--line)}.compare td{padding:14px 10px;border-bottom:1px solid #efeee8;line-height:1.7;vertical-align:top}.compare tr:last-child td{border-bottom:0}.compare td:first-child{color:var(--muted);width:25%}.progressring{width:112px;height:112px;border-radius:50%;background:conic-gradient(var(--ring-fill) 0 var(--ring-pct,0%),var(--ring-track) var(--ring-pct,0%) 100%);display:grid;place-items:center;position:relative;flex-shrink:0}.progressring:before{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--paper)}.progressring div{position:relative;text-align:center}.progressring strong{font:500 27px var(--font-display);display:block}.progressring small{font-size:9px;color:var(--muted)}.settingrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 0;border-bottom:1px solid #eeece5}.settingrow:last-child{border-bottom:0}.settingrow b{display:block;font-size:12px}.settingrow p{font-size:11px;color:var(--muted);line-height:1.7;margin:5px 0 0}.switch{width:46px;height:28px;border:0;border-radius:99px;background:#d6d9cf;padding:3px;flex-shrink:0;position:relative}.switch:before{content:"";position:absolute;inset:-10px -6px;border-radius:99px}.switch:after{content:"";display:block;width:19px;height:19px;border-radius:50%;background:white;transition:.2s;box-shadow:0 1px 3px #0001}.switch.on{background:#739174}.switch.on:after{transform:translateX(21px)}.drawer-scrim,.modal-scrim,.sheet-scrim{position:fixed;inset:0;background:#17251db3;z-index:30;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,visibility .2s;backdrop-filter:blur(3px)}.drawer-scrim.open,.modal-scrim.open,.sheet-scrim.open{opacity:1;visibility:visible;pointer-events:auto}.drawer{position:absolute;right:0;top:0;height:100%;width:min(390px,91vw);background:#fbfaf5;padding:28px 22px;transform:translateX(100%);transition:transform .25s;overflow:auto;box-shadow:-20px 0 70px #0001}.drawer-scrim.open .drawer{transform:translateX(0)}.drawerhead{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.drawerhead h2{font:500 26px var(--font-display);margin:8px 0}.drawerhead p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.drawerlabel{font-size:9px;color:var(--faint);letter-spacing:.13em;margin:21px 8px 8px}.draweritem{width:100%;border:0;background:transparent;border-radius:14px;padding:13px 10px;display:flex;align-items:center;gap:12px;text-align:left}.draweritem:hover{background:#f0f1e9}.draweritem .symbol{width:40px;height:40px;border-radius:12px}.draweritem b{font-size:11px;display:block}.draweritem small{font-size:10px;color:var(--muted);display:block;margin-top:4px}.draweritem .arrow{margin-left:auto;color:var(--faint)}.drawerfooter{margin-top:28px;padding:15px;border-radius:15px;background:#eff1e9;font-size:11px;line-height:1.8;color:#5f6b5e}.modal-scrim{display:grid;place-items:center;padding:18px;z-index:40}.modal{width:min(470px,100%);background:var(--paper);border-radius:24px;padding:28px;transform:translateY(10px) scale(.99);transition:transform .2s;box-shadow:0 30px 100px #0002}.modal-scrim.open .modal{transform:none}.modal h2{font:500 26px/1.4 var(--font-display);margin:10px 0}.modal p{font-size:12px;line-height:1.9;color:var(--muted);white-space:pre-line}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:22px;flex-wrap:wrap}.sheet-scrim{display:flex;align-items:flex-end;justify-content:center}.sheet{width:min(760px,100%);max-height:88dvh;overflow:auto;background:var(--paper);border-radius:25px 25px 0 0;padding:12px 26px calc(26px + env(safe-area-inset-bottom));transform:translateY(30px);transition:transform .22s}.sheet-scrim.open .sheet{transform:none}.grab{height:4px;width:38px;border-radius:8px;background:#d8dacf;margin:0 auto 22px}.sheet h2{font:500 25px var(--font-display);margin:0 0 8px}.sheet p{font-size:11px;line-height:1.8;color:var(--muted)}.toast{position:fixed;z-index:50;bottom:28px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#263d2e;color:#fffdf6;padding:12px 18px;border-radius:999px;font-size:11px;box-shadow:0 10px 35px #0002;transition:.2s;max-width:calc(100vw - 30px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto;cursor:pointer}.toast.toast-error{background:#6b3831}.mobile-nav{display:none}.empty{padding:40px 15px;text-align:center;color:var(--muted);font-size:11px;line-height:1.8}.hide{display:none!important}.caption{font-size:11px;color:var(--muted);line-height:1.75}
.note-line{margin:10px 2px 0}
.guided-fold{margin:10px 0}
.guided-fold>summary{cursor:pointer;color:#4c6d52;font-weight:600}
.guided-fold .guided-fields{margin-top:10px}
.note-line-tight{margin:8px 2px 0}
.support-tag{margin-left:auto}
.strip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.strip .btn{text-align:left;max-width:100%}
.btn-gap{margin-top:12px}.tagline{font:500 16px var(--font-display);color:var(--forest2)}.barrows{display:grid;gap:14px}.barrow{display:grid;grid-template-columns:115px 1fr 36px;align-items:center;gap:10px;font-size:10px;color:var(--muted)}.barrow .bar{height:6px;background:#e6e7de;border-radius:8px;overflow:hidden}.barrow .bar i{display:block;height:100%;background:#7f9a7e;border-radius:8px}.barrow strong{text-align:right;font-size:10px;color:#596a59}.formrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}.callout{border-left:2px solid #93aa8f;padding:13px 15px;background:#f2f4ee;font-size:11px;line-height:1.8;color:#5f6c60;border-radius:0 12px 12px 0}.mobile-menu{display:none}
@media(max-width:980px){.app{grid-template-columns:210px minmax(0,1fr)}.sidebar{padding:23px 12px}.grid.main-side{grid-template-columns:minmax(0,1.2fr) minmax(230px,.8fr)}.content{padding-top:28px}.topicgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.session-layout{grid-template-columns:minmax(0,1fr) 220px}}
@media(max-width:740px){body{background:var(--canvas)}.app{display:block;min-height:100dvh;box-shadow:none}.sidebar{display:none}.maincol{min-height:100dvh}.topbar{height:62px;padding:0 17px}.mobile-brand{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800}.mobile-brand .brandmark{height:30px;width:30px;border-radius:10px;font-size:17px}.crumb{display:none}.top-actions{gap:7px}.top-actions .iconbtn{height:44px;width:44px}.content{padding:26px 17px calc(100px + env(safe-area-inset-bottom));}.h1{font-size:31px}.lede{font-size:12px}.title-row{align-items:flex-start}.title-row>.btn{display:none}.hero{min-height:275px;padding:23px;border-radius:23px}.hero h2{font-size:28px;max-width:310px}.hero p{max-width:310px}.hero-orbit{width:74px;height:74px;right:20px;bottom:17px;opacity:.65}.statrow{gap:8px}.stat{padding:13px 11px;border-radius:15px}.stat strong{font-size:22px}.stat .label{font-size:9px}.stat small{font-size:9px}.grid.two,.grid.three,.grid.main-side{grid-template-columns:1fr}.grid.main-side>.panel{min-width:0}.panel{padding:18px;border-radius:19px}.sectionhead{margin:26px 0 12px}.sectionhead .h2{font-size:16px}.topicgrid{grid-template-columns:1fr 1fr;gap:9px}.topic{min-height:142px;padding:14px;border-radius:16px}.topic .topic-icon{margin-bottom:12px}.topic b{font-size:12px}.session-layout{grid-template-columns:1fr}.session-aside{position:static;display:none}.message{max-width:96%;padding:14px;font-size:12px}.session-title{font-size:22px}.evidence-row{grid-template-columns:1fr}.patternmap{grid-template-columns:1fr}.statrow{grid-template-columns:repeat(3,minmax(0,1fr))}.archive-tools{gap:7px}.searchbox{min-width:100%;max-width:none}.timeline{padding-left:22px}.timeline-card{padding:15px}.formrow{grid-template-columns:1fr}.progressring{width:92px;height:92px}.progressring strong{font-size:23px}.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;bottom:0;left:0;right:0;z-index:15;background:var(--glass);backdrop-filter:blur(18px);border-top:1px solid var(--line);padding:7px 8px calc(7px + env(safe-area-inset-bottom))}.mobile-nav button{border:0;background:transparent;color:var(--muted);border-radius:12px;padding:9px 2px 6px;min-height:52px;font-size:10px;display:grid;justify-items:center;gap:3px}.mobile-nav button span{font-size:18px;line-height:1.2}.mobile-nav button.active{background:#e7eee4;color:var(--forest-text);font-weight:800}.mobile-nav button.active span{color:var(--forest-text)}.mobile-menu{display:grid}.top-actions .desktop-only{display:none}.insight-head{padding:21px}.insight-head .quote{font-size:24px}.evidence-box blockquote{font-size:15px}.quote-card blockquote{font-size:19px}.statrow .stat:nth-child(3){display:none}.statrow{grid-template-columns:1fr 1fr}.title-row{display:block}.title-row .segmented{margin-top:14px}.sectionhead .textbtn{font-size:11px}.sheet{padding-left:19px;padding-right:19px}.modal{padding:23px}.modal-actions .btn{flex:1}.barrow{grid-template-columns:92px 1fr 28px}.hide-sm{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

.guided-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.guided-field{min-width:0}.guided-field:nth-child(2){grid-column:1/-1}.fieldlabel{display:block;font-size:11px;font-weight:700;margin:18px 0 8px;color:#526052}.select{width:100%;border:1px solid var(--line);background:#fffefa;border-radius:13px;padding:12px;color:var(--ink);font-size:12px}.textarea.compact{min-height:74px}.process-wrap{max-width:780px;margin:0 auto}.process-hero{padding:clamp(24px,5vw,48px);border-radius:26px;background:#e8eee4;border:1px solid #d9e2d5}.process-mark{width:58px;height:58px;border-radius:19px;background:var(--forest);color:#f8f7ef;display:grid;place-items:center;font-size:27px;margin-bottom:24px}.process-list{display:grid;gap:0;margin-top:24px}.process-step{display:flex;gap:14px;padding:15px 0;border-top:1px solid #d8dfd4;align-items:flex-start}.process-step .stepnum{width:27px;height:27px;border-radius:50%;background:#d5e1d1;color:var(--forest-text);display:grid;place-items:center;font-size:11px;flex-shrink:0}.process-step b{display:block;font-size:12px;margin:3px 0 5px}.process-step p{font-size:11px;line-height:1.7;color:var(--muted);margin:0}.process-note{font-size:10px;line-height:1.8;color:var(--muted);margin-top:20px}.report-ready{display:none;margin-top:18px;padding:16px 18px;border-radius:15px;background:#fffefa;border:1px solid #d9e2d5}.report-ready.show{display:block}.report-ready b{font-size:12px}.report-ready p{font-size:11px;color:var(--muted);line-height:1.7;margin:7px 0 0}
@media(max-width:700px){.guided-fields{grid-template-columns:1fr}.guided-field:nth-child(2){grid-column:auto}.process-hero{border-radius:21px}.process-step{padding:13px 0}}
.orig-quote{border:1px solid var(--line);background:var(--paper);border-radius:18px;padding:4px 20px 16px;margin-top:16px}
.orig-quote summary{cursor:pointer;list-style:none;font-size:12px;font-weight:750;color:var(--forest-text);display:flex;align-items:center;gap:8px;min-height:44px}
.orig-quote summary::-webkit-details-marker{display:none}
.orig-quote summary:before{content:"◈";color:var(--forest2)}
 .orig-quote summary:after{content:"Show";margin-left:auto;font-size:10px;color:var(--muted);font-weight:600}
.orig-quote[open] summary:after{content:"Hide"}
.orig-quote p{font-size:12px;line-height:1.9;color:#4d584e;white-space:pre-line;margin:4px 0 0}
.orig-quote .meta{font-size:10px;color:var(--muted);margin-top:12px}
/* the evidence grade stays on the card but stops being a meter in the middle of the prose: what a
   reading rests on is something you ask about, not something you read past on the way to it */
.hyp-proof{margin-top:11px;border-top:1px solid #eeece4;padding-top:2px}
.hyp-proof summary{cursor:pointer;list-style:none;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:8px;min-height:40px}
.hyp-proof summary::-webkit-details-marker{display:none}
.hyp-proof summary:after{content:"Show";margin-left:auto;font-size:10px;color:var(--faint);font-weight:600}
.hyp-proof[open] summary:after{content:"Hide"}
.hyp-proof p{margin:7px 0 4px}
/* The mark is the only picture of a person here: initials over one colour, chosen, never uploaded —
   an account can be recognised on a shared device without the product holding a photograph. */
.avatar.sage{background:#dfe6da;color:#41563f}.avatar.clay{background:#ecdfd5;color:#7c5238}
.avatar.slate{background:#d9e1e7;color:#3f566a}.avatar.honey{background:#f0e5c6;color:#7a6127}
.avatar.moss{background:#dcead9;color:#41603d}.avatar.plum{background:#e8dbe4;color:#6d4a65}
.pf-marks{display:flex;gap:9px;flex-wrap:wrap;margin:2px 0 4px}
.pf-marks button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);cursor:pointer;
 padding:0;font:600 14px var(--font-display);display:grid;place-items:center}
.pf-marks button[aria-pressed=true]{border-color:var(--forest);box-shadow:0 0 0 2px #b9cbb4}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:820px){.pf-grid{grid-template-columns:1fr}}
/* The next step is one action to try, not a two-column task list: the second line is a nudge for
   later and must not read as an equal-weight assignment next to the first. */
.nextsteps{display:grid;gap:12px}
.nextsteps .soft{border-top:1px solid #eeece4;padding-top:12px}
.nextsteps .soft p{margin:0;color:var(--muted)}
/* the question is the wide thing on this card and the way back to it is one short label — the
   split gives the button its own column, so it must not be squeezed into the text and turn round */
.open-loop .split{align-items:center;gap:18px}
.open-loop .split>div{flex:1 1 auto}
.open-loop .btn{flex:none;white-space:nowrap}
.empty-block{text-align:center;padding:30px 18px}
.empty-block .mark{font-size:27px;color:var(--forest2)}
.empty-block b{display:block;font-size:15px;margin:14px 0 9px;font-weight:700}
.empty-block p{font-size:11px;line-height:1.9;color:var(--muted);margin:0 auto 20px;max-width:380px}
.cold-only{display:none!important}body.cold .cold-only{display:block!important}body:not(.demo-data) .demo-only{display:none!important}
.skip{position:absolute;left:-9999px;top:10px;z-index:60;background:var(--forest);color:#fff;padding:11px 15px;border-radius:11px;font-size:12px;text-decoration:none}.skip:focus{left:14px}
.process-step .pill{transition:.2s}.process-step.done .stepnum{background:#789576;color:#fff}.tstate.done{background:#dfeae0;color:#3f6249}
#timeline.grouped{padding-left:0}#timeline.grouped:before{display:none}#timeline.grouped .timeline-item:before{display:none}
.tgroup{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--forest2);font-weight:760;margin:18px 0 12px;padding-bottom:7px;border-bottom:1px solid var(--line)}
#timeline.grouped{padding-left:0}#timeline.grouped:before{display:none}#timeline.grouped .timeline-item:before{display:none}.tgroup{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--forest2);font-weight:760;margin:18px 0 12px;padding-bottom:7px;border-bottom:1px solid var(--line)}

/* hit-area-44 */
.textbtn{display:inline-flex;align-items:center;min-height:40px}
.switch{position:relative}
.switch:before{content:"";position:absolute;inset:-8px -4px;border-radius:99px}
.searchbox{min-height:44px}
.searchbox input{min-height:42px}
/* ============ V3 · onboarding / identity / paywall / mock backend ============ */
.gate{min-height:100dvh;display:grid;place-items:center;padding:32px 20px 56px}
.gate-inner{width:min(560px,100%)}
.gate-brand{display:flex;align-items:center;gap:11px;margin-bottom:30px}
.gate-brand .brandmark{width:38px;height:38px;border-radius:12px;background:var(--forest);color:#f4f2ea;display:grid;place-items:center;font-size:17px}
.gate-brand b{font:600 15px/1 var(--font-display);letter-spacing:.02em}
.gate-brand small{display:block;font:500 9px/1 sans-serif;letter-spacing:.19em;color:var(--faint);margin-top:5px}
.ob-step{display:none}.ob-step.active{display:block;animation:fadeUp .4s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.ob-title{font:500 27px/1.45 var(--font-display);color:var(--ink);margin:0 0 12px;letter-spacing:-.01em}
.ob-body{font-size:13px;line-height:2;color:var(--muted);margin:0}
.ob-body em{font-style:normal;color:var(--forest-text);font-weight:650}
.ob-dots{display:flex;gap:7px;margin:26px 0 18px}
.ob-dots i{width:22px;height:3px;border-radius:99px;background:#dcdfd4;transition:.25s}
.ob-dots i.on{background:var(--forest);width:34px}
.ob-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ob-actions .grow{flex:1;min-width:150px}
.ob-legal{margin-top:16px;font-size:11px;line-height:1.85;color:var(--faint)}
.ob-legal a{color:var(--forest2);text-decoration:none;border-bottom:1px solid #cfd6cb}
/* the three public documents. Only ever rendered where an API actually serves them (see .prod-note)
   — in the demo they would be a link to a 404, which is worse than no link. */
.policylink{color:var(--forest2);text-decoration:none;border-bottom:1px solid #cfd6cb;white-space:nowrap}
.ob-legal .policylink{margin-left:10px}
.next-card .policylink,.pw-fine .policylink{border-bottom:0;font-weight:750;color:var(--forest-text)}
/* identity / sign in */
.auth-tabs{display:flex;gap:6px;background:var(--paper2);border-radius:14px;padding:5px;margin-bottom:24px}
.auth-tabs button{flex:1;border:0;background:transparent;border-radius:10px;padding:10px 6px;font-size:12px;font-weight:650;color:var(--muted);min-height:40px;cursor:pointer}
.auth-tabs button.active{background:var(--paper);color:var(--forest-text);box-shadow:0 2px 8px #1f2c2412}
.code-row{display:flex;gap:10px;align-items:flex-end}
.code-row .grow{flex:1;min-width:0}
#resendBtn{white-space:nowrap}
.auth-err{display:none;margin-top:12px;font-size:11.5px;line-height:1.8;color:#8a4a3c;background:#f7ece7;border:1px solid #e8d3cb;border-radius:12px;padding:10px 13px}
.auth-err.show{display:block}
.auth-split{display:flex;align-items:center;gap:12px;margin:26px 0 14px;color:var(--faint);font-size:10px;letter-spacing:.1em}
.auth-split:before,.auth-split:after{content:"";flex:1;height:1px;background:var(--line)}
/* OAuth sign-in is capability-gated: hidden until /capabilities reports that the provider's
   client id is configured and the server can verify the id_token it signs. */
.oauth{display:none}
body.oauth-on .auth-split,body.oauth-on .oauth{display:block}
body.oauth-on .oauth{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.oauth button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border:1px solid var(--line);background:var(--paper);border-radius:14px;font-size:12px;font-weight:600;color:#4b554b;cursor:pointer}
.oauth button span{font-size:15px}
.consent{display:flex;gap:11px;align-items:flex-start;margin-top:20px;font-size:11.5px;line-height:1.85;color:var(--muted)}
.consent input{margin-top:3px;width:19px;height:19px;accent-color:var(--forest);flex-shrink:0}
.consent a{color:var(--forest2);text-decoration:none;border-bottom:1px solid #cfd6cb}
.guest-note{margin-top:14px;font-size:11px;line-height:1.9;color:var(--faint)}
/* account bar */
.acct{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--paper);margin-bottom:18px}
.acct .avatar{width:34px;height:34px;font-size:13px}
.acct b{display:block;font-size:12.5px;color:var(--ink)}
.acct small{display:block;font-size:10.5px;color:var(--faint);margin-top:3px}
.acct .tier{margin-left:auto}
/* notification centre */
.notif{display:flex;gap:12px;align-items:flex-start;padding:15px 2px;border-bottom:1px solid var(--line)}
.notif:last-child{border-bottom:0}
.notif .dot{width:7px;height:7px;border-radius:50%;background:var(--gold);margin-top:7px;flex-shrink:0}
.notif.read .dot{background:#d8dbd1}
.notif b{display:block;font-size:12.5px;color:var(--ink);line-height:1.6}
.notif p{margin:5px 0 0;font-size:11.5px;line-height:1.85;color:var(--muted)}
.notif time{display:block;margin-top:7px;font-size:10px;color:var(--faint);letter-spacing:.05em}
.notif button{margin-top:9px}
/* task failure state */
.taskfail{display:none;margin-top:18px;border:1px solid #e6d2ca;background:#faf1ed;border-radius:18px;padding:19px}
.taskfail.show{display:block}
.taskfail h3{margin:0 0 8px;font:500 16px/1.5 var(--font-display);color:#7c4234}
.taskfail p{margin:0;font-size:11.5px;line-height:1.9;color:#6d5a53}
.taskfail .row{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}
/* paywall */
.pw-hero{background:linear-gradient(160deg,#2b4738,#1d3327 62%,#25402f);border-radius:26px;padding:30px 24px;color:#f2efe5;position:relative;overflow:hidden}
.pw-hero:after{content:"";position:absolute;right:-70px;top:-70px;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,#ffffff26,transparent 68%)}
.pw-hero h1{position:relative;font:500 27px/1.45 var(--font-display);margin:8px 0 10px}
.pw-hero p{position:relative;margin:0;font-size:12.5px;line-height:1.95;color:#d5ddcf;max-width:44ch}
.pw-reason{position:relative;display:inline-flex;align-items:center;gap:7px;font-size:10.5px;letter-spacing:.06em;background:#ffffff1f;border:1px solid #ffffff2e;border-radius:99px;padding:6px 12px;margin-bottom:4px}
.cycle-toggle{display:flex;gap:5px;background:var(--paper2);border-radius:13px;padding:5px;margin:22px 0 6px}
.cycle-toggle button{flex:1;border:0;background:transparent;border-radius:9px;padding:11px 6px;font-size:12px;font-weight:650;color:var(--muted);min-height:44px;cursor:pointer}
.cycle-toggle button.active{background:var(--paper);color:var(--forest-text);box-shadow:0 2px 8px #1f2c2412}
.cycle-toggle small{display:block;font-size:9.5px;font-weight:500;color:var(--gold-text);margin-top:3px}
.plan-grid{display:grid;gap:12px;margin-top:16px}
.plan-card{border:1px solid var(--line);background:var(--paper);border-radius:20px;padding:20px}
.plan-card.here{border-color:#c7d3c4;background:#fbfcf7}
.plan-card.best{border-color:#b9c9b5;box-shadow:0 16px 40px #2a3d2c14}
.plan-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.plan-top h3{margin:0;font:500 19px/1.4 var(--font-display);color:var(--ink)}
.plan-price{font:600 22px/1 var(--font-display);color:var(--forest-text)}
.plan-price small{font:500 10.5px sans-serif;color:var(--faint);margin-left:4px}
.plan-sub{margin:7px 0 0;font-size:11.5px;line-height:1.85;color:var(--muted)}
.caps{margin:15px 0 0;padding:0;list-style:none}
.caps li{position:relative;padding:7px 0 7px 22px;font-size:12px;line-height:1.8;color:#4b554b}
.caps li:before{content:"◈";position:absolute;left:0;top:7px;font-size:10px;color:var(--forest2)}
.caps li.off{color:var(--faint)}
.caps li.off:before{content:"—";color:#c3c8bd}
.plan-foot{display:flex;align-items:center;gap:10px;margin-top:17px;flex-wrap:wrap}
.plan-foot .grow{flex:1;min-width:140px}
.booster{margin-top:16px;border-top:1px dashed var(--line);padding-top:14px;font-size:11.5px;line-height:1.9;color:var(--faint)}
.booster button{border:0;background:transparent;color:var(--forest2);font-size:11.5px;font-weight:700;text-decoration:underline;padding:0;min-height:24px;position:relative;cursor:pointer}.booster button:before{content:"";position:absolute;inset:-9px -6px}
.pw-fine{margin-top:18px;font-size:10.5px;line-height:1.95;color:var(--faint)}
.pw-fine b{color:var(--muted)}
/* mock backend panel */
.be-badge{display:inline-flex;align-items:center;gap:6px;font-size:10px;letter-spacing:.05em;color:#7a6a4f;background:#f4eddf;border:1px solid #e3d5ba;border-radius:99px;padding:5px 10px}
.be-panel{border:1px solid var(--line);border-radius:20px;background:#fbfbf6;padding:20px;margin-top:16px}
.be-panel h3{margin:0 0 6px;font:500 16px/1.5 var(--font-display);color:var(--ink)}
.be-panel > p{margin:0 0 14px;font-size:11px;line-height:1.9;color:var(--faint)}
.be-sw{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:12px;color:#4b554b}
.be-sw b{font-weight:650}
.be-sw p{margin:3px 0 0;font-size:10.5px;color:var(--faint);line-height:1.75}
.be-sw .switch{margin-left:auto}
.ledger{width:100%;border-collapse:collapse;margin-top:6px;font-size:11px}
.ledger th{text-align:left;font-weight:600;color:var(--faint);padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap;font-size:10px;letter-spacing:.05em}
.ledger td{padding:8px;border-bottom:1px solid #eeeee5;color:#5a6359;line-height:1.6;vertical-align:top}
.ledger td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.ledger .in{color:#3f6249;font-weight:650}
.ledger .out{color:#8a5a44;font-weight:650}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
[tabindex="-1"]:focus{outline:none}.offlinewarn{display:flex;gap:9px;align-items:center;margin:0 0 16px;padding:11px 14px;border-radius:14px;border:1px solid #e6d3b4;background:#fbf3e4;color:#7a5b32;font-size:11.5px;line-height:1.75}
.offlinewarn.hide{display:none}
[role="button"]:focus-visible,.hypothesis:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.rawerr{margin:10px 0 0;font-size:11px;color:var(--muted)}.rawerr summary{cursor:pointer;font-weight:650;min-height:32px;display:flex;align-items:center}
.rawerr p{margin:6px 0 0;font:500 10.5px/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--faint);word-break:break-word}
.be-log{margin-top:12px;max-height:190px;overflow:auto;border-radius:12px;background:#f4f5ef;padding:12px;font:500 10.5px/1.9 ui-monospace,SFMono-Regular,Menlo,monospace;color:#5c665c;word-break:break-all}
@media(max-width:700px){.gate{padding:22px 16px 40px}.ob-title{font-size:23px}.oauth{grid-template-columns:1fr}.plan-top{gap:6px}}
body.gate-mode .app{grid-template-columns:minmax(0,1fr);box-shadow:none}
body.gate-mode .sidebar,body.gate-mode .topbar,body.gate-mode .mobile-nav,body.gate-mode .skip{display:none}
body.gate-mode .maincol{min-height:100dvh}
body.gate-mode .content{max-width:none;padding:0;margin:0}
.plan-sub{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:9px 0 0;font-size:11.5px;line-height:1.7;color:var(--muted)}
.plan-sub .pill{font-size:9.5px;padding:5px 9px;white-space:nowrap}
.plan-grid{grid-template-columns:minmax(0,1fr)}
@media(min-width:980px){.plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.plan-card.best{transform:translateY(-6px)}}

/* ============ V4 · painterly register: art band / oversized serif / single pill ============ */
:root{--art-dawn:url("img/art-dawn.jpg");--art-image:url("img/art-image.jpg")}
.gate{display:block;place-items:normal;padding:0 0 46px;min-height:100dvh}
.gate-stage{position:relative;height:clamp(226px,37vh,344px);overflow:hidden;background:#eaeee4}
.gate-stage:before{content:"";position:absolute;inset:0;background-image:linear-gradient(180deg,rgba(246,245,239,.4),rgba(246,245,239,0) 30%),var(--art-dawn);background-size:cover;background-position:center 56%}
.gate-stage:after{content:"";position:absolute;inset:auto 0 0 0;height:58%;background:linear-gradient(to bottom,rgba(245,243,237,0),rgba(245,243,237,.5) 44%,var(--canvas) 92%)}
html.dark .gate-stage:before{background-image:linear-gradient(180deg,rgba(16,22,18,.45),rgba(16,22,18,0) 30%),var(--art-dawn)}
html.dark .gate-stage:after{background:linear-gradient(to bottom,rgba(15,20,17,0),rgba(15,20,17,.55) 44%,var(--canvas) 92%)}
.gate-stage .gate-brand{position:absolute;z-index:2;left:clamp(20px,5vw,42px);top:clamp(18px,3.2vh,26px);margin:0}
.gate-brand .brandmark{background:#223a2cbb;color:#f7f5ec;backdrop-filter:blur(2px)}
.gate-brand b{color:#2b3a2e}
.gate-brand small{color:var(--muted)}
.gate-inner{position:relative;z-index:3;width:min(560px,100%);margin:-58px auto 0;padding:0 clamp(20px,5.2vw,32px)}
.ob-kicker{margin:0 0 13px;font:600 10.5px/1.4 sans-serif;letter-spacing:.19em;color:var(--forest2)}
.ob-title{font:500 clamp(32px,7.6vw,49px)/1.17 var(--font-display);letter-spacing:-.032em;color:var(--ink);margin:0 0 18px}
.ob-body{font-size:14px;line-height:2.05;color:#5f6a60;max-width:37ch;margin:0}
.gate .textarea{border-radius:16px;background:#fffefaf2;border-color:#dcdfd3;font-size:14px;line-height:2;padding:15px 16px}
.gate .fieldlabel{margin:26px 0 9px;font-size:12px;color:#42503f}
.ob-dots{margin:34px 0 22px}
.ob-actions{margin-top:4px;gap:4px 14px}
.ob-actions .btn{min-height:53px;padding:15px 27px;font-size:13px}
.ob-actions .textbtn{min-height:48px}
#auth .auth-tabs button{min-height:44px}
.ob-legal{margin-top:48px;padding-top:17px;border-top:1px solid #e5e3d9;font-size:10.5px;line-height:2;color:var(--faint)}
/* sign in / sign up */
#auth .gate-stage{height:clamp(178px,25vh,236px)}
#auth .gate-inner{margin-top:-44px}
#auth .panel{border-radius:26px;padding:26px 24px;box-shadow:0 22px 60px #1f2c2410}
.auth-cta{margin-top:24px;display:flex;flex-direction:column;align-items:center;gap:3px}
.auth-cta .btn{min-height:53px;font-size:13px}
.auth-cta .textbtn{font-size:11.5px;font-weight:600;color:var(--faint);min-height:44px}
.auth-split{margin:26px 0 14px}
/* today cover */
.hero{background-image:linear-gradient(101deg,rgba(24,41,31,.96) 0%,rgba(24,41,31,.92) 38%,rgba(24,41,31,.55) 70%,rgba(24,41,31,.12) 100%),var(--art-dawn);background-size:cover;background-position:center 44%;min-height:clamp(256px,31vw,326px);padding:clamp(26px,3.6vw,44px);border-radius:28px}
.hero:before,.hero:after{display:none}
.hero h2{font-size:clamp(29px,3.7vw,42px);letter-spacing:-.032em;line-height:1.2;margin:15px 0 13px}
.hero p{font-size:13px;line-height:2;max-width:33ch;margin:0 0 24px;color:#dde6da;text-shadow:0 1px 12px #16281c66}
.hero .btn{min-height:50px;padding:14px 24px;font-size:12.5px}
/* paywall narrative head */
.pw-hero{background-image:linear-gradient(168deg,rgba(21,36,27,.95) 0%,rgba(21,36,27,.88) 42%,rgba(21,36,27,.66) 76%,rgba(21,36,27,.38) 100%),var(--art-image);background-size:cover;background-position:center 38%;border-radius:28px;padding:clamp(27px,4vw,44px);overflow:hidden}
.pw-hero:after{display:none}
.pw-hero h1{font-size:clamp(30px,5.4vw,46px);line-height:1.15;letter-spacing:-.032em;margin:15px 0 15px;max-width:15ch}
.pw-hero p{font-size:13.5px;line-height:2;color:#e9efe3;max-width:24ch;text-shadow:0 1px 0 #14231acc,0 2px 18px #14231ae6}
.pw-reason{background:#f4f2e918;border-color:#f4f2e938}
@media(max-width:700px){.gate{padding:0 0 38px}.gate-stage{height:clamp(206px,32vh,272px)}.gate-inner{margin-top:-48px}.hero{min-height:262px;background-image:linear-gradient(180deg,rgba(24,41,31,.95) 0%,rgba(24,41,31,.9) 48%,rgba(24,41,31,.34) 80%,rgba(24,41,31,.1) 100%),var(--art-dawn);background-position:center 62%}}
@media(prefers-reduced-motion:reduce){.ob-step.active{animation:none}}.oauth button{background:transparent;border-color:#e4e2d8;color:var(--muted);font-size:11.5px;min-height:46px;font-weight:600}
.oauth button span{font-size:13px;opacity:.75}
.consent input{width:20px;height:20px;margin-top:2px}
/* ============ V4 · the screens only the real service renders: compass, pattern board, lesson grid ============ */
.radar-grid{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(14px,3vw,30px);align-items:center}
.radar{display:block;width:100%;height:auto;overflow:visible}
.axis-list{display:grid}
.axis-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid #eeede4;font-size:12.5px;color:#525f53}
.axis-row:last-child{border-bottom:0}
.axis-row strong{font:600 15px/1 var(--font-display);color:var(--forest-text);font-variant-numeric:tabular-nums}
.spark-wrap{display:grid;gap:9px;margin-top:17px}
.spark{display:grid;grid-template-columns:minmax(0,1fr) 100px 34px;align-items:center;gap:12px;font-size:12px;color:#525f53}
.spark span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spark svg{display:block}
.spark strong{font:600 14px/1 var(--font-display);text-align:right;color:var(--forest-text);font-variant-numeric:tabular-nums}
.compass-word{font:500 clamp(27px,4.4vw,37px)/1.2 var(--font-display);letter-spacing:-.035em;margin:15px 0 0;color:var(--ink)}
.lesson{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.lesson-flow{display:grid;gap:13px;width:100%}
.lesson-flow p{margin:0;font-size:12px;line-height:1.85;color:#4d584e}
.lesson-flow i{display:block;font-style:normal;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:5px}
.lesson-flow br{display:none}
.lesson-line{border-top:1px dashed var(--line);padding-top:13px}
.counter-form{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.counter-form .select{flex:1 1 190px}
.api-gate{background:#f6f4eb;border:1px dashed #d9d5c4}
.api-counter{margin:10px 0 0;font-size:11.5px;line-height:1.8;color:#7f6349}
.api-counter i{font-style:normal;font-weight:700;color:#6f5238}
.api-settles{margin:8px 0 0;font-size:11.5px;line-height:1.8;color:#4d6650}
.api-settles i{font-style:normal;font-weight:700;color:#3f5c46}
.api-echo{margin:8px 0 0;font-size:11px;line-height:1.75;color:#4a5b66}
.linkmap{margin-top:15px;border:1px solid var(--line);border-radius:20px;padding:17px 18px;background:#fbfaf5}
/* the map is the only place two threads are shown together, so a node has to be a way to the card */
.link-node{cursor:pointer}.link-node:focus-visible circle{stroke:#4f6b52;stroke-width:2.5}
.link-node:hover circle{fill:#dfeadb}
.pattern.flash{border-color:#8fa58c;box-shadow:0 0 0 3px #cfe0cb59}
.linkmap svg{display:block;width:100%;height:auto}
.custom-record:before{border-color:#b28d53}
.pw-cancel{align-self:flex-start}
@media(max-width:700px){.radar-grid{grid-template-columns:1fr;gap:20px}.spark{grid-template-columns:minmax(0,1fr) 84px 30px}}
.gate .auth-split{color:var(--faint);font-size:10.5px;letter-spacing:.18em}
.eyebrow{font-size:11px!important;letter-spacing:.14em}.caption,.fieldhelp,.pw-fine,.guest-note,.ob-legal{font-size:11.5px!important}small{font-size:11px!important}.fold{margin:20px 0 2px}.fold>summary{cursor:pointer;list-style:none;font:500 15px/1.6 var(--font-display);color:var(--ink);padding:7px 0}.fold>summary::-webkit-details-marker{display:none}.fold>summary:before{content:"▸  ";color:var(--faint)}.fold[open]>summary:before{content:"▾  "}.orig-quote>summary{font-size:12.5px!important}
.pill{font-size:11px!important}.timeline-date,.barrow,th,.compare td,.stat div{font-size:11.5px!important}.demo-banner{display:none!important}body.demo-data .demo-banner{display:flex!important;flex-direction:column;gap:5px;margin-top:16px;padding:12px 14px;border:1px dashed #b9c4b6;border-radius:2px;background:#f1f4ee;font-size:11.5px;line-height:1.65;color:#5c6a5c}.demo-banner b{font:500 13px/1.5 var(--font-display);color:#3f4a41}
.own-only,.needs-more-only{display:none!important}body.has-own .own-only{display:block!important}body.needs-more .needs-more-only{display:flex!important}
.no-result-only{display:none!important}body.no-result .no-result-only{display:flex!important;flex-direction:column;align-items:flex-start}
body.no-result #insResult{display:none!important}
body.no-result #readingRail{display:none}
.navlabel,.quota-mini,.meta,.process-note,.evidence-label,.be-badge,.barrow strong,.be-sw p,.drawerlabel,.ob-kicker,.auth-split,.pw-reason{font-size:11px!important}.mobile-brand{font-size:10.5px!important}.quota-mini .qtop span,.mobile-brand span{font-size:11px!important}.empty.cold-only{padding:26px 18px}
.pattern.locked{filter:blur(4px);opacity:.5;pointer-events:none;user-select:none}
.packs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.pack{border:1px solid var(--line);border-radius:12px;padding:15px;background:#fbfcf8}
.pack b{display:block;font:500 19px var(--font-display);color:var(--forest-text)}
.pack span{display:block;font-size:11px;color:var(--faint);line-height:1.7;margin:7px 0 11px}
@media(max-width:700px){.packs{grid-template-columns:1fr}}

/* ---- readability floor: the smallest running text on the page is 14px ---- */
body{font-size:15px}.lede,.aside-note,.thread,.hero p,.pack span,.compare,.timeline-card p,.pattern p,.settingrow p,.drawerfooter,.modal p,.sheet p,.callout,.next-card p,.focusitem p,.topic p,.hypothesis p,.evidence-box p,.process-step p,.process-note,.report-ready p,.fieldhelp,.caption,.pw-fine,.guest-note,.ob-legal,.drawer p,.sectionhead p,.empty{font-size:14px!important}
.navbtn,.btn,.btn.small,.h3,.segmented button,.chip,.input,.textarea,.select,.searchbox input,.toast,.message,.pill,.textbtn,.feedbackbar button,.mini-line,.pack button{font-size:14px!important}
.eyebrow,.navlabel,.stat .label,.stat small,.quota-mini .qtop,.crumb,.timeline-date,.barrow,.drawerlabel,.draweritem small,.user-mini small,.be-sw,.meta{font-size:12px!important}
.fieldlabel,.settingrow b,.next-card b,.focusitem b,.draweritem b,.topic b,.hypothesis b,.pattern h3,.process-step b,.report-ready b{font-size:14px!important}
.user-mini b,.crumb b{font-size:13px!important}
.message .who,.message .evidence-tag,.progressring small,.brandname small{font-size:11px!important}
.h1{font-size:clamp(31px,3.4vw,45px)}.h2{font-size:19px}.quote-card blockquote{font-size:22px}.session-title{font-size:26px}
@media(max-width:740px){.session-aside{display:block!important;position:static}.session-aside>.panel{margin-top:4px}}

/* ---- production layer: the same screens with the demo scaffolding taken out ---- */
/* One switch: the body class `api-mode` means "the service is answering", and every sentence that
   is only true in one of the two worlds is shown or hidden by CSS rather than rewritten in script.
   `:not(.api-mode)` keeps each element's own display type — prod-only panels stay flex/block rows. */
body:not(.api-mode) .prod-note{display:none}
body:not(.api-mode) .prod-only{display:none!important}
body.api-mode .demo-note,body.api-mode .demo-only,body.api-mode .demo-banner,body.api-mode .demo-only-row{display:none!important}
body.api-mode:not(.pay-live) .pay-live-only,body.api-mode:not(.llm-on) .llm-only{display:none!important}
body.api-mode.pay-live .pay-dry-only,body.api-mode.llm-on .rule-only{display:none!important}
/* "it reaches your inbox" needs more than a connected service — it needs the service to say email is
   configured. Before /capabilities answers the class is absent, and in the browser-only prototype it
   always is, so both worlds hide the sentence instead of promising mail nobody sends. The dry variant
   is a production statement too (a prototype has no delivery either way). */
body:not(.email-on) .email-only{display:none!important}
body:not(.api-mode) .email-dry-only{display:none!important}
body.api-mode.email-on .email-dry-only{display:none!important}
/* A sign-in button that cannot sign anyone in is worse than no button at all, so the third-party row
   is absent until the deployment says it has a provider — in either layer, keyed on one class. */
body:not(.oauth-on) .oauth,body:not(.oauth-on) .auth-split{display:none!important}
.order-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #eeece4;font-size:13px}.order-row:last-child{border-bottom:0}
.order-row .o-state{margin-left:auto;font-size:12px;color:var(--muted)}
/* A thumb, not a cursor. On touch-sized screens every control you aim at is 44px or more, and a text
   field under 16px makes the browser zoom the page the moment you tap into it — which is what pushes
   the words, and the button under them, off the screen when the keyboard rises. */
@media(max-width:980px),(pointer:coarse){.input,.textarea,input:not([type=checkbox]):not([type=radio]):not([type=button]):not([type=submit]),textarea{font-size:16px!important;line-height:1.5}.select,select{font-size:16px!important}.searchbox input{font-size:16px!important}.btn,.btn.small,.chip,.iconbtn,#openMore,.composer .send,.pf-marks button{min-height:44px}.searchbox{min-height:46px}.top-actions .iconbtn{width:44px;height:44px}#openMore{min-width:44px}.composer{bottom:max(12px,env(safe-area-inset-bottom))}}
/* ============================================================ the result page
   A reading is the thing a person waited for and the thing they will judge themselves by, so the
   page speaks in three voices and no more: what their own lines add up to (the sentence they could
   not have written), the readings that part ways (each theirs to take or leave), and the receipts
   (what it was weighed against), which are a door rather than a wall.
   Later in the sheet on purpose: these are the same rules the earlier lines set, decided now. */
#insights .insight-head{margin-bottom:4px}
.insight-head .reframe{margin:20px 0 6px;padding:3px 0 3px 19px;border-left:3px solid var(--gold);max-width:680px}
.insight-head .reframe b{font-size:10px;line-height:1.4;margin-bottom:9px;color:var(--gold-text);letter-spacing:.17em}
.insight-head .reframe span{font-size:19px;line-height:1.5;color:var(--ink)}
/* the correction is the second voice in the same head, so it keeps the shape and loses the gold:
   one accent per page is the rule, and the reframe is the one that earned it */
#insightCorrection{border-left-color:var(--forest2)}
#insightCorrection b{color:var(--forest2)}
#insightCorrection span{font-size:16px;color:var(--forest-text)}
/* what the extra rounds did, told as content: only a deep reading has this to say */
.depth-card{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);padding:17px 20px 18px;margin-top:18px;box-shadow:var(--shadow)}
.depth-card h3{font:500 17px/1.5 var(--font-display);color:var(--ink);margin:9px 0 0;max-width:640px}
.depth-lead{font-size:12px;line-height:1.75;color:var(--muted);margin:9px 0 0;max-width:640px}
.depth-lens{list-style:none;margin:15px 0 0;padding:0;display:grid;gap:10px}
.depth-lens li{display:flex;gap:11px;align-items:flex-start;font-size:12px;line-height:1.65;color:var(--muted);flex-wrap:wrap}
.depth-lens li i{font-style:normal;flex:none;width:19px;height:19px;border-radius:50%;background:var(--sage);color:var(--forest-text);display:grid;place-items:center;font-size:10px;font-weight:700;margin-top:1px}
.depth-lens li b{color:var(--ink);font-weight:600}
.depth-lens li em{font-style:normal;color:#8b938a}
.depth-count{font-size:11px;line-height:1.6;color:var(--forest-text);font-weight:600;margin:13px 0 0;max-width:640px}
.depth-lens li em.added{color:var(--forest-text);margin-left:auto;padding-left:14px;white-space:nowrap}
.depth-against{margin-top:15px;padding-top:13px;border-top:1px solid #eeece4;display:flex;gap:11px;align-items:flex-start}
.depth-against span{flex:none;font-size:14px;color:var(--rose-text);line-height:1.4}
.depth-against p{margin:0;font-size:12px;line-height:1.75;color:var(--muted);max-width:620px}
.depth-against p b{display:block;color:var(--ink);font-size:12px;margin-bottom:3px}
/* choosing a reading belongs on the card the reading is written on */
.hypothesis{cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s}
.hyp-choose{display:inline-flex;align-items:center;gap:6px;margin-top:13px;border:1px solid #d5dbd1;background:transparent;color:var(--forest-text);border-radius:999px;padding:6px 12px;font-size:10px;font-weight:700;letter-spacing:.02em}
.hypothesis:hover .hyp-choose,.hypothesis:focus-visible .hyp-choose{border-color:#bcc9ba;background:var(--sage2)}
.hypothesis.primary{box-shadow:inset 3px 0 0 var(--forest2)}
.hypothesis.primary .hyp-choose{background:var(--forest);border-color:var(--forest);color:#fffefa}
/* the four movements of the page, jumpable from the top of it */
.rail{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0 0}
.rail button{border:1px solid var(--line);background:var(--paper);color:var(--muted);border-radius:999px;padding:7px 12px;font-size:10px;font-weight:700;cursor:pointer;letter-spacing:.02em}
.rail button:hover{border-color:#c3cdc2;color:var(--forest-text);background:var(--sage2)}
.rail button.on{border-color:#a9bda7;background:var(--sage2);color:var(--forest-text)}
/* the receipts stay a door: the closed summary says what is behind it, so closing it costs nothing */
#foldCompare summary .fold-tail{display:block;font:400 12px/1.6 var(--font-body),serif;color:var(--muted);letter-spacing:0;text-transform:none;margin-top:5px;max-width:620px}
/* the reading is the thing that was paid for, so none of its sentences may sit under the sheet's own
   13px readability floor. Four of them did: the position line at 11px, "Against it" and "Where this
   entry stops" at 11.5px, the echo line at 11px, and the press-hint on the card at 10px. All four
   predate the floor block, and all four carry more of the value than the chrome around them. */
#insights .insight-head .support{font-size:16px;line-height:1.62;color:var(--ink);max-width:56ch;margin-top:3px}
/* the cards themselves are not the long lines: #hypGroup is a two-column grid, so their prose already
   sits at ~475px. The lines that ran the full 1036px column were the single-column notes under it. */
#insights .note-line,#insights .depth-lead,#insights .depth-against p{max-width:60ch}
#insights .hypothesis p{font-size:14px!important;line-height:1.72;color:var(--ink)}
#insights .hypothesis .api-counter,#insights .hypothesis .api-settles,#insights .hypothesis .api-echo{font-size:13px!important;line-height:1.68;margin-top:11px}
#insights .hypothesis .hypotop b{font-size:16px!important}
#insights .hyp-choose{font-size:12px;padding:8px 14px}
#insights .hyp-proof summary{font-size:12.5px;min-height:32px}
#insights .depth-lead,#insights .depth-against p{font-size:13px;line-height:1.7}
#insights .depth-count{font-size:12.5px;line-height:1.6}
#insights .depth-lens li{font-size:13px;line-height:1.6}
@media(max-width:740px){.insight-head .reframe span{font-size:17px}.depth-card{padding:15px 16px 16px}#insights .insight-head .support{font-size:15px}#insights .hypothesis p{font-size:13.5px!important}}
#foldEvidence .orig-quote{margin:6px 0 4px;padding:0 0 13px;border:0;border-bottom:1px solid #eeece4;border-radius:0;background:transparent}
#foldEvidence .orig-quote>summary{font:500 13px/1.6 var(--font-display);color:var(--forest2)}
#insights .strip{margin:0 0 12px}
/* ---- the page arriving early (showArriving in app.js) --------------------------------------
   Four rows in the order the finished page prints them, so a column landing later never moves one
   the person has already read. A written part is set in the report's own reading voice at the size
   it is read at on the desk; a part still being written is said in the interface voice, smaller and
   quiet — the two must never look like each other. */
.arriving{margin-top:26px}
.arriving .eyebrow{color:var(--faint);margin:0}
.arriving-item{padding:15px 0 16px;border-top:1px solid #d8dfd4}
.arriving-item:first-child{border-top:0;padding-top:11px}
.arriving-label{display:block;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--faint)}
.arriving-item p{font:500 17px/1.62 var(--font-display),var(--font-display);color:var(--forest-text);margin:9px 0 0;max-width:60ch}
.arriving-item.waiting p{font:400 13px/1.7 var(--font-body),serif;color:var(--muted)}
html.dark body .arriving-item{border-top-color:#2d3830}
@media(max-width:700px){.arriving-item{padding:13px 0 14px}.arriving-item p{font-size:16px}}

/* ── audit fixes: touch targets, the 741-979px gap, toast over the bottom bar, long unbroken text ── */
/* a thumb is not a cursor: every button a reader taps on a result page has to clear 44px */
.rail button{min-height:44px;padding:11px 16px;font-size:12px}
.textbtn{min-height:44px}
/* the reading pane collapsed to one column between 741 and 979px, where the side rail used to steal
   width from the textarea — the old breakpoints only met at 740 and 980 and left the middle empty */
@media(max-width:900px){.grid.main-side{grid-template-columns:minmax(0,1fr)}.session-layout{grid-template-columns:minmax(0,1fr) 210px}}
/* the green note used to land on top of the mobile tab bar; the bar is 52px + its own padding */
@media(max-width:740px){.toast{bottom:calc(78px + env(safe-area-inset-bottom))}}
/* a five-column table cannot shrink to a phone: it scrolls sideways instead of losing a column */
.compare-panel{overflow-x:auto;-webkit-overflow-scrolling:touch}
.compare{min-width:460px}
/* one long word (a pasted URL, a name without spaces) must not push a column off the page */
.insight-head,.insight-head *,.timeline-card,.timeline-card *,.message,.evidence-box,.panel,.hypothesis,td,th,li{overflow-wrap:anywhere}

/* ── choosing several archive entries at once (app.js: paintSelectBar / paintChecks) ──
   The bar sits above the list, not over it: someone who has chosen three rows must still see the
   three rows they chose. The tick is its own control, 44px, so choosing does not open the entry. */
.select-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
 margin:14px 0 4px;padding:12px 14px;border:1px solid var(--line);border-radius:15px;
 background:#fbfaf5;position:sticky;top:74px;z-index:6}
html.dark body .select-bar{background:#1b231d}
.archive-check{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;
 margin:-6px 0 2px -10px;border:1px solid transparent;border-radius:12px;background:transparent;
 color:var(--forest-text);font-size:17px;line-height:1;cursor:pointer}
.archive-check:hover{border-color:#b4c5b1;background:#f0f3eb}
html.dark body .archive-check:hover{background:#222c24}

/* ── surfaces that used to be painted light-only from the markup ──────────────────
   An inline style= attribute outranks every selector but the one !important rule, so a colour
   written into the HTML stayed a light-cream background under a dark theme. Each of these reads
   the same tokens the rest of the page does, so both themes get a real value. */
.noscript-note{max-width:640px;margin:20px auto;padding:16px 20px;border:1px solid var(--line);
 border-radius:14px;background:var(--paper);font:400 13px/1.8 var(--font-body);color:var(--ink)}
.quota-unit{font:400 11px sans-serif;color:var(--faint)}
.rule-deep{background:var(--deep-line)}
.empty-lead{display:block;font-size:13px;color:var(--ink);margin:10px 0 6px}
.saved-note{color:var(--forest2);font-weight:700}
.aside-note-state{color:var(--rose-text);font-weight:700}
.plan-summary{background:var(--sage);border-color:var(--line)}
.pattern.no-lock{background:var(--sage2);border-style:dashed}
.stamp-line{margin-left:auto;color:var(--faint);font-weight:600}
.grace-note{color:var(--rose-text)}
.recent-state{white-space:nowrap}
.recent-state.is-bad{color:var(--rose-text)}
.btn.danger{color:var(--rose-text);border-color:var(--rose-line)}
.link-line{stroke:var(--link-line)}
.link-line.is-strong{stroke:var(--link-line2)}
.node-dot{fill:var(--node-fill);stroke:var(--node-line)}
.node-label{fill:var(--muted)}
.radar-ring{fill:none;stroke:var(--radar-ring)}
.radar-spoke{stroke:var(--radar-spoke)}
.radar-shape{fill:var(--radar-shape);fill-opacity:.16;stroke:var(--radar-shape);stroke-width:1.5}
.radar-label{fill:var(--faint)}
.radar-value{fill:var(--ink);font-weight:700}
.spark-line{fill:none;stroke:var(--spark);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.supportlink{color:var(--forest2);font-weight:700;font-size:12px;text-decoration:underline;
 text-underline-offset:3px;padding:4px 2px}
.supportlink:hover{color:var(--forest-text)}
.code-dead-end{margin:10px 0 0}
.modal .modal-support{display:none}
.modal.ask-support .modal-support{display:block;font-size:12px;margin:12px 0 0}
/* the last resort on every screen: a person who is stuck has to be able to reach a human without
   going through a form that may never answer */
.sitefoot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
 margin-top:26px;padding:22px clamp(18px,4vw,56px) 40px;border-top:1px solid var(--line);
 font-size:11px;color:var(--muted);max-width:1120px}
.sitefoot-links{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
/* an order that was charged and never arrived is the one money case the app cannot resolve by
   itself — the entry point lives next to the orders it is about, not behind a settings switch */
.appeal-box{margin-top:20px;padding:18px;border:1px solid var(--line);border-radius:18px;
 background:var(--paper2)}
.appeal-box .h3{margin:8px 0 6px}
.appeal-box .textarea{min-height:88px;background:var(--paper);margin-top:2px}
.appeal-actions{align-items:flex-start;gap:14px;margin-top:14px}
.age-row .select{margin-top:2px}
/* the sidebar holds the account screens, and a short window used to cut them off with no scroll
   of its own — sticky plus a scroll container means they are reachable at 640px tall */
@media(max-height:760px){.sidebar{padding:14px 14px 12px}.brand{padding:0 10px 12px}
 .navlabel{margin:8px 0 5px}.navdivider{margin:8px 10px}.quota-mini{margin:8px 4px 6px;padding:12px}
 .navbtn{padding:9px 12px}}
@media(max-height:620px){.brandname small{display:none}.quota-mini strong{font-size:19px;margin:6px 0 5px}}
@media(max-width:740px){.sitefoot{padding:20px 17px 120px}}

/* ── dark mode: the text colours that were only ever written once ────────────────
   Same problem as the inline styles, found the same way: a literal tuned against a cream
   surface reads at 1.5–3:1 on the dark panels. Each value below is the light-theme role
   (muted body text, a green pill, a rose warning) expressed against the dark surface. */
html.dark body .pill{color:#a9c3ae}
/* the rule above outranks `.pill.gold` on specificity, so without these three the status pills would
   all read the same grey-green in dark mode — the colour is what tells "Still being tested" apart
   from "Confirmed". Each accent already clears 5.5:1 on its own tinted background. */
html.dark body .pill.gold{color:var(--gold-text)}
html.dark body .pill.rose{color:var(--rose-text)}
html.dark body .pill.blue{color:var(--blue-text)}
html.dark body .fieldlabel,html.dark body .gate .fieldlabel,html.dark body .be-sw,
html.dark body .barrow strong,html.dark body .demo-banner b{color:var(--ink)}
html.dark body .callout,html.dark body .api-settles,html.dark body .api-settles i,
html.dark body .tstate.done{color:#a9c3ae}
html.dark body.demo-data .demo-banner{color:#a9c3ae}
html.dark body .ledger td,html.dark body .caps li,html.dark body .axis-row,html.dark body .spark,
html.dark body .orig-quote p,html.dark body .lesson-flow p,html.dark body .taskfail p,
html.dark body .be-log,html.dark body .ob-body{color:var(--muted)}
html.dark body .ledger .in{color:#9dc4a9}
html.dark body .auth-err,html.dark body .taskfail h3,html.dark body .ledger .out{color:var(--rose-text)}
html.dark body .offlinewarn,html.dark body .be-badge,html.dark body .api-counter,
html.dark body .api-counter i{color:var(--gold-text)}
html.dark body .api-echo{color:var(--blue-text)}
html.dark body .oauth button{color:var(--ink)}
html.dark body .btn.danger{color:var(--rose-text);border-color:var(--rose-line)}
/* three surfaces that took their colour from a variable the dark theme also reuses for text:
   --forest is the button/hero fill in light mode, so in dark it lightened to #4a7b5c and every
   label sitting on it fell to 3:1. The hero and the chosen-reading chip keep a deep fill here,
   and the cream hero button keeps its dark label (a light green on cream reads at 2:1). */
html.dark body .hero{background:#1f3327}
html.dark body .hero .btn{color:#294637}
html.dark body .hypothesis.primary .hyp-choose{background:#2f5240;border-color:#3d6b4f;color:#e7efe6}

/* ---- loading skeleton: the em dash on a first-frame membership screen reads as "no data";
   a soft pulse reads as "on its way" ---- */
.skel{animation:skelpulse 1.3s ease-in-out infinite;border-radius:6px;color:transparent!important;min-width:64px}
.skel *{visibility:hidden}
@keyframes skelpulse{0%,100%{opacity:.45}50%{opacity:.85}}
@media(prefers-reduced-motion:reduce){.skel{animation:none;opacity:.6}}

/* ---- the pool's last fifth, said while there is still time to choose ---- */
.lowchip{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;padding:7px 10px;border:1px solid var(--gold);border-radius:12px;font-size:12px;line-height:1.4}
.lowchip button{font-size:12px;color:var(--forest2);text-decoration:underline;text-underline-offset:3px;background:none;border:0;padding:0;cursor:pointer;white-space:nowrap}
html.dark .lowchip{border-color:var(--gold)}

/* ---- the door back to a reading that is still being written ---- */
.running-nav{display:flex;gap:10px;align-items:flex-start;width:100%;padding:9px 12px;background:var(--gold-soft,#f3ead9);border:1px solid var(--gold);border-radius:14px;font:inherit;color:inherit;text-align:left;cursor:pointer}
.running-nav .ico{width:20px;text-align:center}
.running-nav span span{display:flex;flex-direction:column;gap:2px;font-weight:600;font-size:13px}
.running-nav .run-sub{font-weight:400;font-size:11px;color:var(--muted)}
#runningDrawer b{color:var(--gold-text,#8a6a33)}

/* the first-reading promise: kin to the reframe block, but a path, not a verdict */
.reframe.firstnote{border-left-color:var(--sage-line,#c9d6c5)}
.reframe.firstnote b{color:var(--muted)}

/* ---- locked previews: real titles, withheld bodies. The blur is desire, not a wall ---- */
.locked-preview{position:relative;overflow:hidden;border:1px dashed var(--line);border-radius:16px}
.locked-preview .blur-body{filter:blur(5px);user-select:none;pointer-events:none;opacity:.75}
.locked-preview h3.blur-target{margin:10px 0 2px}
.locked-preview .locked-veil{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:600 13px/1.4 var(--font-body);color:var(--forest-text);text-align:center;padding:0 18px}
.locked-preview .locked-veil span{font-weight:400;font-size:12px;color:var(--muted)}
html.dark .locked-preview{border-color:var(--line)}
.review-preview .blur-body p{font:500 15px/1.6 var(--font-display);margin:14px 0}

/* ---- the pack the ladder wants people on, and the single deep's own name ---- */
.pack.featured{border-color:var(--gold)}
.pack .best-value{position:absolute;top:-9px;right:12px}
.pack{position:relative}
/* ---- the once-only card at the confirmation peak ---- */
.deep-unlock{border-color:var(--gold);animation:unlocksink .5s ease;margin:0 0 18px}
.deep-unlock p{margin:8px 0 12px}
@keyframes unlocksink{from{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}
/* ---- the loop's look-back: last week's question, faced at the top of this report ---- */
.lookback{border-left:3px solid var(--deep-line);padding:4px 0 4px 14px;margin:10px 0 2px}
.lookback p{font:500 15px/1.55 var(--font-display);margin:5px 0 0;color:var(--muted)}

/* the sentence worth stealing travels with a copy button */
.reframe-copy{margin-top:8px;font-size:12px!important;color:var(--muted)}
.reframe{position:relative}