/* Emberfall questjournal.css (7330dd40): the Quest Log as an open leather journal. Pairs with questjournal.js. Fonts are self-hosted
   (IM Fell English + Tangerine, SIL OFL 1.1, fonts/OFL-*.txt). Sizes scale with --qk (set by questjournal.js on resize only). */
@font-face{font-family:"EF Fell";src:url(fonts/imfell-r.woff2?v=qj1) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"EF Fell";src:url(fonts/imfell-i.woff2?v=qj1) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"EF Hand";src:url(fonts/tangerine-b.woff2?v=qj1) format("woff2");font-weight:700;font-style:normal;font-display:swap}
:root{--qk:1}
/* the window: leather cover instead of the wood/stone frame (same #panel, same header = same drag + close) */
body #panel.qj-on[data-kind=quests]{width:min(calc(1060px*var(--qk)),calc(100vw - 16px))!important;height:min(calc(700px*var(--qk)),calc(100vh - 16px))!important;max-height:calc(100vh - 16px)!important;max-width:none!important;bottom:auto!important;
 border:2px solid #1c0f07!important;border-image:none!important;border-radius:calc(12px*var(--qk))!important;padding:0!important;overflow:hidden!important;
 background:radial-gradient(120% 90% at 30% 20%,#7a4a2a 0,#5a3219 45%,#3a1e0e 100%)!important;background-clip:border-box!important;
 box-shadow:0 0 0 1px #000,inset 0 0 0 calc(5px*var(--qk)) rgba(0,0,0,.18),inset 0 0 calc(30px*var(--qk)) rgba(0,0,0,.55),0 calc(14px*var(--qk)) calc(40px*var(--qk)) rgba(0,0,0,.7)!important}
body #panel.qj-on[data-kind=quests]::before,body #panel.qj-on[data-kind=quests]::after{display:none!important}
body #panel.qj-on[data-kind=quests]>header{background:transparent!important;border:0!important;border-bottom:1px dashed rgba(230,190,120,.35)!important;margin:0 calc(14px*var(--qk))!important;padding:calc(6px*var(--qk)) calc(4px*var(--qk)) calc(5px*var(--qk))!important;min-height:0!important}
body #panel.qj-on[data-kind=quests]>header h2{font:400 calc(15px*var(--qk))/1.2 "Cinzel",Georgia,serif!important;color:#e9c98a!important;letter-spacing:.12em!important;text-shadow:0 1px 0 #000,0 0 6px rgba(0,0,0,.6)!important;text-transform:uppercase!important}
body #panel.qj-on[data-kind=quests] #pbody{padding:0!important;margin:0!important;overflow:hidden!important;flex:1 1 auto!important;min-height:0!important;display:flex!important;background:none!important;font-size:calc(14px*var(--qk))!important}
#panel #pbody .qj,#panel #pbody .qj *{font-family:"EF Fell",Georgia,"Times New Roman",serif!important}
#panel #pbody .qj{flex:1;display:flex;min-height:0;padding:calc(8px*var(--qk)) calc(12px*var(--qk)) calc(12px*var(--qk));font-family:"EF Fell",Georgia,"Times New Roman",serif;color:#3a2614;font-size:max(12px,calc(15px*var(--qk)));line-height:1.35}
#panel #pbody .qj-book{flex:1;display:flex;min-height:0;position:relative;border-radius:calc(4px*var(--qk));box-shadow:0 0 0 1px rgba(0,0,0,.5),0 calc(3px*var(--qk)) 0 #c9b48a,0 calc(5px*var(--qk)) 0 #a8946a,0 calc(7px*var(--qk)) calc(10px*var(--qk)) rgba(0,0,0,.6)}
#panel #pbody .qj-page{flex:1 1 50%;min-width:0;min-height:0;position:relative;overflow:auto;scrollbar-width:thin;scrollbar-color:#a08860 transparent;
 background:radial-gradient(140% 100% at 50% 50%,rgba(255,250,232,0) 55%,rgba(150,110,50,.28) 100%),repeating-linear-gradient(0deg,rgba(120,90,40,.035) 0 2px,rgba(0,0,0,0) 2px 5px),linear-gradient(#f3e6c4,#ead9b0)}
#panel #pbody .qj-left{border-radius:calc(4px*var(--qk)) 0 0 calc(4px*var(--qk));padding:calc(10px*var(--qk)) calc(22px*var(--qk)) calc(14px*var(--qk)) calc(20px*var(--qk));display:flex;flex-direction:column;overflow:hidden;
 box-shadow:inset calc(-26px*var(--qk)) 0 calc(26px*var(--qk)) calc(-14px*var(--qk)) rgba(90,60,20,.45)}
#panel #pbody .qj-right{border-radius:0 calc(4px*var(--qk)) calc(4px*var(--qk)) 0;padding:calc(14px*var(--qk)) calc(22px*var(--qk)) calc(18px*var(--qk)) calc(26px*var(--qk));
 box-shadow:inset calc(26px*var(--qk)) 0 calc(26px*var(--qk)) calc(-14px*var(--qk)) rgba(90,60,20,.45);transform-origin:0 50%}
#panel #pbody .qj-spine{flex:0 0 calc(6px*var(--qk));background:linear-gradient(90deg,#6a4a24,#2a1808 50%,#6a4a24);box-shadow:0 0 calc(8px*var(--qk)) rgba(0,0,0,.6)}
#panel #pbody .qj-right.flip{animation:qjflip .26s ease-out}
@keyframes qjflip{from{transform:perspective(1400px) rotateY(-14deg);opacity:.35;filter:brightness(.85)}to{transform:none;opacity:1;filter:none}}
@media (prefers-reduced-motion:reduce){#panel #pbody .qj-right.flip{animation:none}}
/* buttons: undo the game's plank buttons inside the journal (ids beat #panel button:not(#pclose)) */
#panel #pbody .qj button{all:unset;box-sizing:border-box;cursor:pointer;font:inherit;color:#3a2614!important;letter-spacing:normal;border:0!important;border-image:none!important;background:none!important;text-shadow:none!important;border-radius:0!important;min-height:0!important;box-shadow:none!important}
#panel #pbody .qj button:focus-visible{outline:2px dotted #7a1a14!important;outline-offset:1px}
/* ribbons (filters) */
#panel #pbody .qj-ribbons{display:flex;gap:calc(10px*var(--qk));margin:calc(-10px*var(--qk)) 0 calc(4px*var(--qk));flex:0 0 auto}
#panel #pbody .qj .qj-rib{position:relative;padding:calc(10px*var(--qk)) calc(12px*var(--qk)) calc(12px*var(--qk))!important;font:400 max(11px,calc(13px*var(--qk)))/1 "Cinzel",Georgia,serif!important;letter-spacing:.06em;color:#f6e6c0!important;
 clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 7px*var(--qk)),0 100%);transition:transform .15s,opacity .15s,filter .15s;transform:translateY(calc(-8px*var(--qk)));opacity:.55;filter:saturate(.5)}
#panel #pbody .qj .qj-rib.prog{background:linear-gradient(90deg,#6e1410,#9a2418 50%,#6e1410)!important}
#panel #pbody .qj .qj-rib.done{background:linear-gradient(90deg,#1f4a2a,#2e6a3c 50%,#1f4a2a)!important}
#panel #pbody .qj .qj-rib.on{transform:none;opacity:1;filter:none}
#panel #pbody .qj .qj-rib i{font-style:normal;opacity:.8;margin-left:.3em}
#panel #pbody .qj .qj-rib:hover{filter:brightness(1.12)}
#panel #pbody .qj .qj-ph{margin:calc(2px*var(--qk)) 0 calc(4px*var(--qk));font:700 max(30px,calc(46px*var(--qk)))/1 "EF Hand","Brush Script MT",cursive!important;letter-spacing:0!important;color:#5a1610;text-align:center;flex:0 0 auto}
#panel #pbody .qj-list{flex:1 1 auto;min-height:0;overflow:auto;padding-right:calc(4px*var(--qk));scrollbar-width:thin;scrollbar-color:#a08860 transparent}
#panel #pbody .qj-zone{margin:0 0 calc(8px*var(--qk))}
#panel #pbody .qj .qj-zh{display:flex!important;align-items:center;gap:calc(8px*var(--qk));width:100%;padding:calc(4px*var(--qk)) calc(2px*var(--qk))!important;border-bottom:1.5px solid #6a4a24!important;font:400 max(12px,calc(15px*var(--qk)))/1.2 "Cinzel",Georgia,serif!important;color:#4a2a12!important;letter-spacing:.05em}
#panel #pbody .qj-zh em{font:italic max(12px,calc(14px*var(--qk))) "EF Fell",Georgia,serif;color:#6a4a2a}
#panel #pbody .qj-zh .qj-eye{margin-left:auto;font:italic max(11px,calc(12px*var(--qk))) "EF Fell",Georgia,serif;color:#8a6a4a}
#panel #pbody .qj-zone.off .qj-zh{opacity:.6}
#panel #pbody .qj-list h4{margin:calc(8px*var(--qk)) 0 calc(2px*var(--qk)) calc(4px*var(--qk));font:italic max(11px,calc(13px*var(--qk))) "EF Fell",Georgia,serif;color:#7a1a14;letter-spacing:.04em}
#panel #pbody .qj .qj-q{display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:calc(8px*var(--qk));width:100%;padding:calc(4px*var(--qk)) calc(6px*var(--qk))!important;border-radius:calc(3px*var(--qk))!important}
#panel #pbody .qj .qj-q b{font-weight:400;font-size:max(13px,calc(16px*var(--qk)));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#panel #pbody .qj .qj-q small{font-style:italic;font-size:max(11px,calc(13px*var(--qk)));color:#6a5034;white-space:nowrap}
#panel #pbody .qj .qj-q.ready small{color:#8a1a10}
#panel #pbody .qj .qj-q.new{opacity:.62}
#panel #pbody .qj .qj-q.done b{text-decoration:line-through;text-decoration-color:rgba(60,40,20,.55);color:#5a4630}
#panel #pbody .qj .qj-q:hover{background:rgba(120,80,30,.12)!important}
#panel #pbody .qj .qj-q.sel{background:linear-gradient(90deg,rgba(140,30,20,.16),rgba(140,30,20,.04))!important;box-shadow:inset 3px 0 0 #8a1a10!important}
#panel #pbody .qj-none{margin:calc(6px*var(--qk)) calc(6px*var(--qk));font-style:italic;color:#7a6044}
/* ink checkbox */
#panel #pbody .qj-cb{position:relative;display:inline-block;flex:0 0 auto;width:calc(14px*var(--qk));height:calc(14px*var(--qk));min-width:11px;min-height:11px;border:1.6px solid #3a2614;border-radius:2px 3px 2px 4px;transform:rotate(-3deg);background:rgba(255,255,255,.12)}
#panel #pbody .qj .qj-cb.x::after{font-family:Georgia,serif!important}
#panel #pbody .qj-cb.x::after{content:"✓";position:absolute;left:8%;top:-62%;font:700 max(15px,calc(20px*var(--qk)))/1 Georgia,serif;color:#2a1a0c;transform:rotate(8deg)}
/* right page entry */
#panel #pbody .qj-entry{position:relative;min-height:100%}
#panel #pbody .qj .qj-title{margin:0 0 calc(2px*var(--qk));font:700 max(34px,calc(54px*var(--qk)))/1 "EF Hand","Brush Script MT",cursive!important;color:#3a1608;letter-spacing:.01em}
#panel #pbody .qj-meta{font-style:italic;color:#6a4e30;font-size:max(12px,calc(14px*var(--qk)));padding-bottom:calc(6px*var(--qk));border-bottom:1px solid rgba(90,60,20,.35);margin-bottom:calc(8px*var(--qk))}
#panel #pbody .qj-meta b{font-weight:400;font-style:normal;color:#4a2a12}
#panel #pbody .qj .qj-stage,#panel #pbody .qj .qj-stage *{font-family:"Cinzel",Georgia,serif!important}
#panel #pbody .qj-stage{display:flex;align-items:center;justify-content:space-between;gap:calc(10px*var(--qk));margin:calc(4px*var(--qk)) 0 calc(8px*var(--qk));font:400 max(11px,calc(13px*var(--qk)))/1.2 "Cinzel",Georgia,serif;color:#7a1a14;letter-spacing:.05em}
#panel #pbody .qj-pips{display:flex;gap:calc(5px*var(--qk))}
#panel #pbody .qj-pips i{width:calc(9px*var(--qk));height:calc(9px*var(--qk));min-width:7px;min-height:7px;border:1.4px solid #5a2a14;transform:rotate(45deg)}
#panel #pbody .qj-pips i.d{background:#5a2a14}
#panel #pbody .qj-pips i.c{background:#b8402a;border-color:#7a1a14;box-shadow:0 0 0 2px rgba(184,64,42,.2)}
#panel #pbody .qj-story{margin:0 0 calc(10px*var(--qk));font-style:italic;color:#4a3420;text-align:justify;hyphens:auto}
#panel #pbody .qj .qj-entry h5,#panel #pbody .qj .qj-zh .qj-zn,#panel #pbody .qj .qj-rib,#panel #pbody .qj .qj-rib i{font-family:"Cinzel",Georgia,serif!important}
#panel #pbody .qj-entry h5{margin:calc(12px*var(--qk)) 0 calc(5px*var(--qk));font:400 max(11px,calc(13px*var(--qk)))/1 "Cinzel",Georgia,serif;letter-spacing:.14em;text-transform:uppercase;color:#7a1a14;display:flex;align-items:center;gap:calc(8px*var(--qk))}
#panel #pbody .qj-entry h5::after{content:"";flex:1;border-top:1px solid rgba(122,26,20,.35)}
#panel #pbody .qj-obj,#panel #pbody .qj-rw{list-style:none;margin:0;padding:0}
#panel #pbody .qj-obj li{display:grid;grid-template-columns:auto 1fr auto;column-gap:calc(10px*var(--qk));align-items:start;margin:0 0 calc(7px*var(--qk))}
#panel #pbody .qj-obj li .qj-cb{margin-top:.18em}
#panel #pbody .qj-obj li>b{font-weight:400;font-style:italic;color:#3a2614;white-space:nowrap}
#panel #pbody .qj-obj li.done>span:nth-child(2){color:#6a5640;text-decoration:line-through;text-decoration-color:rgba(60,40,20,.45)}
#panel #pbody .qj-obj li.turn>span:nth-child(2){color:#8a1a10}
#panel #pbody .qj-bar{grid-column:2/4;display:block;height:calc(5px*var(--qk));min-height:4px;margin-top:calc(3px*var(--qk));border:1px solid rgba(60,40,20,.55);border-radius:3px;background:rgba(255,255,255,.2);overflow:hidden}
#panel #pbody .qj-bar>i{display:block;height:100%;background:repeating-linear-gradient(-45deg,#5a2a14 0 3px,#7a3a1c 3px 6px)}
#panel #pbody .qj-rw{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(170px*var(--qk)),1fr));gap:calc(6px*var(--qk)) calc(12px*var(--qk))}
#panel #pbody .qj-rw li{display:flex;align-items:center;gap:calc(8px*var(--qk));min-width:0}
#panel #pbody .qj-rw img{width:calc(38px*var(--qk));height:calc(38px*var(--qk));min-width:28px;min-height:28px;flex:0 0 auto;border-radius:calc(5px*var(--qk));box-shadow:0 1px 3px rgba(0,0,0,.45);image-rendering:auto}
#panel #pbody .qj-rw li span:last-child{min-width:0}
#panel #pbody .qj-rw em{font-size:.85em;color:#7a6044}
#panel #pbody .qj .qj-xp{font-family:Georgia,serif!important}
#panel #pbody .qj-xp{display:inline-grid;place-items:center;width:calc(38px*var(--qk));height:calc(38px*var(--qk));min-width:28px;min-height:28px;flex:0 0 auto;border-radius:50%;border:1.6px solid #6a4a24;color:#7a1a14;font-size:max(15px,calc(20px*var(--qk)));background:radial-gradient(circle,rgba(255,240,200,.6),rgba(180,140,80,.25))}
#panel #pbody .qj-xp.lv{color:#2a4a6a}
#panel #pbody .qj-seal{position:absolute;right:calc(2px*var(--qk));top:calc(4px*var(--qk));width:calc(78px*var(--qk));height:calc(78px*var(--qk));border-radius:50%;display:grid;place-items:center;transform:rotate(-14deg);
 background:radial-gradient(circle at 38% 34%,#d0483a,#9a1e16 55%,#6a0e0a);box-shadow:0 2px 4px rgba(0,0,0,.45),inset 0 0 0 calc(5px*var(--qk)) rgba(0,0,0,.14),inset 0 0 0 calc(7px*var(--qk)) rgba(255,190,160,.18)}
#panel #pbody .qj .qj-seal span{font:700 max(22px,calc(32px*var(--qk)))/1 "EF Hand","Brush Script MT",cursive!important;color:#f6d2b8;text-shadow:0 1px 1px rgba(0,0,0,.5)}
#panel #pbody .qj-blank .qj-story{margin-top:30%;text-align:center;color:#8a7050}
/* small windows: pages stack (list on top) */
#panel #pbody .qj-book.narrow{flex-direction:column}
#panel #pbody .qj-book.narrow .qj-left{flex:0 0 42%;border-radius:4px 4px 0 0;box-shadow:inset 0 -18px 18px -12px rgba(90,60,20,.45)}
#panel #pbody .qj-book.narrow .qj-spine{flex:0 0 5px;background:linear-gradient(#6a4a24,#2a1808 50%,#6a4a24)}
#panel #pbody .qj-book.narrow .qj-right{border-radius:0 0 4px 4px;box-shadow:inset 0 18px 18px -12px rgba(90,60,20,.45)}
