@import url('../styles.css?v=3');
:root{--activity-max:min(1120px,calc(100% - 32px))}
.activity-page{background:var(--cream)}
.activity-topbar{min-height:76px;border-bottom:2px solid var(--ink);display:flex;align-items:center;gap:18px;padding:12px max(16px,calc((100vw - 1120px)/2));background:rgba(255,249,233,.97);position:sticky;top:0;z-index:30}
.activity-back{font-weight:900;border:2px solid var(--ink);border-radius:12px;background:#fff;padding:9px 14px}.activity-brand{font:800 22px var(--display);margin-right:auto}.star-counter{border:2px solid var(--ink);border-radius:99px;background:var(--yellow);padding:8px 14px;font-weight:900}
.activity-intro{width:var(--activity-max);margin:0 auto;padding:48px 0 28px}.activity-intro h1{font-size:clamp(44px,7vw,78px);letter-spacing:-2px;max-width:850px}.activity-intro>p:not(.eyebrow){max-width:720px;font-size:18px;color:#575168}.activity-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.activity-meta span{border:2px solid var(--ink);border-radius:99px;padding:7px 13px;background:#fff;font-weight:800;font-size:13px}
.activity-workspace{width:var(--activity-max);margin:0 auto 70px;border:var(--line);border-radius:30px;background:#fff;box-shadow:8px 9px 0 var(--ink);overflow:hidden}.activity-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:18px;border-bottom:2px solid var(--ink);background:#efe1ff}.tool-group{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.tool-label{font-weight:900;font-size:13px}.activity-toolbar button,.activity-action,.choice-button{min-height:44px;border:2px solid var(--ink);border-radius:12px;background:#fff;padding:8px 14px;font-weight:900;cursor:pointer;box-shadow:2px 2px 0 var(--ink)}.activity-toolbar button:active,.activity-action:active,.choice-button:active{transform:translate(2px,2px);box-shadow:none}.activity-toolbar button[aria-pressed="true"],.choice-button.active{background:var(--yellow)}.activity-action.primary{background:var(--coral)}.activity-action.finish{background:var(--green)}.activity-stage{padding:26px;min-height:440px;display:grid;place-items:center;background:#f9f7ff}.activity-help{padding:18px 24px;border-top:2px solid var(--ink);background:#fff9e9}.activity-help b{display:block;font:800 20px var(--display)}.activity-help p{margin:4px 0}
.palette{display:flex;gap:8px;flex-wrap:wrap}.swatch{width:44px;height:44px;padding:0!important;border-radius:50%!important}.swatch.active{outline:4px solid #fff;box-shadow:0 0 0 7px var(--ink)!important}
.completion-card{width:var(--activity-max);margin:0 auto 70px;padding:32px;border:var(--line);border-radius:28px;background:var(--yellow);box-shadow:var(--shadow);text-align:center}.completion-card[hidden]{display:none}.completion-card h2{font-size:clamp(38px,5vw,58px)}.earned{display:inline-block;border:2px solid var(--ink);border-radius:99px;background:#fff;padding:8px 15px;font-weight:900}.completion-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:20px}
.related-activities{width:var(--activity-max);margin:0 auto;padding:0 0 80px}.related-activities h2{font-size:40px}.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.related-grid a{border:2px solid var(--ink);border-radius:18px;background:#fff;padding:20px;font-weight:900;box-shadow:3px 4px 0 var(--ink)}
.map-board{width:min(720px,100%)}.map-board svg{display:block;width:100%;max-height:560px}.map-region{stroke:var(--ink);stroke-width:4;cursor:pointer;transition:.15s}.map-region:hover{filter:brightness(.95)}
.pattern-preview{width:min(720px,100%);aspect-ratio:1.5;border:3px solid var(--ink);border-radius:20px;overflow:hidden;display:grid;background:#fff}.pattern-grid{display:grid;width:100%;height:100%}.pattern-cell{display:grid;place-items:center;font-size:clamp(30px,6vw,70px);line-height:1}.fabric-preview{padding:26px;background:#28203e;border-radius:22px;transform:perspective(700px) rotateX(3deg);box-shadow:inset 0 0 30px rgba(0,0,0,.25)}
.drum-stage{display:grid;grid-template-columns:minmax(260px,500px) minmax(220px,320px);gap:40px;align-items:center}.drum-svg{width:100%;filter:drop-shadow(7px 9px 0 rgba(33,26,61,.25))}.drum-hit{cursor:pointer}.drum-hit.pulse{animation:drum-hit .22s ease}@keyframes drum-hit{50%{transform:scale(.96);transform-origin:center}}
.control-panel{display:grid;gap:15px}.control-panel label{font-weight:900}.control-panel input[type="color"],.control-panel select{width:100%;min-height:48px;border:2px solid var(--ink);border-radius:11px;background:#fff;padding:6px}
.draw-layout{width:100%;display:grid;grid-template-columns:1fr 230px;gap:22px;align-items:start}.draw-canvas-wrap{background:#fff;border:3px solid var(--ink);border-radius:20px;overflow:hidden;touch-action:none}.draw-canvas-wrap canvas{display:block;width:100%;height:520px;cursor:crosshair}.food-prompts{display:grid;gap:10px}.food-prompts button{min-height:48px;border:2px solid var(--ink);border-radius:12px;background:#fff;font-weight:900;cursor:pointer}.food-prompts button.active{background:#ffd96a}
.hunt-board{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.hunt-item{min-height:115px;border:2px solid var(--ink);border-radius:18px;background:#fff;padding:18px;text-align:left;cursor:pointer;display:grid;grid-template-columns:50px 1fr;gap:12px;align-items:center}.hunt-item .hunt-check{width:44px;height:44px;border:2px solid var(--ink);border-radius:12px;display:grid;place-items:center;font-size:25px}.hunt-item.done{background:#c7efda}.hunt-progress{font-weight:900;margin-left:auto}
.puppet-layout{width:100%;display:grid;grid-template-columns:230px 1fr;gap:20px}.puppet-pickers{display:grid;gap:10px;align-content:start}.puppet-pickers button{min-height:52px;border:2px solid var(--ink);border-radius:13px;background:#fff;font-weight:900;cursor:pointer}.shadow-stage{position:relative;height:480px;border:8px solid var(--ink);border-radius:22px;overflow:hidden;background:linear-gradient(#ffb078,#ffd76a);touch-action:none}.shadow-stage.night{background:linear-gradient(#302652,#7661a7)}.shadow-stage.forest{background:linear-gradient(#8bd9f4 0 45%,#80cf98 45%)}.puppet{position:absolute;bottom:35px;font-size:90px;filter:grayscale(1) brightness(.2);cursor:grab;touch-action:none;user-select:none}.puppet:after{content:'';position:absolute;width:7px;height:150px;background:#211a3d;left:50%;top:72px;z-index:-1}.stage-ground{position:absolute;bottom:0;left:0;right:0;height:50px;background:#211a3d}
@media(max-width:760px){.activity-intro{padding-top:34px}.activity-workspace{border-radius:22px}.activity-stage{padding:16px;min-height:360px}.drum-stage,.draw-layout,.puppet-layout{grid-template-columns:1fr}.draw-canvas-wrap canvas{height:430px}.food-prompts{grid-template-columns:repeat(2,1fr)}.hunt-board{grid-template-columns:1fr}.related-grid{grid-template-columns:1fr}.shadow-stage{height:400px}.activity-topbar{gap:9px}.activity-brand{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}