
#wge{--ink:light-dark(#233e37,#e5ede7);--muted:light-dark(#5c746c,#b0c1b8);--paper:light-dark(#fffdf6,#24362f);--bg:light-dark(#edf1e7,#182920);--line:light-dark(#dce4d7,#45594b);--accent:#356b55;--soft:light-dark(#e6eee2,#34473a);--gold:light-dark(#f5e4c6,#574932);font-family:"Avenir Next",ui-rounded,system-ui,sans-serif;color:var(--ink);color-scheme:light dark}
#wge *{box-sizing:border-box}#wge [hidden]{display:none!important}#wge p{margin:0}#wge button,#wge input,#wge select,#wge textarea{font:inherit}#wge button{cursor:pointer;touch-action:manipulation;color:inherit}#wge i{width:17px;height:17px;display:inline-flex;flex-shrink:0}#wge button:focus-visible,#wge input:focus-visible,#wge select:focus-visible,#wge textarea:focus-visible{outline:3px solid #c28831;outline-offset:3px}
#wge .app{background:var(--bg);border:1px solid var(--line);border-radius:26px;overflow:hidden}#wge .header{padding:18px 24px 14px;padding-right:92px;display:flex;align-items:center;justify-content:space-between;gap:15px}#wge .brand{display:flex;align-items:center;gap:9px;font-size:19px;font-weight:700;letter-spacing:-.5px}#wge .mark{width:31px;height:31px;border-radius:10px;background:var(--accent);color:#fff;display:grid;place-items:center}#wge .year-label{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}#wge select{min-height:44px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:12px;padding:8px 10px;font-size:13px;font-weight:600;max-width:100%}
#wge .topics{display:flex;flex-wrap:wrap;gap:6px;padding:0 24px 16px}#wge .topic{display:flex;gap:6px;align-items:center;justify-content:center;background:transparent;border:0;border-radius:10px;padding:10px 12px;min-height:44px;font-size:13px;font-weight:600}#wge .topic[aria-pressed="true"]{background:var(--paper);box-shadow:0 2px 8px #243c2b0a;color:var(--accent)}
#wge .title-row{padding:0 24px 13px;display:flex;justify-content:space-between;align-items:center;gap:15px}#wge h2{margin:0 0 5px;font-size:27px;line-height:1.15;letter-spacing:-.7px;font-weight:700}#wge .sub{font-size:12px;color:var(--muted)}#wge .progress-label{font-size:12px;color:var(--muted);white-space:nowrap}#wge .progress-dots{display:flex;gap:5px;justify-content:flex-end;margin-top:7px}#wge .dot{height:7px;width:7px;border-radius:50%;background:var(--line)}#wge .dot.done{background:var(--accent)}
#wge .stage{height:270px;position:relative;background:#deeadc;margin:0 14px;border-radius:20px;overflow:hidden;color:#314e3a}#wge .stage canvas{display:block;width:100%;height:100%;touch-action:pan-y}#wge .scene-label{position:absolute;left:15px;top:13px;font-size:10px;letter-spacing:1.1px;font-weight:600;z-index:1;pointer-events:none}#wge .scene-help{position:absolute;bottom:10px;left:10px;right:10px;text-align:center;font-size:11px;pointer-events:none;color:#44644b}#wge .loading{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;font-size:13px}
#wge .objects{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;padding:11px 14px 13px}#wge .object{border:1px solid var(--line);border-radius:12px;background:var(--paper);min-height:44px;padding:9px 16px;font-size:13px}#wge .object[aria-pressed="true"]{background:var(--accent);color:#fff;border-color:var(--accent)}
#wge .activity-nav{display:flex;gap:4px;flex-wrap:wrap;padding:0 18px 10px}#wge .activity{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;border:0;background:transparent;border-radius:11px;font-size:13px;padding:9px 6px;font-weight:600;white-space:nowrap}#wge .activity[aria-selected="true"]{background:var(--paper)}
#wge .panel{background:var(--paper);border-radius:20px;margin:0 14px 14px;padding:20px;min-height:190px}#wge .eyebrow{font-size:11px;letter-spacing:.65px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}#wge .word{font-size:33px;font-weight:700;letter-spacing:-.9px;line-height:1.15;margin-bottom:7px}#wge .definition{font-size:15px;line-height:1.5}#wge .example{padding:11px 0 2px;font-size:16px;line-height:1.5}#wge .word-note{color:var(--muted);font-size:12px;line-height:1.5;margin-top:7px}#wge .actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px}#wge .button{display:inline-flex;justify-content:center;align-items:center;gap:6px;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--soft);font-size:13px;font-weight:600;padding:10px 13px}#wge .button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}#wge .button:disabled{opacity:.5;cursor:default}#wge .button:hover,#wge .object:hover{filter:brightness(.97)}#wge .small{font-size:12px;color:var(--muted);line-height:1.5}#wge .heading{font-size:20px;font-weight:700;line-height:1.35;letter-spacing:-.3px;margin-bottom:8px}
#wge .spell-form{display:flex;gap:8px;align-items:center;margin-top:13px;flex-wrap:wrap}#wge input,#wge textarea{border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--ink);padding:11px 13px;font-size:16px;min-width:0;max-width:100%}#wge input{flex:1;min-height:46px;min-width:130px}#wge textarea{display:block;width:100%;min-height:80px;resize:vertical;line-height:1.5}#wge .pattern{font-size:23px;font-weight:600;letter-spacing:3px;margin:12px 0 0;overflow-wrap:anywhere}#wge .feedback{font-size:13px;line-height:1.5;margin-top:11px;min-height:20px}#wge .family{margin-top:18px;padding-top:15px;border-top:1px solid var(--line)}#wge .family-chain{font-size:17px;font-weight:600;margin:7px 0;line-height:1.5}#wge .choices{display:grid;grid-template-columns:1fr;gap:7px;margin-top:12px}#wge .choice{text-align:left;justify-content:flex-start;background:var(--bg)}#wge .choice.correct{background:var(--soft);border-color:var(--accent)}
#wge .sentence-area{min-height:116px;padding:11px 13px;background:var(--bg);border-radius:13px;display:flex;flex-wrap:wrap;gap:6px;align-content:center;align-items:center;margin-top:13px}#wge .placeholder{color:var(--muted);font-size:14px}#wge .word-bank{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}#wge .tile{min-height:44px;padding:9px 12px;border-radius:10px;background:var(--gold);border:1px solid transparent;font-size:15px}#wge .tile.used{visibility:hidden;pointer-events:none}#wge .sentence-area .tile{background:var(--paper);border-color:var(--line)}#wge .draft{margin-top:17px;padding-top:14px;border-top:1px solid var(--line)}#wge .draft label{display:block;font-size:13px;margin-bottom:8px}#wge .paragraph{font-size:16px;line-height:1.75;max-width:64ch;margin:7px 0 13px}#wge .question{font-size:17px;font-weight:600;line-height:1.4;margin-top:13px}#wge .rhyme-lines{font-size:18px;line-height:1.7;margin:8px 0}#wge .rhyme-line.active{color:var(--accent);font-weight:700}#wge .status{font-size:12px;color:var(--muted);padding:0 24px 12px}#wge .status:empty{display:none}#wge .teacher{font-size:12px;line-height:1.6;padding:0 24px 17px;color:var(--muted)}#wge .teacher summary{cursor:pointer;min-height:32px;list-style:revert}#wge .teacher p{padding-top:7px}#wge .teacher ul{padding-left:20px;margin:7px 0}#wge .end{font-size:11px;color:var(--muted);padding:0 24px 15px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
@media(max-width:540px){#wge .header{padding:16px 17px 12px;padding-right:84px;align-items:flex-start;flex-direction:column;gap:10px}#wge .brand{font-size:18px}#wge .year-label{gap:10px}#wge .topics{padding:0 12px 12px;gap:3px}#wge .topic{padding:9px 10px;font-size:12px}#wge .topic i{display:none}#wge .title-row{padding:0 18px 13px}#wge h2{font-size:24px}#wge .stage{margin:0 9px;height:248px}#wge .objects{gap:5px;padding:10px}#wge .object{padding:9px 10px;font-size:12px}#wge .activity-nav{padding:0 9px 9px;gap:3px}#wge .activity{flex:1 1 27%;padding:8px;font-size:12px}#wge .panel{margin:0 9px 12px;padding:17px}#wge .word{font-size:29px}#wge .paragraph{font-size:15px}#wge .teacher,#wge .end{padding-left:17px;padding-right:17px}#wge .spell-form .button{flex:0 0 auto}}
@media(prefers-reduced-motion:reduce){#wge *{transition:none!important}}
@media(max-width:540px){#wge .sentence-area{min-height:232px}}
#wge #wge-read .actions{min-height:58px}#wge #wge-read-feedback,#wge #wge-family-feedback{min-height:40px}
#wge .topic[aria-pressed="true"]{color:light-dark(#356b55,#dcebe0)}
#wge .button:disabled{opacity:.65}#wge .recordings-label{display:block;margin:12px 0 6px}#wge input[type="file"]{display:block;width:100%;font-size:13px;padding:9px;min-height:44px}#wge .recording-status{overflow-wrap:anywhere}
