:root{--bg-deep:#0f1219;--bg-surface:#1a1f2e;--bg-card:#242b3d;--accent:#6ecfc0;--accent-soft:#4a9e92;--accent-glow:#6ecfc059;--text-primary:#eef2f7;--text-secondary:#9aa8bc;--text-muted:#6b7a90;--success:#7dd87d;--warning:#f0c674;--danger-soft:#e88b8b;--radius:16px;--radius-sm:10px;--touch-min:48px;--font:"Segoe UI", system-ui, -apple-system, sans-serif;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font);background:var(--bg-deep);color:var(--text-primary);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}button,input{border:none;outline:none;font-family:inherit}button{cursor:pointer;min-height:var(--touch-min);min-width:var(--touch-min)}.app{flex-direction:column;max-width:430px;height:100%;margin:0 auto;display:flex;position:relative;overflow:hidden}.screen{padding:calc(12px + var(--safe-top)) 16px calc(16px + var(--safe-bottom));flex-direction:column;flex:1;display:flex;overflow:hidden}.btn{border-radius:var(--radius-sm);justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-size:15px;font-weight:600;transition:transform .15s,background .2s,opacity .2s;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:var(--bg-deep)}.btn-primary:hover{background:var(--accent-soft)}.btn-ghost{background:var(--bg-card);color:var(--text-primary)}.btn-ghost:hover{background:#2e3649}.btn-icon{width:var(--touch-min);height:var(--touch-min);color:var(--text-primary);background:#ffffff14;border-radius:50%;padding:0;font-size:18px}.btn-icon.active{background:var(--accent-glow);color:var(--accent)}.input{border-radius:var(--radius-sm);background:var(--bg-card);width:100%;color:var(--text-primary);border:2px solid #0000;padding:14px 16px;font-size:16px;transition:border-color .2s}.input:focus{border-color:var(--accent)}.fade-in{animation:.4s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.flash-wrong{animation:.35s shake}.gesture-area-flash{box-shadow:inset 0 0 0 2px #e88b8b80}.flash-success{animation:.6s 2 pulse}@media (prefers-reduced-motion:reduce){.fade-in,.flash-success,.flash-wrong{animation:none}.progress-bar__fill{transition:none}}