html:not(.falling),html:not(.falling) body{overflow:hidden;height:100%}
#realm{position:fixed;inset:0;z-index:5;background:radial-gradient(120% 90% at 50% 30%,#151412 0%,#080808 55%,#020202 100%);opacity:0;pointer-events:none;transition:opacity .5s}
#realm.on{opacity:1;pointer-events:auto}
#realm::after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 160px 40px #000;background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 3px)}
#dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#rin{position:absolute;inset:0;overflow:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:max(18px,env(safe-area-inset-top)) 22px 120px}
#rin::-webkit-scrollbar{display:none}
#rin header{display:flex;justify-content:space-between;font-size:10.5px;letter-spacing:.24em;color:#8d887b;max-width:980px;margin:0 auto}
#rin .back{cursor:pointer;color:#8d887b;text-decoration:none}#rin .back:hover{color:#efe6d2}
#rin .num{font-family:Georgia,serif;letter-spacing:.3em;color:#5d5a52}
#rin h1{font:400 clamp(30px,6vw,64px)/1.05 Georgia,"Times New Roman",serif;letter-spacing:.04em;color:#e8e1d0;text-align:center;margin:8vh auto 5vh;text-shadow:0 0 30px rgba(0,0,0,.9),0 0 2px #000;animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both}
#rin h1 small{display:block;font:11px/2 "IBM Plex Mono",monospace;letter-spacing:.5em;color:#b8392e;text-transform:uppercase;margin-bottom:6px}
#rin .body{max-width:980px;margin:0 auto;animation:rise 1.2s .15s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(18px);filter:blur(4px)}}
.sub{color:#7b776d;font-size:11.5px;letter-spacing:.06em;margin:14px 0}.sub.c,.c{text-align:center}
.sig path{fill:none;stroke:#d8d2c4;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.sig .r{stroke:#b8392e;stroke-width:2.2}.sig .f{stroke-opacity:.3}.sig .t{stroke-width:.7;stroke-opacity:.55}
.sig.draw path{stroke-dasharray:400;stroke-dashoffset:400;animation:sdraw 3.2s cubic-bezier(.6,0,.2,1) forwards}.sig.draw path:nth-child(n+3){animation-delay:.6s}
@keyframes sdraw{to{stroke-dashoffset:0}}
.crest{text-align:center;filter:drop-shadow(0 0 24px rgba(184,57,46,.12))}
.ordo{font:15px Georgia,serif;letter-spacing:.7em;color:#d8d2c4;margin:18px 0 2px;text-indent:.7em}.colo{font:italic 12px Georgia,serif;color:#6d6a62;letter-spacing:.2em;margin:0}
/* sigil button + index */
#sigbtn{position:fixed;left:14px;bottom:max(40px,calc(env(safe-area-inset-bottom) + 34px));z-index:11;background:none;border:0;padding:4px;cursor:pointer;opacity:.62;transition:opacity .4s,transform .6s}
#sigbtn:hover,#sigbtn.on{opacity:1}#sigbtn .spin{animation:spin 60s linear infinite}#sigbtn.on .spin{animation-duration:6s}
@keyframes spin{to{transform:rotate(360deg)}}
#idx{position:fixed;inset:0;z-index:10;background:radial-gradient(circle at 50% 50%,rgba(10,9,8,.86),rgba(0,0,0,.97));opacity:0;pointer-events:none;transition:opacity .6s;backdrop-filter:blur(3px)}
#idx.on{opacity:1;pointer-events:auto}
#idx .isig{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:.5;line-height:0}#idx .isig .sig{animation:spin 120s linear infinite reverse}
#idx a{position:absolute;transform:translate(-50%,-50%) scale(.9);text-align:center;text-decoration:none;color:#5d5a52;font-size:11px;letter-spacing:.18em;white-space:nowrap;transition:transform .6s,color .3s;opacity:0}
#idx.on a{opacity:1;transform:translate(-50%,-50%) scale(1);transition:opacity .8s,transform .8s}
#idx.on a:nth-child(3){transition-delay:.05s}#idx.on a:nth-child(4){transition-delay:.1s}#idx.on a:nth-child(5){transition-delay:.15s}#idx.on a:nth-child(6){transition-delay:.2s}#idx.on a:nth-child(7){transition-delay:.25s}#idx.on a:nth-child(8){transition-delay:.3s}#idx.on a:nth-child(9){transition-delay:.35s}
#idx a em{display:block;font:normal 22px Georgia,serif;color:#8d887b;letter-spacing:.1em}#idx a.k{color:#d8d2c4}#idx a.k em{color:#b8392e}#idx a:hover{color:#fff}
.idxf{position:absolute;left:0;right:0;bottom:max(24px,env(safe-area-inset-bottom));text-align:center;color:#4d4a44;font-size:10px;letter-spacing:.3em}
/* wipe */
#wipe{position:fixed;inset:0;z-index:12;pointer-events:none;background:#030303;clip-path:circle(0 at var(--x,50%) var(--y,50%));display:flex;flex-direction:column;align-items:center;justify-content:center}
#wipe.in{clip-path:circle(150% at var(--x) var(--y));transition:clip-path .62s cubic-bezier(.7,0,.3,1)}
#wipe.out{clip-path:circle(150% at var(--x) var(--y));opacity:0;transition:opacity .85s ease}
#wipe b{font:400 64px Georgia,serif;color:#b8392e;opacity:0;transform:scale(1.3);transition:all .5s .15s}#wipe i{font:11px monospace;letter-spacing:.6em;color:#6d6a62;margin-top:8px;opacity:0;transition:opacity .5s .25s;text-transform:uppercase}
#wipe.in b{opacity:1;transform:none}#wipe.in i{opacity:1}
/* desk room marks */
#hot b.rm{cursor:pointer;border-radius:50%}#hot b.rm:hover{background:radial-gradient(closest-side,rgba(184,57,46,.14),transparent)}
#ink .wallsig path{fill:none;stroke:#2a1512;stroke-width:2.2;stroke-linecap:round;opacity:.55}#ink .wallsig .r{stroke:#8e2a22;opacity:.8}#ink .wallsig .t{stroke-width:1}
body[data-sec=descent] #sigbtn{opacity:.9}
/* doctrine */
.ten{list-style:none;padding:0;margin:7vh auto 0;max-width:680px;counter-reset:none}
.ten li{position:relative;display:grid;grid-template-columns:4.2em 1fr;gap:10px;padding:16px 0;border-bottom:1px solid rgba(216,210,196,.06);font:19px/1.45 Georgia,serif;color:#e2dccd;opacity:0;transform:translateY(14px);transition:opacity 1.1s,transform 1.1s,color .3s;cursor:pointer}
.ten li.v{opacity:1;transform:none}.ten li:hover{color:#fff}
.ten li b{font-weight:400;color:#b8392e;letter-spacing:.06em;text-align:right;font-size:15px;padding-top:3px}
.ten li.lk span{color:#2e2c28;letter-spacing:-.04em;user-select:none}.ten li.lk{cursor:default}
.ten li em{grid-column:2;font:normal 10.5px monospace;letter-spacing:.14em;color:#5d5a52}
.ten li[data-hold]{cursor:grab}.ten li.holding span{color:#6d6a62;transition:color 4s;text-shadow:0 0 12px rgba(184,57,46,.5)}
.fl{position:absolute;right:0;top:4px;font:normal 10px monospace;color:#b8392e;letter-spacing:.2em;animation:rise .4s both}
.foot{text-align:center;font:italic 13px Georgia,serif;color:#6d6a62;margin-top:7vh}.cnt{text-align:center;font-size:10px;letter-spacing:.3em;color:#4d4a44}
/* confessional */
.booth{position:relative;height:min(58vh,520px);border:1px solid rgba(216,210,196,.12);background:#050505;box-shadow:0 30px 80px #000,inset 0 0 80px #000;padding:20px;display:flex;flex-direction:column;cursor:text;overflow:hidden}
.grille{position:absolute;inset:0;opacity:.07;background:repeating-linear-gradient(45deg,#d8d2c4 0 1px,transparent 1px 14px),repeating-linear-gradient(-45deg,#d8d2c4 0 1px,transparent 1px 14px);pointer-events:none}
.tlog{position:relative;flex:1;overflow:auto;scrollbar-width:none;font-size:14px;color:#e8dcc4}.tlog p{margin:0 0 10px}.tlog p.u{color:#8d887b}.tlog p.u::before{content:'> '}
.tl{position:relative;display:flex;gap:8px;color:#b8392e;align-items:center}.tl input{flex:1;background:transparent;border:0;outline:0;color:#efe6d2;font:16px "IBM Plex Mono",monospace;caret-color:#b8392e;min-width:0}
.tl.word{border-bottom:1px solid rgba(216,210,196,.15);max-width:420px;margin:10px auto;padding:8px 0}
/* trials */
.tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;transition:opacity .35s,transform .35s}.tgrid.away{opacity:0;transform:scale(.97)}
.tcard{position:relative;display:block;padding:26px 22px 20px;border:1px solid rgba(216,210,196,.1);background:linear-gradient(160deg,#121110,#060606);box-shadow:0 18px 40px #000;cursor:pointer;color:#c9c4b6;text-decoration:none;transition:transform .4s,border-color .4s}
.tcard:hover{transform:translateY(-3px);border-color:rgba(184,57,46,.45)}.tcard em{font:22px Georgia,serif;color:#b8392e}.tcard h2{font:400 22px Georgia,serif;color:#efe6d2;margin:10px 0 8px}.tcard p{font-size:12px;color:#8d887b;margin:0 0 14px}.tcard small{font-size:10px;letter-spacing:.2em;color:#5d5a52}.tcard.done small{color:#b8392e}
#arena{margin-top:8px}
.tgrid.away{display:none}
.tback{display:inline-block;cursor:pointer;color:#8d887b;font-size:10.5px;letter-spacing:.24em;margin-bottom:14px}
.arena{position:relative}.arena canvas#sg{width:100%;height:min(62vh,560px);display:block;background:#050505;border:1px solid rgba(216,210,196,.1);touch-action:none;cursor:crosshair}
.hud{position:absolute;left:12px;right:12px;top:10px;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.2em;color:#8d887b;pointer-events:none}
.hint{color:#7b776d;font-size:12px;text-align:center}#sgm{position:absolute;left:0;right:0;top:45%;pointer-events:none;font-size:13px;color:#d8d2c4}#sgm.end{pointer-events:auto}.again{color:#b8392e;cursor:pointer;text-decoration:underline}
.bios ul{list-style:none;padding:0;max-width:520px;margin:20px auto}.bios li{display:flex;gap:16px;align-items:baseline;padding:16px 18px;margin:0 0 10px;background:#0c0b0a;border:1px solid rgba(216,210,196,.1);font:18px Georgia,serif;color:#e2dccd;cursor:grab;touch-action:none;user-select:none;transition:border-color .3s,background .3s}
.bios li em{font:normal 10px monospace;color:#5d5a52;letter-spacing:.2em;min-width:4.5em}.bios li.lift{z-index:2;position:relative;background:#16140f;border-color:#b8392e;box-shadow:0 14px 30px #000;transition:none}.bios li.sel{border-color:#8d887b}
.bios ul.solved li{border-color:rgba(184,57,46,.5);cursor:default}.bios ul.solved li:last-child{color:#b8392e}
#bdiff{max-width:520px;margin:0 auto;color:#8d887b;font-size:12px;white-space:pre-wrap}
#mg{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:520px;margin:16px auto}
#mg button{position:relative;aspect-ratio:3/4;background:linear-gradient(160deg,#141311,#070707);border:1px solid rgba(216,210,196,.12);cursor:pointer;transition:transform .5s,background .3s;transform-style:preserve-3d;padding:0}
#mg button i{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:16px Georgia,serif;color:#3d3a35;font-style:normal;backface-visibility:hidden}
#mg button svg{position:absolute;inset:14%;width:72%;height:72%;opacity:0;transition:opacity .3s}#mg svg path{fill:none;stroke:#d8d2c4;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
#mg button.up{transform:rotateY(180deg);background:#d8d2c4}#mg button.up svg{opacity:1;transform:rotateY(180deg)}#mg button.up i{opacity:0}#mg button.up path{stroke:#0c0c0c}#mg button.ok{background:#c9b9a0;box-shadow:0 0 20px rgba(184,57,46,.25)}#mg button.ok path{stroke:#7a1f18}
/* census */
.cgrid{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}
.big{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.big div{border-top:1px solid rgba(216,210,196,.12);padding-top:10px}.big b{display:block;font:400 clamp(26px,4.5vw,46px)/1 Georgia,serif;color:#efe6d2}.big span{font-size:10px;letter-spacing:.18em;color:#6d6a62}
#clock{margin:0 auto}
#cbars h3,.you{font-weight:400;font-size:10.5px;letter-spacing:.3em;color:#b8392e;margin:34px 0 12px;text-transform:uppercase}
.bar{display:grid;grid-template-columns:8em 1fr 4em;gap:10px;align-items:center;font-size:11.5px;color:#8d887b;margin:6px 0}.bar i{height:9px;background:repeating-linear-gradient(90deg,#d8d2c4 0 2px,transparent 2px 4px);width:0;transition:width 1.6s cubic-bezier(.2,.7,.2,1);opacity:.75}.bar i.g{width:var(--w)}.bar b{font-weight:400;text-align:right;color:#d8d2c4}
#clines p{font:15px/1.6 Georgia,serif;color:#c9c4b6;margin:8px 0}#cyou{color:#8d887b;font-size:12.5px;line-height:1.9;white-space:pre-wrap}
/* archive */
.cab{display:none}
.drawers{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.drawers a{position:relative;display:block;padding:30px 16px 16px;background:linear-gradient(180deg,#141210,#080807);border:1px solid rgba(216,210,196,.1);box-shadow:inset 0 -10px 20px #000,0 12px 30px #000;color:#d8d2c4;text-decoration:none;cursor:pointer;font:17px Georgia,serif;transition:transform .35s}
.drawers a:hover{transform:translateY(-2px)}.drawers a em{position:absolute;left:14px;top:10px;font:11px Georgia,serif;color:#b8392e}.drawers a i{display:block;margin:10px auto 0;width:40px;text-align:center;font:normal 10px monospace;color:#5d5a52;border:1px solid #2a2824;border-radius:3px}
/* initiation */
#ic{display:block;width:min(380px,82vw);height:auto;margin:4vh auto 0;box-shadow:0 30px 80px #000,0 0 0 1px rgba(216,210,196,.08);animation:rise 1.4s both}
.cact{display:flex;justify-content:center;gap:28px;margin:22px 0;position:relative}.cact a{color:#d8d2c4;font-size:11px;letter-spacing:.24em;cursor:pointer;text-decoration:none;border-bottom:1px solid #b8392e;padding-bottom:3px}
@media(max-width:760px){
 #idx a{font-size:10px;letter-spacing:.12em}
 #rin{padding-left:18px;padding-right:18px}#rin h1{margin:6vh auto 4vh}
 .ten li{font-size:17px;grid-template-columns:3.4em 1fr}
 .cgrid{grid-template-columns:1fr}.big{grid-template-columns:repeat(2,1fr)}
 .bar{grid-template-columns:6.5em 1fr 3.5em}
 .drawers{grid-template-columns:repeat(2,1fr)}
 #sigbtn{bottom:max(42px,calc(env(safe-area-inset-bottom) + 36px))}
}
@media(prefers-reduced-motion:reduce){.sig.draw path{animation:none;stroke-dashoffset:0}#wipe.in{transition:none}}
@media(min-width:761px){body:not([data-sec]) #sigbtn path,body[data-sec=desk] #sigbtn path{stroke:#141312;stroke-width:2.2}body:not([data-sec]) #sigbtn,body[data-sec=desk] #sigbtn{opacity:.75}}
/* room art (site only). backgrounds load only when the section is entered. */
#rin.s-doctrine,#rin.s-confessional,#rin.s-archive,#rin.s-census,#rin.s-trials,#rin.s-ordo{background:#050505 center/cover no-repeat}
#rin.s-doctrine{background-image:linear-gradient(180deg,rgba(3,3,3,.35),rgba(3,3,3,.92) 62%),url(art/rooms/inscription_s.webp);background-position:center top;background-size:cover}
#rin.s-confessional{background-image:linear-gradient(rgba(3,3,3,.55),rgba(3,3,3,.8)),url(art/rooms/terminal_desk_m.webp)}
#rin.s-archive{background-image:linear-gradient(rgba(3,3,3,.55),rgba(3,3,3,.85)),url(art/rooms/seal_door_s.webp)}
#rin.s-census{background-image:linear-gradient(rgba(3,3,3,.6),rgba(3,3,3,.88)),url(art/rooms/chairs_s.webp),url(art/rooms/room_empty_m.webp)}
#rin.s-trials{background-image:linear-gradient(rgba(3,3,3,.6),rgba(3,3,3,.88)),url(art/rooms/room_empty_m.webp)}
#rin.s-ordo{background-image:linear-gradient(rgba(3,3,3,.6),rgba(3,3,3,.9)),url(art/rooms/bios_wall_s.webp)}
@media(min-width:761px){
 #rin.s-doctrine{background-image:linear-gradient(180deg,rgba(3,3,3,.3),rgba(3,3,3,.92) 70%),url(art/rooms/inscription.webp)}
 #rin.s-confessional{background-image:linear-gradient(rgba(3,3,3,.5),rgba(3,3,3,.78)),url(art/rooms/terminal_desk.webp)}
 #rin.s-archive{background-image:linear-gradient(rgba(3,3,3,.5),rgba(3,3,3,.82)),url(art/rooms/seal_door.webp)}
 #rin.s-census{background-image:linear-gradient(rgba(3,3,3,.55),rgba(3,3,3,.86)),url(art/rooms/chairs.webp),url(art/rooms/room_empty.webp)}
 #rin.s-trials{background-image:linear-gradient(rgba(3,3,3,.55),rgba(3,3,3,.86)),url(art/rooms/room_empty.webp)}
 #rin.s-ordo{background-image:linear-gradient(rgba(3,3,3,.6),rgba(3,3,3,.9)),url(art/rooms/bios_wall.webp)}}
#rin.s-doctrine .crest,#rin.s-doctrine .ten{position:relative}
.booth{background:rgba(4,4,4,.78);backdrop-filter:blur(2px)}
.drawers a{background:linear-gradient(180deg,rgba(20,18,16,.92),rgba(8,8,7,.95))}
.drawers a::after{content:'';position:absolute;right:10px;top:8px;width:26px;height:26px;background:url(art/rooms/fragment.webp) center/contain no-repeat;opacity:.0;transition:opacity .4s}
.drawers a:hover::after{opacity:.5}
.tcard{background:linear-gradient(160deg,rgba(18,17,16,.92),rgba(6,6,6,.95));overflow:hidden}
.tcard::before{content:'';position:absolute;right:-6px;bottom:-6px;width:96px;height:96px;background:url(art/rooms/sketch_scraps.webp) 0 0/400% 400% no-repeat;opacity:.45;pointer-events:none;filter:invert(.85) sepia(.3)}
.tcard[data-t=signal]::before{background-position:0 0}
.tcard[data-t=bios]::before{background-position:100% 33.333%}
.tcard[data-t=memory]::before{background-position:66.666% 0}
.tcard[data-t=sorry]::before{background-position:0 100%}
/* art v2 (ChatGPT section pack). backgrounds load only when the section class is set */
#rin.s-confessional{background-image:linear-gradient(rgba(3,3,3,.35),rgba(3,3,3,.78)),url(art/sections/confessional_m.webp)}
#rin.s-archive{background-image:linear-gradient(rgba(3,3,3,.4),rgba(3,3,3,.82)),url(art/sections/archive_m.webp)}
#rin.s-census{background-image:linear-gradient(rgba(3,3,3,.45),rgba(3,3,3,.86)),url(art/sections/census_room_m.webp)}
@media(min-width:761px){
 #rin.s-confessional{background-image:linear-gradient(rgba(3,3,3,.3),rgba(3,3,3,.75)),url(art/sections/confessional.webp)}
 #rin.s-archive{background-image:linear-gradient(rgba(3,3,3,.35),rgba(3,3,3,.8)),url(art/sections/archive.webp)}
 #rin.s-census{background-image:linear-gradient(rgba(3,3,3,.4),rgba(3,3,3,.84)),url(art/sections/census_room.webp)}}
.tcard::before{display:none}
.tcard{background:linear-gradient(180deg,rgba(6,6,6,.15),rgba(6,6,6,.55) 45%,rgba(6,6,6,.96) 78%),var(--art) center top/cover no-repeat,#060606;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end}
.tcard[data-t=signal]{--art:url(art/sections/trial_catch_the_signal.webp)}
.tcard[data-t=bios]{--art:url(art/sections/trial_order_the_bios.webp)}
.tcard[data-t=memory]{--art:url(art/sections/trial_what_was_on_the_desk.webp)}
.tcard[data-t=sorry]{--art:url(art/sections/trial_make_him_say_it.webp)}
.crest .sigart{display:block;margin:0 auto 6px;opacity:.92;animation:sigin 2.4s ease both}
@keyframes sigin{from{opacity:0;filter:blur(6px)}to{opacity:.92;filter:none}}
#sigbtn img{display:block;filter:drop-shadow(0 0 6px #000)}
@media(min-width:761px){body:not([data-sec]) #sigbtn img,body[data-sec=desk] #sigbtn img{filter:invert(.92)}}
.cst{font:11px monospace;letter-spacing:.08em;color:#b8392e;opacity:.8;margin-top:4px}
@media (max-width:640px){.cst{padding-left:64px;padding-right:64px;text-align:center}#cst{margin-bottom:56px}}
/* nav clarity v11: labeled rooms button, readable index, big back target */
#sigbtn{display:flex;align-items:center;gap:8px;min-height:52px;padding:4px 14px 4px 4px;border-radius:30px;background:rgba(6,6,5,.72);border:1px solid rgba(216,210,196,.22);opacity:.92}
#sigbtn .lbl{font:500 13px/1 ui-monospace,Menlo,monospace;letter-spacing:.22em;color:#d8d2c4;text-transform:lowercase}
#sigbtn.on .lbl::before{content:'× '}
@media(min-width:761px){body:not([data-sec]) #sigbtn img,body[data-sec=desk] #sigbtn img{filter:none}body:not([data-sec]) #sigbtn,body[data-sec=desk] #sigbtn{opacity:.92}}
#idx a{padding:10px 12px;min-width:44px;min-height:44px;color:#a29d90;font-size:12px}
#idx a em{color:#a29d90}
#idx a.k::after{content:'·entered';display:block;font-size:9px;color:#6b675e;letter-spacing:.2em;margin-top:3px}
#rin header{position:sticky;top:0;z-index:3;padding:max(8px,env(safe-area-inset-top)) 0 8px;background:linear-gradient(rgba(3,3,3,.85),rgba(3,3,3,0));font-size:12px}
#rin .back{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;margin-left:-6px;border:1px solid rgba(216,210,196,.25);border-radius:22px;color:#d8d2c4;background:rgba(6,6,5,.6);letter-spacing:.18em}
.tback{display:inline-flex;align-items:center;min-height:44px;padding:0 12px}
@media(max-width:760px){#idx a{font-size:12px;letter-spacing:.12em}}
#idx .idxf{bottom:auto!important;top:max(64px,calc(env(safe-area-inset-top) + 56px))!important}
#sigbtn img{min-width:46px;min-height:46px}
/* v12 */
#rin .rline{text-align:center;margin:-2vh auto 4vh;max-width:30em;font:14px/1.6 "IBM Plex Mono",monospace;color:#b4ae9f;letter-spacing:.04em}
#hint{position:absolute;left:0;right:0;text-align:center;font:13px/1.5 "IBM Plex Mono",monospace;letter-spacing:.14em;color:#d8d2c4;z-index:4;pointer-events:none;transition:opacity 1.2s;animation:hintin 2s 1.2s both}
#hint.gone{opacity:0}
@keyframes hintin{from{opacity:0}}
#hot b::after{content:'';position:absolute;inset:18%;border-radius:50%;box-shadow:0 0 22px 6px rgba(232,214,170,.16);background:radial-gradient(rgba(240,225,190,.10),transparent 70%);animation:hglow 4.4s ease-in-out infinite;pointer-events:none}
#hot b:nth-child(2n)::after{animation-delay:1.3s}#hot b:nth-child(3n)::after{animation-delay:2.6s}
@keyframes hglow{0%,100%{opacity:.25}50%{opacity:.9}}
body.open #hot b::after{display:none}
#bbar{display:none}
#upbtn{position:fixed;right:14px;top:max(14px,env(safe-area-inset-top));z-index:12;min-height:44px;padding:0 16px;border-radius:22px;border:1px solid rgba(216,210,196,.3);background:rgba(6,6,5,.78);color:#d8d2c4;font:13px "IBM Plex Mono",monospace;letter-spacing:.12em;opacity:0;pointer-events:none;transition:opacity .4s;cursor:pointer}
#upbtn.on{opacity:1;pointer-events:auto}
@media(max-width:600px){
 #bbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:12;padding:4px 2px max(6px,env(safe-area-inset-bottom));background:linear-gradient(rgba(5,5,4,.88),rgba(3,3,3,.97));border-top:1px solid rgba(216,210,196,.14)}
 #bbar a{flex:1;min-width:0;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:#9a9588}
 #bbar i{font:normal 18px/1 Georgia,serif;color:#c9c2b2}#bbar span{font:9.5px/1 "IBM Plex Mono",monospace;letter-spacing:.06em}
 #bbar a.on{color:#efe6d2}#bbar a.on i{color:#b8392e}
 #sigbtn,#idx{display:none!important}
 body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
 #rin{padding-bottom:calc(90px + env(safe-area-inset-bottom))!important}
}
@media(prefers-reduced-motion:reduce){#hot b::after{animation:none;opacity:.5}#hint{animation:none}}
#hint{text-shadow:0 0 8px #000,0 0 18px #000}
@media(max-width:600px){#depth{bottom:calc(76px + env(safe-area-inset-bottom))!important}#hint{font-size:12px;letter-spacing:.08em;padding:0 14px}}

.book{max-width:680px;margin:9vh auto 6vh;position:relative;overflow-wrap:anywhere}
.book h2{font:400 26px/1.2 Georgia,serif;color:#e2dccd;text-align:center;margin:0}.book h2 small{display:block;font:11px monospace;letter-spacing:.3em;color:#b8392e;margin-bottom:6px}
.book .bsub{text-align:center;font:11px monospace;letter-spacing:.12em;color:#6d6a62;margin:8px 0 26px}
.pass{padding:22px 0;border-top:1px solid rgba(216,210,196,.08)}.pass.hl h3{color:#fff;text-shadow:0 0 14px rgba(184,57,46,.45)}
.pass .dl{font:11.5px monospace;letter-spacing:.14em;color:#b8392e;text-decoration:none}
.pass h3{font:italic 400 22px/1.3 Georgia,serif;color:#efe9da;margin:6px 0 12px}
.pass p{font:18px/1.6 Georgia,serif;color:#d8d2c4;margin:0 0 10px;display:grid;grid-template-columns:1.8em 1fr}
.pass p b{font:400 11px/2.4 monospace;color:#6d6a62}
.pass .th{display:block;font-style:italic;color:#9a948a;border-left:2px solid #8e2a22;padding-left:12px;margin-top:14px}
@media(max-width:600px){.pass p{font-size:17px}.pass h3{font-size:20px}}