:root{font-family:Trebuchet MS,Hiragino Sans,Yu Gothic,sans-serif;color:#1a2440;background:radial-gradient(circle at top left,#fff4ce 0,#fff4ce 18%,transparent 19%),radial-gradient(circle at top right,#dff2ff 0,#dff2ff 22%,transparent 23%),linear-gradient(180deg,#fffef8,#eef7ff)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh}button,input{font:inherit}button{cursor:pointer}#root{min-height:100vh;min-height:100dvh}.page-shell{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px}.panel{width:100%;background:#fffffff0;border:4px solid #ffffff;border-radius:32px;box-shadow:0 20px 50px #2c63a724,inset 0 -6px #155baf14}.hero-panel,.result-panel{padding:40px}.practice-panel{width:100%;padding:18px 20px 20px}.hero-copy h1,.result-panel h1,.question-stage h2{margin:0}.eyebrow{margin:0 0 8px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#e0493d}.subtitle{margin:12px 0 0;color:#425376;line-height:1.6}.stack{margin-top:28px;display:grid;gap:18px}.stack-sm{display:grid;gap:12px}.field{display:grid;gap:8px;font-weight:700}.field input{min-height:58px;border-radius:18px;border:2px solid #dbe7ff;padding:0 16px;background:#fbfdff;font-size:16px}.primary-button,.secondary-button,.card-button{border:0;border-radius:18px;font-weight:800;transition:transform .15s ease,box-shadow .15s ease}.primary-button{min-height:58px;padding:0 22px;color:#fff;background:linear-gradient(180deg,#ff6a54,#ea4737);box-shadow:0 8px #bf3327}.secondary-button{min-height:54px;padding:0 22px;color:#21405f;background:linear-gradient(180deg,#fff,#e4f0ff);box-shadow:0 8px #bfd4f0}.card-button{min-height:92px;padding:16px;background:linear-gradient(180deg,#fff,#f4f9ff);box-shadow:0 8px #d6e7fb;color:#21405f;text-align:left;display:grid;gap:8px;align-content:start}.primary-button:hover,.secondary-button:hover,.card-button:hover{transform:translateY(2px)}.card-button.selected{background:linear-gradient(180deg,#ffedb8,#ffd35d);box-shadow:0 8px #d7aa24}.choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.choice-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.section-title{margin:0;font-size:.95rem;font-weight:800;color:#385074}.card-title{font-size:1rem;font-weight:800}.card-copy{font-size:.88rem;line-height:1.5;color:#607392}.score-row,.action-row,.result-meta{display:flex;flex-wrap:wrap;gap:12px}.score-pill,.result-card{display:grid;gap:6px;padding:10px 12px;border-radius:18px;background:#f4f9ff}.score-pill{min-width:120px}.score-pill.secondary{background:#fff6da}.score-pill span,.result-card span{font-size:.68rem;color:#607392;text-transform:uppercase;letter-spacing:.04em}.score-pill strong,.result-card strong{font-size:1rem}.error-text{margin:0;color:#ca3d37;font-weight:700}.mode-preview-card{padding:18px 20px;border-radius:20px;background:linear-gradient(180deg,#fff8df,#fff1c7);box-shadow:inset 0 -4px #cda3271f}.mode-preview-card strong{display:block;margin-bottom:8px;font-size:1.1rem}.mode-preview-card p{margin:0;color:#536787;line-height:1.6}.progress-track{height:14px;margin:0 0 10px;border-radius:999px;background:#dfeafb;overflow:hidden}.progress-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffcc49,#ff7a59)}.question-stage{flex:1 1 auto;min-height:170px;padding:12px 16px 14px;border-radius:24px;background:linear-gradient(180deg,#fff,#f9fbff);text-align:center;transition:box-shadow .15s ease,background .15s ease}.question-stage.ok{box-shadow:0 0 0 4px #38c4702e}.question-stage.miss{box-shadow:0 0 0 4px #ec64532e}.question-stage h2{font-size:clamp(1.6rem,4.6vw,3.6rem);line-height:1.18}.typed-line{margin:10px 0 0;font-size:clamp(1.1rem,3.2vw,2rem);font-weight:800;letter-spacing:.04em;word-break:break-word}.typed-ok{color:#23a55a}.practice-stage-row{width:100%;margin-top:10px;display:flex;align-items:stretch;justify-content:space-between;gap:12px;color:#647692;font-size:.78rem;line-height:1.3}.practice-status-card{display:flex;flex-direction:column;justify-content:center;gap:8px;min-height:170px;padding:14px 12px;border-radius:16px;background:#ecf5ffeb;white-space:nowrap}.practice-status-left,.practice-status-right{flex:0 0 auto;width:fit-content}.practice-status-left{align-items:flex-start;text-align:left}.practice-status-right{align-items:flex-end;text-align:right}.practice-shell{align-items:stretch;justify-content:flex-start;flex-direction:column;padding:0}.practice-input-card{width:100%;padding:8px;border-radius:18px;background:#fffffff5;border:3px solid rgba(255,255,255,.92);box-shadow:0 12px 28px #2559962e;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.practice-input-inline{margin-top:10px}.practice-input{width:100%;min-height:56px;padding:0 14px;border-radius:16px;border:3px solid #b9d6ff;background:#fff;font-size:18px;font-weight:800;letter-spacing:.04em}.practice-input:focus{outline:none;border-color:#ffb938;box-shadow:0 0 0 4px #ffb9382e}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:28px 0}.result-message{font-size:1.1rem;font-weight:800;color:#e0493d}.result-ribbon{display:inline-block;margin:10px 0 6px;padding:10px 16px;border-radius:999px;background:linear-gradient(180deg,#fff0b8,#ffd968);color:#6d4500;font-weight:800;box-shadow:0 6px #b884002e}@media (max-width: 720px){.hero-panel,.result-panel,.practice-panel{padding:18px 14px 16px}.page-shell{padding:8px}.panel{border-radius:24px}.choice-grid.two{grid-template-columns:1fr}.question-stage{padding:10px 8px 12px}.question-stage h2{font-size:clamp(1.35rem,6.2vw,2.2rem)}.typed-line{font-size:clamp(1rem,4.8vw,1.45rem)}.practice-stage-row{width:100%;align-items:stretch;font-size:.72rem}.practice-status-card{min-height:140px;padding:6px 8px}.practice-input{min-height:52px;font-size:17px}}