/* said. notes: one small stylesheet shared by every note */
@font-face{font-family:Geist;font-weight:300;font-display:swap;src:url(../fonts/Geist-Light.woff2) format("woff2")}
@font-face{font-family:Geist;font-weight:400;font-display:swap;src:url(../fonts/Geist-Regular.woff2) format("woff2")}
@font-face{font-family:Geist;font-weight:500 600;font-display:swap;src:url(../fonts/Geist-Medium.woff2) format("woff2")}
:root{--bg:#FBF8F3;--sand:#F6F2EB;--card:#FFFFFF;--ink:#2A2320;--body:#4A3F38;--quiet:#6E6356;--light:#A69886;--line:#E9E1D6;--ox:#9A3B36}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;font-family:Geist,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--ox)}
:focus-visible{outline:2px solid var(--ox);outline-offset:3px;border-radius:8px}
.wrap{max-width:720px;margin:0 auto;padding:0 clamp(20px,6vw,40px) 72px}
nav{height:80px;display:flex;align-items:center;justify-content:space-between}
.mark{display:inline-flex;align-items:baseline;gap:2px;text-decoration:none;color:var(--ink)}
.mark b{font-size:28px;font-weight:500;letter-spacing:-0.05em;line-height:.85}
.mark i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ox)}
nav .back{font-size:15px;color:var(--body);text-decoration:none}
nav .back:hover{color:var(--ink)}
.crumb{margin-top:36px;font-size:15px;font-weight:500;color:var(--ox);text-decoration:none;display:inline-block}
h1{font-size:clamp(40px,7vw,64px);line-height:1;font-weight:500;letter-spacing:-0.055em;margin:14px 0 0;text-wrap:balance}
h1 span{color:var(--ox)}
.dek{margin-top:20px;font-size:clamp(19px,2.2vw,22px);line-height:1.45;font-weight:300;color:var(--body)}
.meta{margin-top:16px;font-size:14px;color:var(--quiet)}
h2{font-size:clamp(26px,3.4vw,32px);line-height:1.1;font-weight:500;letter-spacing:-0.04em;margin:52px 0 0;text-wrap:balance}
h3{font-size:20px;font-weight:500;letter-spacing:-0.02em;margin:32px 0 0}
p,li{font-size:18px;line-height:1.65;font-weight:300;color:var(--body)}
p{margin:14px 0 0}
strong{font-weight:500;color:var(--ink)}
ul,ol{margin:14px 0 0;padding-left:22px}
li{margin-top:8px}
.prompts{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.prompts li{margin:0;padding:16px 20px;border-radius:18px;background:var(--card);box-shadow:0 18px 36px -26px rgba(42,35,32,.35);font-size:18px;font-weight:400;color:var(--ink);letter-spacing:-0.01em}
.cta{margin-top:56px;padding:32px clamp(22px,5vw,40px);border-radius:32px;background:var(--sand);text-align:center}
.cta .dot{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;background:radial-gradient(circle,var(--ox) 0 50%,rgba(154,59,54,.09) 50% 72%,rgba(154,59,54,.055) 72%)}
.cta h2{margin:0;font-size:clamp(28px,4vw,38px)}
.cta p{margin-top:10px}
.cta form{margin:22px auto 0;display:flex;gap:8px;padding:6px 6px 6px 20px;border-radius:999px;background:var(--card);max-width:460px;box-shadow:0 20px 40px -24px rgba(42,35,32,.35)}
.cta input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:400 16px Geist,-apple-system,sans-serif;color:var(--ink);height:48px}
.cta input::placeholder{color:var(--light)}
.cta button{height:48px;padding:0 20px;border:0;border-radius:999px;background:var(--ink);color:var(--sand);font:500 15px Geist,-apple-system,sans-serif;cursor:pointer;white-space:nowrap}
.cta .note{margin-top:12px;font-size:14px;color:var(--quiet)}
.cta .ok{display:none;margin-top:20px;font-size:17px;color:var(--ink)}
.cta.sent form{display:none}.cta.sent .ok{display:block}
.faq dt{margin-top:24px;font-size:18px;font-weight:500;color:var(--ink)}
.faq dd{margin:6px 0 0;font-size:18px;line-height:1.65;font-weight:300;color:var(--body)}
.list{list-style:none;padding:0;margin:40px 0 0;display:grid;gap:14px}
.list a{display:block;padding:26px 28px;border-radius:28px;background:var(--card);box-shadow:0 22px 44px -28px rgba(42,35,32,.35);text-decoration:none;color:var(--ink);transition:transform .3s cubic-bezier(.32,.72,0,1)}
.list a:hover{transform:translateY(-2px)}
.list b{display:block;font-size:24px;line-height:1.15;font-weight:500;letter-spacing:-0.035em}
.list span{display:block;margin-top:8px;font-size:17px;line-height:1.5;font-weight:300;color:var(--body)}
.list small{display:block;margin-top:12px;font-size:14px;color:var(--quiet)}
.soon{margin-top:22px;font-size:15px;color:var(--quiet)}
footer{margin-top:64px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px 22px;font-size:14px;color:var(--quiet)}
footer a{color:var(--quiet);text-decoration:none}
footer a:hover{color:var(--ink)}
@media (max-width:560px){
  nav{height:68px}
  .cta form{flex-direction:column;padding:0;background:none;box-shadow:none;gap:10px}
  .cta input{flex:none;height:54px;padding:0 20px;border-radius:999px;background:var(--card);box-shadow:0 20px 40px -24px rgba(42,35,32,.35);text-align:center}
  .cta button{height:52px}
  .list a{padding:22px}
}

/* ---------- Richer notes: cover, short version, contents, steps, pull quotes, app cards, related ---------- */
.progress{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--ox);transform-origin:0 50%;transform:scaleX(0);z-index:20}
.cover{position:relative;overflow:hidden;margin-top:28px;padding:clamp(28px,6vw,52px) clamp(24px,6vw,52px) clamp(30px,6vw,48px);border-radius:36px;background:var(--sand)}
.cover.oat{background:#EFE6D8}
.cover.ink{background:var(--ink);color:var(--sand)}
.cover.ink h1{color:var(--sand)}
.cover.ink h1 span{color:#B5544D}
.cover.ink .dek{color:#D9CFC2}
.cover.ink .meta{color:#A69886}
.cover.ink .crumb{background:rgba(246,242,235,.1);color:var(--sand)}
.cover .crumb{margin:0;display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:999px;background:var(--card);font-size:14px}
.cover h1{margin-top:22px;max-width:15ch;position:relative;z-index:1}
.cover .dek{max-width:30ch;position:relative;z-index:1}
.cover .meta{position:relative;z-index:1}
.cover .orb{position:absolute;right:-60px;bottom:-60px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,var(--ox) 0 33%,rgba(154,59,54,.1) 33% 66%,rgba(154,59,54,.06) 66%);opacity:.95}
.cover.ink .orb{background:radial-gradient(circle,#B5544D 0 33%,rgba(181,84,77,.16) 33% 66%,rgba(181,84,77,.08) 66%)}
.short{margin-top:28px;padding:22px 24px;border-radius:24px;background:var(--card);box-shadow:0 22px 44px -30px rgba(42,35,32,.35)}
.short b{display:block;font-size:15px;font-weight:500;color:var(--ox)}
.short ul{margin:10px 0 0;padding-left:20px}
.short li{margin-top:6px;font-size:17px}
.toc{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px}
.toc a{display:inline-flex;align-items:center;height:36px;padding:0 14px;border-radius:999px;background:var(--sand);font-size:15px;color:var(--body);text-decoration:none;transition:background .2s}
.toc a:hover{background:#EFE6D8}
h2[id]{scroll-margin-top:24px}
.step{display:grid;grid-template-columns:56px minmax(0,1fr);gap:4px 14px;margin-top:30px}
.step .n{grid-row:span 2;font-size:15px;font-weight:500;color:var(--ox);padding-top:5px}
.step h3{margin:0}
.step p{margin-top:6px}
.pull{margin:44px 0 0;padding:0;border:0;font-size:clamp(26px,3.8vw,34px);line-height:1.15;font-weight:500;letter-spacing:-0.04em;color:var(--ink);text-wrap:balance}
.pull::before{content:"";display:block;width:10px;height:10px;border-radius:50%;background:var(--ox);margin-bottom:16px}
.pull cite{display:block;margin-top:12px;font-size:15px;font-style:normal;font-weight:400;letter-spacing:0;color:var(--quiet)}
.prompts{grid-template-columns:repeat(2,minmax(0,1fr))}
.prompts li{display:flex;gap:12px;align-items:flex-start}
.prompts li::before{content:"";flex:none;width:8px;height:8px;margin-top:9px;border-radius:50%;background:var(--ox)}
.entry{margin-top:26px;padding:22px;border-radius:28px;background:var(--card);box-shadow:0 30px 60px -36px rgba(42,35,32,.45)}
.entry .pills{display:flex;gap:6px;flex-wrap:wrap}
.entry .pills span{height:26px;display:inline-flex;align-items:center;padding:0 10px;border-radius:999px;background:var(--sand);font-size:12.5px;color:var(--body)}
.entry .pills .mood{background:#EFE6D8}
.entry .t{margin-top:14px;font-size:28px;line-height:1;font-weight:500;letter-spacing:-0.05em}
.entry .q{margin-top:6px;font-size:14px;color:var(--quiet)}
.entry .k{margin-top:16px;padding:14px 16px;border-radius:18px;background:var(--bg)}
.entry .k small{display:block;font-size:12.5px;font-weight:500;color:var(--ox)}
.entry .k div{margin-top:4px;font-size:17px;line-height:1.35;color:var(--ink)}
.entry figcaption{margin-top:12px;font-size:13.5px;color:var(--quiet)}
.notif{margin-top:26px;display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:22px;background:rgba(255,255,255,.95);box-shadow:0 24px 48px -30px rgba(42,35,32,.45);max-width:440px}
.notif .ic{flex:none;width:38px;height:38px;border-radius:10px;background:var(--bg);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px var(--line)}
.notif .ic i{width:14px;height:14px;border-radius:50%;background:var(--ox)}
.notif b{display:flex;justify-content:space-between;font-size:14px;font-weight:500;color:var(--ink)}
.notif b em{font-style:normal;font-weight:400;font-size:12.5px;color:var(--quiet)}
.notif span{display:block;margin-top:2px;font-size:14.5px;line-height:1.35;color:var(--body)}
.related{margin-top:56px}
.related h2{margin:0}
.related .list{margin-top:18px}
@media (max-width:560px){
  .prompts{grid-template-columns:minmax(0,1fr)}
  .cover{border-radius:30px}
  .cover .orb{width:180px;height:180px;right:-50px;bottom:-50px}
  .step{grid-template-columns:40px minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){.list a{transition:none}}
.list.covers a{position:relative;overflow:hidden;padding:30px 30px 32px;border-radius:32px;background:var(--sand);box-shadow:none;min-height:200px;display:flex;flex-direction:column;justify-content:flex-end}
.list.covers a::after{content:"";position:absolute;right:-46px;top:-46px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,var(--ox) 0 33%,rgba(154,59,54,.1) 33% 66%,rgba(154,59,54,.06) 66%)}
.list.covers a b,.list.covers a span,.list.covers a small{position:relative;z-index:1;max-width:30ch}
.list.covers a b{font-size:clamp(24px,3.4vw,30px);max-width:16ch}
.list.covers a.oat{background:#EFE6D8}
.list.covers a.ink{background:var(--ink)}
.list.covers a.ink b{color:var(--sand)}
.list.covers a.ink span{color:#D9CFC2}
.list.covers a.ink small{color:#A69886}
.list.covers a.ink::after{background:radial-gradient(circle,#B5544D 0 33%,rgba(181,84,77,.16) 33% 66%,rgba(181,84,77,.08) 66%)}
nav.toc{height:auto;justify-content:flex-start;align-items:center}
.cover .meta{padding-right:120px}
.cover .orb{width:220px;height:220px;right:-56px;bottom:-56px}
@media (max-width:560px){
  .cover .orb{width:150px;height:150px;right:-42px;bottom:-42px}
  .cover .meta{padding-right:96px}
  .cover .dek{padding-right:24px}
}
/* Brand dot: same geometry as the app's button (core 1 · halo 1.4 · halo 1.8), crisp circles, never cropped */
.bdot{position:absolute;top:22px;right:22px;width:56px;height:56px;pointer-events:none}
.bdot i{position:absolute;border-radius:50%;background:var(--ox)}
.bdot i:nth-child(1){inset:0;opacity:.07}
.bdot i:nth-child(2){inset:11.111%;opacity:.11}
.bdot i:nth-child(3){inset:22.222%}
.cover.ink .bdot i,.list.covers a.ink .bdot i{background:#B5544D}
.cover.ink .bdot i:nth-child(1),.list.covers a.ink .bdot i:nth-child(1){opacity:.14}
.cover.ink .bdot i:nth-child(2),.list.covers a.ink .bdot i:nth-child(2){opacity:.2}
.cover .bdot{top:24px;right:24px}
.cover h1{margin-top:26px}
.cover .meta,.cover .dek{padding-right:0}
.list.covers a::after{content:none}
.list.covers a .bdot{position:absolute;margin:0;max-width:none;top:24px;right:24px;width:48px;height:48px}
.bdot.big{position:relative;top:auto;right:auto;display:block;width:76px;height:76px;margin:0 auto 18px}
.notif img.ic{display:block;width:38px;height:38px;border-radius:9px;box-shadow:0 0 0 .5px rgba(42,35,32,.12);background:none}