:root{--ink:#15251f;--muted:#65716c;--cream:#f7f3e9;--paper:#fffdf8;--green:#126c4f;--orange:#ff6b4a}*{box-sizing:border-box}body{background:var(--cream);color:var(--ink);margin:0;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button{cursor:pointer}.topbar{z-index:10;background:#fffdf9;border-bottom:1px solid #ded9cc;justify-content:space-between;align-items:center;height:76px;padding:0 max(24px,50vw - 610px);display:flex;position:sticky;top:0}.brand{color:var(--ink);background:0 0;border:0;align-items:center;gap:10px;font-size:20px;font-weight:900;display:flex}.brand em{text-transform:uppercase;letter-spacing:.12em;color:var(--green);background:#dff1e8;border-radius:20px;padding:5px 8px;font-size:10px;font-style:normal}.logo{background:var(--green);color:#fff;border-radius:12px 12px 12px 4px;place-items:center;width:38px;height:38px;font-family:Georgia,serif;font-size:23px;display:grid}.save-state{color:var(--muted);align-items:center;gap:8px;font-size:13px;display:flex}.save-state span{width:24px;height:24px;color:var(--green);background:#dff1e8;border-radius:50%;place-items:center;display:grid}.hero{justify-content:space-between;align-items:center;gap:60px;max-width:1220px;margin:auto;padding:70px 24px 56px;display:flex}.pill{color:#a4442f;text-transform:uppercase;letter-spacing:.08em;background:#ffe5db;border-radius:30px;padding:8px 13px;font-size:12px;font-weight:800}.hero h1{letter-spacing:-.045em;margin:24px 0 22px;font-family:Georgia,serif;font-size:clamp(48px,6vw,82px);line-height:.94}.hero h1 i{color:var(--orange);font-weight:400}.hero p{max-width:600px;color:var(--muted);font-size:18px;line-height:1.6}.formula{background:var(--ink);color:#fff;border-radius:30px 30px 30px 8px;justify-content:space-between;align-items:center;min-width:370px;padding:34px;display:flex;transform:rotate(1.5deg);box-shadow:14px 14px #d9cbb5}.formula div{flex-direction:column;align-items:center;display:flex}.formula b{color:#ffb19d;font-family:Georgia,serif;font-size:52px}.formula span{text-transform:uppercase;letter-spacing:.12em;font-size:12px}.formula strong{color:#75857e;font-size:28px}.formula .fun b{color:#f6cf5e}.workspace{grid-template-columns:1.35fr .75fr;align-items:start;gap:26px;max-width:1220px;margin:0 auto 70px;padding:0 24px;display:grid}.editor-panel,.mode-panel{background:var(--paper);border:1px solid #ded9cc;border-radius:24px;padding:30px;box-shadow:0 8px 30px #493c2920}.mode-panel{position:sticky;top:98px}.section-heading,.section-heading>div{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-heading h2{margin:0;font-family:Georgia,serif;font-size:27px}.step{background:var(--ink);color:#fff;border-radius:10px;place-items:center;width:34px;height:34px;font-weight:900;display:grid}.count{color:var(--green);background:#e5f3ec;border-radius:20px;padding:7px 10px;font-size:12px;font-weight:800}.hint{color:var(--muted);margin:8px 0 25px;font-size:14px}.question-list{flex-direction:column;gap:9px;display:flex}.question-row{grid-template-columns:38px 1.5fr 1fr;align-items:center;gap:10px;display:grid}.number{color:#9c988d;font-family:Georgia,serif;font-size:13px}.question-row label{background:#fff;border:1px solid #ded9cc;border-radius:11px;padding:7px 11px}.question-row label:focus-within{border-color:var(--green);box-shadow:0 0 0 3px #126c4f18}.question-row small{letter-spacing:.12em;color:#99958c;font-size:8px;font-weight:900;display:block}.question-row input{width:100%;color:var(--ink);background:0 0;border:0;outline:0;padding:3px 0 1px;font-size:13px}.reset{color:var(--muted);background:0 0;border:0;margin:18px 0 0 45px;font-size:12px;text-decoration:underline}.mode-list{flex-direction:column;gap:12px;display:flex}.mode-list button{--mode:#444;text-align:left;background:#fff;border:1px solid #ded9cc;border-radius:15px;grid-template-columns:50px 1fr auto;align-items:center;gap:14px;padding:15px;transition:all .2s;display:grid}.mode-list button:hover{border-color:var(--mode);transform:translate(5px);box-shadow:0 6px 18px #30291d17}.mode-icon{background:color-mix(in srgb,var(--mode) 16%,white);width:46px;height:46px;color:var(--mode);border-radius:13px;place-items:center;font-size:24px;display:grid}.mode-list b{display:block}.mode-list small{color:var(--muted);margin-top:4px;display:block}.mode-list i{color:var(--mode);font-size:12px;font-style:normal;font-weight:900}.privacy{background:#e9f3ee;border-radius:14px;gap:14px;margin-top:24px;padding:18px;display:flex}.privacy>span{color:var(--green);font-size:25px}.privacy b{font-size:13px}.privacy p{color:var(--muted);margin:4px 0 0;font-size:11px;line-height:1.5}footer{max-width:1172px;color:var(--muted);border-top:1px solid #d7d0c1;gap:25px;margin:0 auto;padding:25px 0 45px;font-size:12px;display:flex}footer b{color:var(--ink);margin-right:auto}.game-shell{background:#f7f3e9;min-height:100vh}.play-title{color:var(--accent);font-family:Georgia,serif;font-size:21px;font-weight:800}.ghost{color:var(--muted);background:#fff;border:1px solid #d8d1c4;border-radius:10px;padding:10px 14px;font-size:12px}.play-area{max-width:1100px;margin:auto;padding:30px 24px 70px}.scoreline{color:var(--muted);justify-content:space-between;margin-bottom:24px;font-size:13px;display:flex}.scoreline strong{color:var(--accent);font-size:16px}.wheel-layout{grid-template-columns:420px 1fr;align-items:center;gap:60px;min-height:560px;display:grid}.wheel{background:conic-gradient(#ff6b4a 0 45deg,#f6cf5e 45deg 90deg,#126c4f 90deg 135deg,#6c5ce7 135deg 180deg,#f19cb3 180deg 225deg,#37a8a1 225deg 270deg,#ff9f43 270deg 315deg,#375a7f 315deg);border:14px solid #fff;border-radius:50%;place-items:center;width:390px;height:390px;display:grid;position:relative;box-shadow:0 15px 40px #1f2b2529}.wheel:after{content:"▼";color:var(--ink);font-size:35px;position:absolute;right:-35px;transform:rotate(90deg)}.wheel-center{background:var(--ink);color:#fff;border:8px solid #fff;border-radius:50%;place-items:center;width:95px;height:95px;font-family:Georgia,serif;font-size:40px;display:grid}.spinning{animation:.9s cubic-bezier(.2,.8,.2,1) spin}@keyframes spin{to{transform:rotate(1080deg)}}.question-card,.quiz-stage{background:#fff;border:1px solid #ded9cc;border-radius:28px;padding:45px;box-shadow:10px 10px #dfd5c4}.eyebrow,.question-number{letter-spacing:.14em;color:var(--accent);font-size:11px;font-weight:900}.question-card h1,.quiz-stage h1,.memory-stage h1{margin:20px 0 30px;font-family:Georgia,serif;font-size:clamp(29px,4vw,47px);line-height:1.15}.answer-reveal{color:var(--green);background:#e2f3eb;border-radius:12px;margin-bottom:20px;padding:18px;font-weight:900}.actions{gap:10px;display:flex}.primary,.secondary{border:0;border-radius:12px;padding:14px 20px;font-weight:900}.primary{background:var(--accent);color:#fff}.secondary{color:var(--ink);background:#eee9df}.quiz-stage{text-align:center;max-width:820px;margin:45px auto}.choices{grid-template-columns:1fr 1fr;gap:13px;display:grid}.choices button{text-align:left;color:var(--ink);background:#faf8f2;border:1px solid #d8d1c4;border-radius:13px;padding:17px}.choices b{background:var(--ink);color:#fff;border-radius:8px;place-items:center;width:29px;height:29px;margin-right:12px;display:inline-grid}.choices .correct{background:#dff3e8;border-color:#28a66f}.choices .wrong{background:#ffe2df;border-color:#e85c51}.next{margin-top:25px}.memory-stage{text-align:center}.memory-grid{grid-template-columns:repeat(4,1fr);gap:13px;display:grid}.memory-grid button{background:var(--accent);color:#fff;min-height:140px;box-shadow:0 7px 0 color-mix(in srgb,var(--accent) 70%,black);border:0;border-radius:16px;font-family:Georgia,serif;font-size:32px}.memory-grid .open{color:var(--ink);background:#fff;padding:14px;font-family:Arial,sans-serif;font-size:14px;transform:translateY(5px);box-shadow:0 2px #d9d1c4}.memory-grid .done{color:var(--green);opacity:.65;background:#dff3e8}@media (width<=850px){.hero{flex-direction:column;align-items:flex-start}.formula{width:100%;min-width:0}.workspace{grid-template-columns:1fr}.mode-panel{position:static}.wheel-layout{grid-template-columns:1fr}.wheel{width:min(78vw,390px);height:min(78vw,390px);margin:auto}.memory-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=560px){.hero{padding-top:42px}.hero h1{font-size:47px}.formula{padding:22px}.formula b{font-size:38px}.workspace{padding:0 12px}.editor-panel,.mode-panel{padding:20px}.question-row{grid-template-columns:28px 1fr}.question-row label:last-child{grid-column:2}.choices{grid-template-columns:1fr}.memory-grid{grid-template-columns:repeat(2,1fr)}footer{flex-direction:column;gap:8px;padding:25px 18px}.play-title{display:none}.wheel-layout{gap:30px}}.play-title{text-align:center}.play-controls{justify-content:center;align-items:center;max-width:1100px;margin:auto;padding:24px;display:flex;position:relative}.play-controls .ghost{position:absolute;right:24px}.play-title small{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:3px;font:700 9px Arial,sans-serif;display:block}.lesson-title{background:#f1ede3;border:1px solid #d8d1c4;border-radius:13px;margin:-8px 0 18px;padding:10px 13px;display:block}.library-picker{background:#15251f;border-radius:15px;grid-template-columns:110px 1fr 1.35fr auto;gap:10px;margin:-8px 0 18px;padding:16px;display:grid}.library-picker label{background:#fff;border-radius:10px;padding:8px 10px}.library-picker small{letter-spacing:.12em;color:#65716c;font-size:8px;font-weight:900;display:block}.library-picker select{color:#15251f;background:#fff;border:0;outline:0;width:100%;padding-top:4px;font-weight:800}.library-picker button{color:#fff;background:#ff6b4a;border:0;border-radius:10px;padding:0 17px;font-weight:900}.lesson-title small{letter-spacing:.12em;color:var(--muted);font-size:8px;font-weight:900;display:block}.lesson-title input{width:100%;color:var(--ink);background:0 0;border:0;outline:0;padding-top:5px;font-family:Georgia,serif;font-size:18px;font-weight:700}.data-tools{flex-wrap:wrap;gap:8px;margin:20px 0 0 45px;display:flex}.data-tools button,.data-tools label{color:var(--muted);cursor:pointer;background:#fff;border:1px solid #d8d1c4;border-radius:9px;padding:9px 11px;font-size:11px;font-weight:800}.data-tools input{display:none}.word-stage{text-align:center;background:#fff;border:1px solid #ded9cc;border-radius:28px;max-width:820px;margin:45px auto;padding:45px;box-shadow:10px 10px #dfd5c4}.word-stage h1{margin:20px 0 26px;font-family:Georgia,serif;font-size:clamp(29px,4vw,47px)}.word-answer{color:#9a9488;letter-spacing:.05em;border:2px dashed #c9c1b2;border-radius:14px;place-items:center;min-height:70px;padding:15px;font-family:Georgia,serif;font-size:27px;display:grid}.word-answer.right{color:#14744d;background:#e5f5ed;border-style:solid;border-color:#2ba66e}.word-answer.wrong{color:#b74039;background:#fff0ee;border-color:#e85c51}.letter-bank{flex-wrap:wrap;justify-content:center;gap:8px;margin:28px 0;display:flex}.letter-bank button{color:#fff;background:#3574b8;border:0;border-radius:10px;width:46px;height:52px;font-family:Georgia,serif;font-size:22px;font-weight:800;box-shadow:0 5px #214e7e}.word-stage .actions{justify-content:center}.word-feedback{color:#b74039;font-size:13px;font-weight:700}@media (width<=900px){.library-picker{grid-template-columns:1fr 1fr}.library-picker button{grid-column:1/-1;padding:13px}}@media (width<=700px){.play-controls{justify-content:flex-start}.play-controls .play-title{text-align:left}.play-controls .ghost{right:12px}.data-tools{margin-left:28px}.word-stage{padding:24px}.letter-bank button{width:40px;height:46px}}