:root{--bg: #0d0d10;--bg-grad-top: #131318;--surface: #16161c;--surface-2: #1d1d25;--surface-3: #25252f;--border: rgba(255, 255, 255, .07);--border-strong: rgba(255, 255, 255, .12);--text: #f4f4f7;--text-dim: #9b9ba8;--text-faint: #6c6c79;--lime: #c9f75b;--lime-bright: #d8ff6b;--lime-deep: #a8d63f;--lime-soft: rgba(201, 247, 91, .12);--lime-soft-2: rgba(201, 247, 91, .18);--purple: #8b5cf6;--purple-bright: #a78bfa;--purple-deep: #6d43e8;--purple-soft: rgba(139, 92, 246, .14);--purple-soft-2: rgba(139, 92, 246, .22);--danger: #ff7a7a;--danger-soft: rgba(255, 122, 122, .13);--warn: #ffcf66;--radius-sm: 12px;--radius: 18px;--radius-lg: 24px;--radius-xl: 30px;--shadow-card: 0 8px 30px rgba(0, 0, 0, .35);--shadow-soft: 0 4px 18px rgba(0, 0, 0, .25);--font-head: "Sora", system-ui, sans-serif;--font-body: "Inter", system-ui, sans-serif;--app-max: 440px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#root{min-height:100%}h1,h2,h3,h4{font-family:var(--font-head);font-weight:700;letter-spacing:-.02em;margin:0;line-height:1.12}button{font-family:var(--font-body);cursor:pointer;border:none;background:none;color:inherit}input,textarea{font-family:var(--font-body);color:var(--text)}::-webkit-scrollbar{width:0;height:0}.app-frame{position:relative;max-width:var(--app-max);margin:0 auto;min-height:100vh;min-height:100dvh;background:radial-gradient(120% 60% at 50% -8%,rgba(139,92,246,.16),transparent 55%),radial-gradient(90% 40% at 100% 0%,rgba(201,247,91,.05),transparent 50%),linear-gradient(180deg,var(--bg-grad-top) 0%,var(--bg) 28%);overflow-x:hidden;display:flex;flex-direction:column}.screen{flex:1;padding:0 20px 120px;overflow-y:auto}.screen-pad-top{padding-top:calc(env(safe-area-inset-top,0px) + 22px)}.eyebrow{font-family:var(--font-head);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}.h-xl{font-size:30px;font-family:var(--font-head);font-weight:800}.h-lg{font-size:23px}.h-md{font-size:18px}.muted{color:var(--text-dim)}.faint{color:var(--text-faint)}.center{text-align:center}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow-soft)}.card-2{background:var(--surface-2)}.card-row{display:flex;align-items:center;gap:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--font-head);font-weight:700;font-size:15px;border-radius:999px;padding:15px 22px;transition:transform .12s ease,opacity .12s ease,background .15s ease;white-space:nowrap}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-block{width:100%}.btn-primary{background:var(--lime);color:#0c1006;box-shadow:0 6px 22px #c9f75b38}.btn-purple{background:linear-gradient(135deg,var(--purple) 0%,var(--purple-deep) 100%);color:#fff;box-shadow:0 6px 22px #6d43e852}.btn-ghost{background:var(--surface-2);color:var(--text);border:1px solid var(--border)}.btn-sm{padding:10px 16px;font-size:13.5px}.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;padding:0 14px;border-radius:999px;background:var(--purple-soft);color:var(--purple-bright);border:1px solid var(--purple-soft-2);font-weight:600;font-size:13.5px;transition:transform .12s ease,background .15s ease}.icon-btn:active{transform:scale(.95)}.icon-btn.lime{background:var(--lime-soft);color:var(--lime);border-color:var(--lime-soft-2)}.icon-btn.speaking{background:var(--purple);color:#fff;animation:rocoPulse 1.4s ease-out infinite}@keyframes rocoPulse{0%{box-shadow:0 0 #a78bfa8c}70%{box-shadow:0 0 0 14px #a78bfa00}to{box-shadow:0 0 #a78bfa00}}.chip{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);color:var(--text-dim);font-weight:600;font-size:14px;transition:all .14s ease}.chip.selected{background:var(--lime-soft);border-color:var(--lime);color:var(--lime-bright)}.chip-wrap{display:flex;flex-wrap:wrap;gap:10px}.option{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:16px;border-radius:var(--radius);background:var(--surface);border:1.5px solid var(--border);transition:all .14s ease}.option:active{transform:scale(.99)}.option.selected{border-color:var(--purple-bright);background:var(--purple-soft)}.option-emoji{display:flex;align-items:center;justify-content:center;width:46px;height:46px;flex:none;border-radius:14px;background:var(--surface-3);font-size:22px}.option.selected .option-emoji{background:var(--purple-soft-2)}.option-title{font-family:var(--font-head);font-weight:700;font-size:15.5px}.option-sub{color:var(--text-dim);font-size:13px;margin-top:2px}.option-check{margin-left:auto;color:var(--purple-bright);flex:none}.brand{display:inline-flex;align-items:center;gap:10px}.brand-name{font-family:var(--font-head);font-weight:800;letter-spacing:-.02em}.bottom-nav{position:fixed;bottom:0;left:0;right:0;max-width:var(--app-max);margin:0 auto;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;padding:9px 6px calc(env(safe-area-inset-bottom,0px) + 11px);background:#0f0f13d1;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--border);z-index:40}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:7px 0 5px;border-radius:14px;color:var(--text-faint);font-size:10.5px;font-weight:600;position:relative;transition:color .15s ease}.nav-item.active{color:var(--lime)}.nav-item.sos.active{color:var(--purple-bright)}.nav-dot{position:absolute;top:1px;width:5px;height:5px;border-radius:50%;background:var(--lime)}.nav-item.sos .nav-dot{background:var(--purple-bright)}.app-header{display:flex;align-items:center;justify-content:space-between;padding-top:calc(env(safe-area-inset-top,0px) + 8px);padding-right:0;padding-bottom:18px;padding-left:0}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:15px 16px}.stat-label{display:flex;align-items:center;gap:6px;color:var(--text-dim);font-size:12.5px;font-weight:600}.stat-value{font-family:var(--font-head);font-weight:800;font-size:26px;margin-top:6px;display:flex;align-items:baseline;gap:5px}.stat-unit{font-size:13px;font-weight:600;color:var(--text-faint)}.meter{height:9px;border-radius:999px;background:var(--surface-3);overflow:hidden}.meter-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--purple) 0%,var(--lime) 100%);transition:width .6s cubic-bezier(.2,.8,.2,1)}.meter.lime .meter-fill{background:linear-gradient(90deg,var(--lime-deep),var(--lime))}.dots{display:flex;gap:6px;align-items:center}.dot{height:4px;border-radius:999px;background:var(--surface-3);flex:1;transition:background .3s ease}.dot.done{background:var(--purple)}.dot.active{background:var(--lime)}.field{width:100%;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius);padding:15px 16px;color:var(--text);font-size:15.5px;resize:none;outline:none;transition:border-color .15s ease}.field:focus{border-color:var(--purple-bright)}.field::placeholder{color:var(--text-faint)}textarea.field{min-height:118px;line-height:1.5}.tag{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:600;background:var(--surface-2);color:var(--text-dim);border:1px solid var(--border)}.tag.lime{background:var(--lime-soft);color:var(--lime);border-color:var(--lime-soft-2)}.tag.purple{background:var(--purple-soft);color:var(--purple-bright);border-color:var(--purple-soft-2)}.tag.danger{background:var(--danger-soft);color:var(--danger);border-color:#ff7a7a40}.roco-orb{display:flex;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--purple-bright),var(--purple-deep) 75%);box-shadow:0 10px 34px #6d43e866,inset 0 2px 8px #ffffff2e;flex:none}.bubble{max-width:86%;padding:13px 16px;border-radius:20px;font-size:14.5px;line-height:1.5}.bubble.roco{background:var(--surface-2);border:1px solid var(--border);border-bottom-left-radius:7px;align-self:flex-start}.bubble.me{background:linear-gradient(135deg,var(--purple) 0%,var(--purple-deep) 100%);color:#fff;border-bottom-right-radius:7px;align-self:flex-end}.stack{display:flex;flex-direction:column}.gap-8{gap:8px}.gap-10{gap:10px}.gap-12{gap:12px}.gap-14{gap:14px}.gap-16{gap:16px}.gap-20{gap:20px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-20{margin-top:20px}.mt-24{margin-top:24px}.row{display:flex;align-items:center}.row-between{display:flex;align-items:center;justify-content:space-between}.spread{margin-left:auto}.full{width:100%}.locked{position:relative;background:linear-gradient(135deg,#8b5cf629,#c9f75b0f);border:1px solid var(--purple-soft-2);border-radius:var(--radius-lg);padding:20px;overflow:hidden}.locked:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(80% 60% at 80% 0%,rgba(167,139,250,.25),transparent 60%);pointer-events:none}.section-title{font-family:var(--font-head);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:11px}.explain{background:var(--surface-2);border:1px solid var(--border);border-left:3px solid var(--purple);border-radius:14px;padding:13px 15px}.explain.diff{border-left-color:var(--lime)}.word-row{display:flex;align-items:flex-start;gap:12px}.word-en{font-family:var(--font-head);font-weight:700;font-size:16px}.badge{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 10px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);text-align:center}.badge.earned{border-color:var(--lime-soft-2);background:var(--lime-soft)}.badge-ico{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--surface-3);color:var(--text-faint)}.badge.earned .badge-ico{background:var(--lime);color:#0c1006}.badge-name{font-size:11.5px;font-weight:600}.weekbars{display:flex;align-items:flex-end;gap:8px;height:96px}.weekbar{flex:1;display:flex;flex-direction:column;align-items:center;gap:7px;height:100%;justify-content:flex-end}.weekbar-fill{width:100%;border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,var(--lime),var(--lime-deep));min-height:4px}.weekbar-fill.dim{background:var(--surface-3)}.weekbar-day{font-size:10px;color:var(--text-faint);font-weight:600}.divider{height:1px;background:var(--border);margin:16px 0}.toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%);z-index:80;background:var(--surface-3);border:1px solid var(--border-strong);color:var(--text);padding:12px 18px;border-radius:999px;font-weight:600;font-size:14px;box-shadow:var(--shadow-card);display:flex;align-items:center;gap:8px;max-width:calc(var(--app-max) - 40px)}.empty{text-align:center;padding:46px 20px;color:var(--text-dim)}.empty-ico{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:20px;background:var(--surface-2);color:var(--text-faint);margin-bottom:14px}