@font-face{font-family:ScribbleMarker;src:url('assets/fonts/PermanentMarker.ttf') format('truetype');font-weight:400 900;font-display:swap}
@font-face{font-family:ScribbleHand;src:url('assets/fonts/Kalam-Bold.ttf') format('truetype');font-weight:400 900;font-display:swap}
:root{--paper:#eeff69;--ink:#101010;--lime:#d8ff18;--pink:#ff58d5;--purple:#9865ff;--cyan:#42efff;--hand:ScribbleHand,'Comic Sans MS',cursive;--marker:ScribbleMarker,'Comic Sans MS',cursive}
body{color:var(--ink);font-family:var(--hand);font-size:19px;font-weight:700;background:#5b15bb url('assets/neon-painted-ink-background.png') center top/cover fixed no-repeat}
body:before{display:none}
main>h2,main>p,main>.eyebrow,.story-top>.eyebrow,.story-top>span:not(.badge){background:#faffb6;color:#101010;padding:10px 15px;border:2px solid #101010;border-radius:5px;box-shadow:3px 3px 0 #101010}
main>.eyebrow{display:inline-block}main>p{max-width:100%;line-height:1.65}
@media(max-width:700px){body{background-attachment:scroll;background-size:auto 1200px;background-repeat:repeat-y}}

button,input,select,textarea{font:inherit;color:var(--ink)}button,a,input,select{accent-color:#101010}h1,h2,h3,.brand,.btn,nav button,.pill,.lesson-library summary{font-family:var(--marker);font-weight:400;color:var(--ink)}h1{font-size:clamp(48px,6.5vw,84px);line-height:1.12;letter-spacing:-2px}h2{font-size:clamp(29px,4vw,39px);letter-spacing:-.5px}h3{letter-spacing:0}p{line-height:1.65}
header{background:#edff72;border-bottom:4px solid #101010;box-shadow:0 5px 0 #10101018;gap:24px;flex-wrap:wrap}.brand{font-size:27px;line-height:1.15;letter-spacing:-1px}.brand small{font-family:var(--hand);color:#101010;font-size:12px;letter-spacing:1px;margin-top:10px}nav{gap:8px}nav button{color:#101010;background:#fffef3;border:2px solid #101010;border-radius:55% 45% 47% 53%/15% 18% 16% 20%;font-size:16px;padding:9px 13px}nav button.active{background:var(--pink);color:#101010;box-shadow:3px 3px 0 #101010;transform:rotate(-2deg)}
main{max-width:1280px;padding-top:42px}.hero{gap:45px}.hero>div:first-child{background:#fbffad;border:3px solid #101010;padding:28px;border-radius:3% 2% 3% 2%;box-shadow:7px 7px 0 #101010}.hero h1{color:#101010;text-shadow:none;margin:24px 0}.hero p{color:#101010;font-size:21px}.hero .notice{font-size:16px}.pill{background:var(--pink);border:2px solid #101010;color:#101010;font-size:15px;padding:9px 13px;border-radius:4px;box-shadow:3px 3px 0 #101010;transform:rotate(-2deg)}.art{background:var(--cyan);border:4px solid #101010;border-radius:3% 2% 4% 3%;box-shadow:8px 8px 0 #101010;padding:15px}.art img{max-height:540px;border:2px solid #101010;border-radius:3px}.art span{font-family:var(--marker);font-size:20px;line-height:1.3;background:var(--lime);color:#101010;border:2px solid #101010;box-shadow:3px 3px 0 #101010;padding:12px 24px;border-radius:3px}
.btn,.btn.light{background:var(--lime);border:3px solid #101010;color:#101010;border-radius:6% 3% 5% 4%/12% 15% 12% 15%;box-shadow:4px 4px 0 #101010;font-size:17px;line-height:1.4;letter-spacing:0}.btn.light{background:#fffef3}.btn:disabled{opacity:.5;box-shadow:none}.btn:hover:not(:disabled){background:var(--pink)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #101010;outline-offset:5px;box-shadow:0 0 0 8px var(--cyan)}
.badge{background:var(--pink);color:#101010;border:2px solid #101010;font-size:16px;box-shadow:3px 3px 0 #101010}.eyebrow{font-family:var(--hand);font-size:14px;letter-spacing:1px;color:#101010}.notice,.drawing-help,.status,.story-caption{color:#101010!important;font-family:var(--hand);font-weight:700}.notice{font-size:16px}.status{background:#fbffb6;padding:8px 12px;border-radius:5px}.status:empty{background:none;padding:0}.story-top>h2{background:var(--lime);padding:8px 14px;border:2px solid #101010;box-shadow:4px 4px 0 #101010}
.card,.card:nth-child(2),.card:nth-child(3){background:#fbffb6;color:#101010;border:3px solid #101010;border-radius:3% 4% 2% 3%;box-shadow:5px 5px 0 #101010}.activities,.game-grid{gap:23px}.activities>button.card,.game-grid>button.card{padding:16px;min-height:345px;box-shadow:6px 6px 0 #101010;background-position:center top;background-size:100% auto;background-repeat:no-repeat;background-color:var(--cyan)}.activities>button.card:nth-child(1){background-image:url('assets/moon.webp')}.activities>button.card:nth-child(2){background-image:url('assets/garden.webp')}.activities>button.card:nth-child(3){background-image:url('assets/orchestra.webp')}.game-grid>button.card:nth-child(1){background-image:url('assets/ribbon.webp')}.game-grid>button.card:nth-child(2){background-image:url('assets/tickle.webp')}.game-grid>button.card:nth-child(3){background-image:url('assets/orchestra.webp')}.game-grid>button.card:nth-child(4){background-image:url('assets/garden.webp')}.card .number,.activities>button.card .number,.game-grid>button.card .number{background:var(--pink);color:#101010;text-shadow:none;border:2px solid #101010;padding:5px 9px;font-size:13px;align-self:flex-start}.activities>button.card h3,.game-grid>button.card h3{background:var(--lime);color:#101010;padding:12px 10px;margin:80px 0 0;border:2px solid #101010;border-bottom:0;font-size:25px;line-height:1.3}.card p{background:#faffc9;color:#101010;padding:10px;font-size:17px;line-height:1.45;border:2px solid #101010;border-top:0;width:100%}
.panel,.drawing-lesson,.lesson-library{background:#f9ffb4;color:#101010;border:3px solid #101010;border-radius:9px;box-shadow:5px 5px 0 #101010}.drawing-lesson{background:#bafff2}.lesson-library{background:#ffc2f0}.lesson-library summary span{color:#101010;font-family:var(--hand);font-size:17px}.lesson-filters label{font-size:17px}.lesson-filters select{background:#fffef3;color:#101010;border:2px solid #101010;font-family:var(--hand);font-size:17px}.lesson-card{background:#fffef3;color:#101010;border:3px solid #101010;border-radius:6px}.lesson-card.chosen{border-color:#101010;box-shadow:inset 0 0 0 4px var(--pink)}.lesson-card strong{font-family:var(--marker);font-size:16px;font-weight:400;padding-top:4px}.level{color:#101010;border:1px solid #101010;font-size:14px;background:#c7a3ff}.level-easy{background:var(--lime)}.level-tricky{background:var(--pink)}.drawing-lesson h3{font-size:26px}.drawing-lesson .notice{font-size:15px}.canvas-shell{border:3px solid #101010;box-shadow:5px 5px 0 #101010;border-radius:4px}.swatch{border:2px solid #101010}.swatch.selected{outline-color:#101010;box-shadow:0 0 0 6px var(--pink)}
.story-spread{background:#f9ffb4;color:#101010;border:3px solid #101010;border-radius:8px;box-shadow:7px 7px 0 #101010}.story-visual{background:#7effdf;border-right:3px solid #101010}.story-copy p{font-family:var(--hand);font-size:23px;line-height:1.65}.story-copy h2,.cover-title{color:#101010!important}.story-caption{font-size:16px!important}.storyimg{background:var(--cyan)}.progress{background:#fffef3;border:1px solid #101010;height:12px}.progress span{background:var(--pink)}
.neon-stage{background:#b5ffde;color:#101010;border:3px solid #101010;border-radius:8px;box-shadow:5px 5px 0 #101010}.secretstage{border:3px solid #101010}.secret{background:#eeff85;color:#101010;border:3px dashed #101010;box-shadow:3px 3px 0 #101010;font-family:var(--marker)}.secret.found{background:var(--pink);color:#101010}.tile{background:var(--pink);border:3px solid #101010;color:#101010;box-shadow:4px 4px 0 #101010;border-radius:7% 4% 6% 5%;font-family:var(--marker)}.tile.open,.tile.matched{background:var(--lime);color:#101010;border-color:#101010;box-shadow:2px 2px 0 #101010}.pad{opacity:1;border:3px solid #101010;color:#101010;box-shadow:4px 4px 0 #101010;font-family:var(--marker)}.pad.lit{border-color:#101010;box-shadow:0 0 0 5px white,0 0 0 8px #101010}.count-art{background:#f8ffb7;border:3px solid #101010;border-radius:6px}.count-art span{background:#91ffe6;border:2px solid #101010;text-shadow:none}.count-art .star{color:#101010}.count-art .moon{color:#6725ab}
dialog{background:#f6ff91;color:#101010;border:4px solid #101010;border-radius:8px;box-shadow:8px 8px 0 #101010}dialog input{background:#fffef3;color:#101010;border:2px solid #101010}dialog::backdrop{background:#2d005a9c}footer{background:var(--lime);color:#101010;border-top:4px solid #101010;font-size:16px}
@media(max-width:800px){.hero{gap:30px}.hero>div:first-child{padding:22px}.story-visual{border-right:0;border-bottom:3px solid #101010}.story-copy p{font-size:21px}header{padding:20px 5%}h1{letter-spacing:-1px}.activities>button.card{min-height:360px}}
@media(max-width:700px){body{font-size:18px}main{padding-left:5%;padding-right:6%}nav button{font-size:14px;padding:8px 10px}.brand{font-size:26px}.hero .btn{font-size:16px}.art img{max-height:480px}.story-top{align-items:flex-start}.activities>button.card,.game-grid>button.card{min-height:360px}.lesson-card strong{font-size:15px}.drawing-lesson{padding:16px}.lesson-modes .btn{min-width:120px;font-size:15px}.toolbar{gap:12px}.lesson-library summary{font-size:18px}.lesson-card{padding:9px}.story-copy{padding:22px}}