:root{
--cream:#FAF6EC;--paper:#FDF9F0;--ink:#22242E;--muted:#77705F;--gold:#A8782B;--hairline:#E7DCC0;
--serif:'Sorts Mill Goudy',Georgia,serif;--sans:'Inter',-apple-system,sans-serif;
/* type scale — the six registers. No page invents a size. */
--t-label:.72rem; --ls-label:.26em;      /* section heads, corner meta */
--t-eyebrow:.6rem; --ls-eyebrow:.34em;   /* masthead eyebrow, tiny labels */
--t-title:2.2rem; --t-title-map:2rem;
--t-subtitle:1rem;
--t-keyword:1.02rem; --ls-keyword:.09em;
--t-body:.95rem; --t-whisper:.84rem; --t-nearby:.92rem;
}
*{box-sizing:border-box}
html{background:var(--cream)}
body{margin:0;color:var(--ink);font-family:var(--sans);line-height:1.6;padding:40px 20px 70px;
background:radial-gradient(1100px 520px at 50% -120px, rgba(255,253,244,.95), rgba(255,253,244,0) 70%), var(--cream);
text-rendering:optimizeLegibility}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.028'/%3E%3C/svg%3E")}
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:199;
background:radial-gradient(ellipse at center, transparent 62%, rgba(110,82,35,.045) 100%)}
::selection{background:color-mix(in srgb,var(--gold) 28%,transparent)}
a{color:inherit}
.eb{font-size:var(--t-eyebrow);letter-spacing:var(--ls-eyebrow);color:var(--gold);display:block;text-transform:uppercase}
.masthead{text-align:center;margin-bottom:6px}
.masthead .eb{margin-bottom:14px}
.titlestring{display:flex;align-items:center;justify-content:center;gap:22px;max-width:760px;margin:0 auto}
.titlestring h1{font-family:var(--serif);font-weight:400;font-size:var(--t-title-map);letter-spacing:.2em;margin:0;white-space:nowrap}
.titlestring h1 a{text-decoration:none}
.titlestring .str{flex:1;height:1.5px;background:var(--gold);opacity:.55;position:relative;min-width:30px}
.titlestring .str.l:before,.titlestring .str.r:after{content:"";position:absolute;top:-4px;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--gold);background:var(--cream)}
.titlestring .str.l:before{left:0}
.titlestring .str.r:after{right:0}
.masthead .subtitle{font-family:var(--serif);font-variant:small-caps;letter-spacing:.3em;font-size:var(--t-subtitle);color:var(--gold);margin:14px 0 0}
.masthead .subtitle a{color:var(--gold);text-decoration:none;border-bottom:1px solid transparent}
.masthead .subtitle a:hover{border-bottom-color:var(--gold)}
.masthead .quote{font-family:var(--serif);font-size:.95rem;color:var(--muted);margin:12px auto 0;max-width:560px;line-height:1.6}
.masthead .quote em{font-style:italic}
/* search */
.findrow{display:flex;justify-content:center;margin-top:18px;position:relative}
.findwrap{position:relative;width:300px;max-width:76vw}
.findwrap input{width:100%;background:transparent;border:0;border-bottom:1px solid #D9CDAD;padding:7px 4px;font-family:var(--serif);font-style:italic;font-size:.95rem;color:var(--ink);text-align:center;outline:none}
.findwrap input:focus{border-bottom-color:var(--gold)}
.findwrap .results{position:absolute;top:110%;left:0;right:0;background:var(--paper);border:1px solid var(--hairline);border-radius:10px;z-index:60;max-height:290px;overflow:auto;box-shadow:0 8px 22px rgba(60,40,10,.14);display:none;text-align:left}
.findwrap .results a{display:block;padding:8px 12px;text-decoration:none;font-size:.85rem;border-bottom:1px solid #F0E8D3}
.findwrap .results a:last-child{border-bottom:0}
.findwrap .results a:hover,.findwrap .results a:focus{background:#F3EAD6}
.findwrap .results .k{font-family:var(--serif);font-weight:600}
.findwrap .results .m{color:var(--muted);font-size:.74rem}
/* ============ map ============ */
.board{max-width:1300px;margin:26px auto 0;background:var(--paper);border:1px solid var(--hairline);border-radius:20px;padding:40px 34px 46px;box-shadow:0 2px 6px rgba(60,40,10,.05),0 20px 55px rgba(60,40,10,.1)}
.gridline{display:grid;grid-template-columns:130px repeat(7,1fr) 190px;gap:0;align-items:center}
.registers{margin-bottom:10px}
.reg{text-align:center;height:76px;display:flex;flex-direction:column;justify-content:center;border-radius:9px;margin:0 8px;background:linear-gradient(to bottom,color-mix(in srgb,var(--rc) 13%,transparent),color-mix(in srgb,var(--rc) 3%,transparent) 94%);text-decoration:none;transition:height .3s}
.regsv{display:none;font-family:var(--serif);font-size:.66rem;color:var(--muted);margin-top:4px}
.regsv b2{font-variant:small-caps;letter-spacing:.14em;color:var(--gold);font-size:.74rem}
body[data-lens="spiritual"] .reg{height:100px}
body[data-lens="spiritual"] .regsv{display:block}
.reg .eb2{font-size:.55rem;letter-spacing:.24em;color:var(--muted);text-transform:uppercase}
.reg b{font-family:var(--serif);font-weight:400;font-size:.95rem}
.reg i{font-family:var(--serif);font-style:italic;font-size:.68rem;color:var(--muted)}
.reg:hover b{color:var(--gold)}
.frame{position:relative}
.washes{position:absolute;inset:0;pointer-events:none}
.washes .wash{height:100%;margin:0 8px;background:linear-gradient(to bottom,color-mix(in srgb,var(--rc) 9%,transparent),color-mix(in srgb,var(--rc) 4%,transparent));border-radius:10px}
.row{position:relative;height:124px}
.rowstring{position:absolute;left:138px;right:198px;top:60%;height:1.5px;background:var(--fam);opacity:.35;z-index:0;transition:opacity .3s}
.rowstring:before,.rowstring:after{content:"";position:absolute;top:-3.8px;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--fam);background:var(--paper)}
.rowstring:before{left:-9px}
.rowstring:after{right:-9px}
.side{position:relative;z-index:1}
.side.left{text-align:right;padding-right:18px}
.side.left a{text-decoration:none}
.side.left b{font-family:var(--serif);font-weight:400;font-size:1.12rem;letter-spacing:.06em;color:var(--fam);display:block;margin-top:2px}
.side.left .glyph{color:var(--gold);font-size:.9rem;display:block}
.side.right{padding-left:20px}
.side.right a{text-decoration:none}
.side.right b{font-family:var(--serif);font-weight:400;font-size:1.06rem;color:var(--fam);display:block}
.side.right i{font-family:var(--serif);font-style:italic;font-size:.72rem;color:var(--muted);line-height:1.4;display:block;max-width:164px;text-wrap:balance}
body[data-lens="psychology"] .side.right i{font-size:.82rem;color:color-mix(in srgb,var(--fam) 68%,var(--ink))}
.side.right a:hover b{color:var(--gold)}
.note{position:relative;z-index:1;display:block;height:100%;text-decoration:none;color:var(--ink)}
.note .word{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(40% + 16px);font-family:var(--serif);font-weight:400;font-size:clamp(.9rem,1.15vw,1.12rem);letter-spacing:.02em;white-space:nowrap;transition:color .2s,transform .2s}
.note .word:after{content:"";position:absolute;left:8%;right:8%;bottom:-3px;height:1px;background:var(--gold);opacity:0;transition:opacity .2s}
.note .dot{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);width:9px;height:9px;border-radius:50%;background:var(--paper);border:2px solid var(--fam);transition:background .2s,transform .2s}
.note .whisper{position:absolute;left:50%;transform:translate(-50%,6px);top:calc(60% + 11px);font-family:var(--serif);font-size:var(--t-whisper);line-height:1.35;color:color-mix(in srgb,var(--fam) 72%,var(--ink));opacity:0;transition:opacity .24s,transform .24s;pointer-events:none;text-align:center;width:max-content;max-width:210px;white-space:normal;text-shadow:0 0 6px var(--paper),0 0 10px var(--paper),0 1px 2px var(--paper),0 -1px 2px var(--paper),1px 0 2px var(--paper),-1px 0 2px var(--paper)}
.row:hover .rowstring{opacity:.55}
.note:hover .word,.note:focus-visible .word{color:var(--fam);transform:translate(-50%,-1px)}
.note:hover .word:after,.note:focus-visible .word:after{opacity:.9}
.note:hover .dot,.note:focus-visible .dot{background:var(--fam);transform:translate(-50%,-50%) scale(1.3);box-shadow:0 0 0 5px color-mix(in srgb,var(--fam) 14%,transparent)}
.note:hover .whisper,.note:focus-visible .whisper{opacity:1;transform:translate(-50%,0)}
.note:hover{z-index:5}
.note:focus-visible{outline:2px solid var(--gold);outline-offset:-6px;border-radius:8px}
.benediction{text-align:center;font-family:var(--serif);font-style:italic;color:var(--muted);margin-top:30px;font-size:.95rem}
.benediction .g{color:var(--gold)}
/* lens toggle: psychology | spiritual */
.lenspick{text-align:center;margin:16px 0 0}
.lenspick .pill{display:inline-flex;border:1px solid var(--gold);border-radius:20px;overflow:hidden}
.lenspick button{border:0;background:transparent;padding:6px 18px;cursor:pointer;font-size:.78rem;letter-spacing:.08em;color:var(--muted);font-family:var(--sans)}
.lenspick button[aria-pressed="true"]{background:var(--gold);color:#fff}
body[data-lens="psychology"] .side.right b{display:none}
body[data-lens="psychology"] .side.left .glyph{visibility:hidden}
.lens-note{text-align:center;font-family:var(--serif);font-style:italic;font-size:.8rem;color:var(--muted);margin:14px 0 0}
body[data-lens="psychology"] .lens-note{display:none}
/* ============ card pages ============ */
.page{max-width:640px;margin:0 auto}
.crumb{display:flex;justify-content:space-between;align-items:flex-start;font-size:.78rem;letter-spacing:.06em;margin-bottom:30px}
.crumb a{color:var(--muted);text-decoration:none}
.crumb a:hover{color:var(--gold)}
.crumb .loc{text-align:right;line-height:1.5}
.crumb .fam{color:var(--famink);font-family:var(--serif);font-size:.9rem;display:block;text-decoration:none}
.crumb .lvl2{font-size:.58rem;letter-spacing:.22em;color:var(--muted);display:block;text-transform:uppercase}
.crumb .lvl2 b{color:var(--lc);font-weight:600}
.page{position:relative}
.titleblock{text-align:center;position:relative;z-index:0}
.watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-54%);font-size:210px;line-height:1;color:color-mix(in srgb,var(--fam) 6%,transparent);z-index:-1;pointer-events:none;user-select:none}
.titleblock h1{font-family:var(--serif);font-weight:400;font-size:var(--t-title);letter-spacing:.04em;margin:0}
.tstring{margin:16px auto;max-width:440px}
.tstring .str{display:block;height:1.5px;background:var(--fam);opacity:.45;position:relative}
.tstring .str:before,.tstring .str:after{content:"";position:absolute;top:-4px;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--fam);background:var(--cream)}
.tstring .str:before{left:0}
.tstring .str:after{right:0}
.subtitle2{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:var(--t-subtitle);margin:0;text-align:center}
.landing{font-family:var(--serif);font-size:1.08rem;line-height:1.65;margin:26px 0 0}
h2.sec{font-family:var(--sans);font-weight:500;letter-spacing:var(--ls-label);font-size:var(--t-label);color:var(--gold);margin:46px 0 12px;text-align:center;text-transform:uppercase}
h2.sec a{color:var(--gold);text-decoration:none}
h2.sec a:hover{text-decoration:underline;text-underline-offset:4px}
.entry{margin:14px 0;font-size:var(--t-body)}
.entry b{font-family:var(--serif);font-weight:600;font-size:var(--t-keyword);letter-spacing:var(--ls-keyword);color:var(--famink)}
.q{color:var(--gold);font-size:.66em;letter-spacing:.1em}
.nearby{font-size:var(--t-nearby);line-height:1.85;margin-top:4px}
.nearby b{font-family:var(--serif);font-weight:600;font-size:.96rem;letter-spacing:.08em;color:var(--famink)}
.bene{text-align:center;font-family:var(--serif);font-style:italic;color:var(--muted);font-size:1rem;margin:0}
.xref{color:var(--famink);text-decoration:underline dotted;text-underline-offset:3px}
.stringnav{margin:48px 0 0;position:relative}
.stringnav .line{position:absolute;left:6px;right:6px;top:9px;height:1.5px;background:var(--fam);opacity:.35}
.stringnav .dots{display:flex;justify-content:space-between;position:relative}
.mn{text-decoration:none;text-align:center;width:60px}
.mn i{display:block;width:9px;height:9px;border-radius:50%;background:var(--cream);border:2px solid var(--lc2);margin:4px auto 6px;transition:transform .2s}
.mn.cur i{background:var(--lc2);transform:scale(1.25);box-shadow:0 0 0 4px color-mix(in srgb,var(--lc2) 16%,transparent)}
.mn b{font-family:var(--serif);font-weight:400;font-size:.66rem;color:var(--muted);display:block;line-height:1.2}
.mn.cur b{color:var(--ink)}
.mn:hover i{transform:scale(1.3)}
.pn{display:flex;justify-content:space-between;margin-top:36px;font-size:.85rem}
.pn a{color:var(--muted);text-decoration:none;font-family:var(--serif);font-style:italic}
.pn a:hover{color:var(--famink)}
footer.site{margin-top:60px;padding-top:20px;border-top:1px solid var(--hairline);text-align:center;color:var(--muted);font-size:.72rem;line-height:1.7}
footer.site a{color:var(--muted)}
.waitlist{margin:0 auto 18px;display:flex;gap:10px;justify-content:center;align-items:baseline;flex-wrap:wrap}
.waitlist .wl-line{font-family:var(--serif);font-style:italic;font-size:.9rem;color:var(--muted)}
.waitlist input[type=email]{background:transparent;border:0;border-bottom:1px solid #D9CDAD;padding:4px 6px;font-family:var(--serif);font-style:italic;font-size:.9rem;color:var(--ink);text-align:center;outline:none;width:190px}
.waitlist input[type=email]:focus{border-bottom-color:var(--gold)}
.waitlist button{border:1px solid var(--gold);background:transparent;color:var(--gold);border-radius:16px;padding:4px 14px;font-size:.75rem;letter-spacing:.08em;cursor:pointer;font-family:var(--sans)}
.waitlist button:hover{background:var(--gold);color:#fff}
/* ===== D1 header architecture ===== */
.topbar{font-size:.72rem;letter-spacing:.04em;margin-bottom:26px}
.topbar a{color:var(--muted);text-decoration:none}
.topbar a:hover{color:var(--gold)}
.topbar .mp{color:var(--gold)}
.d1head{display:flex;justify-content:space-between;align-items:flex-start;gap:26px}
.d1head h1{font-family:var(--serif);font-weight:400;font-size:2.3rem;letter-spacing:.01em;margin:0;line-height:1.1}
.d1head .flavor{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:1rem;margin:10px 0 0}
a.locator{flex-shrink:0;display:block;text-decoration:none}
a.locator:hover circle{opacity:1}
.ixwrap{margin-top:26px;border-top:1px solid var(--hairline)}
.ixrow{display:flex;align-items:baseline;gap:26px;border-bottom:1px solid var(--hairline);padding:11px 0}
.ixlab{font-size:.58rem;letter-spacing:.22em;color:var(--muted);opacity:.75;width:76px;flex-shrink:0;text-transform:uppercase}
.ixitems{display:flex;flex-wrap:wrap;gap:4px 22px}
.ixit{font-size:.66rem;letter-spacing:.17em;text-transform:uppercase;text-decoration:none;color:var(--muted);opacity:.45;font-weight:500}
.ixit:hover{opacity:.85}
.ixit.cur{color:var(--cc);opacity:1;font-weight:600;border-bottom:1.5px solid var(--gold);padding-bottom:2px}
body[data-lens="psychology"] .spirit-only{display:none}
body[data-lens="spiritual"] .psy-only{display:none}
.flash{animation:flashglow 1.5s ease 2}
@keyframes flashglow{50%{background:color-mix(in srgb,var(--gold) 22%,transparent);border-radius:8px}}
/* you-are-here map nav */
.famrow{display:flex;justify-content:center;gap:22px;margin-top:34px;flex-wrap:wrap}
.fam-tok{text-decoration:none;font-family:var(--serif);font-size:.88rem;letter-spacing:.04em;color:var(--muted);opacity:.5;transition:opacity .2s,color .2s;text-align:center}
.fam-tok .tg{font-size:.78rem}
.fam-tok:hover,.fam-tok:focus-visible{color:var(--fc);opacity:1}
.fam-tok.cur{color:var(--fc);opacity:1}
.fam-tok.cur:after{content:"";display:block;width:60%;height:1px;background:var(--gold);margin:3px auto 0}
.tok-sub{display:block;font-style:italic;font-size:.74rem;color:var(--ink);opacity:.85;margin-top:1px}
.lvlnav{margin:30px 0 0;position:relative}
.lvlnav .line{position:absolute;left:6px;right:6px;top:8px;height:1px;background:var(--hairline)}
.lvlnav .dots{display:flex;justify-content:space-between;position:relative}
.lvl-tok{text-decoration:none;text-align:center;width:72px}
.lvl-tok i{display:block;width:8px;height:8px;border-radius:50%;background:var(--cream);border:1.5px solid var(--lc3);margin:4px auto 6px;transition:transform .2s,background .2s}
.lvl-tok b{font-family:var(--serif);font-weight:400;font-size:.64rem;color:var(--muted);display:block;line-height:1.2}
.lvl-tok.cur i{background:var(--lc3);transform:scale(1.3);box-shadow:0 0 0 4px color-mix(in srgb,var(--lc3) 16%,transparent)}
.lvl-tok.cur b{color:var(--ink)}
.lvl-tok:hover i{transform:scale(1.3)}
/* context cards */
.ctx-list{margin:8px 0 0;padding:0;list-style:none;text-align:center}
.ctx-list li{margin:7px 0;font-size:var(--t-body)}
.ctx-list a{font-family:var(--serif);text-decoration:none;color:var(--ink)}
.ctx-list a:hover{color:var(--gold)}
.ctx-list .lv{font-size:.62rem;letter-spacing:.2em;color:var(--muted);margin-right:8px;text-transform:uppercase}
.ctx-kv{text-align:center;font-size:var(--t-body);margin:6px 0}
.ctx-kv .k{font-size:var(--t-eyebrow);letter-spacing:var(--ls-eyebrow);color:var(--gold);text-transform:uppercase;display:block;margin:20px 0 4px}
.ctx-kv .v{font-family:var(--serif);font-size:1.05rem}
/* vocab slices (family + level pages, mirrored) */
.vocab{margin-top:4px}
.vb{display:flex;align-items:baseline;gap:16px;padding:9px 0;border-bottom:1px solid #F0E8D3}
.vb:last-child{border-bottom:0}
.vb-lab{font-size:.56rem;letter-spacing:.18em;color:var(--vc);text-transform:uppercase;width:118px;flex-shrink:0;font-weight:600;opacity:.85;text-decoration:none}
.vb-lab:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}
.vb-key{font-family:var(--serif);font-size:1.02rem;color:var(--ink);text-decoration:none;flex-shrink:0}
.vb-key:hover{color:var(--famink);border-bottom:1px solid var(--gold)}
.vb-secs{font-family:var(--serif);font-size:.82rem;color:var(--muted);line-height:1.5}
.ctxline{font-family:var(--serif);font-size:.95rem;text-align:center;margin:4px 0;color:var(--ink)}
/* ===== vertical map (flip) ===== */
.vhead{display:grid;grid-template-columns:150px repeat(6,1fr);gap:0;margin-bottom:6px}
.vfh{text-align:center;padding:6px 4px 10px;text-decoration:none}
.vfh b{font-family:var(--serif);font-weight:400;font-size:1.08rem;letter-spacing:.05em;color:var(--fam);display:inline-block;border-bottom:1px solid transparent;transition:border-color .2s}
.vfh:hover b{border-bottom-color:var(--gold)}
.vfh .glyph{color:var(--gold);font-size:.85rem;display:block}
body[data-lens="psychology"] .vfh .glyph{visibility:hidden}
.vfh i{font-family:var(--serif);font-style:italic;font-size:.68rem;color:var(--muted);display:block;max-width:150px;margin:2px auto 0;text-wrap:balance}
.vfh i.spirit-only{font-style:normal;font-size:.72rem;max-width:160px}
.vfh .an{color:var(--fam)}
.vfh .aname{font-family:var(--serif);font-size:.72rem;color:var(--muted);display:block}
.vframe{position:relative}
.bgpyr{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.vwashes{position:absolute;inset:0;pointer-events:none;display:grid;grid-template-rows:repeat(7,1fr)}
.vwash{margin:3px 0;background:linear-gradient(to right,color-mix(in srgb,var(--rc) 8%,transparent),color-mix(in srgb,var(--rc) 4%,transparent));border-radius:10px}
.vrow{display:grid;grid-template-columns:150px repeat(6,1fr);gap:0;height:92px;align-items:center;position:relative}
.vreg{text-align:right;padding-right:16px;text-decoration:none;position:relative;z-index:1}
.vreg b{font-family:var(--serif);font-weight:400;font-size:.9rem;color:var(--ink);display:block}
.vreg .eb2{font-size:.52rem;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
.vreg i{font-family:var(--serif);font-style:italic;font-size:.64rem;color:var(--muted);display:block}
.vreg .regsv{display:none;font-family:var(--serif);font-size:.6rem;color:var(--muted)}
body[data-lens="spiritual"] .vreg .regsv{display:block;line-height:1.45;margin-top:3px}
body[data-lens="spiritual"] .vrow{height:112px}
.vreg:hover b{color:var(--gold)}
.vnote{position:relative;z-index:1;display:block;height:100%;text-decoration:none;color:var(--ink);text-align:center}
.vnote .word{position:absolute;left:50%;transform:translateX(-50%);top:16px;font-family:var(--serif);font-size:clamp(.82rem,1.05vw,1.02rem);white-space:nowrap;transition:color .2s}
.vnote .word:after{content:"";position:absolute;left:8%;right:8%;bottom:-3px;height:1px;background:var(--gold);opacity:0;transition:opacity .2s}
.vnote:after{content:"";position:absolute;left:50%;transform:translateX(-50%);top:58px;bottom:-12px;width:1.5px;background:var(--fc);opacity:.33}
.vrow:last-child .vnote:after{display:none}
.vnote .dot{position:absolute;left:50%;top:48px;transform:translateX(-50%);width:9px;height:9px;border-radius:50%;background:var(--paper);border:2px solid var(--fc);transition:background .2s,transform .2s}
.vnote .whisper{position:absolute;left:50%;transform:translateX(-50%);top:60px;font-family:var(--serif);font-size:.72rem;line-height:1.3;color:color-mix(in srgb,var(--fc) 72%,var(--ink));opacity:0;transition:opacity .22s;pointer-events:none;width:max-content;max-width:150px;white-space:normal;text-align:center;text-shadow:0 0 6px var(--paper),0 1px 2px var(--paper),0 -1px 2px var(--paper)}
.vnote:hover .word{color:var(--fc);text-shadow:0 0 7px var(--paper),0 1px 3px var(--paper),0 -1px 3px var(--paper)}
.vnote:hover .word:after{opacity:.9}
.vnote:hover .dot{background:var(--fc);transform:translateX(-50%) scale(1.3)}
.vnote:hover .whisper{opacity:1}
.vnote:hover{z-index:5}
/* mobile */
.mobile{display:none}
@media(max-width:980px){
body{padding:30px 14px 60px}
.board,.find-desktop{display:none}
.titlestring{gap:12px}
.titlestring h1{font-size:1.3rem;letter-spacing:.14em}
.masthead .subtitle{letter-spacing:.22em;font-size:.9rem}
.mobile{display:block;max-width:520px;margin:26px auto 0}
details{border-bottom:1px solid var(--hairline)}
summary{list-style:none;cursor:pointer;padding:18px 6px;display:flex;align-items:baseline;gap:10px}
summary::-webkit-details-marker{display:none}
summary .glyph{color:var(--gold);font-size:.95rem}
summary b{font-family:var(--serif);font-weight:400;font-size:1.35rem;letter-spacing:.05em;color:var(--fam)}
summary .msum{font-family:var(--serif);font-style:italic;font-size:.78rem;color:var(--muted);margin-left:auto;text-align:right;max-width:46%}
.mstring{position:relative;margin:0 0 18px 14px;padding-left:26px;border-left:1.5px solid color-mix(in srgb,var(--fam) 35%,transparent)}
.mnote{display:block;text-decoration:none;color:var(--ink);position:relative;padding:10px 0 14px}
.mnote:before{content:"";position:absolute;left:-32.5px;top:19px;width:10px;height:10px;border-radius:50%;background:var(--lc);border:2px solid var(--cream)}
.mnote .meb{font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;display:block;opacity:.8}
.mnote .mword{font-family:var(--serif);font-size:1.2rem;display:block}
.mnote .minside{font-family:var(--serif);font-size:var(--t-whisper);color:color-mix(in srgb,var(--fam) 62%,var(--ink));display:block;line-height:1.4;margin-top:2px}
.mfind{margin:26px 6px 60px}
.mfind-top{margin:4px 6px 20px}
.mhow{font-family:var(--serif);font-size:.86rem;color:var(--muted);text-align:center;margin:2px 10px 12px;line-height:1.55}
.titleblock h1{font-size:1.7rem}
.crumb{font-size:.7rem}
}
@media(prefers-reduced-motion:no-preference){
.rowstring{transform:scaleX(0);transform-origin:left center;animation:strum .9s cubic-bezier(.3,.6,.25,1) forwards;animation-delay:var(--d,0s)}
.note .word,.note .dot,.side.left b,.side.left .glyph,.side.right b,.side.right i{opacity:0;animation:settle .6s ease forwards;animation-delay:calc(var(--d,0s) + .45s)}
@keyframes strum{to{transform:scaleX(1)}}
@keyframes settle{to{opacity:1}}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}