:root{--cream: #fff6e5;--paper: #fffdf7;--ink: #4a2c1a;--muted: #8a6a52;--sun: #ffc83d;--tangerine: #ff8a2b;--coral: #ff6b5b;--berry: #d6457a;--leaf: #5bb974;--sky: #4fb3d9;--edge: #f1d9b0;--shadow: 0 6px 0 rgba(120, 70, 20, .16);--display: "Fredoka", "Baloo 2", ui-rounded, "Arial Rounded MT Bold", "Trebuchet MS", system-ui, sans-serif;--body: "Nunito", ui-rounded, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--ink);background-color:var(--cream);font:18px/1.5 var(--body);background-image:radial-gradient(circle at 12% 8%,rgba(255,200,61,.35) 0 90px,transparent 91px),radial-gradient(circle at 92% 30%,rgba(255,107,91,.18) 0 120px,transparent 121px),radial-gradient(rgba(255,138,43,.12) 2px,transparent 2.5px);background-size:auto,auto,28px 28px}#app{padding:16px 16px 48px;display:flex;justify-content:center}.hub{width:min(1040px,100%)}.hero{position:relative;overflow:hidden;margin-top:8px;padding:36px 28px 40px;border-radius:32px;color:#fff;text-align:center;background:linear-gradient(135deg,var(--tangerine),var(--coral) 60%,var(--berry));box-shadow:0 8px #a03c1e40}.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:radial-gradient(circle at 12px 14px,var(--cream) 10px,transparent 11px) repeat-x;background-size:24px 14px;opacity:.35}.hero .sym{position:absolute;font-family:var(--display);font-weight:700;color:#ffffff47;user-select:none;pointer-events:none;animation:float 6s ease-in-out infinite}.hero .sym:nth-child(1){left:4%;top:10%;font-size:3.4rem}.hero .sym:nth-child(2){left:14%;bottom:12%;font-size:2.6rem;animation-delay:-1.5s}.hero .sym:nth-child(3){right:6%;top:12%;font-size:3rem;animation-delay:-3s}.hero .sym:nth-child(4){right:16%;bottom:10%;font-size:3.6rem;animation-delay:-4.5s}.hero .sym:nth-child(5){left:44%;top:4%;font-size:2rem;animation-delay:-2s}@keyframes float{50%{transform:translateY(-10px) rotate(8deg)}}.hero .apple{font-size:3rem;display:block;margin-bottom:4px}.hero h1{position:relative;margin:0;font:700 clamp(2rem,6vw,3.4rem)/1.1 var(--display);text-shadow:0 3px 0 rgba(120,30,20,.3)}.hero .lede{position:relative;margin:10px auto 0;max-width:34ch;font-size:1.2rem;font-weight:700}.hero .cta{position:relative;display:inline-block;margin-top:20px;padding:12px 26px;border-radius:999px;background:var(--sun);color:var(--ink);font:700 1.15rem var(--display);text-decoration:none;box-shadow:0 5px #c78f00;transition:transform .12s}.hero .cta:hover{transform:translateY(-2px) rotate(-1.5deg)}.hero .cta:active{transform:translateY(3px);box-shadow:0 2px #c78f00}.banner{position:relative;width:min(560px,92%);margin:22px auto 0;padding:16px 20px 16px 52px;background:#fff3a6;border-radius:6px 6px 18px;font-weight:700;box-shadow:3px 6px #78461429;transform:rotate(-1.2deg)}.banner:before{content:"📌";position:absolute;left:16px;top:12px;font-size:1.6rem}.hub h2{display:flex;align-items:center;gap:10px;margin:40px 0 14px;font:700 1.7rem var(--display);color:var(--ink)}.hub h2:after{content:"";flex:1;height:0;border-top:4px dotted var(--edge)}.hint{color:var(--muted);font-size:.95rem;margin:6px 0}button{font:inherit;cursor:pointer}.chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.chip{padding:8px 20px;border-radius:999px;border:3px solid var(--edge);background:var(--paper);color:var(--ink);font:700 1rem var(--display);transition:transform .12s}.chip:hover{transform:translateY(-2px)}.chip.on{background:var(--leaf);border-color:var(--leaf);color:#fff;box-shadow:0 4px #3c8f55}.grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.activity{--c: var(--tangerine);position:relative;display:flex;flex-direction:column;gap:10px;padding:0 20px 20px;background:var(--paper);border:3px solid var(--c);border-radius:24px;box-shadow:var(--shadow);overflow:hidden;transition:transform .15s}.activity:nth-child(4n+2){--c: var(--sky)}.activity:nth-child(4n+3){--c: var(--leaf)}.activity:nth-child(4n+4){--c: var(--berry)}.activity:nth-child(odd):hover{transform:translateY(-4px) rotate(-1deg)}.activity:nth-child(2n):hover{transform:translateY(-4px) rotate(1deg)}.activity.soon{border-style:dashed}.activity.soon:hover{transform:none}.activity .emoji{margin:0 -20px 4px;padding:16px 0;text-align:center;font-size:3.4rem;line-height:1.1;background:var(--c);background-image:radial-gradient(rgba(255,255,255,.3) 3px,transparent 3.5px);background-size:20px 20px}.activity.soon .emoji{filter:grayscale(.4);opacity:.8}.activity h3{margin:0;font:700 1.3rem/1.2 var(--display)}.activity p{margin:0;flex:1}.tags{display:flex;gap:6px;flex-wrap:wrap}.tag{background:#fdebc8;border-radius:999px;padding:2px 12px;font-size:.82rem;font-weight:700;color:var(--muted)}a.button{text-decoration:none;text-align:center;display:block;border-radius:999px;padding:10px 18px;margin-top:6px}a.button.primary{background:var(--c);color:#fff;font:700 1.15rem var(--display);box-shadow:0 4px #0003;transition:transform .1s}a.button.primary:hover{transform:translateY(-2px)}a.button.primary:active{transform:translateY(3px);box-shadow:0 1px #0003}.badge{align-self:flex-start;background:#fdebc8;color:var(--muted);font:700 .95rem var(--display);border-radius:999px;padding:4px 14px}button.ghost{border:2px solid var(--edge);border-radius:999px;background:transparent;color:var(--muted);padding:5px 14px;font-weight:700;font-size:.9rem}button.ghost:hover{border-color:var(--c);color:var(--ink)}.class-link{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.class-link small{color:var(--muted)}.resources{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.resources li{background:var(--paper);border:3px solid var(--edge);border-radius:18px;padding:12px 16px}.resources li:before{content:"📎 "}.resources a{color:var(--berry);font-weight:800}.fact{display:flex;gap:16px;align-items:center;margin-top:40px;padding:18px 22px;background:#e5f5ff;border:3px dashed var(--sky);border-radius:24px}.fact .big{font-size:2.6rem}.fact strong{font-family:var(--display);font-size:1.2rem;display:block;color:#1f7ea6}footer{margin-top:36px;text-align:center;color:var(--muted);font-weight:700}@media (max-width: 520px){.hero{padding:28px 16px 34px;border-radius:24px}.hero .sym{opacity:.6}}@media (prefers-reduced-motion: reduce){.hero .sym{animation:none}*{transition:none!important}}