@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400&family=Caveat:wght@400;500;600;700&display=swap";:root{--paprika:#c8401a;--danube:#4a6fa5;--amber:#e8a820;--cream:#f5edd8;--parchment:#ede0c4;--graphite:#3a3530;--muted:#7a6a5a;--border:#d4c5a9;--white:#fffdf7;--font-display:"Fredoka", "Trebuchet MS", sans-serif;--font-body:"Atkinson Hyperlegible", Georgia, serif;--font-hand:"Caveat", cursive;--page-max:680px;--radius-sm:4px;--radius:8px;--radius-lg:16px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{background-color:var(--parchment);color:var(--graphite);font-family:var(--font-body);background-image:radial-gradient(circle at 20% 80%,#c8401a0a 0%,#0000 50%),radial-gradient(circle at 80% 20%,#4a6fa50a 0%,#0000 50%);min-height:100vh;line-height:1.7}body:before{content:"";pointer-events:none;z-index:9999;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");position:fixed;inset:0}.notebook-page{background:var(--cream);border:2px solid var(--border);border-radius:var(--radius-lg);box-shadow:2px 4px 0px var(--border), 4px 8px 20px #3a35301f;position:relative;overflow:hidden}.notebook-page:before{content:"";background:#c8401a2e;width:2px;position:absolute;top:0;bottom:0;left:52px}.ruled{background-image:repeating-linear-gradient(#0000,#0000 27px,#4a6fa51f 27px 28px)}.btn-stamp{font-family:var(--font-display);cursor:pointer;letter-spacing:.02em;background:0 0;border:3px solid;border-radius:4px;align-items:center;gap:8px;padding:10px 22px;font-size:1rem;font-weight:600;transition:transform .1s,box-shadow .1s;display:inline-flex;position:relative}.btn-stamp:hover{transform:translate(-1px,-1px);box-shadow:3px 3px}.btn-stamp:active{box-shadow:none;transform:translate(1px,1px)}.btn-primary{color:var(--paprika);background:#c8401a0f}.btn-secondary{color:var(--danube);background:#4a6fa50f}.btn-amber{color:var(--amber);background:#e8a82014}.section-title{font-family:var(--font-display);color:var(--paprika);font-weight:700;line-height:1.2}.annotation{font-family:var(--font-hand);color:var(--amber);font-size:1.1rem;display:inline-block;transform:rotate(-1.5deg)}.sticker{border:3px dashed var(--border);background:var(--white);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.4rem;display:inline-flex;position:relative}.sticker.earned{border-style:solid;border-color:var(--amber);background:#e8a8201a;box-shadow:0 2px 8px #e8a8204d}.pencil-bar{background:var(--parchment);border:2px solid var(--border);border-radius:3px;height:18px;position:relative;overflow:hidden}.pencil-bar-fill{background:repeating-linear-gradient(-45deg, var(--amber), var(--amber) 4px, #e8a82099 4px, #e8a82099 8px);height:100%;transition:width .6s}.riddle-card{background:var(--white);border:2px solid var(--border);border-radius:var(--radius);padding:24px;position:relative}.riddle-card:after{content:"";border:2px solid var(--border);border-radius:var(--radius);z-index:-1;background:var(--parchment);width:100%;height:100%;position:absolute;bottom:-4px;right:-4px}.answer-input{font-family:var(--font-hand);border:none;border-bottom:2px dashed var(--border);width:100%;color:var(--graphite);letter-spacing:.05em;background:0 0;outline:none;padding:4px 8px;font-size:1.3rem}.answer-input:focus{border-bottom-color:var(--danube)}.tab-nav{background:var(--cream);border-top:2px solid var(--border);z-index:100;justify-content:space-around;padding:8px 0 4px;display:flex;position:fixed;bottom:0;left:0;right:0}.tab-item{cursor:pointer;font-family:var(--font-display);color:var(--muted);border-radius:var(--radius);background:0 0;border:none;flex-direction:column;align-items:center;gap:2px;padding:6px 12px;font-size:.7rem;font-weight:600;text-decoration:none;transition:color .2s,transform .15s;display:flex}.tab-item:hover{color:var(--graphite);transform:translateY(-2px)}.tab-item.active{color:var(--paprika)}.tab-item .tab-icon{font-size:1.4rem}.torn-top{position:relative}.torn-top:before{content:"";background:var(--cream);clip-path:polygon(0% 100%,2% 20%,4% 80%,6% 10%,8% 70%,10% 30%,12% 85%,14% 15%,16% 75%,18% 40%,20% 90%,22% 20%,24% 70%,26% 35%,28% 80%,30% 15%,32% 65%,34% 30%,36% 85%,38% 10%,40% 75%,42% 40%,44% 90%,46% 20%,48% 70%,50% 30%,52% 85%,54% 15%,56% 75%,58% 40%,60% 90%,62% 20%,64% 70%,66% 35%,68% 80%,70% 15%,72% 65%,74% 30%,76% 85%,78% 10%,80% 75%,82% 40%,84% 90%,86% 20%,88% 70%,90% 35%,92% 80%,94% 15%,96% 65%,98% 30%,100% 100%);height:16px;position:absolute;top:-8px;left:0;right:0}.word-grid{font-family:var(--font-display);gap:2px;font-size:1.1rem;font-weight:600;display:grid}.word-cell{border:1px solid var(--border);background:var(--white);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:3px;justify-content:center;align-items:center;width:36px;height:36px;transition:background .15s,color .15s;display:flex}.word-cell:hover{background:#4a6fa51a}.word-cell.selected{color:var(--danube);background:#4a6fa540}.word-cell.found{color:var(--graphite);border-color:var(--amber);background:#e8a8204d}.maze-container{background:var(--white);border:2px solid var(--border);border-radius:var(--radius);overflow:hidden}.hand-checkbox{border:2.5px solid var(--graphite);cursor:pointer;background:0 0;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;transition:background .15s;display:inline-flex}.hand-checkbox.checked{border-color:var(--paprika);background:#c8401a1a}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--parchment)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}@keyframes wiggle{0%,to{transform:rotate(-1deg)}50%{transform:rotate(1deg)}}@keyframes stamp-in{0%{opacity:0;transform:scale(1.3)rotate(-3deg)}60%{transform:scale(.95)rotate(1deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes page-turn{0%{opacity:0;transform:rotateY(-5deg)}to{opacity:1;transform:rotateY(0)}}.animate-stamp{animation:.4s forwards stamp-in}.animate-page{animation:.3s forwards page-turn}