@import url('quiz.css');
/* Child-facing layer using the approved Os Jalochos artwork and palette. */
.lq-root{--lq-ink:#23251e;--lq-muted:#515446;--lq-ground:#f8f2e4;--lq-paper:#fffaf2;--lq-red:#bc302a;--lq-blue:#176da6;--lq-green:#4d6845;--lq-yellow:#e8ae37;--lq-light:#e7eddc;background:var(--lq-ground) url('ui/paper.png') center/900px 600px}
body.lq-page{background:#f8f2e4}.lq-root ::selection{background:var(--lq-yellow);color:var(--lq-ink)}.lq-root :focus-visible{outline-color:var(--lq-blue)}
.lq-app{max-width:1490px;padding:0 32px;min-height:100dvh;display:flex;flex-direction:column}
.lq-header{min-height:90px;gap:18px;position:relative;z-index:20;background:transparent;flex:none}
.lq-brand{min-width:72px;min-height:64px;padding:0!important}.lq-brand img{width:72px;height:64px}
.lq-header-name{font-size:1.2rem;font-weight:700;position:relative;padding:4px 0}
.lq-header-name:after{content:'';position:absolute;left:-5px;right:-8px;height:10px;bottom:-1px;background:url('ui/underline.webp') center/100% 100% no-repeat;z-index:-1}
.lq-tools{gap:12px}.lq-ui-art{display:block;object-fit:contain}
.lq-index summary{gap:8px;padding:4px 14px;font-weight:700;font-size:.9rem}.lq-index summary>.lq-ui-art{width:34px;height:34px}
.lq-index nav{width:min(370px,89vw);max-height:75dvh;background:var(--lq-paper) url('ui/paper.png') center/900px 600px;padding:18px;border-radius:18px;box-shadow:0 12px 36px #463b272b}
.lq-index-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:0 7px 10px;color:var(--lq-blue)}
.lq-index-heading button{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--lq-yellow)}
.lq-index li button{padding:10px 8px;min-height:48px;border-radius:10px}.lq-index-number{display:grid;place-items:center;flex:none;width:30px;height:30px;min-width:30px;border-radius:47% 51% 45% 54%;background:var(--lq-yellow);color:var(--lq-ink);font-weight:700}
.lq-index li button[aria-current] .lq-index-number{background:var(--lq-green);color:var(--lq-paper)}
.lq-sound{justify-content:center;min-width:48px;padding:8px 13px!important;border-radius:18px 15px 19px 14px;background:var(--lq-yellow)!important;font-weight:700!important}
.lq-cover{padding:25px 4% 35px;min-height:0;flex:1;gap:clamp(40px,6vw,90px)}.lq-cover-art img{max-height:610px}.lq-cover-copy h1{font-size:clamp(2.15rem,3.5vw,3.6rem)}.lq-cover-actions{margin-top:30px}
.lq-primary{position:relative;isolation:isolate;gap:20px;min-height:64px;padding:17px 25px!important;border-radius:0;background:transparent!important;font-size:1rem!important;max-width:100%;transition:transform .25s var(--lq-ease)}
.lq-primary:before{content:'';position:absolute;inset:0;z-index:-1;background:url('ui/button-red.webp') center/100% 100% no-repeat;filter:drop-shadow(0 4px 3px #77251f24)}
.lq-primary:hover{background:transparent!important;transform:translateY(-2px) rotate(-.5deg)}.lq-primary:active{transform:translateY(1px) scale(.98)}
.lq-drawn-arrow{display:block;flex:none;width:54px;height:28px;object-fit:contain;filter:brightness(0) invert(1)}.lq-drawn-arrow--back{transform:scaleX(-1)}.lq-primary>.lq-drawn-arrow{width:46px}
.lq-cover-hint,.lq-saved{font-size:.86rem}.lq-cover-credit{display:flex;align-items:center;gap:18px;margin-top:35px}.lq-cover-credit>.lq-ui-art{width:65px;height:65px;transform:rotate(-5deg)}.lq-credits{margin-top:0!important}
.lq-reader{padding-top:5px;flex:1;width:100%}.lq-reading-meta{align-items:center;gap:16px;font-size:.88rem;margin-bottom:16px;color:var(--lq-ink)}
.lq-chapter-sticker{position:relative;isolation:isolate;padding:9px 19px;transform:rotate(-2deg);color:var(--lq-paper);white-space:nowrap}.lq-chapter-sticker:before{content:'';position:absolute;inset:0;z-index:-1;background:url('ui/tape-blue.webp') center/100% 100% no-repeat}.lq-chapter-sticker b{font-size:1.1em}
.lq-score{gap:8px;white-space:nowrap}.lq-score>.lq-ui-art{width:31px;height:31px}
.lq-book{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr);min-height:clamp(420px,61dvh,660px);border-radius:9px;box-shadow:0 12px 32px #463b2712}
.lq-art{display:flex;align-items:center;justify-content:center;min-height:390px;padding:32px 25px}
.lq-art:after{content:'';position:absolute;inset:8px;pointer-events:none;background:url('ui/frame.webp') center/100% 100% no-repeat}
.lq-art picture{display:block;width:100%;min-width:0}.lq-art .lq-scene-image{display:block;width:100%;height:auto;max-height:min(59dvh,625px);object-fit:contain}
.lq-reading-panel{padding:28px clamp(23px,2.8vw,44px)}.lq-reading-panel h1{font-family:LandraText,system-ui,sans-serif;font-size:clamp(1.65rem,2.1vw,2.25rem);font-weight:700;line-height:1.22}
.lq-scene-text{font-size:1.04rem;line-height:1.6;margin-top:16px!important}.lq-listen-panel{margin-top:25px}.lq-player{margin-bottom:21px}
.lq-player-main{display:grid;grid-template-columns:minmax(0,1fr) 44px auto;gap:9px}.lq-listen{justify-content:center;min-height:54px;min-width:0;padding:10px 15px!important;background:var(--lq-yellow)!important;border-radius:20px 16px 19px 14px;white-space:nowrap}
.lq-listen:hover,.lq-sound:hover{background:#f1bd4b!important;color:var(--lq-ink)}.lq-listen:active,.lq-replay:active,.lq-sound:active{transform:scale(.96)}.lq-replay{display:grid;place-items:center;color:var(--lq-blue)!important}.lq-time{margin-left:0;font-size:.75rem}
.lq-root input[type=range]::-webkit-slider-thumb{background:var(--lq-red);width:22px;height:22px;border-radius:45% 51% 48% 43%;margin-top:-9px}.lq-root input[type=range]::-moz-range-thumb{background:var(--lq-red);width:22px;height:22px;border-radius:45% 51% 48% 43%}
.lq-riddle-note{font-size:.9rem;margin-bottom:15px!important}.lq-question{margin-top:24px}.lq-question-count{font-size:.83rem;color:var(--lq-blue);font-weight:700;margin-bottom:8px!important}
.lq-root h2{font-family:LandraText,system-ui,sans-serif;font-weight:700;line-height:1.25;font-size:clamp(1.35rem,1.85vw,1.75rem)}.lq-hear{font-size:.88rem!important;color:var(--lq-blue)!important;margin-bottom:10px}
.lq-option{border:2px solid #d3c9af!important;border-radius:15px 20px 14px 19px;background:#fffdf7!important;padding:13px 17px!important;font-size:.97rem!important}
.lq-option:hover:enabled{background:#fbf1d5!important;border-color:var(--lq-yellow)!important;transform:translateX(2px)}.lq-option.lq-correct{background:var(--lq-light)!important;border-color:var(--lq-green)!important}.lq-option.lq-incorrect{background:#fbede2!important;border-color:var(--lq-red)!important}
.lq-feedback{font-size:.9rem;margin-top:11px!important}.lq-feedback--correct{font-weight:700}.lq-continue{scroll-margin-bottom:110px}
.lq-return-listen{display:flex;align-items:center;gap:8px;min-height:44px;margin-top:15px;padding:4px 0!important;font-size:.84rem!important;color:var(--lq-blue)!important;text-align:left}.lq-return-listen span{text-decoration:underline;text-underline-offset:4px}
.lq-reader-nav{grid-template-columns:minmax(175px,1fr) minmax(100px,210px) minmax(205px,1fr);gap:28px;padding:19px 0 12px}
.lq-nav-button{position:relative;isolation:isolate;justify-content:center;gap:15px;min-height:70px;padding:14px 25px!important;font-size:1.04rem!important;font-weight:700!important;color:var(--lq-paper)!important;text-align:center;transition:transform .22s var(--lq-ease);min-width:0}
.lq-nav-button:before{content:'';position:absolute;inset:0;z-index:-1;mask:url('ui/button-red.webp') center/100% 100% no-repeat;background:var(--lq-green);filter:drop-shadow(0 4px 3px #463b2724)}
.lq-nav-button:hover:enabled{transform:translateY(-2px) rotate(-1deg)}.lq-nav-button:active:enabled{transform:translateY(1px) scale(.98)}.lq-previous{min-width:185px}.lq-next{min-width:235px}.lq-next:before{background:var(--lq-blue)}
.lq-progress label{font-size:.79rem}.lq-progress progress{height:8px}.lq-ending{min-height:0;flex:1}.lq-result strong{color:var(--lq-green)}.lq-result span{font-size:1.02rem}.lq-footer{margin-top:auto;padding:16px 0 20px}
@media(min-width:980px) and (max-width:1180px){.lq-app{padding:0 24px}.lq-book{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.lq-reading-panel{padding:25px}.lq-primary{padding:16px 21px!important}.lq-primary>.lq-drawn-arrow{width:35px}.lq-player-main{gap:7px}.lq-listen{padding:10px!important}.lq-time{font-size:.69rem}}
@media(max-width:979px){
.lq-app{max-width:800px;padding:0 22px}.lq-header{min-height:80px;position:sticky;top:0;background:var(--lq-ground) url('ui/paper.png') center/900px 600px}.lq-brand{min-width:58px;min-height:58px}.lq-brand img{width:58px;height:56px}.lq-header-name{font-size:1.05rem}
.lq-book{display:block;min-height:0;border-radius:13px}.lq-art{min-height:0;height:clamp(230px,35dvh,370px);padding:25px 20px}.lq-art picture,.lq-art .lq-scene-image{height:100%;max-height:100%;width:100%}.lq-reading-panel{padding:22px 28px 26px}.lq-reading-panel h1{font-size:1.8rem}.lq-scene-text{max-width:none;font-size:1.05rem;margin-top:12px!important}.lq-listen-panel{margin-top:20px}.lq-player{margin-bottom:14px}.lq-listen-panel .lq-primary{max-width:420px}
.lq-reader{padding-bottom:115px}.lq-reader-nav{position:fixed;bottom:0;left:0;right:0;z-index:15;grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr);gap:17px;padding:14px max(22px,calc((100vw - 740px)/2)) calc(12px + env(safe-area-inset-bottom));background:var(--lq-ground) url('ui/paper.png') center/900px 600px;box-shadow:0 -5px 20px #463b2712}
.lq-nav-button{width:100%;min-width:0;min-height:65px;padding:13px 18px!important;gap:12px;justify-self:stretch;font-size:1rem!important}.lq-nav-button .lq-drawn-arrow{width:44px;height:30px}.lq-progress{position:absolute;top:0;left:0;right:0}.lq-progress label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.lq-progress progress{height:5px;border-radius:0}
.lq-reader~.lq-footer{display:none}.lq-reader~.lq-status:not(:empty){position:fixed;bottom:105px;left:14px;right:14px;z-index:16;background:var(--lq-paper);padding:10px!important}.is-quiz .lq-art{height:clamp(145px,21dvh,220px)}.is-quiz .lq-reading-panel h1{font-size:1.12rem;color:var(--lq-green)}.is-quiz .lq-scene-text{display:none}.lq-question{margin-top:15px}.lq-question-count{font-size:.8rem}.lq-root h2{font-size:1.45rem}.lq-return-listen{margin-top:9px}
.lq-cover{gap:35px;padding:25px 0}.lq-cover-copy h1{font-size:2.5rem}.lq-cover-actions .lq-primary{gap:14px}.lq-cover-credit{gap:10px}.lq-cover-credit>.lq-ui-art{width:50px;height:50px}.lq-credits{font-size:.76rem}
}
@media(max-width:599px){
.lq-app{padding:0 14px}.lq-header{min-height:72px;gap:10px}.lq-brand{min-width:48px;min-height:54px}.lq-brand img{width:48px;height:48px}.lq-header-name{font-size:.93rem}.lq-tools{gap:6px}.lq-sound{min-width:44px;min-height:44px;padding:8px!important;border-radius:15px}.lq-sound>span{display:none}.lq-index summary{gap:4px;min-height:44px;padding:3px 8px;font-size:.75rem}.lq-index summary>span{display:block}.lq-index summary>.lq-ui-art{width:29px;height:29px}
.lq-index nav{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;max-height:80dvh;border-radius:24px 24px 0 0;padding:17px 20px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 35px #463b273b}.lq-index-heading{padding-bottom:8px}.lq-index li button{font-size:.88rem;min-height:46px;padding:7px 4px}
.lq-cover{display:flex;flex-direction:column;gap:23px;padding:14px 6px 8px;justify-content:center}.lq-cover-art{padding:0 13%;max-width:370px;width:100%;margin:auto;transform:rotate(-2deg)}.lq-cover-art img{max-height:310px}.lq-cover-copy{max-width:440px;margin:auto;width:100%}.lq-cover-copy h1{font-size:1.95rem;line-height:1.12}.lq-intro{font-size:1.03rem;margin-top:15px!important}.lq-cover-actions{margin-top:22px}.lq-cover-actions .lq-primary{width:100%;min-height:62px}.lq-primary{padding:16px 22px!important;font-size:1rem!important;min-height:61px}.lq-primary>.lq-drawn-arrow{width:42px}.lq-cover-credit{margin-top:24px;gap:15px}.lq-cover-hint,.lq-saved{font-size:.8rem}
.lq-reading-meta{gap:9px;margin-bottom:12px;font-size:.77rem}.lq-chapter-sticker{padding:9px 13px}.lq-score{gap:5px;font-size:.74rem}.lq-score>.lq-ui-art{width:26px;height:26px}.lq-art{height:clamp(190px,30dvh,280px);padding:21px 16px}.lq-art:after{inset:6px}.lq-book{border-radius:13px}.lq-reading-panel{padding:20px 19px 23px}.lq-reading-panel h1{font-size:1.55rem}.lq-scene-text{font-size:1rem;line-height:1.55;margin-top:10px!important}.lq-listen-panel{margin-top:18px}
.lq-listen{min-height:52px;font-size:.98rem!important}.lq-player-main{grid-template-columns:minmax(0,1fr) 42px auto;gap:6px}.lq-time{font-size:.7rem}.lq-player{margin-bottom:9px}.lq-riddle-note{font-size:.85rem;margin-bottom:12px!important}.lq-listen-panel .lq-primary{max-width:none}
.is-quiz .lq-art{height:clamp(125px,18dvh,165px);padding:17px 13px}.is-quiz .lq-reading-panel{padding:17px 18px 21px}.is-quiz .lq-reading-panel h1{font-size:1.03rem}.lq-root h2{font-size:1.28rem;margin-bottom:10px}.lq-hear{font-size:.86rem!important;margin-bottom:8px;min-height:44px}.lq-options{gap:9px}.lq-option{min-height:52px;padding:11px 14px!important;font-size:.96rem!important;line-height:1.3}.lq-feedback{font-size:.85rem;margin-top:9px!important}.lq-return-listen{font-size:.8rem!important;min-height:44px;margin-top:8px}.lq-continue{min-height:58px;font-size:.94rem!important}
.lq-reader-nav{gap:12px;padding:14px 14px calc(12px + env(safe-area-inset-bottom))}.lq-nav-button{min-height:62px;padding:12px 15px!important;gap:8px;font-size:.94rem!important}.lq-nav-button .lq-drawn-arrow{width:40px;height:27px}.lq-reader{padding-bottom:110px}.lq-ending{display:block;padding:15px 6px 20px}.lq-ending-art img{max-height:320px}.lq-ending-copy{margin-top:25px}.lq-ending-copy h1{font-size:1.9rem}.lq-result strong{font-size:4.5rem}.lq-result span{font-size:.95rem}.lq-ending-copy>.lq-primary{width:100%}.lq-pending{font-size:.9rem}.lq-footer{font-size:.7rem;padding:18px 0}
}
@media(max-width:359px){.lq-app{padding:0 10px}.lq-header{gap:7px}.lq-header-name{font-size:.85rem}.lq-index summary{padding:3px 5px}.lq-reading-panel{padding:18px 16px}.lq-nav-button{font-size:.86rem!important;padding:12px!important;gap:5px}.lq-nav-button .lq-drawn-arrow{width:33px}.lq-time{font-size:.64rem}.lq-primary{font-size:.94rem!important}.lq-primary>.lq-drawn-arrow{width:33px}}