.guide-cover{width:min(42vw,180px);height:auto;border:2px solid #c49b44;border-radius:.35rem;box-shadow:0 12px 32px #0008}
#claim-form{display:flex;flex-wrap:wrap;align-items:end;gap:.55rem;margin:1rem 0}
#claim-form label{display:grid;gap:.25rem;max-width:100%}
#claim-code{font:inherit;color:inherit;background:var(--navy);border:1px solid var(--border);border-radius:.5rem;padding:.58rem .8rem;max-width:100%;min-height:2.75rem}
.book-reader{position:fixed;z-index:10;inset:0;overflow:hidden;background:#020b1d;color:#fff6df}
.book-header,.book-toolbar{position:absolute;z-index:5;left:0;right:0;display:flex;align-items:center;gap:.55rem;background:#04142ef5;padding:.45rem max(.65rem,env(safe-area-inset-right));transition:opacity .22s ease}
.book-header{top:0;padding-top:max(.45rem,env(safe-area-inset-top));border-bottom:1px solid #b7944b66}
.book-toolbar{bottom:0;justify-content:center;flex-wrap:wrap;padding-bottom:max(.45rem,env(safe-area-inset-bottom));border-top:1px solid #b7944b66}
.book-reader:not(.controls-visible) :is(.book-header,.book-toolbar):not(:focus-within){opacity:0;pointer-events:none}
.book-reader .brand{margin-inline-end:auto;font:700 clamp(.75rem,2.5vw,1.05rem) Georgia,serif;letter-spacing:.11em;color:#e8c46a}
.book-reader button,.book-menu>summary,.book-reader select,#thread-close{border:1px solid #b7944b;border-radius:999px;background:#071f48;color:#fff6df;min-height:44px;padding:.5rem .75rem;font-weight:700}
.book-menu{position:relative}
.book-menu>summary{display:flex;align-items:center;list-style:none;cursor:pointer}
.book-menu>summary::-webkit-details-marker{display:none}
.book-menu>summary::after{content:'⌄';margin-inline-start:.3rem;color:#e8c46a}
.book-menu-panel{position:absolute;inset-inline-end:0;top:calc(100% + .5rem);width:min(20rem,calc(100vw - 2rem));max-height:calc(100dvh - 6rem);overflow:auto;background:#04142e;border:1px solid #b7944b;border-radius:.8rem;padding:.75rem;display:grid;gap:.5rem}
.book-more .book-menu-panel{width:min(23rem,calc(100vw - 1.3rem))}
.book-menu-panel label{display:grid;gap:.25rem}
.book-menu-panel select{width:100%}
.book-stage{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;overscroll-behavior:none;touch-action:none;background:radial-gradient(circle,#173054,#020b1d 70%)}
.book-pages{position:relative;display:flex;justify-content:center;transform:translate(var(--pan-x,0px),var(--pan-y,0px)) scale(var(--zoom,1));transform-origin:center;box-shadow:0 12px 40px #000b;perspective:2200px}
.companion-page{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:start;gap:clamp(.35rem,1.2dvh,1rem);width:min(93vw,35rem,65dvh);height:min(78dvh,50rem,140vw);padding:clamp(.85rem,3dvh,2.6rem);overflow:hidden;color:#17243a;background:linear-gradient(145deg,#fffdf7,#f5e7c8);font:clamp(.82rem,2.2dvh,1.16rem)/1.38 Georgia,serif}
.book-pages.spread .companion-page{width:min(46vw,33rem,58dvh)}
.companion-page::before{position:absolute;inset:.45rem;content:'';border:1px solid #ad823b82;pointer-events:none}
.book-pages.spread .companion-page:first-child{box-shadow:inset -11px 0 16px -13px #3e2c10}
.book-pages.spread .companion-page:nth-child(2){box-shadow:inset 11px 0 16px -13px #3e2c10}
[dir=rtl] .book-pages.spread .companion-page:first-child{box-shadow:inset 11px 0 16px -13px #3e2c10}
[dir=rtl] .book-pages.spread .companion-page:nth-child(2){box-shadow:inset -11px 0 16px -13px #3e2c10}
.companion-page p,.companion-page h2{margin:0;overflow-wrap:anywhere}
.companion-page h2{font-size:clamp(1.15rem,3.6dvh,2.3rem);line-height:1.1;color:#071f48}
.companion-page .book-page-number{position:absolute;bottom:.7rem;inset-inline-end:.9rem;color:#5a421a;font-weight:700}
.thread-kicker{color:#755613;font:700 .78rem/1.2 system-ui;letter-spacing:.07em}
.book-reader .thread-marker{color:#071f48;background:#efd38a;display:inline-flex;align-items:center;gap:.45rem;text-align:start;max-width:100%;min-height:36px;font-size:.83rem;padding:.32rem .6rem}
.turning-leaf{position:absolute;top:0;z-index:4;pointer-events:none;backface-visibility:hidden;transform-style:preserve-3d}
.turn-left{transform-origin:left center;animation:turnLeft .65s cubic-bezier(.33,.04,.25,1) both}
.turn-right{transform-origin:right center;animation:turnRight .65s cubic-bezier(.33,.04,.25,1) both}
@keyframes turnLeft{from{transform:rotateY(0)}to{transform:rotateY(-176deg);filter:brightness(.8)}}
@keyframes turnRight{from{transform:rotateY(0)}to{transform:rotateY(176deg);filter:brightness(.8)}}
.zoom-controls{display:flex;gap:.2rem}
#page-count{font-variant-numeric:tabular-nums;font-size:.85rem;min-width:3rem;text-align:center}
#thread-dialog{width:min(42rem,calc(100vw - 1rem));max-height:calc(100dvh - 1rem);border:1px solid #c6a45a;border-radius:20px;background:linear-gradient(145deg,#fffdf7,#fff8e8);color:#17243a;padding:0;box-shadow:0 28px 90px #0008,0 0 0 5px #d7b66e14;color-scheme:light}
#thread-dialog[open]{animation:threadArrival .38s cubic-bezier(.19,1,.22,1) both}
#thread-dialog::backdrop{background:#020b1dcc;backdrop-filter:blur(4px)}
.thread-card{padding:clamp(1rem,4vw,2rem);line-height:1.55}
.thread-card h2{font:700 clamp(1.35rem,5vw,2rem) Georgia,serif;color:#071f48}
#thread-close{float:inline-end}
.thread-verse{background:#fff0c2;border-inline-start:4px solid #b58c30;padding:.8rem 1rem}
.thread-verse a{color:#174d8e;font-weight:700}
.lens-buttons{display:flex;flex-wrap:wrap;gap:.45rem;margin:.8rem 0}
.lens-buttons button{background:#fff;color:#071f48;border-color:#a98234}
.lens-buttons button[aria-pressed=true]{background:#071f48;color:#fff}
#lens-list.lens-panel{display:block;background:#f4ebd5;border-radius:12px;padding:.8rem 1rem}
#lens-list p:last-child{margin-bottom:0}
#lens-list strong{color:#604616}
@keyframes threadArrival{from{opacity:0;transform:translateY(22px) scale(.965)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:520px){.book-reader button{padding:.36rem .5rem}.book-toolbar{gap:.25rem}}
@media(prefers-reduced-motion:reduce){.turning-leaf,#thread-dialog[open]{animation:none}.book-header,.book-toolbar{transition:none}}
@media(max-width:600px){.book-menu-panel{position:fixed;top:calc(max(.45rem,env(safe-area-inset-top)) + 52px);inset-inline-end:.55rem}}
