:root{--bg: #f4efe6;--bg-2: #efe6d6;--ink: #2b241b;--ink-soft: #5c5348;--card: #fffdf8;--line: #e4d8c4;--teal: #0f766e;--teal-deep: #115e59;--coral: #d85a3a;--gold: #d7a11b;--purple: #5b4b8a;--green: #2f7d4a;--shadow: 0 10px 28px rgba(43, 36, 27, .08);--radius: 22px;--tap: 52px;--font: "Nunito", "Segoe UI", sans-serif;--max: 880px}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font);color:var(--ink);background:radial-gradient(circle at top left,#f8e7c8 0,transparent 42%),radial-gradient(circle at top right,#cfe8e2 0,transparent 38%),var(--bg)}button,input,a{font:inherit}button{min-height:var(--tap);border:0;border-radius:16px;padding:0 18px;cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--teal);outline-offset:2px}.btn-primary{background:var(--teal);color:#fff;font-weight:800}.btn-primary:disabled{opacity:.55;cursor:not-allowed}.btn-ghost{background:transparent;color:var(--teal-deep);font-weight:700}.btn-gold{background:var(--gold);color:#2b241b;font-weight:800}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}.shell{width:min(var(--max),calc(100% - 28px));margin:0 auto;padding:20px 0 48px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.brand{font-weight:800;font-size:1.2rem;color:var(--teal-deep);text-decoration:none}.stats{display:flex;gap:8px;flex-wrap:wrap}.pill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-weight:800;font-size:.92rem}h1,h2,h3{margin:0 0 10px;line-height:1.2}p{color:var(--ink-soft);line-height:1.5}.stack{display:grid;gap:16px}.grid-2{display:grid;gap:14px}@media(min-width:720px){.grid-2{grid-template-columns:1fr 1fr}}label{display:grid;gap:6px;font-weight:700}input,select{min-height:var(--tap);border:1px solid var(--line);border-radius:14px;padding:0 14px;background:#fff}.muted{color:var(--ink-soft);font-size:.95rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.hero-title{font-size:clamp(1.8rem,4vw,2.5rem)}.choice-list,.tf-row{display:grid;gap:10px}.choice,.tf{text-align:left;background:#fff;border:2px solid var(--line);font-weight:800;color:var(--ink)}.choice[data-selected=true],.tf[data-selected=true]{border-color:var(--teal);background:#e7f4f2}.feedback{border-radius:18px;padding:16px 18px}.feedback.ok{background:#e6f6ea;color:var(--green)}.feedback.try{background:#fff4e5;color:#8a4b12}.blocks{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin:12px 0}.block{width:18px;height:18px;border-radius:5px}.block.hundred{width:28px;height:28px;background:#5b8def}.block.ten{background:#3cb371}.block.unit{background:#f0c14b}.skill-card[data-state=locked]{opacity:.55}.state{font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.state.locked{color:#8a7d6c}.state.available{color:var(--teal)}.state.current{color:var(--coral)}.state.mastered{color:var(--green)}.prompt{white-space:pre-wrap;font-size:1.15rem;color:var(--ink);font-weight:700}.boss-banner{background:#5b4b8a;color:#fff;border-radius:16px;padding:10px 14px;font-weight:800;display:inline-block}.error{color:var(--coral);font-weight:700}.order-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.order-row,.match-row{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 12px}.match-row select{flex:1;min-width:140px}.order-label{font-weight:800}.order-actions{display:flex;gap:6px}.fill-line,.sequence-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:1.2rem;font-weight:800}.blank-input{width:96px;text-align:center;font-weight:800}.sequence-item{min-width:48px;text-align:center}.chip-row{display:flex;flex-wrap:wrap;gap:8px}.chip,.drop-slot{background:#fff;border:2px solid var(--line);font-weight:800;color:var(--ink)}.chip[data-selected=true]{border-color:var(--teal);background:#e7f4f2}.drop-slot{display:grid;gap:4px;text-align:left;width:100%}.slot-list{display:grid;gap:10px}.play-nav{display:flex;gap:8px;margin:-8px 0 20px;flex-wrap:wrap}.play-nav a{text-decoration:none;font-weight:800;color:var(--teal-deep);padding:8px 12px;border-radius:999px}.play-nav a.active{background:#fff;border:1px solid var(--line)}.hero-row{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.hero-avatar{position:relative;width:88px;height:110px}.hero-avatar.lg{width:108px;height:132px}.hero-avatar .head{width:42px;height:42px;border-radius:50%;background:#f3d2b3;margin:18px auto 0}.hero-avatar .cape{width:56px;height:48px;margin:-6px auto 0;border-radius:0 0 22px 22px}.hero-avatar .hat.explorer{position:absolute;left:50%;top:4px;width:48px;height:16px;margin-left:-24px;background:#8b5a2b;border-radius:8px 8px 0 0}.hero-avatar .hat.crown{position:absolute;left:50%;top:0;width:0;height:0;margin-left:-14px;border-left:14px solid transparent;border-right:14px solid transparent;border-bottom:20px solid var(--gold)}.hero-avatar .pet{position:absolute;right:0;bottom:8px;width:22px;height:22px;border-radius:50%}.hero-avatar .pet.owl{background:#c4a574}.hero-avatar .pet.dragon{background:#2f7d4a}.mission-bar{height:12px;background:#efe6d6;border-radius:999px;overflow:hidden}.mission-bar span{display:block;height:100%;background:var(--teal)}.trail{list-style:none;margin:0;padding:0;display:grid;gap:0}.trail li{position:relative;padding-bottom:18px}.trail li:not(:last-child):before{content:"";position:absolute;left:29px;top:64px;bottom:0;width:3px;background:var(--line)}.trail-index{width:32px;height:32px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:8px}.skill-card[data-state=current]{border-color:var(--coral)}.skill-card[data-state=mastered]{border-color:var(--green)}.shop-grid{display:grid;gap:12px}@media(min-width:720px){.shop-grid{grid-template-columns:1fr 1fr}}.coin-pill{background:#fff6d6}.feedback.pop,.reward-pop{animation:pop .35s ease-out}@keyframes pop{0%{transform:scale(.96);opacity:.4}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){.feedback.pop,.reward-pop{animation:none}}
