*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
:root{--ink:#26222B;--soft:#6F6A75;--line:#E3E0E6;--shadow:#ECEAEE}
body{margin:0;background:#fff;color:var(--ink);font:400 16px/1.85 "Zen Old Mincho","Hiragino Mincho ProN","Yu Mincho",serif;overflow-wrap:break-word}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}
a:focus-visible{outline:2px solid currentColor;outline-offset:3px}
ul{list-style:none;margin:0;padding:0}
svg .pe{fill:#F7EBA4;stroke:#D9C06A}
svg .ey{fill:#E7A33A}
svg .ce{fill:#88A456}
svg .lf{fill:#A9C38A}
svg .rib{stroke:#8BA66C;fill:none}

/* the circle's header, on the front page */
.circle{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px clamp(16px,4vw,48px);border-bottom:1px solid var(--line)}
.circle .id{display:flex;align-items:center;gap:12px}
.circle .mark{width:38px;height:38px;display:block}
.circle h1{font-size:20px;line-height:1.3;font-weight:700;margin:0}

/* the catalog of little books */
.catalog{max-width:1120px;margin:0 auto;padding:clamp(28px,5vw,60px) clamp(16px,4vw,48px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,300px));justify-content:center;gap:clamp(24px,5vw,64px)}
.book{display:block;text-decoration:none}
.jacket{position:relative;aspect-ratio:148/210;overflow:hidden;background:var(--c);box-shadow:7px 7px 0 var(--shadow);transition:transform .15s}
.book:hover .jacket{transform:translateY(-4px)}
.jacket .art{position:absolute;inset:0;width:100%;height:100%;display:block}
.jacket .ti{position:absolute;left:8%;top:6%;font-weight:700;font-size:calc(var(--fs,1)*clamp(26px,3vw,36px));line-height:1.12;max-width:70%}
.jacket .au{position:absolute;left:8%;top:calc(6% + var(--tl,1)*1.12*var(--fs,1)*clamp(26px,3vw,36px) + 8px);font-size:13px}
.jacket .vt{position:absolute;right:7%;top:6%;writing-mode:vertical-rl;text-orientation:upright;letter-spacing:.2em;font-size:clamp(16px,1.6vw,20px);line-height:1}
.book h2{font-size:17px;margin:18px 0 0;line-height:1.5}
.book p{margin:0;color:var(--soft);font-size:14px;line-height:1.6}
.book p.blurb{color:var(--ink);font-size:15px;line-height:1.65;margin:4px 0 6px}
.lede{margin:0 0 22px;color:var(--soft);font-size:15px;line-height:1.75}

/* inside a book */
.site{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 24px;padding:14px 20px}
.ribbon{height:27px;background:url(img/ribbon-lavender.png) 0 0/30px 27px repeat-x;image-rendering:pixelated}   /* her pick 11-06: "the purple one is better" */
.seal{display:flex;justify-content:flex-end;margin:26px 0 0}.seal span{display:block;width:38px;height:38px;background:url(img/orn-seal.png) 0 0/38px 38px;image-rendering:pixelated}
.lotus{display:flex;align-items:center;gap:16px;margin:44px 0 0}.lotus i{flex:1;height:1px;background:var(--line)}
.lotus span{width:30px;height:30px;background:url(img/orn-lotus.png) 0 0/30px 30px;image-rendering:pixelated}
.lotus+.notes{border-top:0;margin-top:1em;padding-top:0}
.site .home{display:flex;align-items:center;gap:10px;font-weight:600;text-decoration:none}
.site .mark{width:24px;height:24px;display:block}
.site .pin{flex:none;background:url(img/pin-24.png) 0 0/192px 24px no-repeat;background-image:-webkit-image-set(url(img/pin-24.png) 1x,url(img/pin-48.png) 2x);background-image:image-set(url(img/pin-24.png) 1x,url(img/pin-48.png) 2x);image-rendering:pixelated}
.site .home:hover .pin,.site .home:focus-visible .pin{animation:pp-gleam .56s steps(7) 1}
@keyframes pp-gleam{from{background-position:-24px 0}to{background-position:-192px 0}}
@media (prefers-reduced-motion:reduce){.site .home:hover .pin,.site .home:focus-visible .pin{animation:none}}
.site nav a{margin-left:16px;text-decoration:none}
.site nav a:first-child{margin-left:0}
.site a:hover,.site nav a[aria-current]{text-decoration:underline}
.contents,.reading{max-width:680px;margin:0 auto;padding:36px 20px}
h1{font-size:34px;line-height:1.2;margin:0}
.contents h1{margin-bottom:16px}
.head{margin-bottom:28px}
.meta{margin:6px 0 0;font-size:14px;color:var(--soft)}
.works a{display:flex;justify-content:space-between;gap:1em;align-items:baseline;padding:5px 0;text-decoration:none;line-height:1.45;border-top:1px solid var(--line)}
.works li:last-child a{border-bottom:1px solid var(--line)}
.works a:hover .t{text-decoration:underline}
.works .t{min-width:0}
.works .y{flex:0 1 auto;max-width:45%;text-align:right;font-size:13px;color:var(--soft)}
.text p{margin:0 0 1.05em}
.text .l{display:block;padding-left:1.4em;text-indent:-1.4em}
.text figure{margin:0 0 1.6em}
.text img{display:block;width:100%;height:auto}
html{scroll-behavior:smooth}
sup.fn{line-height:0}
sup.fn a,a.fnref{text-decoration:none;color:#7A6A9A;font-size:.72em;padding:0 1px}
a.fnref{font-size:1em}
.notes{margin:2.6em 0 0;padding-top:1.2em;border-top:1px solid var(--line);font-size:14.5px;line-height:1.7;color:var(--soft)}
.notes h2{font-size:16px;margin:0;color:var(--ink)}
.notes .by{margin:0 0 .8em;font-style:italic}
.notes ol{padding-left:1.6em;margin:0}
.notes li{margin:0 0 .6em}
.notes a{color:var(--ink)}
.notes a.src{font-size:12.5px;color:var(--soft)}
a.back{text-decoration:none;color:#7A6A9A}
:target{scroll-margin-top:24px;background:#F3EFF8;transition:background 1.5s}
.credit{margin:1.6em 0 0;font-size:14px;font-style:italic;color:var(--soft)}
.bib{max-width:1120px;margin:0 auto;padding:36px 20px}
.bib h1{margin-bottom:10px}
.bib .lede{max-width:640px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.chips button{font:inherit;font-size:13.5px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 12px;cursor:pointer}
.chips button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.count{font-size:13px;color:var(--soft);margin:14px 0 10px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:26px 20px}
.tile{display:flex;flex-direction:column;gap:3px;line-height:1.35}
.tile[hidden]{display:none}
.tile .cv{display:block;aspect-ratio:2/3;overflow:hidden;background:#F3F1EC;box-shadow:5px 5px 0 var(--shadow);margin-bottom:8px;transition:transform .15s}
.tile .cv:hover{transform:translateY(-3px)}
.tile .cv img{width:100%;height:100%;object-fit:cover;display:block}
.tile .made{position:relative;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;padding:14px 12px;background:var(--c,#F1E9D6)}
.tile .made .mt{font-weight:700;font-size:17px;line-height:1.2}
.tile .made .mc{font-size:12.5px;color:var(--soft)}
.tile .made svg{position:absolute;right:10px;bottom:10px;width:22px;height:22px}
.tile .tt{font-weight:700;font-size:14.5px}
.tile .cr{font-size:12.5px;color:var(--soft)}
.tile .in{font-size:12px;color:var(--soft)}
.tile .in a{color:var(--ink)}
.bib .credit{margin-top:36px}
.k-scripture{--c:#F1E9D6}.k-book{--c:#DCE6D3}.k-essay{--c:#E8E2EF}.k-poem{--c:#F3DDE0}.k-film{--c:#DCE7EE}.k-song{--c:#F2E4CC}.k-game{--c:#E6E6E6}
.reading.wide{max-width:1040px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:28px 48px;align-items:start}
.pair.one{grid-template-columns:minmax(0,680px)}
.pair .lab{font-size:12.5px;color:var(--soft);margin:0 0 10px;border-bottom:1px solid var(--line);padding-bottom:4px}
.orig{color:#4A4550}
.orig p{margin:0 0 1em}
@media (max-width:760px){.pair{grid-template-columns:minmax(0,1fr)}}
.works-list{list-style:none;margin:0;padding:0}
.work{padding:22px 0;border-top:1px solid var(--line)}
.work:last-child{border-bottom:1px solid var(--line)}
.work h2{font-size:24px;margin:0}
.work h2 a{text-decoration:none}
.work .role{margin:2px 0 8px;color:var(--soft);font-size:14px}
.work p{margin:0 0 6px}
.work .go{font-size:14px}
.exlibris{display:flex;justify-content:center;padding:10px 20px 40px}
.plate{text-align:center;padding:22px 34px 18px;border:1px solid #CFC6DD;outline:1px solid #CFC6DD;outline-offset:4px;max-width:340px}
.plate .mark{width:34px;height:34px;display:block;margin:0 auto 6px}
.plate .ex{margin:0;font-size:13px;font-style:italic;color:var(--soft)}
.plate .nm{margin:0;font-weight:700;font-size:20px}
.plate .mo{margin:6px 0 0;font-style:italic;font-size:15px}
.argument{margin:0 0 2em;padding:1em 1.2em;background:#F6F4F8;border-left:3px solid #CFC6DD;font-size:15.5px;line-height:1.8}
.argument p{margin:0}
.argument .lab{font-weight:700}
.moral{margin:2.6em 0 0;padding-top:1.4em;border-top:1px solid var(--line);color:var(--soft);font-size:15px;line-height:1.8}
.moral p{margin:0}
.moral .lab{font-weight:700;color:var(--ink)}
.moral a{color:var(--ink)}
.turn{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25em 1.5em;margin-top:36px;padding-top:10px;border-top:1px solid var(--ink);font-size:14px}
.colophon{max-width:680px;margin:0 auto;padding:36px 20px 32px;font-size:12.5px;color:var(--soft)}
.colophon p{margin:0}
@media (max-width:720px){.catalog{grid-template-columns:minmax(0,320px)}.jacket .ti{font-size:calc(var(--fs,1)*34px)}.jacket .au{top:calc(6% + var(--tl,1)*1.12*var(--fs,1)*34px + 8px)}}
.platform .preamble{margin:22px 0 26px;font-size:18px;line-height:1.9}
.platform .preamble p{margin:0 0 .8em}
.platform .toc{padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14.5px}
.platform .toc ul{columns:2;column-gap:2em}
.platform .toc li{break-inside:avoid;line-height:1.95}
.platform .toc a{text-decoration:none}
.platform .toc a:hover{text-decoration:underline}
.platform section{scroll-margin-top:12px}
.platform h2{font-size:24px;line-height:1.3;margin:1.9em 0 2px}
.platform .sec-lede{margin:0 0 1.1em;color:var(--soft);font-style:italic}
.platform .plank{margin:0 0 1em}
@media (max-width:520px){.platform .toc ul{columns:1}}
.aligned{margin:0 0 8px}
.arow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 48px;padding:14px 0;border-top:1px solid var(--line)}
.arow.head{padding:0;border:0}
.arow .lab{font-size:12.5px;color:var(--soft);margin:0 0 6px}
.arow .h p{margin:0 0 .7em}
.arow .h p:last-child{margin:0}
.arow .o .l{display:block}
.arow .o[lang=pgd]{font-size:15px;line-height:1.7;letter-spacing:.01em}
.arow .o[lang=pgd] .l{padding-left:1.2em;text-indent:-1.2em}
.arow .o .r{color:#A59EAE}
.arow .o .wit{margin:6px 0 0;font-size:12px;color:var(--soft);letter-spacing:0}
.arow.gap .o[lang=pgd]{color:var(--soft)}
.arow .mk{margin:0;color:var(--soft);font-style:italic;font-size:14px}
.aligned + .credit{font-size:13px;font-style:normal}
@media (max-width:760px){.arow{grid-template-columns:minmax(0,1fr);gap:8px}.arow .o{font-size:14.5px;color:var(--soft)}.arow.head{display:none}}
.about .her{margin:18px 0 10px;font-size:20px;line-height:1.75}
.about .motto{color:var(--soft);margin:0 0 28px}
.about > h2{font-size:15px;color:var(--soft);font-weight:400;margin:0 0 4px}
.colophon a{color:inherit}
.photos figure{margin:0 0 30px}
.photos img{display:block;width:100%;height:auto;background:var(--shadow)}
.photos figcaption{margin:9px 0 0;font-size:14.5px;line-height:1.7;color:var(--soft);max-width:680px}
.sets{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:30px 26px;margin-top:8px}
.sets a{display:block;text-decoration:none}
.sets img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--shadow)}
.sets .t{display:block;margin-top:10px;font-weight:700;font-size:17px;line-height:1.4}
.sets .c{display:block;font-size:13.5px;color:var(--soft)}
.sets a:hover .t{text-decoration:underline}
.sayings .saying{margin:0;padding:22px 0;display:flow-root}
.sayings .saying+.saying::before{content:"";display:block;width:30px;height:30px;margin:-6px auto 26px;background:url(img/orn-wheel.png) 0 0/30px 30px;image-rendering:pixelated}
.bookpic{float:right;width:96px;height:96px;margin:4px 0 12px 24px;background:0 0/96px 96px no-repeat;image-rendering:pixelated}
.bp-poems{background-image:url(img/bp-poems.png)}.bp-essays{background-image:url(img/bp-essays.png)}.bp-translations{background-image:url(img/bp-translations.png)}.bp-platform{background-image:url(img/bp-platform.png)}.bp-photographs{background-image:url(img/bp-photographs.png)}.bp-bibliography{background-image:url(img/bp-bibliography.png)}.bp-sayings{background-image:url(img/bp-sayings.png)}.bp-works{background-image:url(img/bp-works.png)}.bp-about{background-image:url(img/bp-about.png)}
.bp-poems{background-size:384px 96px;animation:pp-moth .9s steps(4) infinite}
@keyframes pp-moth{from{background-position:0 0}to{background-position:-384px 0}}
@media (prefers-reduced-motion:reduce){.bp-poems{animation:none}}
.bookpic~ul,.bookpic~.chips,.bookpic~.sets{clear:both}
.ep{display:block;width:96px;height:96px;margin:0 auto 12px;background:0 0/96px 96px no-repeat;image-rendering:pixelated}
.ep-goose{background-image:url(img/ep-goose.png)}.ep-beggar{background-image:url(img/ep-beggar.png)}.ep-adam{background-image:url(img/ep-adam.png)}
.vign,.broadside,.tailpiece{text-align:center}
.vign blockquote,.broadside blockquote,.tailpiece blockquote{margin:0;font-style:italic;line-height:1.7}
.vign figcaption,.broadside figcaption,.tailpiece figcaption{margin-top:8px;font-size:12.5px;color:var(--soft);line-height:1.5}
.vign{float:right;width:230px;margin:4px 0 16px 30px}.vign blockquote{font-size:15px}.vign blockquote p{margin:0}
.broadside{clear:both;margin:30px 0 32px;padding:24px 0 26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.broadside .geese{display:block;width:240px;height:48px;margin:0 auto 18px;background:url(img/geese.png) 0 0/240px 48px no-repeat;image-rendering:pixelated}
.broadside blockquote{font-size:16px}.broadside blockquote p{margin:0 0 1.1em}.broadside blockquote p:last-child{margin-bottom:0}
.tailpiece{clear:both;margin:54px 0 8px;padding-top:30px;border-top:1px solid var(--line)}.tailpiece blockquote{font-size:16px}.tailpiece blockquote p{margin:0}
@media (max-width:640px){.vign{float:none;width:auto;margin:16px 0 22px}}
@media (max-width:560px){.bookpic{float:none;display:block;margin:0 0 10px}}
.sayings .look{float:right;width:144px;height:144px;margin:4px 0 10px 24px;background:url(img/last-look.png) 0 0/144px 144px no-repeat;image-rendering:pixelated}
@media (max-width:560px){.sayings .look{float:none;display:block;margin:6px 0 14px}}
.sayings .saying:first-of-type{border-top:0}
.sayings .when{margin:0 0 4px;font-size:13px;color:var(--soft)}
.sayings .text p{margin:0 0 .6em;font-size:17.5px;line-height:1.8}
.sayings .text p:last-child{margin-bottom:0}
.site{border-top:4px solid var(--accent,transparent)}
.run{margin:0 0 10px;font-size:13.5px}
.run a{text-decoration:none;color:var(--soft)}
.run a:hover{color:var(--ink)}
.run span{display:inline-block;margin-right:.6em;padding:0 .45em;background:var(--book,#eee);color:var(--ink);letter-spacing:.12em}
.contents .yr{font-size:15px;font-weight:700;margin:26px 0 4px;color:var(--accent,var(--soft))}
.toc a{flex-wrap:wrap}
.toc .sub{flex-basis:100%;font-size:13.5px;color:var(--soft);line-height:1.55;padding-bottom:3px}
.after{max-width:1120px;margin:0 auto;padding:0 clamp(16px,4vw,48px) 30px;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:20px 56px;align-items:start}
.after{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"lately lately" "snap said"}   /* her pick and Naomi's, 11-06: D */
.after .lately{grid-area:lately}.after .said{grid-area:said}.after .snap{grid-area:snap}
@media (max-width:760px){.after{grid-template-columns:minmax(0,1fr);grid-template-areas:"lately" "said" "snap"}}
.after h2{font-size:15px;color:var(--soft);font-weight:400;margin:0 0 6px}
.lately .y{white-space:nowrap;max-width:none}
.said{margin:0;padding:22px 24px;background:#F6F4F8;border-left:3px solid #CFC6DD}
.said blockquote{margin:0;font-size:18px;line-height:1.75}
.said .tea{float:right;width:96px;height:96px;margin:-14px -10px 2px 12px;background:url(img/tea.png) 0 0/288px 96px no-repeat;image-rendering:pixelated;animation:pp-steam 2.4s steps(3) infinite}
@keyframes pp-steam{from{background-position:0 0}to{background-position:-288px 0}}
@media (prefers-reduced-motion:reduce){.said .tea{animation:none}}
.said figcaption{margin-top:10px;font-size:13px;color:var(--soft)}
.said figcaption a{color:inherit}
@media (max-width:760px){.after{grid-template-columns:minmax(0,1fr)}}
.fetch{max-width:860px;margin:0 auto;padding:clamp(36px,7vw,80px) 20px 44px;display:grid;grid-template-columns:minmax(0,210px) minmax(0,1fr);gap:20px clamp(28px,5vw,56px);align-items:start}
.fetch .fig{padding-top:30px}
.fetch .bouquet{display:block;width:100%;height:auto}
.fetch .pinbig{display:block;width:192px;height:192px;background:url(img/pin-48.png) 0 0/1536px 192px no-repeat;image-rendering:pixelated}
.fetch .fig:hover .pinbig{animation:pp-gleam-big .56s steps(7) 1}
@keyframes pp-gleam-big{from{background-position:-192px 0}to{background-position:-1536px 0}}
@media (prefers-reduced-motion:reduce){.fetch .fig:hover .pinbig{animation:none}}
.fetch .prompt{margin:0 0 6px;font:12.5px/1.5 "SF Mono",Menlo,Consolas,monospace;color:#A9A3AF;letter-spacing:.02em}
.fetch h1{font-size:30px;line-height:1.2;margin:0}
.fetch hr{border:0;border-top:1px solid var(--line);width:9em;margin:14px 0 12px}
.fetch dl{margin:0}
.fetch dl div{display:grid;grid-template-columns:10.4em minmax(0,1fr);gap:0 14px;padding:4px 0;line-height:1.6}
.fetch dt{display:grid;grid-template-columns:4.6em auto;font-size:14px;color:var(--soft);white-space:nowrap}
.fetch dt span{color:var(--ink);letter-spacing:.06em;font-size:13px}
.fetch dd{margin:0}
.fetch dd a{text-decoration-color:#CFC6DD}
.fetch dd a:hover{text-decoration-color:currentColor}
.fetch .sws{display:flex;gap:0;margin:18px 0 0}
.fetch .sw{display:block;width:30px;height:16px;opacity:.85}
.fetch .sw:hover{opacity:1}
.fetch .sw:hover{transform:translateY(-2px)}
.fetch .sw:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media (max-width:640px){.fetch{grid-template-columns:minmax(0,1fr)}.fetch .fig{width:144px;padding-top:0}.fetch .pinbig{width:144px;height:144px;background-size:1152px 144px}@keyframes pp-gleam-big{from{background-position:-144px 0}to{background-position:-1152px 0}}
 .fetch dl div{grid-template-columns:minmax(0,1fr);gap:0}.fetch dt{font-size:13px}}
/* OLED dark: true black, on a switch in the menu bar (her word, 11-06: "how do i turn off oled? that should be more obvious");
   with no choice made it follows the device's dark setting */
html.oled{--ink:#E8E4EC;--soft:#9E98A6;--line:#25222B;--shadow:#121016;color-scheme:dark}
html.oled body{background:#000}
html.oled sup.fn a,html.oled a.fnref,html.oled a.back{color:#B9A8DE}
html.oled :target{background:#17121F}
html.oled .chips button{background:#000}
html.oled .chips button[aria-pressed="true"]{background:var(--ink);color:#000;border-color:var(--ink)}
html.oled .tile .cv{background:#141218}
html.oled .tile .made,html.oled .tile .made *{color:#26222B}
html.oled .orig{color:#CFCAD6}
html.oled .plate{border-color:#3A3542;outline-color:#3A3542}
.site nav a{position:relative}.site nav a[aria-current]{text-decoration:none}
.site nav a[aria-current]::after{content:"";position:absolute;left:50%;top:100%;width:10px;height:10px;margin:2px 0 0 -5px;background:url(img/orn-diamond.png) 0 0/10px 10px;image-rendering:pixelated}
@media (max-width:640px){.site nav a[aria-current]{text-decoration:underline}.site nav a[aria-current]::after{display:none}}
.platform .toc li{padding-left:20px;background:url(img/orn-diamond.png) 0 .62em/10px 10px no-repeat;image-rendering:pixelated}
.platform h2::before{content:"";display:inline-block;width:10px;height:10px;margin:0 12px 0 0;vertical-align:.2em;background:url(img/orn-diamond.png) 0 0/10px 10px;image-rendering:pixelated}
.mode::before{content:"";display:inline-block;width:18px;height:18px;margin:0 6px 0 -4px;vertical-align:-4px;background:url(img/orn-moon.png) 0 0/18px 18px;image-rendering:pixelated}
body[data-book=essays] article.text>p:first-child::first-letter{float:left;font:400 36px/52px "DotGothic16",monospace;padding:0 17px;margin:6px 12px 0 0;color:#4B3566;background:url(img/init-frame.png) 0 0/52px 52px no-repeat;image-rendering:pixelated}
main.reading{position:relative}
.bookmark{position:absolute;top:0;right:-70px;width:27px;height:150px;background:url(img/bookmark.png) 0 0/27px 150px;image-rendering:pixelated}
@media (max-width:860px){.bookmark{display:none}}
.argument{position:relative}
.argument::after{content:"";position:absolute;inset:6px 6px 6px 4px;border:2px dashed #C9BFDC;pointer-events:none}
::selection{background:#E4DAF2}
html.oled .site nav a[aria-current]::after,html.oled .platform .toc li{background-image:url(img/orn-diamond-oled.png)}
html.oled .platform h2::before{background-image:url(img/orn-diamond-oled.png)}
html.oled .mode::before{background-image:url(img/orn-sun.png)}
html.oled body[data-book=essays] article.text>p:first-child::first-letter{color:#F4EFE6;background-image:url(img/init-frame-oled.png)}
html.oled .bookmark{background-image:url(img/bookmark-oled.png)}
html.oled .argument::after{border-color:#4A3D63}
html.oled ::selection{background:#4A3D63;color:#fff}
.tonight:not(.on){display:none}
#moon{width:24px;height:24px;vertical-align:-6px;margin-right:8px;image-rendering:pixelated}
.colophon .tend{display:flex;align-items:center;gap:10px;margin:0 0 8px}
.lantern{display:inline-block;flex:none;width:22px;height:32px;background:url(img/lantern-dark.png) 0 0/22px 32px;image-rendering:pixelated}
html.dusk .lantern{background-image:url(img/lantern-lit.png);filter:drop-shadow(0 0 6px rgba(242,198,107,.6))}
html.oled:not(.dusk) .lantern{background-image:url(img/lantern-dark-oled.png)}
.leaf{display:inline-block;width:14px;height:12px;margin-left:8px;vertical-align:1px;background:url(img/orn-sprout.png) 0 0/14px 12px;image-rendering:pixelated}
.snap{margin:0;padding:10px;background:#F6F4F8;position:relative}
.snap::after{content:"";position:absolute;inset:5px;border:2px dashed #C9BFDC;pointer-events:none}
.snap img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.snap figcaption{margin-top:8px;font-size:13px;color:var(--soft)}.snap figcaption a{color:inherit}
html.oled .snap{background:#0D0B11}html.oled .snap::after{border-color:#4A3D63}
html{cursor:url(img/cur-arrow.png) 0 0,auto;cursor:-webkit-image-set(url(img/cur-arrow.png) 1x,url(img/cur-arrow@2x.png) 2x) 0 0,auto}
a,button,summary,label,.sw{cursor:url(img/cur-link.png) 0 0,pointer;cursor:-webkit-image-set(url(img/cur-link.png) 1x,url(img/cur-link@2x.png) 2x) 0 0,pointer}
::-webkit-scrollbar{width:14px;height:14px}::-webkit-scrollbar-track{background:#F6F3FA}
::-webkit-scrollbar-thumb{background:url(img/scroll-thumb.png) 0 0/14px 14px repeat-y;image-rendering:pixelated}
@supports not selector(::-webkit-scrollbar){html{scrollbar-color:#BDB1D2 #F6F3FA}}
html.oled ::-webkit-scrollbar-track{background:#0D0B11}html.oled ::-webkit-scrollbar-thumb{background-image:url(img/scroll-thumb-oled.png)}
html.oled .ribbon{background-image:url(img/ribbon-plum.png)}
html.oled .argument,html.oled .said{background:#0D0B11;border-left-color:#4A4157}
html.oled .arow .o .r{color:#7E7788}
html.oled .run span{color:#26222B}
html.oled .fetch .prompt{color:#6E6878}
html.oled .fetch dd a{text-decoration-color:#4A4157}
.mode{font:inherit;font-size:13px;color:var(--soft);background:none;border:1px solid var(--line);border-radius:999px;padding:1px 11px;margin-left:16px;cursor:pointer}
.mode:hover{color:var(--ink);border-color:var(--ink)}
.mode:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
body[data-book=poems]{--book:#DCE6D3;--accent:#7E9A64}body[data-book=sayings]{--book:#F0E3D9;--accent:#B98A6A}body[data-book=essays]{--book:#E8E2EF;--accent:#8B7BA6}body[data-book=translations]{--book:#DCE7EE;--accent:#6E93A8}body[data-book=platform]{--book:#D6E6DF;--accent:#5E9A82}body[data-book=photographs]{--book:#E4E1EC;--accent:#8A84A6}body[data-book=bibliography]{--book:#EFE6D6;--accent:#A88B5A}