html,body.desk{height:100%}body.desk{display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,rgba(120,78,40,.35),transparent 70%),repeating-linear-gradient(92deg,rgba(0,0,0,.05) 0 3px,transparent 3px 41px),linear-gradient(#2b1a0f,#1c110a);color:var(--vellum)}.bar{display:flex;align-items:center;gap:14px;padding:8px var(--gutter);background:#140c07bf;border-bottom:1px solid rgba(184,146,74,.25);font-size:1rem}.bar a{color:var(--vellum);text-decoration:none;white-space:nowrap}.bar a:hover{color:#fff6dc}.book-title{flex:1;min-width:0;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:var(--gothic);font-weight:500;font-size:1.35rem;color:#f1dfb4}.pager{display:flex;align-items:center;gap:4px}.pager button{width:34px;height:34px;border:1px solid rgba(184,146,74,.35);border-radius:2px;background:transparent;color:var(--vellum);font:inherit;font-size:1.3rem;line-height:1;cursor:pointer}.pager button:disabled{opacity:.3;cursor:default}.where{font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}.where input{width:5.2em;padding:3px 4px;border:1px solid rgba(184,146,74,.35);border-radius:2px;background:#00000040;color:var(--vellum);font:inherit;text-align:center}#contents{max-width:11em;padding:4px 6px;border:1px solid rgba(184,146,74,.35);border-radius:2px;background:#00000040;color:var(--vellum);font:inherit}#contents option{background:#2b1a0f}.stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}.spread{position:relative;display:flex;filter:drop-shadow(0 18px 24px rgba(0,0,0,.55))}.page{position:relative;background:#f8f1e0}.page canvas{display:block;-webkit-touch-callout:none;mix-blend-mode:multiply}.page.blank{background:transparent}.facing .page.verso:not(.blank):after,.facing .page.recto:not(.blank):after{content:"";position:absolute;top:0;bottom:0;width:7%;pointer-events:none}.facing .page.verso:after{right:0;background:linear-gradient(90deg,transparent,rgba(60,40,20,.16) 80%,rgba(40,25,10,.3))}.facing .page.recto:after{left:0;background:linear-gradient(270deg,transparent,rgba(60,40,20,.14) 80%,rgba(40,25,10,.28))}.spread:not(.facing) .page{box-shadow:0 0 0 1px #0003}.spread.turn-on{animation:turn-on .22s ease-out}.spread.turn-back{animation:turn-back .22s ease-out}@keyframes turn-on{0%{opacity:.35;transform:translate(14px)}}@keyframes turn-back{0%{opacity:.35;transform:translate(-14px)}}.turn{position:absolute;top:0;bottom:0;width:22%;border:0;background:transparent;cursor:pointer}.turn.back{left:0;cursor:w-resize}.turn.on{right:0;cursor:e-resize}.status{position:absolute;inset:auto 0 45%;text-align:center;font-style:italic;color:#d9c9a0}.status a{color:#f1dfb4}@media(max-width:720px){.bar{flex-wrap:wrap;gap:8px 10px}.book-title{order:-1;flex-basis:100%;font-size:1.15rem}.bar .label{display:none}#contents{flex:1;max-width:none}}.stage.column{display:block;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:10px 0 40px}.stage.column .spread{flex-direction:column;align-items:center;gap:10px;filter:none}.stage.column .page{box-shadow:0 6px 14px -6px #0009}.stage.column .turn{display:none}.ribbon-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px;border:1px solid rgba(184,146,74,.35);border-radius:2px;background:transparent;color:var(--vellum);font:inherit;cursor:pointer}.ribbon-btn svg{fill:none;stroke:#d64a3e;stroke-width:1.4}.ribbon-btn[aria-pressed=true] svg{fill:#c22d26;stroke:var(--gilt)}.ribbon{--rw: 60px;position:absolute;z-index:3;width:var(--rw);padding:0;border:0;background:none;cursor:pointer;filter:drop-shadow(1px 2px 2px rgba(0,0,0,.45))}.ribbon:before,.ribbon>span{content:"";position:absolute;top:0;clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - var(--rw) * .55),0 100%)}.ribbon:before{inset:0;background:linear-gradient(90deg,#8a6a2c,#e6c77a 50%,#8a6a2c)}.ribbon>span{left:3px;right:3px;bottom:5px;background:repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 1px,transparent 1px 4px),linear-gradient(90deg,#6e0e0e,#a82019 14%,#cf3a31 38%,#e0473c 50%,#c4332b 64%,#a82019 86%,#6e0e0e)}.ribbon:hover>span,.ribbon:focus-visible>span{filter:brightness(1.12)}.ribbon.on-page{--rw: 64px;--fold: 12px;top:calc(var(--fold) * -1);right:16%}.stage.column .ribbon.on-page{--rw: 44px}.ribbon.on-page:before,.ribbon.on-page>span{top:var(--fold)}.ribbon.on-page>span{background:linear-gradient(rgba(40,0,0,.45),transparent 9px),repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 1px,transparent 1px 4px),linear-gradient(90deg,#6e0e0e,#a82019 14%,#cf3a31 38%,#e0473c 50%,#c4332b 64%,#a82019 86%,#6e0e0e)}.ribbon>.fold{position:absolute;top:0;left:0;right:0;height:calc(var(--fold) + 1px);border-radius:9px 9px 1px 1px/10px 10px 1px 1px;background:linear-gradient(transparent calc(100% - 3px),#ffd6a08c calc(100% - 2px),#3c000099),linear-gradient(#3e0606,#6b0f0d 45%,#9a1c17 85%),linear-gradient(90deg,#4a0909,#9a1c17 50%,#4a0909);background-blend-mode:normal,multiply,normal;box-shadow:inset 2.5px 0 #b8924a,inset -2.5px 0 #b8924a,inset 0 1px #e6c77a99}.stage.column{padding-top:18px}.ribbon.stub{--rw: 64px;top:-18px;right:8%;height:26px;z-index:auto}.ribbon.stub:before,.ribbon.stub>span{clip-path:none}.ribbon.stub:hover{transform:translateY(-4px)}.ribbon.stub.hanging{--rw: 34px;position:fixed;right:22px;height:34px;clip-path:none}.ribbon.stub.hanging:hover{transform:translateY(3px)}@media(prefers-reduced-motion:no-preference){.ribbon.stub{transition:transform .15s ease}}.about{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
