/* The Stacks: a night reading room.
   Dark first, light when the phone asks for it. Literata for reading, Martian Mono for call numbers only,
   the system sans for small interface text. One accent: the catalog stamp red. */
:root{
  --bg:#15171C; --s1:#1C1F26; --s2:#242833; --line:#2E3340; --line2:#3A4050;
  --ink:#E9E3D4; --ink2:#B1AB9E; --ink3:#857F74;
  --stamp:#E0574A; --stamp-ink:#15171C; --stamp-soft:rgba(224,87,74,.14);
  --mat:#2A2E37; --img:brightness(.88) contrast(1.05);
  --read:"Literata",Charter,"Iowan Old Style",Georgia,serif;
  --ui:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:"Martian Mono","SFMono-Regular",Menlo,Consolas,monospace;
  --f1:12.5px; --f2:15px; --f3:17px; --f4:19.5px; --f5:clamp(32px,8vw,48px);
  --g1:4px; --g2:8px; --g3:12px; --g4:16px; --g5:24px; --g6:32px; --g7:48px;
  --pad:16px; --wrap:760px; --tap:44px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--f3)/1.55 var(--read);font-optical-sizing:auto;-webkit-font-smoothing:antialiased}
a{color:inherit}
button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--stamp);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.panel[hidden],[hidden]{display:none!important}
main,.top,.sits,.libhead,.close,.foot{max-width:var(--wrap);margin-left:auto;margin-right:auto;padding-left:var(--pad);padding-right:var(--pad)}

/* the call number: mono's only job */
.cn{font:500 var(--f1)/1.3 var(--mono);letter-spacing:0;color:var(--ink3);white-space:nowrap}

/* ---------- header ---------- */
.top{padding-top:var(--g4);padding-bottom:var(--g3)}
.brand{font:500 var(--f2)/1 var(--ui);color:var(--ink2);text-decoration:none}
.brand:hover{color:var(--ink)}
.top h1{font:700 var(--f5)/1 var(--read);letter-spacing:-.02em;margin:var(--g4) 0 var(--g2)}
.lede{margin:0;font-size:var(--f3);line-height:1.45;color:var(--ink2);max-width:32em}

/* ---------- the command bar: search, sticky from first paint ---------- */
.cmd{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.cmd .find{display:block;max-width:var(--wrap);margin:0 auto;padding:var(--g2) var(--pad)}
.cmd input{width:100%;height:var(--tap);font:400 16px/1 var(--ui);padding:0 var(--g3) 0 38px;color:var(--ink);background:var(--s1) no-repeat 12px 50%/16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23857F74' stroke-width='2.2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");border:1px solid var(--line);border-radius:10px}
.cmd input::placeholder{color:var(--ink3)}
.cmd input:focus{outline:none;border-color:var(--stamp)}

/* ---------- situations: drawer fronts ---------- */
.sits{padding-top:var(--g5);padding-bottom:var(--g5)}
.sits h2{font:600 var(--f4)/1.25 var(--read);margin:0 0 var(--g3)}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--g2)}
@media (min-width:700px){.sgrid{grid-template-columns:repeat(3,1fr)}}
.sit{display:flex;align-items:center;justify-content:space-between;gap:var(--g2);min-height:56px;padding:var(--g2) var(--g3);text-align:left;background:var(--s1);border:1px solid var(--line);border-radius:6px;cursor:pointer;font:500 var(--f2)/1.25 var(--ui);color:var(--ink)}
.sit:after{content:"";flex:none;width:7px;height:7px;border-right:1.5px solid var(--ink3);border-bottom:1.5px solid var(--ink3);transform:rotate(45deg) translate(-2px,-2px)}
.sit:hover{border-color:var(--line2)}
.sit[aria-expanded=true]{background:var(--s2);border-color:var(--stamp);box-shadow:inset 0 3px 0 var(--stamp)}
.sit[aria-expanded=true]:after{transform:rotate(-135deg) translate(-2px,-2px);border-color:var(--stamp)}
.spanel{margin-top:var(--g5)}
.sph h3{font:700 26px/1.15 var(--read);margin:0}
.sph p{margin:var(--g1) 0 0;font:400 var(--f2)/1.45 var(--ui);color:var(--ink2)}

/* ---------- the move card: a catalog record ---------- */
.mvs{display:grid;gap:var(--g3);margin:var(--g4) 0}
.mv{position:relative;background:var(--s1);border:1px solid var(--line);border-radius:6px;padding:var(--g3) var(--g4) var(--g1)}
.mv .mid{display:block;margin:0 0 var(--g2)}
.mv .mt{font:500 var(--f4)/1.4 var(--read);margin:0;letter-spacing:-.003em;text-wrap:pretty}
.fn{display:inline-flex;align-items:center;justify-content:center;vertical-align:super;margin-left:3px;min-width:22px;height:22px;padding:0 5px;font:500 11px/1 var(--mono);color:var(--stamp);background:var(--stamp-soft);border:0;border-radius:4px;cursor:pointer;position:relative;top:-2px}
.fn:before{content:"";position:absolute;inset:-11px -6px}
.fn:hover{background:var(--stamp);color:var(--stamp-ink)}
.mv .meta{display:flex;align-items:center;gap:var(--g1);margin-top:var(--g2);padding-top:var(--g1);border-top:1px dashed var(--line2);font:400 14px/1.35 var(--ui);color:var(--ink2)}
.mv .meta .src{flex:1;min-width:0;padding:var(--g2) 0}
.mv .meta a.ti{color:var(--ink);text-decoration:none;font-weight:500}
.mv .meta a.ti:hover{text-decoration:underline;text-decoration-color:var(--stamp)}
.mv .meta .by,.mv .meta .yr{color:var(--ink3)}
.icon{flex:none;width:var(--tap);height:var(--tap);display:inline-grid;place-items:center;background:transparent;border:0;border-radius:8px;color:var(--ink2);cursor:pointer}
.icon:hover{background:var(--s2);color:var(--ink)}
.icon svg{width:19px;height:19px}
.icon.ok{color:var(--stamp)}
.mv.hasimg .mt,.mv.hasimg .mid{padding-right:84px}
.mv .thumb{position:absolute;right:var(--g3);top:var(--g3);width:70px;padding:3px;background:var(--mat);border-radius:3px}
.mv .thumb img{display:block;width:100%;height:auto;max-height:96px;object-fit:cover;object-position:top;filter:var(--img)}
.tag{font:500 11px/1 var(--ui);padding:3px 6px;border-radius:3px;border:1px solid var(--line2);color:var(--ink2);white-space:nowrap;margin-left:6px;vertical-align:1px}
.tag.free{border-color:var(--stamp);color:var(--stamp)}
.more{margin:var(--g2) 0 0;border:0}
.more>summary{list-style:none;cursor:pointer;min-height:var(--tap);display:flex;align-items:center;font:500 var(--f2)/1 var(--ui);color:var(--ink)}
.more>summary::-webkit-details-marker{display:none}
.more>summary:after{content:"+";margin-left:auto;font:400 20px/1 var(--ui);color:var(--ink3)}
.more[open]>summary:after{content:"\2212"}

/* ---------- the source sheet (footnote) ---------- */
.sheetbg{position:fixed;inset:0;z-index:40;background:rgba(5,6,8,.55)}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-height:86vh;overflow:auto;background:var(--s1);border-top:1px solid var(--line2);border-radius:14px 14px 0 0;padding:var(--g2) var(--pad) calc(var(--g5) + env(safe-area-inset-bottom));max-width:var(--wrap);margin:0 auto;animation:up .22s ease-out}
@keyframes up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}
.sheet .grab{width:40px;height:4px;border-radius:2px;background:var(--line2);margin:0 auto var(--g3)}
.sheet .x{position:absolute;right:var(--g2);top:var(--g2);font:400 24px/1 var(--ui)}
.sheet .noteno{font:500 var(--f1)/1 var(--mono);color:var(--stamp)}
.sheet h3{font:600 var(--f4)/1.3 var(--read);margin:var(--g2) 0 var(--g1);padding-right:40px}
.sheet .by{font:400 var(--f2)/1.4 var(--ui);color:var(--ink2);margin:0}
.sheet .why{margin:var(--g4) 0 0;font-size:var(--f3)}
.sheet .why b{font:600 13px/1 var(--ui);display:block;margin-bottom:var(--g2);color:var(--ink3)}
.cite{margin:var(--g4) 0 0;padding:var(--g3);background:var(--s2);border-radius:6px}
.cite .ct{margin:0;padding-left:1.5em;text-indent:-1.5em;font-size:var(--f2);line-height:1.5}
.cite .lbl{margin:0 0 var(--g2)}
.btns{display:flex;flex-wrap:wrap;gap:var(--g2);margin-top:var(--g4)}
.btn{min-height:var(--tap);display:inline-flex;align-items:center;justify-content:center;padding:0 var(--g4);font:600 var(--f2)/1 var(--ui);border-radius:8px;text-decoration:none;cursor:pointer;border:1px solid var(--line2);background:transparent;color:var(--ink)}
.btn.primary{background:var(--stamp);border-color:var(--stamp);color:var(--stamp-ink)}
.btn:hover{border-color:var(--ink3)}
body.locked{overflow:hidden}

/* ---------- labels ---------- */
.lbl{font:600 13px/1.3 var(--ui);color:var(--ink3);margin:var(--g5) 0 var(--g2)}
.chips{display:flex;flex-wrap:wrap;gap:var(--g2)}
.chip{min-height:36px;display:inline-flex;align-items:center;padding:0 var(--g3);font:500 14px/1.2 var(--ui);color:var(--ink);background:var(--s1);border:1px solid var(--line);border-radius:18px;text-decoration:none}
.chip:hover{border-color:var(--line2)}
.chip.sitc{border-color:var(--stamp);color:var(--stamp)}

/* ---------- the library ---------- */
.libhead{padding-top:var(--g6)}
.libhead h2{font:700 26px/1.15 var(--read);margin:0}
.libd{margin:var(--g2) 0 0;color:var(--ink2);font:400 var(--f2)/1.5 var(--ui)}
.funnel{list-style:none;margin:var(--g4) 0 0;padding:0}
.funnel li{position:relative;display:grid;grid-template-columns:76px 1fr;column-gap:var(--g3);padding:var(--g2) 0}
.funnel li:not(:last-child):after{content:"";position:absolute;left:62px;top:30px;bottom:-4px;width:1px;background:var(--line2)}
.funnel b{grid-row:1 / span 2;font:500 18px/1.3 var(--mono);text-align:right;color:var(--ink);padding-right:20px}
.funnel .u{font:600 var(--f2)/1.3 var(--ui);color:var(--ink)}
.funnel .d{grid-column:2;font:400 14px/1.4 var(--ui);color:var(--ink3)}
.funnel .st4 b,.funnel .st4 .u{color:var(--stamp)}
.funnel .go{grid-column:2;font:600 14px/1 var(--ui);color:var(--stamp);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.hlink{margin:var(--g3) 0 0}
.hlink a{display:inline-flex;align-items:center;min-height:var(--tap);font:600 var(--f2)/1 var(--ui);color:var(--ink);text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:4px}

/* tabs: sticky under the command bar */
.bar{position:sticky;top:61px;z-index:15;background:var(--bg);border-bottom:1px solid var(--line);margin-top:var(--g4)}
.tabs{display:flex;max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);gap:var(--g1)}
.tabs button{flex:1;min-height:var(--tap);background:none;border:0;border-bottom:2px solid transparent;font:600 var(--f2)/1 var(--ui);color:var(--ink3);cursor:pointer;padding:0 var(--g1)}
.tabs button span{font:500 11px var(--mono);margin-left:4px;color:var(--ink3)}
.tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--stamp)}
@media (max-width:420px){.tabs button span{display:none}}
main{padding-top:var(--g3);min-height:60vh}

/* topic, person, era groups: subject cards with a red top edge */
details{border:0}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
.grp{background:var(--s1);border:1px solid var(--line);border-radius:6px;margin:0 0 var(--g2);scroll-margin-top:120px}
.grp>summary{position:relative;padding:var(--g3) 44px var(--g3) var(--g4);min-height:56px}
.grp>summary:after{content:"";position:absolute;right:18px;top:24px;width:8px;height:8px;border-right:1.5px solid var(--ink3);border-bottom:1.5px solid var(--ink3);transform:rotate(45deg)}
.grp[open]{border-top:3px solid var(--stamp)}
.grp[open]>summary:after{transform:rotate(-135deg);top:28px}
.grp>summary .h{display:flex;align-items:baseline;gap:var(--g2);flex-wrap:wrap}
.grp>summary b{font:600 var(--f4)/1.25 var(--read)}
.grp>summary .n{font:500 var(--f1) var(--mono);color:var(--ink3)}
.grp>summary .d{display:block;font:400 var(--f2)/1.45 var(--ui);color:var(--ink2);margin-top:2px}
.grp>summary .pv{display:none}
.grp .body{padding:0 var(--g4) var(--g4)}
.sub{border-top:1px solid var(--line)}
.sub>summary{position:relative;padding:var(--g3) 36px var(--g3) 0;min-height:var(--tap)}
.sub>summary:after{content:"+";position:absolute;right:4px;top:12px;font:400 20px/1 var(--ui);color:var(--ink3)}
.sub[open]>summary:after{content:"\2212"}
.sub>summary b{font:600 var(--f2)/1.3 var(--ui)}
.sub>summary .n{font:500 var(--f1) var(--mono);color:var(--ink3);margin-left:6px}
.sub>summary .d{display:block;font:400 14px/1.4 var(--ui);color:var(--ink3)}
.subs{margin-top:var(--g2)}

/* lineage: a shelf of years */
.lineage{margin:var(--g2) 0 0}
.steps{list-style:none;margin:0;padding:0 0 var(--g2);display:flex;gap:var(--g2);overflow-x:auto;scroll-snap-type:x proximity}
.steps li{flex:0 0 150px;scroll-snap-align:start}
.steps a,.steps li.now{display:block;height:100%;text-decoration:none;padding:var(--g2) var(--g3);background:var(--s2);border-radius:4px;border-left:2px solid var(--line2)}
.steps li.now{border-left-color:var(--stamp)}
.steps .yr{display:block;font:500 var(--f1)/1.3 var(--mono);color:var(--ink3)}
.steps .sl{display:block;font:500 14px/1.35 var(--ui);color:var(--ink);margin-top:2px}

/* rows: catalog records that open the work page */
.list{margin:0;padding:0}
a.wl{display:block;position:relative;text-decoration:none;color:inherit;padding:var(--g3) 0;border-top:1px solid var(--line);min-height:var(--tap)}
a.wl .cn{display:block;margin-bottom:3px}
a.wl .mvh{display:block;font:500 var(--f3)/1.4 var(--read);color:var(--ink)}
a.wl>.ti{font:600 var(--f3)/1.35 var(--read);color:var(--ink)}
a.wl .rc{display:block;margin-top:3px;font:400 14px/1.4 var(--ui);color:var(--ink3)}
a.wl .rc .ti{font:500 14px/1.4 var(--ui);color:var(--ink2)}
a.wl .by,a.wl .yr{font:400 14px/1.4 var(--ui);color:var(--ink3)}
a.wl .ln{margin-top:3px;font:400 var(--f2)/1.45 var(--ui);color:var(--ink2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
a.wl .flag{font:500 11px/1 var(--ui);padding:2px 5px;border-radius:3px;border:1px solid var(--line2);color:var(--ink2);margin-left:6px;vertical-align:1px}
a.wl .flag:not(.canon){border-color:var(--stamp);color:var(--stamp)}
a.wl:hover .mvh,a.wl:hover>.ti{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
a.wl.thin>.ti{font-weight:400;color:var(--ink2)}
a.wl.hasimg{padding-right:66px}
a.wl .rthumb{position:absolute;right:0;top:var(--g3);width:54px;height:70px;object-fit:cover;object-position:top;padding:2px;background:var(--mat);border-radius:2px;filter:var(--img)}
.res a.wl:first-child,.body>.list>a.wl:first-child{border-top:0}

/* people */
.alpha{display:flex;flex-wrap:wrap;gap:2px;margin:var(--g3) 0 var(--g2)}
.alpha a{min-width:32px;min-height:36px;display:inline-grid;place-items:center;font:500 var(--f1) var(--mono);text-decoration:none;color:var(--ink3);border-radius:4px}
.alpha a:hover{background:var(--s1);color:var(--ink)}
.letter{font:700 22px/1 var(--read);color:var(--ink3);margin:var(--g5) 0 var(--g2);scroll-margin-top:120px}
.mostly{margin:0 0 var(--g3);font-size:var(--f2);line-height:1.5}
.mix{display:flex;height:6px;border-radius:3px;overflow:hidden;margin:var(--g2) 0}
.mix i{display:block;height:100%}
.mixkey{display:flex;flex-wrap:wrap;gap:var(--g1) var(--g3);font:400 13px/1.4 var(--ui);color:var(--ink3)}
.mixkey i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px}
.off{list-style:none;margin:0;padding:0}
.off li{padding:var(--g2) 0;border-top:1px solid var(--line);font:400 var(--f2)/1.4 var(--read);color:var(--ink2)}
.off li .yr{font:500 var(--f1) var(--mono);color:var(--ink3)}
.off li .tp{font:400 13px var(--ui);color:var(--ink3);margin-left:6px}

/* filters: decades, kinds, groups */
.decs,.kinds{display:flex;gap:var(--g2);overflow-x:auto;padding:var(--g2) var(--pad);margin:0 calc(-1 * var(--pad));scrollbar-width:none}
.decs::-webkit-scrollbar,.kinds::-webkit-scrollbar{display:none}
.decs button,.kinds button{flex:0 0 auto;min-height:36px;padding:0 var(--g3);font:500 14px/1 var(--ui);color:var(--ink2);background:var(--s1);border:1px solid var(--line);border-radius:18px;cursor:pointer;white-space:nowrap}
.decs button span{font:500 11px var(--mono);color:var(--ink3);margin-left:6px}
.decs button[aria-pressed=true],.kinds button[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.decs button[aria-pressed=true] span{color:var(--bg);opacity:.7}
.wcount{font:400 14px/1.4 var(--ui);color:var(--ink3);margin:var(--g2) 0}
.showmore{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--tap);margin:var(--g3) 0;font:600 var(--f2)/1 var(--ui);color:var(--ink);background:var(--s1);border:1px solid var(--line);border-radius:8px;cursor:pointer}

/* today */
.intro{font:400 var(--f2)/1.5 var(--ui);color:var(--ink2);margin:var(--g2) 0}
.today-row{padding:var(--g3) 0;border-top:1px solid var(--line);display:grid;gap:4px}
.tt{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--g1) var(--g2)}
.tn{font:600 var(--f3)/1.3 var(--read);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
.tn:hover{text-decoration-color:var(--stamp)}
.tk{font:500 12px/1 var(--ui);color:var(--ink3);border:1px solid var(--line2);padding:3px 6px;border-radius:3px}
.tsig{margin:0;font:600 var(--f2)/1.4 var(--ui)}
.tf{margin:0;font:400 var(--f2)/1.45 var(--ui);color:var(--ink2)}
.tm{margin:0;font:400 13px/1.45 var(--ui);color:var(--ink3)}
.tm a{color:var(--ink2)}

/* search results */
.res h3{font:600 13px/1.3 var(--ui);color:var(--ink3);margin:var(--g5) 0 var(--g2)}
.empty,.pad{font:400 var(--f2)/1.5 var(--ui);color:var(--ink2);padding:var(--g4) 0}

/* ---------- signup ---------- */
.mini{margin:var(--g4) 0;padding:var(--g4);background:var(--s2);border-radius:8px;display:grid;gap:var(--g3)}
.mini .mc{margin:0;font:500 var(--f2)/1.45 var(--ui);color:var(--ink)}
.mini .mc.done{color:var(--stamp)}
.mini .mr{display:flex;gap:var(--g2);flex-wrap:wrap}
.mini input[type=email]{flex:1 1 200px;min-width:0;height:var(--tap);font:400 16px var(--ui);padding:0 var(--g3);color:var(--ink);background:var(--bg);border:1px solid var(--line2);border-radius:8px}
.mini button{height:var(--tap);padding:0 var(--g4);font:600 var(--f2)/1 var(--ui);color:var(--stamp-ink);background:var(--stamp);border:0;border-radius:8px;cursor:pointer}
.mini .hp,.cap .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.mini .err,.cap .err{margin:0;font:400 14px var(--ui);color:var(--stamp)}
.close{margin-top:var(--g7);padding-top:var(--g5);border-top:1px solid var(--line)}
.close h2{font:700 26px/1.15 var(--read);margin:0 0 var(--g2)}
.close p{margin:0 0 var(--g3);font:400 var(--f2)/1.5 var(--ui);color:var(--ink2);max-width:36em}
.cap{display:grid;gap:var(--g2);margin:var(--g3) 0;position:relative;max-width:520px}
.cap label{font:500 14px var(--ui);color:var(--ink2)}
.cap .row{display:flex;flex-wrap:wrap;gap:var(--g2)}
.cap input[type=email]{flex:1 1 220px;min-width:0;height:48px;font:400 16px var(--ui);padding:0 var(--g3);color:var(--ink);background:var(--s1);border:1px solid var(--line2);border-radius:8px}
.cap button{height:48px;padding:0 var(--g4);font:600 var(--f2)/1 var(--ui);color:var(--stamp-ink);background:var(--stamp);border:0;border-radius:8px;cursor:pointer}
.cap .done{margin:0;color:var(--stamp);font:500 var(--f2) var(--ui)}
.fine{font:400 13px var(--ui);color:var(--ink3)}
.foot{margin-top:var(--g6);padding-top:var(--g4);padding-bottom:var(--g7);border-top:1px solid var(--line);font:400 13px/1.5 var(--ui);color:var(--ink3)}
.subbar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--s2);border-top:1px solid var(--line2);padding:var(--g3) var(--pad) calc(var(--g3) + env(safe-area-inset-bottom))}
.subbar .mini{margin:0 auto;max-width:var(--wrap);padding:0 36px 0 0;background:transparent}
.subbar .x{position:absolute;right:var(--g2);top:var(--g2);width:var(--tap);height:var(--tap);background:none;border:0;color:var(--ink2);font:400 24px/1 var(--ui);cursor:pointer}

/* ---------- work pages ---------- */
.wp .top{padding-bottom:0}
.work{max-width:var(--wrap);margin:0 auto;padding:var(--g3) var(--pad) 0}
.card{background:var(--s1);border:1px solid var(--line);border-radius:8px;padding:var(--g4);position:relative}
.card .cardhead{display:flex;justify-content:space-between;align-items:baseline;gap:var(--g2);padding-bottom:var(--g2);margin-bottom:var(--g3);border-bottom:1px dashed var(--line2)}
.card .cardhead .cn{font-size:13px;color:var(--ink2)}
.card .cardhead .mid{font:500 var(--f1) var(--mono);color:var(--stamp)}
.work .kicker{font:400 14px/1.4 var(--ui);color:var(--ink3);margin:0 0 var(--g3)}
.work .kicker a{color:var(--ink2);text-decoration:none;display:inline-block;padding:var(--g2) 0}
.work .kicker a:hover{color:var(--ink)}
.work h1.move{font:600 clamp(24px,6vw,32px)/1.25 var(--read);letter-spacing:-.01em;margin:0}
.work .src{font:600 var(--f4)/1.3 var(--read);margin:var(--g4) 0 2px}
.work .src.big{font:700 clamp(24px,6vw,32px)/1.2 var(--read);margin:0}
.work .by{margin:0;font:400 var(--f2)/1.45 var(--ui);color:var(--ink2)}
.work .by .yr{color:var(--ink3)}
.work .flag{font:500 11px/1 var(--ui);padding:3px 6px;border-radius:3px;border:1px solid var(--line2);color:var(--ink2);margin-left:8px;vertical-align:1px}
.work .flag:not(.canon){border-color:var(--stamp);color:var(--stamp)}
.work .acts{display:flex;flex-wrap:wrap;gap:var(--g2);margin-top:var(--g4)}
.work .act{min-height:var(--tap);padding:0 var(--g4);font:600 14px/1 var(--ui);background:transparent;color:var(--ink);border:1px solid var(--line2);border-radius:8px;cursor:pointer}
.work .act:hover{border-color:var(--ink3)}
.work .gem{font-size:var(--f3);line-height:1.6;margin:0}
.work .note{font:400 var(--f2)/1.55 var(--ui);color:var(--ink2);margin:var(--g3) 0 0}
.orig{margin:var(--g5) 0 0;padding:var(--g2);background:var(--mat);border-radius:6px}
.orig img{display:block;width:100%;height:auto;filter:var(--img)}
.orig figcaption{font:400 13px/1.45 var(--ui);color:var(--ink3);margin:var(--g2) 2px 0}
.get{margin:var(--g5) 0 0;display:grid;gap:var(--g3)}
.get a.free{justify-self:start;min-height:var(--tap);display:inline-flex;align-items:center;padding:0 var(--g4);font:600 var(--f2)/1 var(--ui);color:var(--stamp-ink);background:var(--stamp);border-radius:8px;text-decoration:none}
.get .find{margin:0;font:400 var(--f2)/1.45 var(--ui);color:var(--ink2)}
.get .cite .act{margin-top:var(--g3)}
.work .rel a{display:block;padding:var(--g2) 0;border-top:1px solid var(--line);text-decoration:none}
.work .rel b{font:600 var(--f2)/1.4 var(--read)}
.work .rel span{font:400 14px/1.4 var(--ui);color:var(--ink3)}
.shelf{display:flex;gap:var(--g2);overflow-x:auto;margin:0 calc(-1 * var(--pad));padding:var(--g1) var(--pad) var(--g2);scroll-snap-type:x proximity;scrollbar-width:none}
.shelf::-webkit-scrollbar{display:none}
.shelf a{flex:0 0 136px;scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;min-height:120px;padding:var(--g3);background:var(--s1);border:1px solid var(--line);border-radius:4px;text-decoration:none;color:var(--ink)}
.shelf a .cn{font-size:11px;white-space:normal;line-height:1.35}
.shelf a b{font:500 14px/1.3 var(--read)}
.shelf a .y{margin-top:auto;font:400 12px var(--ui);color:var(--ink3)}
.shelf a.here{border-color:var(--stamp);box-shadow:inset 0 3px 0 var(--stamp)}
.back{margin:var(--g5) 0 0}
.back a{display:inline-flex;align-items:center;min-height:var(--tap);font:600 var(--f2) var(--ui);color:var(--ink);text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:4px}

@media (prefers-reduced-motion:reduce){.sheet{animation:none}}
.results{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) var(--g6);min-height:50vh}
.searching .sits,.searching .libhead,.searching .bar,.searching main{display:none}
.mv .mid{margin:0 0 6px}
.funnel .u{grid-column:2}
.subbar .mini{gap:var(--g2)}
.subbar .mini .mc{font-size:14px}
.subbar .x{top:2px}

/* ---- regrade fixes ---- */
.cn{color:var(--ink2);letter-spacing:.02em}
.mvid{font:500 var(--f1)/1.3 var(--mono);color:var(--stamp);letter-spacing:.02em}
.mv .mid{display:flex;justify-content:space-between;align-items:baseline;gap:var(--g2)}
.sheet .noteno{display:flex;flex-direction:column;gap:2px;font:inherit}
.sheet .noteno .cn{font-size:var(--f1)}
/* situations: a drawer index, not a settings menu */
.sgrid{display:block;border-top:1px solid var(--line)}
@media (min-width:700px){.sgrid{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--g5)}}
.sit{width:100%;min-height:52px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:0 2px;font:500 var(--f3)/1.3 var(--read)}
.sit b{font-weight:500;flex:1}
.sit .n{font:500 var(--f1)/1 var(--mono);color:var(--ink3)}
.sit:after{display:none}
.sit:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:4px}
.sit[aria-expanded=true]{background:transparent;box-shadow:inset 3px 0 0 var(--stamp);padding-left:12px;border-color:var(--line)}
.sit[aria-expanded=true] b,.sit[aria-expanded=true] .n{color:var(--stamp)}
/* targets */
.alpha a{min-width:40px;min-height:44px}
.chip,.decs button,.kinds button{min-height:44px;border-radius:22px}
/* stamps, not pills */
.tag,a.wl .flag,.work .flag{border-radius:1px;border-width:1.5px;font:600 10.5px/1 var(--ui);letter-spacing:.03em;padding:3px 5px;transform:rotate(-2deg);display:inline-block}
/* people: index entries, not cards */
#people .grp{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;margin:0}
#people .grp[open]{border-top:2px solid var(--stamp)}
#people .grp>summary{padding-left:0}
#people .grp .body{padding-left:0;padding-right:0}
/* show-the-moves list: red only on the page markers */

/* ================= v3: a reference library ================= */
/* masthead: logo, search, browse */
.mast{position:sticky;top:0;z-index:25;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.mastin{max-width:var(--wrap);margin:0 auto;padding:6px var(--pad);display:flex;align-items:center;justify-content:space-between;min-height:56px}
.wm{display:inline-grid;justify-items:start;font:700 19px/.92 "Newsreader",var(--read);font-variation-settings:"opsz" 48;letter-spacing:-.012em;color:var(--ink);text-decoration:none}
.wm .dot{position:relative}
.wm .dot:after{content:"";position:absolute;left:50%;top:.02em;width:.25em;height:.25em;margin-left:-.125em;border-radius:50%;background:var(--stamp)}
.mastbtns{display:flex;align-items:center;gap:var(--g1)}
.iconbtn{width:var(--tap);height:var(--tap);display:inline-grid;place-items:center;background:transparent;border:0;border-radius:10px;color:var(--ink);cursor:pointer}
.iconbtn svg{width:20px;height:20px}
.iconbtn:hover,.browsebtn:hover{background:var(--s1)}
.browsebtn{height:var(--tap);display:inline-flex;align-items:center;gap:var(--g2);padding:0 var(--g3);font:600 var(--f2)/1 var(--ui);color:var(--ink);background:transparent;border:1px solid var(--line2);border-radius:22px;cursor:pointer}
.browsebtn svg{width:18px;height:18px}
.searchrow{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) var(--g2);display:flex;gap:var(--g2);align-items:center}
.searchrow .find{flex:1}
.searchrow input{width:100%;height:var(--tap);font:400 16px/1 var(--ui);padding:0 var(--g3);color:var(--ink);background:var(--s1);border:1px solid var(--line2);border-radius:10px}
.searchrow input:focus{outline:none;border-color:var(--stamp)}
.textbtn{min-height:var(--tap);display:inline-flex;align-items:center;padding:0 var(--g2);font:600 14px/1 var(--ui);color:var(--ink2);background:none;border:0;cursor:pointer;text-decoration:none}
.textbtn:hover{color:var(--ink)}
.results{padding-top:var(--g3)}
.searching .page{display:none}

/* hero */
.page>section,.page>footer{max-width:var(--wrap);margin-left:auto;margin-right:auto;padding-left:var(--pad);padding-right:var(--pad)}
.hero{padding-top:var(--g6);padding-bottom:var(--g5)}
.hero h1{font:700 var(--f5)/1 var(--read);letter-spacing:-.02em;margin:0 0 var(--g3)}
.hero .lede{font-size:18px;line-height:1.5;color:var(--ink);max-width:30em;margin:0}
.count{margin:var(--g3) 0 0;font:400 14px/1.4 var(--ui);color:var(--ink3)}
.heroacts{display:flex;flex-wrap:wrap;gap:var(--g2);margin-top:var(--g5)}
.heroacts .btn{min-height:48px}

/* the reading list */
.reading,.wander{padding-top:var(--g5);padding-bottom:var(--g5);border-top:1px solid var(--line)}
.reading h2,.wander h2,.libbar h2{font:700 26px/1.15 var(--read);margin:0}
.sectd{margin:var(--g2) 0 var(--g4);font:400 var(--f2)/1.5 var(--ui);color:var(--ink2)}
.chap{border-top:1px solid var(--line)}
.chap>summary{display:flex;align-items:baseline;gap:var(--g3);min-height:52px;padding:var(--g3) 28px var(--g3) 0;position:relative}
.chap>summary:after{content:"+";position:absolute;right:2px;top:14px;font:400 22px/1 var(--ui);color:var(--ink3)}
.chap[open]>summary:after{content:"\2212"}
.chap .cr{font:500 var(--f1)/1 var(--mono);color:var(--ink3);min-width:48px}
.chap>summary b{font:600 var(--f3)/1.3 var(--read)}
.rl{list-style:none;margin:0 0 var(--g3);padding:0}
.ri{display:grid;grid-template-columns:40px 1fr;gap:var(--g2);padding:var(--g3) 0;border-top:1px dashed var(--line);text-decoration:none;color:inherit}
.ri .no{font:500 15px/1.6 var(--mono);color:var(--stamp)}
.ri .rt{display:grid;gap:3px}
.ri b{font:600 var(--f3)/1.35 var(--read)}
.ri .rc{font:400 14px/1.4 var(--ui);color:var(--ink3)}
.ri .why{font:400 var(--f2)/1.5 var(--read);color:var(--ink2)}
.ri:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.rc .flag{font:600 10.5px/1 var(--ui);letter-spacing:.03em;padding:2px 5px;border:1.5px solid var(--stamp);color:var(--stamp);border-radius:1px;margin-left:8px;display:inline-block;transform:rotate(-2deg);vertical-align:1px}

/* doors: the side quests */
.doors{border-top:1px solid var(--line);margin-top:var(--g4)}
.door{display:grid;grid-template-columns:1fr auto;column-gap:var(--g3);row-gap:2px;width:100%;padding:var(--g3) 2px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;text-decoration:none;color:var(--ink);cursor:pointer;min-height:64px;align-content:center}
.door b{font:600 var(--f3)/1.3 var(--read)}
.door .n{font:500 var(--f1)/1.6 var(--mono);color:var(--ink3);grid-column:2;grid-row:1}
.door .d{grid-column:1 / -1;font:400 14px/1.4 var(--ui);color:var(--ink2)}
.door:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.door.rand b:after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--stamp);margin-left:8px;vertical-align:3px}
.door.main{border-bottom-width:2px;border-bottom-color:var(--stamp)}

/* the library panels */
.library{padding-top:var(--g5);border-top:1px solid var(--line);scroll-margin-top:57px}
.libbar{display:flex;align-items:center;justify-content:space-between;gap:var(--g2);margin-bottom:var(--g3)}
.library .grp{scroll-margin-top:70px}
.letter{scroll-margin-top:70px}
/* rows lead with the title now */
a.wl>.ti{display:block;font:600 var(--f3)/1.35 var(--read);color:var(--ink)}
a.wl .rc{display:block;margin-top:2px;font:400 14px/1.4 var(--ui);color:var(--ink3)}
a.wl:hover>.ti{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}

/* the menu sheet */
.menu{padding-bottom:calc(var(--g5) + env(safe-area-inset-bottom))}
.menu .x{position:absolute;right:var(--g2);top:var(--g2);font:400 26px/1 var(--ui)}
.menuh{font:700 22px/1.2 var(--read);margin:var(--g1) 0 var(--g3)}
.menu .door:first-of-type{border-top:1px solid var(--line)}

/* signup: one quiet block after the reading list, one at the end */
.mini button{white-space:nowrap}
.close{border-top:1px solid var(--line)}
.work .card{margin-top:0}
.shelfline{margin:var(--g2) 0 0;font:400 14px/1.4 var(--ui);color:var(--ink3)}
.try{margin:var(--g5) 0 0;padding:var(--g4);border:1px dashed var(--line2);border-radius:8px}
.try .lbl{margin-top:0}
.tryl{margin:0;font:500 var(--f4)/1.4 var(--read)}
.try .acts{margin-top:var(--g3)}
.back{display:flex;flex-wrap:wrap;gap:var(--g4)}
.wp .mast .browsebtn{text-decoration:none}
a.wl .rc .onshelf{display:block;margin:1px 0 0}
.res .chips .chip{transform:none}

/* ================= work page: one focused reading column ================= */
.work{max-width:640px;padding-top:var(--g5)}
.rlpos{display:flex;justify-content:space-between;align-items:center;margin:0 0 var(--g4);font:500 14px/1 var(--ui);color:var(--ink3)}
.rlpos a{color:var(--stamp);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.rlpos span{font:500 var(--f1) var(--mono)}
.entry h1{font:700 clamp(30px,7vw,44px)/1.1 var(--read);letter-spacing:-.015em;margin:0;text-wrap:balance}
.entry .by{margin:var(--g2) 0 0;font:400 var(--f3)/1.4 var(--ui);color:var(--ink2)}
.work .orig{margin:var(--g5) 0 0}
.lead{margin:var(--g5) 0 0;font:400 20px/1.55 var(--read);color:var(--ink)}
.fact{margin:var(--g4) 0 0;padding-left:var(--g4);border-left:2px solid var(--stamp);font:400 var(--f3)/1.6 var(--read);color:var(--ink2)}
.readit{margin:var(--g5) 0 0}
.readit .free{display:inline-flex;align-items:center;min-height:48px;padding:0 var(--g5);font:600 var(--f2)/1 var(--ui);color:var(--stamp-ink);background:var(--stamp);border-radius:8px;text-decoration:none}
.work .find{margin:var(--g5) 0 0;font:400 var(--f2)/1.5 var(--ui);color:var(--ink2)}
.folds{margin:var(--g5) 0 0;border-top:1px solid var(--line)}
.fold{border-bottom:1px solid var(--line)}
.fold>summary{position:relative;min-height:52px;display:flex;align-items:center;font:600 var(--f2)/1 var(--ui);color:var(--ink);padding-right:28px}
.fold>summary:after{content:"+";position:absolute;right:2px;font:400 22px/1 var(--ui);color:var(--ink3)}
.fold[open]>summary:after{content:"\2212"}
.fold .ct{margin:0 0 var(--g3);padding-left:1.5em;text-indent:-1.5em;font-size:var(--f2);line-height:1.55;color:var(--ink2)}
.fold .tryl{margin:0 0 var(--g3);font:500 var(--f3)/1.5 var(--read)}
.fold .act,.fold .acts{margin-bottom:var(--g4)}
.next{margin:var(--g6) 0 0;display:grid;gap:var(--g2)}
.nx{display:grid;gap:3px;padding:var(--g3) var(--g4);background:var(--s1);border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink)}
.nx:first-child{border-color:var(--line2)}
.nx .nk{font:600 13px/1.3 var(--ui);color:var(--ink3)}
.nx:first-child .nk{color:var(--stamp)}
.nx b{font:600 var(--f3)/1.35 var(--read)}
.nx .nb{font:400 14px/1.4 var(--ui);color:var(--ink3)}
.nx:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.morelinks{display:flex;flex-direction:column;margin:var(--g4) 0 0}
.morelinks a{min-height:var(--tap);display:flex;align-items:center;border-bottom:1px solid var(--line);font:500 var(--f2)/1.3 var(--ui);color:var(--ink);text-decoration:none}
.morelinks a:after{content:"";margin-left:auto;width:7px;height:7px;border-right:1.5px solid var(--ink3);border-top:1.5px solid var(--ink3);transform:rotate(45deg)}
.wp .mini{margin-top:var(--g6)}
.work>.nx{margin-top:var(--g6)}
.rh{font:600 13px/1.3 var(--ui);color:var(--ink3);margin:var(--g6) 0 var(--g1)}
.rl2 a{display:grid;gap:3px;padding:var(--g3) 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.rl2 b{font:600 var(--f3)/1.35 var(--read)}
.rl2 span{font:400 14px/1.45 var(--ui);color:var(--ink3)}
.rl2 a:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.rl2+.morelinks{margin-top:0}
.work>.nx .nk{color:var(--stamp)}
.foot .sitefoot{display:flex;flex-wrap:wrap;gap:4px 18px;margin:0 0 8px}
.foot .sitefoot a{display:inline-flex;align-items:center;min-height:40px;color:var(--ink2);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
.menuh2{font:600 13px/1.3 var(--ui);color:var(--ink3);margin:var(--g5) 0 0;padding-bottom:var(--g2);border-bottom:1px solid var(--line)}

/* ================= night pass: one header, a tools row, the card drawer, the library card, rails ================= */
.mast{position:static;background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}
.mastin.lh{min-height:60px;padding:8px var(--pad)}
.mast .sitenav{font-family:var(--ui);color:var(--ink)}
.mast .sitenav a[aria-current=page]{border-bottom-color:var(--stamp)}
.wm{font-size:21px}
.tools{position:sticky;top:0;z-index:25;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.toolsin{max-width:var(--wrap);margin:0 auto;padding:var(--g2) var(--pad);display:flex;gap:var(--g2);align-items:center}
.toolsin .find{flex:1;min-width:0}
.toolsin input{width:100%;height:var(--tap);font:400 16px/1 var(--ui);padding:0 var(--g3) 0 38px;color:var(--ink);background:var(--s1) no-repeat 12px 50%/16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23857F74' stroke-width='2.2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");border:1px solid var(--line2);border-radius:10px;-webkit-appearance:none;appearance:none}
.toolsin input::placeholder{color:var(--ink3)}
.toolsin input:focus{outline:none;border-color:var(--stamp)}
.toolsin input::-webkit-search-cancel-button{-webkit-appearance:none}
.searching .tools .browsebtn{display:none}
.cardhint{margin:var(--g3) 0 0;font:400 13px/1.4 var(--ui);color:var(--ink3)}
.libcard{padding-top:0;padding-bottom:var(--g5)}
.cardbox{background:var(--s1);border:1px solid var(--line2);border-radius:10px;padding:var(--g4);position:relative;overflow:hidden}
.cardbox:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--stamp)}
.cardtop{display:flex;justify-content:space-between;align-items:baseline;gap:var(--g2);font:600 12px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--stamp)}
.cardno{font:500 13px var(--mono);color:var(--ink3);letter-spacing:.04em;text-transform:none}
.cardbox h2{font:700 28px/1.1 var(--read);margin:var(--g3) 0 var(--g3)}
.cardfacts{display:grid;grid-template-columns:auto 1fr;gap:var(--g1) var(--g4);margin:0;font:400 14px/1.5 var(--ui)}
.cardfacts dt{color:var(--ink3)}
.cardfacts dd{margin:0;color:var(--ink)}
.cardacts{display:flex;flex-wrap:wrap;gap:var(--g2);margin-top:var(--g4)}
.ri.pulled .no{color:var(--ink3)}
.ri.pulled .no:after{content:" ✓";color:var(--stamp)}
.flag.myth{border-color:var(--ink2);color:var(--ink2)}
.drawer{padding-bottom:calc(var(--g6) + env(safe-area-inset-bottom))}
.drawer .x{position:absolute;right:var(--g2);top:var(--g2);font:400 26px/1 var(--ui)}
.drawer .catcard{margin-top:36px}
.catcard{margin-top:var(--g3);padding:var(--g4);background:#F2EBDD;color:#2A2724;border-radius:4px;box-shadow:0 2px 0 #CFC4AD,0 10px 24px rgba(0,0,0,.35);background-image:repeating-linear-gradient(transparent 0 27px,rgba(42,39,36,.08) 27px 28px);background-position:0 72px}
.cctop{display:flex;justify-content:space-between;gap:var(--g2);font:500 12px/1.3 var(--mono);color:#6B6357}
.cctop .cn{color:#B3241B}
.ccshelf{font:600 11px/1.3 var(--ui);letter-spacing:.06em;text-transform:uppercase}
.catcard h3{font:700 clamp(22px,5.6vw,28px)/1.15 var(--read);margin:var(--g3) 0 2px;color:#2A2724;text-wrap:balance}
.ccby{margin:0;font:400 15px/1.4 var(--ui);color:#5A534A}
.ccgem{margin:var(--g4) 0 0;font:400 17px/1.5 var(--read);color:#2A2724}
.ccnote{margin:var(--g2) 0 0;font:400 14px/1.5 var(--ui);color:#5A534A}
.catcard .btns{margin-top:var(--g4)}
.catcard .btn{border-color:#B3241B;color:#2A2724}
.catcard .btn.primary{background:#B3241B;color:#FDF9F2}
.linsec{padding:var(--g4) 0;border-top:1px solid var(--line)}
.linsec h3{font:600 var(--f4)/1.3 var(--read);margin:0}
.linsec h3 a{text-decoration:none}
.linsec h3 a:hover{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.lint{margin:2px 0 var(--g3);font:400 var(--f2)/1.45 var(--ui);color:var(--ink2)}
.mline{margin:0;font:500 var(--f4)/1.45 var(--read)}
.seeit{display:inline-flex;align-items:center;min-height:var(--tap);margin-top:var(--g2);font:600 var(--f2)/1 var(--ui);color:var(--stamp);text-decoration:none}
.seeit:after{content:"";margin-left:8px;width:7px;height:7px;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg)}
.seeit:hover{text-decoration:underline;text-underline-offset:4px}
.treach{font:500 12px/1 var(--mono);color:var(--ink3)}
#libintro:empty{display:none}
#moves .grp>summary b{font-variant-numeric:tabular-nums}

/* ---------- work page v4: one fixed format, a rail you can swipe along ---------- */
.wp .mast{border-bottom:1px solid var(--line)}
.rail{position:sticky;top:0;z-index:25;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.railin{max-width:640px;margin:0 auto;padding:0 var(--g1);display:grid;grid-template-columns:var(--tap) 1fr var(--tap);align-items:center;min-height:48px}
.rail .rk{display:flex;justify-content:center;align-items:baseline;gap:8px;font:500 13px/1.3 var(--ui);color:var(--ink2);min-width:0;white-space:nowrap;text-decoration:none}
.rail .rk b{min-width:0;overflow:hidden;text-overflow:ellipsis}
.rail .rk .pos{flex:none;margin-left:0}
.rail .rk b{font-weight:600;color:var(--ink)}
.rail .rk .pos{font:500 12px var(--mono);color:var(--ink3);margin-left:8px}
.rail a.rk:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.rail .arr{width:var(--tap);height:var(--tap);display:inline-grid;place-items:center;color:var(--ink);text-decoration:none;border-radius:8px}
.rail .arr:hover{background:var(--s1)}
.rail .arr.off{visibility:hidden}
.rail .arr svg{width:20px;height:20px}
.kick{display:flex;flex-wrap:wrap;align-items:center;gap:var(--g1) var(--g3);margin:0 0 var(--g3);font:400 13px/1.4 var(--ui);color:var(--ink3)}
.kick a{color:var(--ink2);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.kick a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.kick .cn{font-size:12px}
.entry .flags{margin:var(--g2) 0 0;display:flex;gap:var(--g2);flex-wrap:wrap}
.entry .flags .flag{margin:0;transform:none;display:inline-flex;align-items:center;min-height:24px;border-radius:2px}
.useit{margin:var(--g5) 0 0;padding:var(--g4);background:var(--s1);border:1px solid var(--line2);border-left:3px solid var(--stamp);border-radius:6px}
.useit .lbl{margin:0 0 var(--g2)}
.useit .tryl{margin:0;font:500 var(--f4)/1.45 var(--read)}
.useit .acts{margin-top:var(--g3);display:flex;gap:var(--g2);flex-wrap:wrap}
.readit{margin:var(--g5) 0 0;display:flex;flex-wrap:wrap;gap:var(--g2) var(--g3);align-items:center}
.readit .pdn{font:400 14px/1.4 var(--ui);color:var(--ink3)}
.citebox{margin:var(--g5) 0 0;padding-top:var(--g4);border-top:1px solid var(--line)}
.citebox .lbl{margin:0 0 var(--g2)}
.citebox .ct{margin:0 0 var(--g3);padding-left:1.5em;text-indent:-1.5em;font-size:var(--f2);line-height:1.55;color:var(--ink2)}
.further{margin:var(--g6) 0 0}
.further .lbl{margin:0 0 var(--g1)}
.mvlink{display:grid;gap:3px;margin:var(--g4) 0 0;padding:var(--g3) var(--g4);background:var(--s1);border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink)}
.mvlink .nk{font:600 13px/1.3 var(--ui);color:var(--stamp)}
.mvlink b{font:600 var(--f3)/1.35 var(--read)}
.mvlink span.nb{font:400 14px/1.45 var(--ui);color:var(--ink2)}
.mvlink:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.pn{margin:var(--g6) 0 0;display:grid;grid-template-columns:1fr 1fr;gap:var(--g2)}
.pn a{display:grid;gap:3px;align-content:start;padding:var(--g3);background:var(--s1);border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink);min-height:96px}
.pn a.nextc{border-color:var(--line2)}
.pn .nk{font:600 12px/1.3 var(--ui);color:var(--ink3);letter-spacing:.04em;text-transform:uppercase}
.pn a.nextc .nk{color:var(--stamp)}
.pn b{font:600 var(--f2)/1.35 var(--read);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pn .nb{font:400 13px/1.4 var(--ui);color:var(--ink3)}
.pn a:hover b{text-decoration:underline;text-decoration-color:var(--stamp);text-underline-offset:3px}
.pn a.off{visibility:hidden}
.swipehint{margin:var(--g2) 0 0;text-align:center;font:400 12px/1.4 var(--ui);color:var(--ink3)}
.work.slide-left{animation:sl .22s ease-out}
.work.slide-right{animation:sr .22s ease-out}
@keyframes sl{from{transform:translateX(24px);opacity:.3}to{transform:none;opacity:1}}
@keyframes sr{from{transform:translateX(-24px);opacity:.3}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.work.slide-left,.work.slide-right{animation:none}}
.myth .fact{border-left-color:var(--ink2)}
.mythtag{display:inline-block;margin:var(--g4) 0 0;padding:var(--g2) var(--g3);font:600 13px/1.4 var(--ui);color:var(--ink);background:var(--s2);border-radius:6px}