:root{--bg:#0d0f13;--panel:#171a21;--panel2:#11141a;--text:#f4f5f7;--muted:#7d8592;--border:#2a3038;--accent:#f2b84b;--accent-soft:rgba(242,184,75,.12);--good:#63d69a;--good-soft:rgba(99,214,154,.12);--bad:#ff6e6e;--bad-soft:rgba(255,110,110,.13);--ghost:#4c5360;--blue:#70a5ff}*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(circle at 50% -10%,rgba(242,184,75,.1),transparent 32%),linear-gradient(180deg,#101218,#0b0d11 70%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.app{width:min(1000px,calc(100% - 28px));margin:0 auto;padding:28px 0 46px}.brand{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:28px}.brand h1{margin:0;font-size:clamp(26px,4vw,40px);font-weight:900;letter-spacing:-1.5px}.brand h1 span{color:var(--accent)}.tag{margin-top:5px;color:var(--muted);font-size:14px}.version{border:1px solid var(--border);border-radius:999px;padding:8px 11px;color:var(--muted);font-size:12px;white-space:nowrap}.panel{background:#171a21e6;border:1px solid var(--border);border-radius:18px;padding:22px}h2{margin:0 0 8px;font-size:21px;letter-spacing:-.4px}h3{margin:0}p{line-height:1.55}.muted{color:var(--muted)}label{display:block;margin-bottom:8px;font-size:13px;font-weight:750;color:#d2d6dc}textarea,input,select{width:100%;border:1px solid var(--border);background:#101319;color:var(--text);border-radius:12px;outline:none;transition:.15s ease}textarea{min-height:230px;padding:14px;resize:vertical;line-height:1.5}input,select{min-height:46px;padding:10px 12px}textarea:focus,input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.controls{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:12px;align-items:end;margin-top:18px}.check{min-height:46px;display:flex;align-items:center;gap:8px;padding:0 13px;border:1px solid var(--border);border-radius:12px;background:#101319;font-size:14px;font-weight:650}.check input{width:auto;min-height:auto}.btn{min-height:46px;border:1px solid var(--border);border-radius:12px;padding:0 16px;background:#161a20;color:var(--text);font-weight:800;transition:.15s}.btn:hover{transform:translateY(-1px);border-color:#3c4552}.btn.primary{background:var(--accent);border-color:var(--accent);color:#15120c;box-shadow:0 8px 24px #f2b84b21}.btn.good{background:var(--good);border-color:var(--good);color:#08150f}.meta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.pill{border:1px solid var(--border);border-radius:999px;padding:7px 10px;font-size:12px;color:var(--muted);background:#101319}.stage-top{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.stats{display:flex;gap:22px;flex-wrap:wrap}.stat{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.75px}.stat strong{display:block;color:var(--text);font-size:18px;margin-top:2px;letter-spacing:0;text-transform:none}.progress{height:4px;background:#191d23;border:1px solid #20252d;border-radius:999px;overflow:hidden;margin-bottom:24px}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--accent),#ffd977);transition:width .18s ease}.round-label{text-align:center;color:var(--accent);font-size:12px;text-transform:uppercase;letter-spacing:1.5px;font-weight:900;margin-bottom:14px}.dojo{min-height:390px;display:flex;flex-direction:column;justify-content:center;text-align:center;padding:24px 8px}.prompt-main{font-size:clamp(31px,6vw,62px);line-height:1.2;font-weight:820;letter-spacing:-1.5px;word-break:break-word}.prompt-sub{margin-top:12px;color:var(--muted);font-size:clamp(16px,2.2vw,21px);min-height:28px}.target{margin-top:30px;font-size:clamp(25px,4.8vw,48px);line-height:1.25;font-weight:740;letter-spacing:-.9px;word-break:break-word;min-height:63px}.char{color:var(--ghost);position:relative;border-radius:4px}.char.done{color:#f6f7f9}.char.error{color:var(--bad);background:var(--bad-soft)}.char.current:before{content:"";position:absolute;left:-2px;top:7%;width:2px;height:86%;background:var(--accent);border-radius:2px;animation:blink 1s step-end infinite}@keyframes blink{50%{opacity:0}}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.025)}to{transform:scale(1)}}.flash-good .char{color:var(--good)!important;background:transparent!important}.pop{animation:pop .18s ease-out}.input-wrap{max-width:620px;margin:18px auto 0;position:relative}.capture{position:absolute;width:1px;height:1px;opacity:0;border:0;padding:0;margin:0;pointer-events:none}.capture::selection{background:transparent}.hint{margin-top:2px;color:#616977;font-size:12px;text-align:center}.feedback{min-height:24px;margin-top:10px;text-align:center;color:var(--muted);font-size:13px}.phase-card{max-width:680px;margin:0 auto;text-align:center;padding:30px 20px}.phase-card .emoji{font-size:40px}.phase-card h2{font-size:30px;margin-top:12px}.phase-card p{color:var(--muted)}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.card{background:#101319;border:1px solid var(--border);border-radius:14px;padding:16px}.card .lab{font-size:11px;text-transform:uppercase;color:var(--muted);letter-spacing:.7px}.card .val{margin-top:5px;font-size:31px;font-weight:900;letter-spacing:-.8px}.mastery{margin-top:18px;border:1px solid var(--border);border-radius:14px;overflow:hidden}.mastery-head{padding:13px 15px;background:#12161c;font-size:14px;font-weight:850}.mastery-row{display:grid;grid-template-columns:1.2fr 1.1fr .8fr .8fr;gap:12px;padding:11px 15px;border-top:1px solid var(--border);font-size:13px;align-items:center}.belt{display:inline-block;border-radius:999px;padding:5px 8px;border:1px solid var(--border);font-size:11px;font-weight:850}.belt.white{background:#e5e7eb;color:#111827}.belt.yellow{background:#eabf42;color:#1c1605}.belt.green{background:#52b788;color:#07150e}.belt.black{background:#050608;color:#f5f5f5;border-color:#3b4048}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.small-note{text-align:center;color:#5d6571;font-size:12px;margin-top:18px}.separator{height:1px;background:var(--border);margin:18px 0}@media(max-width:720px){.controls{grid-template-columns:1fr}.summary-grid{grid-template-columns:repeat(2,1fr)}.mastery-row{grid-template-columns:1fr 1fr}.mastery-row .optional,.version{display:none}.dojo{min-height:340px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
