:root{color-scheme:light;font-family:"Trebuchet MS","Arial Rounded MT Bold",Arial,sans-serif;--ink:#304d49;--muted:#71817d;--paper:#fffdf8;--line:#ddd4b8;--green:#58a77a;--gold:#e2a54f;--coral:#e87866;--purple:#8875af;--shadow:0 19px 46px rgba(58,75,68,.14)}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:#f2f7ed}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;color:var(--ink);background:radial-gradient(circle at 8% 11%,rgba(226,165,79,.2) 0 145px,transparent 147px),radial-gradient(circle at 95% 30%,rgba(104,164,194,.13) 0 175px,transparent 177px),linear-gradient(145deg,#f1f7ec,#fff8ed 55%,#f2eef9)}body:before{position:fixed;inset:0;z-index:-1;opacity:.12;background-image:radial-gradient(#738e86 1.2px,transparent 1.2px);background-size:29px 29px;content:""}button{color:inherit;font:inherit}button:not(:disabled){cursor:pointer}button:focus-visible{outline:4px solid rgba(226,165,79,.72);outline-offset:4px}h1,h2,p{margin-top:0}.app{width:min(1120px,calc(100% - 32px));min-height:100vh;margin:0 auto;padding:20px 0 48px}.loading-card{display:grid;min-height:320px;place-items:center;align-content:center;gap:12px;margin-top:60px;background:var(--paper);border:3px solid var(--line);border-radius:42px;box-shadow:var(--shadow)}.loading-card span{font-size:64px}.loading-card p{color:var(--muted);font-weight:900}.topbar,.brand,.top-actions,.section-heading,.game-head,.choice-head,.feedback,.animal-note{display:flex;align-items:center}.topbar{min-height:68px;justify-content:space-between;gap:16px;margin-bottom:20px}.brand{gap:12px;padding:0;text-align:left;background:none;border:0}.brand-mark{display:grid;width:56px;height:56px;place-items:center;font-size:29px;background:#fff0c8;border:3px solid #dac790;border-radius:19px;box-shadow:0 7px 16px rgba(65,84,76,.12);transform:rotate(-4deg)}.brand strong,.brand small{display:block}.brand strong{font-size:24px;font-weight:900}.brand small{margin-top:3px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.top-actions{gap:10px}.top-notes{color:var(--coral);font-size:25px}.sound-button,.back-button{min-width:48px;min-height:48px;font-weight:900;background:rgba(255,253,248,.95);border:2px solid var(--line);border-radius:17px}.sound-button{display:flex;align-items:center;gap:8px;padding:0 16px;font-size:13px}.back-button{padding:0;font-size:22px}.eyebrow{margin:0 0 8px;color:#3d7e64;font-family:Georgia,serif;font-size:12px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.primary-button,.secondary-button,.hint-button{min-width:44px;min-height:52px;border-radius:17px;font-weight:900}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 22px;color:white;background:#409775;border:0;box-shadow:0 8px 0 #2e795e}.primary-button:active{transform:translateY(4px);box-shadow:0 4px 0 #2e795e}.primary-button.compact{min-height:46px;box-shadow:none}.secondary-button{padding:0 20px;background:white;border:2px solid var(--line)}.hint-button{padding:0 17px;background:#fff1c5;border:2px solid #dbc36e}
.hero{display:grid;min-height:520px;align-items:center;grid-template-columns:1.05fr .95fr;gap:45px;padding:clamp(40px,6vw,68px);overflow:hidden;background:rgba(255,253,248,.97);border:3px solid var(--line);border-radius:46px;box-shadow:var(--shadow)}.hero h1{max-width:610px;margin-bottom:19px;font-size:clamp(48px,5.7vw,68px);font-weight:900;letter-spacing:-.055em;line-height:.98}.hero-copy>p:not(.eyebrow){max-width:550px;margin-bottom:27px;color:var(--muted);font-size:18px;font-weight:800;line-height:1.52}.hero-facts{display:flex;flex-wrap:wrap;gap:18px;margin-top:29px}.hero-facts span{color:var(--muted);font-size:13px;font-weight:900}.hero-facts strong{margin-right:4px;color:var(--ink);font-size:24px}.hero-art{min-height:390px}.hero-stage{position:relative;height:380px;background:radial-gradient(circle at 52% 48%,#fff5c9 0 34%,#e8dcb6 35% 58%,#b9d8c1 59%);border:4px solid #53635e;border-radius:45% 45% 30px 30px;box-shadow:14px 15px 0 rgba(62,78,71,.13)}.hero-stage img{position:absolute;right:20px;bottom:22px;width:180px;height:180px;object-fit:contain}.rhyme-card{position:absolute;z-index:2;display:grid;width:130px;height:130px;place-items:center;align-content:center;background:white;border:4px solid #53635e;border-radius:25px;box-shadow:0 9px 0 rgba(83,99,94,.14)}.rhyme-card b{font-size:31px}.rhyme-card span{font-size:35px}.card-one{top:58px;left:28px;transform:rotate(-5deg)}.card-two{top:72px;left:183px;transform:rotate(4deg)}.rhyme-link{position:absolute;top:97px;left:155px;z-index:4;font-size:43px;font-weight:900}.sound-waves{position:absolute;right:34px;top:40px;color:#8a6ba6;font-size:28px;font-weight:900;transform:rotate(7deg)}
.how-section,.levels-section{margin-top:30px;padding:38px;background:rgba(255,253,248,.84);border:2px solid rgba(221,212,184,.86);border-radius:36px}.section-heading{justify-content:space-between;gap:30px;margin-bottom:24px}.section-heading h2{margin:0;font-size:31px}.section-heading>p{max-width:440px;margin:0;color:var(--muted);font-size:14px;font-weight:800;text-align:right}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.steps-grid article{display:flex;min-height:112px;align-items:center;gap:15px;padding:19px;background:white;border:2px solid var(--line);border-radius:24px}.steps-grid article>b{display:grid;flex:0 0 42px;height:42px;place-items:center;color:white;background:var(--green);border-radius:14px}.steps-grid strong,.steps-grid small{display:block}.steps-grid strong{margin-bottom:5px;font-size:17px}.steps-grid small{color:var(--muted);font-size:13px;font-weight:800;line-height:1.35}.levels-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.level-card{display:flex;min-height:385px;padding:19px;text-align:left;background:white;border:3px solid var(--line);border-radius:29px;box-shadow:0 10px 0 #ded6bc;flex-direction:column}.level-card.green{--card:var(--green)}.level-card.gold{--card:var(--gold)}.level-card.purple{--card:var(--purple)}.level-top{display:flex;align-items:center;justify-content:space-between}.level-top>b{display:grid;width:45px;height:45px;place-items:center;color:white;background:var(--card);border-radius:15px}.level-top small{color:var(--card);font-weight:900}.level-art{position:relative;display:grid;height:140px;place-items:center;margin:14px 0;background:color-mix(in srgb,var(--card) 16%,white);border-radius:22px}.level-art img{width:130px;height:130px;object-fit:contain}.level-art i{position:absolute;top:10px;right:10px;display:grid;min-width:46px;height:43px;place-items:center;padding:0 8px;color:white;font-size:22px;font-weight:900;background:var(--card);border-radius:14px;font-style:normal}.level-copy{flex:1}.level-copy small,.level-copy strong,.level-copy span{display:block}.level-copy small{color:var(--card);font-size:11px;font-weight:900;text-transform:uppercase}.level-copy strong{margin:7px 0;font-size:22px}.level-copy span{color:var(--muted);font-size:14px;font-weight:800;line-height:1.4}.level-go{display:flex;min-height:48px;align-items:center;justify-content:space-between;margin-top:14px;padding:0 15px;color:white;font-weight:900;background:var(--card);border-radius:15px}.animal-note{gap:22px;margin:28px auto 0;padding:17px 27px;background:#e9f2e6;border:2px solid #b9d1b7;border-radius:28px}.animal-note img{width:88px;height:88px;object-fit:contain}.animal-note strong,.animal-note span{display:block}.animal-note strong{margin-bottom:5px;font-size:18px}.animal-note span{color:var(--muted);font-size:14px;font-weight:800;line-height:1.4}
.game-shell{padding:clamp(22px,3.5vw,39px);background:var(--paper);border:3px solid var(--line);border-radius:40px;box-shadow:var(--shadow)}.game-head{justify-content:space-between;gap:24px}.game-head h1{margin-bottom:7px;font-size:clamp(37px,5vw,54px);letter-spacing:-.045em;line-height:1}.game-head>div:first-child>p:last-child{margin:0;color:var(--muted);font-weight:900}.round-badge{display:grid;flex:0 0 82px;height:82px;place-items:center;align-content:center;color:white;background:var(--accent);border:7px solid color-mix(in srgb,var(--accent) 24%,white);border-radius:50%}.round-badge strong{font-size:25px;line-height:1}.round-badge span{font-size:10px;font-weight:900}.progress-dots{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:25px 0 18px}.progress-dots span{height:8px;background:#e8e3d4;border-radius:8px}.progress-dots .done{background:var(--green)}.progress-dots .current{background:var(--accent)}.rhyme-workspace{display:grid;align-items:start;grid-template-columns:minmax(320px,.84fr) minmax(430px,1.16fr);gap:18px}.poem-card,.choice-panel{min-width:0;min-height:505px;padding:23px;border:3px solid var(--line);border-radius:28px}.poem-card{position:relative;background:#f4f1df;border-color:#d7cda8}.paper-clip{position:absolute;top:-5px;left:32px;width:26px;height:70px;border:6px solid #789087;border-bottom-color:transparent;border-radius:18px;transform:rotate(8deg)}.animal-scene{position:relative;display:grid;height:210px;place-items:center;margin-bottom:17px;overflow:hidden;background:radial-gradient(circle,#fff7ce 0 33%,#dbe9d7 34% 68%,#b5d4bf 69%);border-radius:28px}.animal-scene img{width:190px;height:190px;object-fit:contain}.animal-scene span{position:absolute;top:20px;right:24px;color:var(--purple);font-size:34px}.poem-label{margin-bottom:12px;color:#60776b;font-family:Georgia,serif;font-size:11px;font-weight:900;letter-spacing:.12em}.anchor-word{text-align:center}.anchor-word small,.anchor-word strong,.anchor-word span{display:block}.anchor-word small{color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.1em}.anchor-word strong{margin:6px 0;font-family:Georgia,serif;font-size:53px}.anchor-word span{color:var(--muted);font-weight:800}.poem-lines p{margin-bottom:8px;font-family:Georgia,serif;font-size:19px;font-weight:800;line-height:1.35}.poem-lines b{color:var(--accent)}.poem-lines .missing-line{color:#9c9278}.choice-panel{background:#fffaf0;border-color:#e3d6ad}.choice-head{justify-content:space-between;gap:15px;margin-bottom:15px}.choice-head h2{margin:0;font-size:27px}.answer-list{display:grid;gap:11px}.answer-list button{display:grid;min-height:74px;align-items:center;grid-template-columns:42px 1fr;gap:12px;padding:11px 15px;text-align:left;background:white;border:3px solid #ded7bf;border-radius:18px;box-shadow:0 5px 0 #ddd5bc}.answer-list button>span{display:grid;width:38px;height:38px;place-items:center;color:white;font-weight:900;background:#728b84;border-radius:12px}.answer-list strong{font-size:17px;line-height:1.35}.answer-list.lines strong{font-size:14px}.answer-list button.wrong{color:#92564d;background:#fff0ec;border-color:#df8b7f;box-shadow:none}.answer-list button.correct{background:#e8f4e9;border-color:var(--green);box-shadow:none}.answer-list button.hinted{border-color:var(--gold);box-shadow:0 0 0 5px rgba(226,165,79,.23)}.feedback{min-height:82px;gap:12px;margin-top:16px;padding:12px 14px;background:#eef4eb;border:2px solid #c7d7c2;border-radius:19px}.feedback>span{display:grid;flex:0 0 43px;height:43px;place-items:center;background:white;border-radius:13px}.feedback p{flex:1;margin:0}.feedback strong,.feedback small{display:block}.feedback small{margin-top:2px;color:var(--muted);font-weight:800;line-height:1.35}.feedback.retry{background:#fff0ec;border-color:#e2a299}.feedback.success{background:#e8f4e9;border-color:#9fc5a8}.feedback .primary-button{margin-left:auto}
.result-card{max-width:900px;margin:35px auto;padding:clamp(28px,4.5vw,50px);text-align:center;background:var(--paper);border:3px solid var(--line);border-radius:42px;box-shadow:var(--shadow)}.result-art{position:relative;width:155px;height:140px;margin:auto}.result-art img{width:150px;height:150px;object-fit:contain}.result-art span{position:absolute;top:0;right:-10px;display:grid;width:45px;height:45px;place-items:center;color:var(--purple);font-size:26px;background:#fff0c6;border-radius:50%}.result-card h1{margin-bottom:12px;font-size:clamp(39px,5vw,56px);letter-spacing:-.045em}.result-card>p:not(.eyebrow){color:var(--muted);font-weight:800}.result-stars{margin:16px 0;color:var(--gold);font-size:36px;letter-spacing:5px}.result-stars span{color:#ddd6c1}.poem-book{display:grid;gap:8px;text-align:left}.poem-book article{display:grid;align-items:center;grid-template-columns:38px 1fr;gap:12px;padding:11px 14px;background:#f4f2e7;border-radius:16px}.poem-book article>b{display:grid;width:36px;height:36px;place-items:center;color:white;background:var(--green);border-radius:11px}.poem-book p{margin:0}.poem-book p span{display:block;font-family:Georgia,serif;font-size:13px;font-weight:700;line-height:1.35}.result-stats,.result-actions{display:flex;justify-content:center;gap:13px}.result-stats{margin:22px 0}.result-stats>span{min-width:125px;padding:12px;background:#f0f4eb;border-radius:17px}.result-stats strong,.result-stats small{display:block}.result-stats strong{font-size:25px}.result-stats small{color:var(--muted);font-weight:800}
@media(max-width:900px){.hero{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-copy>p,.hero h1{margin-right:auto;margin-left:auto}.hero-facts{justify-content:center}.hero-art{width:min(100%,520px);margin:auto}.steps-grid,.levels-grid{grid-template-columns:1fr}.rhyme-workspace{grid-template-columns:1fr}.poem-card,.choice-panel{min-height:0}}
@media(max-width:700px){.app{width:min(100% - 20px,1120px);padding-top:10px}.topbar{min-height:58px;margin-bottom:10px}.brand-mark{width:48px;height:48px;font-size:24px;border-radius:16px}.brand strong{font-size:18px}.brand small,.sound-button span:last-child,.top-notes{display:none}.sound-button{width:48px;padding:0;justify-content:center}.hero{min-height:0;gap:24px;padding:34px 20px;border-radius:31px}.hero h1{font-size:clamp(40px,12vw,56px)}.hero-copy>p:not(.eyebrow){font-size:16px}.hero-facts{gap:8px}.hero-facts span{padding:8px 9px;background:#f5f3e9;border-radius:12px}.hero-art{min-height:325px}.hero-stage{height:320px}.hero-stage img{right:5px;width:140px;height:140px}.rhyme-card{width:105px;height:105px}.rhyme-card b{font-size:25px}.rhyme-card span{font-size:28px}.card-one{left:18px}.card-two{left:135px}.rhyme-link{left:112px}.how-section,.levels-section{margin-top:18px;padding:24px 15px;border-radius:28px}.section-heading{align-items:flex-start;flex-direction:column;gap:6px}.section-heading>p{text-align:left}.animal-note{align-items:flex-start;padding:15px}.animal-note img{width:70px;height:70px}.game-shell{padding:21px 12px;border-radius:29px}.game-head{align-items:flex-start}.game-head h1{font-size:34px}.round-badge{flex-basis:64px;height:64px;border-width:5px}.poem-card,.choice-panel{padding:16px;border-radius:23px}.animal-scene{height:185px}.animal-scene img{width:165px;height:165px}.poem-lines p{font-size:17px}.choice-head{align-items:flex-start;flex-direction:column}.hint-button{width:100%}.feedback{align-items:flex-start;flex-wrap:wrap}.feedback .primary-button{width:100%;margin-left:0}.result-card{margin:22px auto;padding:28px 14px;border-radius:29px}.result-stats{flex-wrap:wrap}.result-stats>span{min-width:95px;flex:1}.result-actions{flex-direction:column-reverse}}
@media(max-width:420px){.brand{gap:8px}.brand strong{font-size:17px}.sound-waves{right:12px}.answer-list button{grid-template-columns:36px 1fr;padding:9px}.answer-list button>span{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}