:root{--wall:#cfcbec;--ink:#4a3426;--ink-soft:#7d6655;--wood:#d4925a;--wood-d:#93593a;--wood-l:#efbf86;--paper:#fffaf1;--paper-edge:#eadcc5;--gold:#f5b938;--gold-d:#c88d14;--coral:#ec6f5b;--mint:#86c9ad;--night:#3f4475;--f-display:"Fredoka","Baloo 2","Trebuchet MS",system-ui,sans-serif;--f-read:"Andika","Verdana","Comic Sans MS",sans-serif;--pw:300px;--ph:396px;--cs:1;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[hidden]{display:none!important}html,body{height:100%}body{background:var(--wall);color:var(--ink);font-family:var(--f-read);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation;margin:0;overflow:hidden}button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--coral);outline-offset:3px}.bar{z-index:30;padding-block:max(10px,env(safe-area-inset-top,0px)) 10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));flex-wrap:wrap;align-items:center;gap:10px;transition:opacity .5s,transform .5s;display:flex;position:fixed;top:0;left:0;right:0}body.reading .bar{opacity:0;pointer-events:none;transform:translateY(-20px)}.brand{font:700 22px/1 var(--f-display);color:var(--ink);text-shadow:0 2px #fffaf1b3;align-items:center;gap:9px;margin-right:auto;display:flex}.tabs{background:var(--paper);box-shadow:0 0 0 2.5px var(--ink),0 4px 0 2.5px var(--ink);border-radius:999px;padding:4px;display:flex}.tab{color:var(--ink-soft);font:600 15px var(--f-display);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:8px 16px;transition:background .2s,color .2s}.tab[aria-pressed=true]{background:var(--gold);color:var(--ink);box-shadow:inset 0 -3px 0 var(--gold-d)}.pill{background:var(--paper);font:700 19px/1 var(--f-display);box-shadow:0 0 0 2.5px var(--ink),0 4px 0 2.5px var(--ink);font-variant-numeric:tabular-nums;border-radius:999px;align-items:center;gap:6px;padding:6px 14px 6px 8px;display:flex}.pill.bump{animation:.45s cubic-bezier(.3,1.8,.5,1) bump}@keyframes bump{40%{transform:scale(1.25)}}.iconbtn{background:var(--paper);width:42px;height:42px;box-shadow:0 0 0 2.5px var(--ink),0 4px 0 2.5px var(--ink);cursor:pointer;color:var(--ink);border:0;border-radius:50%;flex:none;place-items:center;display:grid}.iconbtn:active{box-shadow:0 0 0 2.5px var(--ink),0 1px 0 2.5px var(--ink);transform:translateY(3px)}.iconbtn[aria-pressed=false]{opacity:.55}@media (width<=600px){.brand{gap:6px;font-size:16px}.brand svg{width:28px;height:28px}.pill{padding:5px 12px 5px 7px;font-size:17px}.iconbtn{width:38px;height:38px}.tabs{order:3;width:100%}.tab{flex:1}.bar{gap:8px}.bar .iconbtn{width:36px;height:36px}}@media (width<=400px){.brand span{display:none}}.layer{z-index:70;padding-block:16px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#3f447573;place-items:center;animation:.35s fadein;display:grid;position:fixed;inset:0}@keyframes fadein{0%{opacity:0}}.card{background-color:var(--paper);background-image:var(--paper-tex);background-blend-mode:multiply;width:min(560px,100%);max-height:100%;box-shadow:0 0 0 3px var(--ink),0 8px 0 3px var(--ink),0 30px 60px #281e3c59;border-radius:28px;padding:22px 22px 24px;animation:.5s cubic-bezier(.3,1.5,.5,1) popin;position:relative;overflow:auto}@keyframes popin{0%{opacity:0;transform:scale(.85)translateY(20px)}}.qhead{align-items:center;gap:10px;margin-bottom:10px;display:flex}.qhead .bt{min-width:0;font:600 14px var(--f-display);color:var(--ink-soft);letter-spacing:.04em;text-transform:uppercase;flex:1}.qprog{gap:4px;display:flex}.qprog svg.got{animation:.5s cubic-bezier(.3,1.8,.5,1) pop}.qq{font:700 clamp(22px,5.4vw,28px)/1.2 var(--f-display);text-align:center;text-wrap:balance;margin:6px 0 12px}.qart{justify-content:center;margin-bottom:14px;display:flex}.qart canvas{width:min(260px,70%);height:auto}.choices{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;display:grid}.ch{cursor:pointer;font:600 20px var(--f-display);box-shadow:0 0 0 2.5px var(--ink),0 5px 0 2.5px var(--ink);background:#fff;border:0;border-radius:18px;justify-content:center;align-items:center;gap:10px;padding:15px 12px;transition:transform .15s;display:flex}.ch:active{box-shadow:0 0 0 2.5px var(--ink),0 1px 0 2.5px var(--ink);transform:translateY(4px)}.ch:disabled{cursor:default}.ch .sw{background:var(--sw);width:32px;height:32px;box-shadow:0 0 0 2.5px var(--ink),inset 0 -4px 0 #00000026;border-radius:50%;flex:none}.ch svg{flex:none}.ch.ok{background:#e1f5e6;animation:.5s cubic-bezier(.3,1.8,.5,1) pop;box-shadow:0 0 0 3px #3f8f5c,0 5px 0 3px #3f8f5c}.ch.no{background:#fde4df;animation:.45s shake}.ch.dim{opacity:.4}@keyframes pop{40%{transform:scale(1.08)}}@keyframes shake{20%,60%{transform:translate(-7px)}40%,80%{transform:translate(7px)}}.fb{text-align:center;min-height:28px;font:700 19px var(--f-display);margin:16px 0 0}.fb.good{color:#3f8f5c}.fb.bad{color:#b4523f}.actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:16px;display:flex}.btn{cursor:pointer;font:700 17px var(--f-display);background:var(--gold);color:var(--ink);box-shadow:0 0 0 2.5px var(--ink),0 5px 0 2.5px var(--ink);border:0;border-radius:999px;align-items:center;gap:6px;padding:13px 22px;display:inline-flex}.btn.alt{background:var(--paper)}.btn:disabled{opacity:.45;cursor:default}.btn:active:not(:disabled){box-shadow:0 0 0 2.5px var(--ink),0 1px 0 2.5px var(--ink);transform:translateY(4px)}.res{text-align:center}.res .big{justify-content:center;gap:6px;margin:6px 0 10px;display:flex}.res .big svg{animation:.6s cubic-bezier(.3,1.8,.5,1) both pop}.res h3{font:700 28px var(--f-display);margin:0 0 6px}.res p{max-width:36ch;color:var(--ink-soft);margin:0 auto;line-height:1.5}.shopc{align-items:center;gap:18px;display:flex}.mini{width:130px;height:172px;box-shadow:0 0 0 2.5px var(--ink),6px 8px 0 #0000001a;background-size:100% 100%;border-radius:4px 12px 12px 4px;flex:none}.shopc h3{font:700 24px/1.1 var(--f-display);margin:0 0 4px}.shopc .k{font:600 13px var(--f-display);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em}.shopc p{margin:10px 0 0;line-height:1.5}@media (width<=420px){.shopc{text-align:center;flex-direction:column}}.x{position:absolute;top:14px;right:14px}.toast{left:50%;bottom:calc(70px + env(safe-area-inset-bottom,0px));opacity:0;z-index:90;background:var(--night);color:#fff;font:600 16px var(--f-display);pointer-events:none;text-align:center;max-width:calc(100% - 32px);box-shadow:0 0 0 2.5px var(--ink);border-radius:999px;padding:12px 20px;transition:all .4s cubic-bezier(.3,1.4,.5,1);position:fixed;transform:translate(-50%,40px)}.toast.on{opacity:1;transform:translate(-50%)}.flystar{z-index:95;pointer-events:none;position:fixed;top:0;left:0}.loader{z-index:100;background:#cfcbec;place-items:center;transition:opacity .6s;display:grid;position:fixed;inset:0}.loader.off{opacity:0;pointer-events:none}.loader p{font:600 18px var(--f-display);color:var(--ink);text-align:center;margin:14px 0 0}.loader .lb{width:70px;height:56px;margin:auto;position:relative}.loader .lb i{background:var(--coral);width:34px;height:52px;box-shadow:0 0 0 2.5px var(--ink);transform-origin:0;border-radius:3px 8px 8px 3px;animation:1.4s ease-in-out infinite lflip;position:absolute;top:0;left:50%}.loader .lb i:nth-child(2){background:var(--mint);animation-delay:.2s}.loader .lb i:nth-child(3){background:var(--gold);animation-delay:.4s}@keyframes lflip{0%,20%{transform:perspective(200px)rotateY(0)}60%,to{transform:perspective(200px)rotateY(-180deg)}}@media (prefers-reduced-motion:reduce){.lampglow,.bulb,.zz,.catb,.mote,.sign,.bk .tag b,.quizbtn,.quiznav{animation:none!important}.pan,.book{transition-duration:.2s}}.iconbtn,.woodbtn,.btn,.ch,.tab{transition:transform .18s cubic-bezier(.3,1.8,.5,1),box-shadow .18s}.iconbtn:active,.woodbtn:active,.btn:active:not(:disabled),.ch:active{scale:.92}@media (hover:hover){.iconbtn:hover,.woodbtn:hover,.btn:hover:not(:disabled){transform:translateY(-2px)rotate(-2deg)}}.hint span{padding:9px 18px;font-size:17px;animation:3.6s ease-in-out infinite floaty;position:relative}.hint span:after{content:"";background:inherit;width:14px;height:14px;box-shadow:-2.5px -2.5px 0 0 var(--ink);position:absolute;top:-9px;left:50%;transform:translate(-50%)rotate(45deg)}@keyframes floaty{50%{transform:translateY(-5px)}}#pillStar svg{animation:8s linear infinite starspin}@keyframes starspin{to{rotate:360deg}}.brand span{letter-spacing:.01em}@media (prefers-reduced-motion:reduce){.hint span,#pillStar svg{animation:none!important}}
