@font-face{font-family:Fredoka;src:url('assets/fonts/Fredoka.ttf') format('truetype');font-weight:300 700;font-display:swap}
@font-face{font-family:Andika;src:url('assets/fonts/Andika.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--font:'Andika',sans-serif;--cream:#fff8e8;--gold:#ffcf58}
.brand,.hero h1,.story-panel h2,.paths-intro h1,.path-info h2,.rest h1,.dialog-heading h2{font-family:Fredoka,ui-rounded,sans-serif;font-weight:550;letter-spacing:-.025em}
.brand{font-size:30px;letter-spacing:-.035em}.hero h1{font-weight:600;line-height:1.04}.hero h1 em{font-style:normal;color:#ffce62}.hero-description{max-width:320px}.hero-small{font-size:12px}
.primary{border-radius:18px;background:linear-gradient(#ffda75,#f7be45);box-shadow:0 5px 0 #c48e2d,0 8px 15px #58361415;font-family:Fredoka,ui-rounded,sans-serif;font-weight:550;letter-spacing:.015em;font-size:20px}.primary:active:not(:disabled){box-shadow:0 2px 0 #c48e2d;transform:translateY(3px)}
.story-layout{border:3px solid #274e39;box-shadow:0 8px 0 #183c2c15,0 20px 45px #21462e10}.story-panel{background:#fffdf7;padding:28px}.story-panel h2{font-size:38px;line-height:1.1;font-weight:550;max-width:420px}.story-text{font-family:Andika,sans-serif;color:#3e5144;font-size:17px;line-height:1.55;letter-spacing:0}.story-panel.story-step-0 .story-text,.story-panel.story-step-3 .story-text,.story-panel.story-step-5 .story-text{font-size:19px;line-height:1.55}.prompt-note{background:none;border-left:3px solid #e6c06d;border-radius:0;padding:3px 0 3px 14px;margin-top:22px;font-size:12px;line-height:1.5}.prompt-note strong{display:block;margin-bottom:4px}.sound-pill{font-size:11px;text-transform:uppercase;letter-spacing:.08em}.sound-pill b{font-weight:400;font-size:24px;text-transform:none}.read-button{font-size:11px}.activity-title{font-weight:650;font-size:14px}.model{background:linear-gradient(150deg,#f6e8bc,#fff7db);border:2px solid #d5b76c;border-bottom:7px solid #bf9a52;box-shadow:inset 0 2px 0 #fff8e1;border-radius:24px}.model-letter{font-family:Andika,sans-serif;font-weight:400;font-size:110px;color:#244e39;line-height:1.25}.model p{margin-top:0}.model .word-button{background:#fffaf0;border-color:#d4b876}.letter-options{gap:14px}
.letter-tile{font-family:Andika,sans-serif;font-weight:400;background:linear-gradient(155deg,#ffefc8,#f6dfaa);border:2px solid #bda067;border-bottom:7px solid #a1814a;border-radius:20px;color:#1e4937;box-shadow:inset 0 2px 0 #fff9e7,0 4px 7px #6e542212;min-height:100px;font-size:54px;padding:6px 12px 12px;line-height:1.3;isolation:isolate}.letter-tile:before{content:'';position:absolute;inset:6px;border:1px solid #a8833925;border-radius:13px;pointer-events:none;z-index:-1}.letter-tile:hover:not(:disabled){background:linear-gradient(#fff6de,#f8e2aa);border-color:#ad8e49;transform:translateY(-3px)}.letter-tile:active:not(:disabled){transform:translateY(4px);border-bottom-width:3px}.letter-tile.found{background:linear-gradient(#e5f2bb,#c9e794);border-color:#749b51;border-bottom-color:#547837;box-shadow:inset 0 2px 0 #f5ffdc}.letter-tile.found:after{border-radius:50%;width:21px;height:21px;display:grid;place-items:center;background:#356a3e;color:white;top:5px;right:5px;font-size:13px}.letter-tile:disabled{opacity:.8}.letter-tile.found:disabled{opacity:1}.letter-tile.hint{outline:3px solid #f3c45e;outline-offset:3px}.hunt .letter-tile{font-size:43px;min-height:83px}.reference-letter{font-family:Andika,sans-serif;font-weight:400;border-bottom:3px solid #c2953c;height:40px;border-radius:10px}.feedback{font-size:12px;min-height:30px}.sound-medallion{transform:none;border-radius:30px;box-shadow:0 6px 0 #ad8033,0 12px 25px #17302a66}.sound-medallion b{font-family:Andika,sans-serif;font-weight:400;font-size:59px;line-height:1.1}.sound-medallion span{margin-top:4px}.success-banner{background:#eef4df;border:1px solid #d3dfb9;padding:14px}.path-card{border:2px solid #d2ddc7;box-shadow:0 5px 0 #d4ddc7}.path-info h2{font-weight:550;font-size:29px}.paths-intro h1{font-weight:550}.scene-dot.current{background:#e6ab37}.story-heading .eyebrow{font-family:Fredoka,sans-serif;letter-spacing:.08em;font-size:12px;font-weight:500}.page-foot{font-size:10px;color:#7f8d7c}
.living-arena{background-size:cover;background-position:center;isolation:isolate;min-height:610px}.living-arena canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .3s;z-index:0}.living-arena[data-ready=true] canvas{opacity:1}.living-arena:after{z-index:1;pointer-events:none;background:linear-gradient(transparent,#0b2a2580);inset:76% 0 0}.arena-nameplates{position:absolute;top:23px;left:24px;right:24px;display:flex;align-items:center;justify-content:space-between;gap:14px;z-index:3;pointer-events:none}.arena-nameplates span{color:#fff6dc;background:#163b2bd6;border:2px solid #f2c663;box-shadow:0 3px 0 #0c2b20a0;border-radius:15px;padding:8px 23px;font-family:Fredoka,sans-serif;font-size:24px;font-weight:550;min-width:100px;text-align:center;backdrop-filter:blur(8px)}.arena-nameplates b{font-family:Fredoka,sans-serif;font-size:33px;font-weight:650;color:#ffdd7e;text-shadow:0 3px 0 #55422b,2px 0 #55422b,-2px 0 #55422b;transform:rotate(-8deg)}.arena-tools{position:absolute;z-index:4;bottom:22px;right:20px;display:flex;gap:8px}.motion-toggle,.action-replay{background:#fff5d8ed;border:2px solid #fff6dd;color:#204534;box-shadow:0 3px 0 #163b2b70;min-height:44px;border-radius:13px;font:500 15px Fredoka,sans-serif;padding:9px 14px;backdrop-filter:blur(8px)}.motion-toggle{min-width:44px;padding:9px;font-family:system-ui;font-weight:700}.action-replay{max-width:180px}.arena-beat{position:absolute;left:15px;right:15px;top:110px;text-align:center;z-index:2;color:#ffefb0;font-family:Fredoka,sans-serif;font-weight:600;font-size:clamp(29px,3.6vw,48px);line-height:1.05;text-shadow:0 4px 0 #21412d,-2px 0 #21412d,2px 0 #21412d,0 -2px #21412d;pointer-events:none}.arena-caption{position:absolute;left:20px;right:20px;bottom:85px;text-align:center;color:#fff8df;font:400 12px Andika,sans-serif;text-shadow:0 1px 5px #102b20;z-index:3;pointer-events:none}.living-arena .art-tag{left:20px;bottom:24px;max-width:48%;font-size:10px;padding:8px 11px;line-height:1.4;z-index:3}.arena-tools button:hover{background:#ffe9a1}.living-arena .art-tag{pointer-events:none}
@media(min-width:1300px){.living-arena{min-height:640px}.story-panel{padding:34px}.story-panel h2{font-size:43px}}
@media(max-width:950px){.story-panel{padding:23px}.story-panel h2{font-size:32px}.arena-nameplates{left:15px;right:15px}.arena-nameplates span{font-size:20px;padding:7px 15px;min-width:75px}.living-arena .art-tag{display:none}.arena-beat{font-size:34px}.arena-tools{right:16px}.letter-tile{min-height:88px;font-size:48px}.hunt .letter-tile{min-height:75px;font-size:39px}}
@media(max-width:700px){.brand{font-size:27px}.story-layout{border-width:2px}.living-arena{height:clamp(305px,46vh,420px);min-height:0}.arena-nameplates{top:15px}.arena-nameplates span{font-size:18px;padding:6px 16px;min-width:80px}.arena-nameplates b{font-size:27px}.arena-beat{top:78px;font-size:29px}.arena-caption{bottom:70px;font-size:10px}.arena-tools{bottom:14px;right:14px}.motion-toggle,.action-replay{min-height:44px;font-size:13px}.story-panel{padding:22px;min-height:0}.story-panel h2{font-size:33px}.story-panel.story-step-0 h2,.story-panel.story-step-3 h2,.story-panel.story-step-5 h2{margin-top:22px}.story-panel.story-step-0 .story-text,.story-panel.story-step-3 .story-text,.story-panel.story-step-5 .story-text{font-size:18px}.model-letter{font-size:90px}.letter-tile{font-size:47px;min-height:87px}.hunt .letter-tile{font-size:39px;min-height:77px}.sound-medallion{border-radius:23px}.sound-medallion b{font-size:43px}.hero h1{font-size:49px}.hero .primary{font-size:18px}.hero-small{font-size:10px}.primary{font-size:19px}}