@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Poppins:wght@300;400;500;600;700&display=swap";:root{--primary: #D97F8C;--primary-2: #F3B7C1;--secondary: #EBCB8B;--olive: #BBD38A;--ink: #1F2937;--muted: #6B7280;--bg: #FBFAFB;--surface: #FFFFFF;--border: #E9E3E8;--danger: #EF4444;--success: #10B981;--violet: #8B5CF6;--radius-xl: 26px;--radius-lg: 18px;--radius-md: 14px;--shadow: 0 18px 50px rgba(17,24,39,.08);--shadow-soft: 0 10px 26px rgba(17,24,39,.06);--t: .22s ease;--max: 980px;--safeTop: env(safe-area-inset-top);--safeRight: env(safe-area-inset-right);--safeBottom: env(safe-area-inset-bottom);--safeLeft: env(safe-area-inset-left)}[data-theme=dark]{--primary: #E89FAB;--primary-2: #D97F8C;--secondary: #F4D79F;--olive: #C9E0A2;--ink: #E5E7EB;--muted: #9CA3AF;--bg: #111827;--surface: #1F2937;--border: #374151;--danger: #F87171;--success: #34D399;--violet: #A78BFA;--shadow: 0 18px 50px rgba(0,0,0,.4);--shadow-soft: 0 10px 26px rgba(0,0,0,.3)}*{box-sizing:border-box;margin:0;padding:0}html{background-color:#fbfafb;transition:background-color 0s}[data-theme=dark] html{background-color:#111827}html,body{height:100%}body{font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(1200px 600px at 10% 0%,rgba(217,127,140,.18),transparent 55%),radial-gradient(900px 500px at 90% 0%,rgba(235,203,139,.16),transparent 55%),var(--bg);color:var(--ink);min-height:100svh;display:flex;overflow:hidden;padding:var(--safeTop) var(--safeRight) var(--safeBottom) var(--safeLeft);padding-left:calc(var(--safeLeft) + 270px);padding-right:calc(var(--safeRight) + 340px);-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background var(--t),color var(--t)}[data-theme=dark] body{background:radial-gradient(1200px 600px at 10% 0%,rgba(232,159,171,.12),transparent 55%),radial-gradient(900px 500px at 90% 0%,rgba(244,215,159,.1),transparent 55%),var(--bg)}.layout{display:flex;height:100vh;width:100%}.sidebar{position:fixed;left:0;top:0;width:270px;height:100vh;background:#ffffffd9;border-right:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:18px;display:flex;flex-direction:column;gap:14px;z-index:10}.main{flex:1;overflow:auto;padding:22px 100px 80px;-webkit-overflow-scrolling:touch;max-width:100%;width:100%;box-sizing:border-box}.right{position:fixed;right:0;top:0;width:340px;background:#ffffffd9;border-left:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:18px;display:flex;flex-direction:column;gap:14px;overflow:auto;-webkit-overflow-scrolling:touch}.brand{display:flex;align-items:center;gap:12px;padding:14px 12px;border:1px solid var(--border);border-radius:var(--radius-lg);background:linear-gradient(180deg,#ffffffeb,#ffffffb8);box-shadow:var(--shadow-soft);min-width:0}.brand-badge{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;box-shadow:0 10px 20px #d97f8c40;flex:0 0 auto}.brand h1{font-family:Fredoka,Poppins,sans-serif;font-size:18px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand p{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav{display:flex;flex-direction:column;gap:8px}.nav-btn{border:1px solid transparent;background:transparent;padding:12px;border-radius:16px;display:flex;align-items:center;gap:12px;cursor:pointer;color:var(--muted);transition:var(--t);font-weight:600;min-width:0}.nav-btn:hover{background:#d97f8c14;color:var(--ink)}.nav-btn.active{background:#d97f8c1f;border-color:#d97f8c47;color:var(--ink)}.nav-btn.active i{color:var(--primary)}.nav-btn i{font-size:22px;color:var(--muted);flex:0 0 auto}.nav-btn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wrap{width:100%;margin:0;padding:0}.view{display:none;animation:fade .32s ease;width:100%;min-width:0}.view.active{display:block}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}.title h2{font-family:Fredoka,Poppins,sans-serif;font-size:26px;letter-spacing:-.2px;word-break:break-word}.title p{color:var(--muted);font-size:13px;margin-top:4px}.pillrow{display:flex;gap:10px;flex-wrap:wrap}.pill{border:1px solid var(--border);background:#ffffffbf;padding:8px 10px;border-radius:999px;display:flex;align-items:center;gap:8px;font-size:12px;box-shadow:0 8px 18px #1118270a;white-space:nowrap}.pill strong{font-weight:700}.grid{display:grid;grid-template-columns:2.3fr 1.4fr;gap:14px;margin-top:14px;width:100%;min-width:0}.card{border:1px solid var(--border);background:#ffffffeb;border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:16px;min-width:0;width:100%;box-sizing:border-box}.view>.card{margin-top:14px;flex:1}.card>*{width:100%;box-sizing:border-box}.card h3{font-family:Fredoka,Poppins,sans-serif;font-size:16px;margin-bottom:10px;display:flex;align-items:center;gap:10px;min-width:0}.card h3 i{color:var(--primary);font-size:20px;flex:0 0 auto}.muted{color:var(--muted);font-size:13px}.route{display:flex;flex-direction:column;align-items:center;gap:20px}.node{width:75px;height:75px;border-radius:50%;background:#e5e7eb;color:#9ca3af;box-shadow:0 10px #d1d5db;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;font-weight:700;position:relative;transition:var(--t)}.node i{font-size:30px}.node.done{background:var(--olive);box-shadow:0 10px #bbd38a8c;color:#fff}.node.current{background:var(--primary);box-shadow:0 10px #d97f8c8c;color:#fff;animation:bounce 2.2s infinite}.node.locked{background:#e5e7eb;color:#9ca3af;box-shadow:0 10px #d1d5db;cursor:not-allowed}.node:active{transform:translateY(6px);box-shadow:none}.node .lbl{margin-top:4px;text-align:center}.line{width:4px;height:28px;background:#e5e7eb;margin-top:-6px;margin-bottom:-6px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.help{font-size:12px;color:var(--muted)}.btn{border:0;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;padding:10px 14px;border-radius:14px;cursor:pointer;font-weight:700;transition:var(--t);box-shadow:0 14px 30px #d97f8c38;display:inline-flex;align-items:center;gap:10px;-webkit-user-select:none;user-select:none;min-height:44px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn.ghost{background:#ffffffd9;color:var(--ink);border:1px solid var(--border);box-shadow:none}.btn.danger{background:linear-gradient(135deg,#ef4444,#f59e0b)}.hamburger{display:none;position:fixed;top:18px;left:18px;z-index:1001;width:44px;height:44px;border:1px solid var(--border);background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;cursor:pointer;box-shadow:var(--shadow-soft);color:var(--ink);font-size:24px;align-items:center;justify-content:center;transition:var(--t)}.hamburger:hover{transform:scale(1.05)}.hamburger:active{transform:scale(.95)}.sidebar-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:999;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}[data-theme=dark] .sidebar,[data-theme=dark] .right{background:#1f2937d9}[data-theme=dark] .brand{background:linear-gradient(180deg,#1f2937eb,#111827b8)}[data-theme=dark] .card{background:#1f2937eb}[data-theme=dark] .pill{background:#1f2937bf}[data-theme=dark] .btn.ghost{background:#1f2937d9;color:var(--ink)}[data-theme=dark] .hamburger{background:#1f2937f2}[data-theme=dark] .node{background:#374151;color:#d1d5db;box-shadow:0 10px #1f2937}[data-theme=dark] .node.done{background:var(--olive);box-shadow:0 10px #c9e0a28c;color:#fff}[data-theme=dark] .node.current{background:var(--primary);box-shadow:0 10px #e89fab8c;color:#fff}[data-theme=dark] .node.locked{background:#374151;color:#d1d5db;box-shadow:0 10px #1f2937}[data-theme=dark] .line{background:#374151}[data-theme=dark] .two-col>div{background:#1f2937cc!important}[data-theme=dark] .help{color:var(--muted)}.sidebar-footer{margin-top:auto;padding:10px;border:1px solid var(--border);border-radius:18px;background:#ffffffb8}[data-theme=dark] .sidebar-footer{background:#1f2937b8}@media (max-width: 768px){.hamburger{display:flex}.sidebar-overlay{display:block}.sidebar{left:-270px;transition:left .3s ease;z-index:1000}.sidebar.open{left:0}.right{display:none}body{padding-left:var(--safeLeft);padding-right:var(--safeRight)}.main{padding:16px 16px 60px}.topbar{flex-direction:column;align-items:flex-start;margin-top:50px}.grid,.two-col{grid-template-columns:1fr}.title h2{font-size:22px}.title p{font-size:12px}.card{padding:14px}.route{flex-direction:row;overflow-x:auto;padding-bottom:10px}.route .line{width:28px;height:4px}.node{width:60px;height:60px;flex-shrink:0}.node i{font-size:24px}.node .lbl{font-size:10px}.form .row{flex-direction:column}.sel{width:100%;min-width:auto}.btn{width:100%;justify-content:center}.pillrow{width:100%}.pill{font-size:11px;padding:6px 8px}}.login-page{min-height:100vh;width:100vw;display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;overflow:auto}.login-layout{display:flex;justify-content:center;align-items:center;width:100%}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:40px;margin:20px;width:auto;max-width:400px;box-shadow:var(--shadow)}.login-card__header{text-align:center;margin-bottom:30px}.login-logo{display:flex;justify-content:center;margin-bottom:20px}.login-title{font-family:Fredoka,Poppins,sans-serif;font-size:28px;margin-bottom:8px}.login-subtitle{color:var(--muted);font-size:14px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:600}.form-group input{width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:12px;font-size:16px;background:var(--bg)}.error{color:var(--danger);font-size:12px;margin-top:4px;display:block}.login-cta{text-align:center;margin-top:20px}.login-cta a{color:var(--primary);text-decoration:none}.login-hero{display:flex;align-items:center;justify-content:center}.login-hero__image{width:300px;height:300px;background:linear-gradient(135deg,var(--primary),var(--secondary));border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:100px}@media (max-width: 768px){.login-layout{grid-template-columns:1fr}.login-hero{display:none}}.stat{border:1px solid var(--border);background:#ffffffeb;border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:16px;display:flex;justify-content:space-between;align-items:center;gap:10px}.stat .l{display:flex;align-items:center;gap:10px;min-width:0}.stat .l i{font-size:22px;flex:0 0 auto}.stat .v{font-weight:900;font-size:16px}.stat .k{font-size:12px;color:var(--muted);font-weight:700}.stat .tag{border:1px solid var(--border);background:#ffffffbf;padding:4px 8px;border-radius:999px;font-size:11px;display:flex;align-items:center;gap:6px;box-shadow:0 8px 18px #1118270a}.assistant{border:1px solid var(--border);background:#ffffffeb;border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column;gap:8px}.assistant h4{font-family:Fredoka,Poppins,sans-serif;font-size:14px;margin-bottom:4px;display:flex;align-items:center;gap:8px;min-width:0}.assistant p{font-size:12px;color:var(--ink);line-height:1.55}.assistant .tip{border-top:1px solid var(--border);padding-top:8px;margin-top:8px;font-size:11px;color:var(--muted);font-style:italic}.tag{border:1px solid var(--border);background:#ffffffbf;padding:4px 8px;border-radius:999px;font-size:11px;display:flex;align-items:center;gap:6px;box-shadow:0 8px 18px #1118270a}.modes{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media (max-width: 900px){.modes{grid-template-columns:repeat(2,1fr)}}@media (max-width: 500px){.modes{grid-template-columns:1fr}}.mode{border:1px solid var(--border);background:#ffffffeb;border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;transition:var(--t);box-shadow:var(--shadow-soft)}.mode:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.mode .ico{width:50px;height:50px;border-radius:50%;background:#d97f8c1a;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--primary)}.mode h4{font-family:Fredoka,Poppins,sans-serif;font-size:16px;text-align:center}.mode p{font-size:12px;color:var(--muted);text-align:center;line-height:1.4}[data-theme=dark] .mode{background:#1f2937eb}[data-theme=dark] .mode .ico{background:#e89fab26}[data-theme=dark] .assistant{background:#1f2937eb}[data-theme=dark] .tag{background:#1f2937bf}[data-theme=dark] .qbox,[data-theme=dark] .opt{background:#1f2937eb}[data-theme=dark] .opt:hover{background:#e89fab1a}[data-theme=dark] .opt.selected{background:#e89fab26;border-color:var(--primary)}[data-theme=dark] .opt.correct{background:#c9e0a226;border-color:var(--olive)}[data-theme=dark] .opt.incorrect{background:#f8717126;border-color:var(--danger)}.chat{border:1px solid var(--border);border-radius:var(--radius-xl);display:flex;flex-direction:column;height:500px;background:#ffffffeb}[data-theme=dark] .chat{background:#1f2937eb}.chat-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--border)}.chat-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}.chat-foot{display:flex;gap:10px;padding:16px;border-top:1px solid var(--border)}.msg-ai{background:#d97f8c1a;color:var(--ink)}[data-theme=dark] .msg-ai{background:#e89fab26}[data-theme=dark] .stat{background:#1f2937eb}[data-theme=dark] .stat .tag{background:#1f2937bf}[data-theme=dark] .sel{background:#1f2937;color:#e5e7eb;border-color:#4b5563}[data-theme=dark] .sel option{background:#1f2937;color:#e5e7eb}.input{padding:10px 12px;border:1px solid var(--border);border-radius:12px;font-size:14px;background:var(--surface);color:var(--ink)}[data-theme=dark] .input{background:#1f2937;color:#e5e7eb;border-color:#4b5563}[data-theme=dark] .input::placeholder{color:#9ca3af}[data-theme=dark] .txt{background:#1f2937;color:#e5e7eb;border-color:#4b5563}[data-theme=dark] .txt::placeholder{color:#9ca3af}.theme-toggle{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#1f2937,#111827);border:none;color:#fff;font-size:24px;cursor:pointer;box-shadow:0 8px 24px #1f293773;display:flex;align-items:center;justify-content:center;transition:var(--t);z-index:100}.theme-toggle:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 32px #1f29378c}.theme-toggle:active{transform:translateY(-1px) scale(.98)}[data-theme=dark] .theme-toggle{background:linear-gradient(135deg,var(--primary),var(--secondary));box-shadow:0 8px 24px #e89fab59}[data-theme=dark] .theme-toggle:hover{box-shadow:0 12px 32px #e89fab73}.form{display:flex;flex-direction:column;gap:12px}.form .row{display:flex;gap:10px;flex-wrap:wrap}.sel{border:1px solid var(--border);background:#ffffffeb;padding:10px 12px;border-radius:12px;font-size:14px;cursor:pointer;min-width:120px}.txt{border:1px solid var(--border);background:#ffffffeb;border-radius:14px;padding:10px 12px;outline:none;font-size:13px;min-width:160px;flex:1;min-height:44px;font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.qbox{border:1px solid var(--border);background:#ffffffeb;border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:16px;width:100%;min-width:0;box-sizing:border-box}.qmeta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.stem{font-size:16px;line-height:1.6;margin-bottom:16px}.opts{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.opt{border:1px solid var(--border);background:#ffffffeb;padding:12px 16px;border-radius:12px;cursor:pointer;transition:var(--t);display:flex;align-items:flex-start;gap:12px}.opt:hover{background:#d97f8c0d}.opt.selected{background:#d97f8c1a;border-color:var(--primary)}.opt.correct{background:#bbd38a1a;border-color:var(--olive)}.opt.incorrect{background:#ef44441a;border-color:var(--danger)}.feedback{border-top:1px solid var(--border);padding-top:16px;display:flex;flex-direction:column;gap:12px}.fb-title{display:flex;align-items:center;gap:8px;font-weight:700}.fb-title .dot{width:12px;height:12px;border-radius:50%;background:var(--success)}.fb-body{font-size:14px;line-height:1.6}.fb-actions{display:flex;gap:10px;flex-wrap:wrap}.voice{border-radius:28px;padding:18px;border:1px solid rgba(255,255,255,.22);background:radial-gradient(900px 420px at 20% 0%,rgba(217,127,140,.5),transparent 60%),radial-gradient(900px 420px at 90% 0%,rgba(235,203,139,.45),transparent 60%),linear-gradient(135deg,#1f2937,#111827);color:#fff;box-shadow:0 22px 60px #11182766;position:relative;overflow:hidden;min-height:clamp(520px,72vh,640px);display:flex;flex-direction:column;justify-content:space-between}.voice-top{display:flex;justify-content:space-between;align-items:center;gap:10px;opacity:.95;flex-wrap:wrap}.voice-top small{opacity:.75;letter-spacing:1px;text-transform:uppercase}.voice-ava{width:140px;height:140px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.28),transparent 55%),linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;font-size:56px;box-shadow:0 0 #d97f8c73;animation:pulse 2.2s infinite;margin:18px auto 8px}.voice-prompt{text-align:center;font-size:16px;line-height:1.6;padding:0 14px;min-height:96px;color:#ffffffeb;word-break:break-word}.voice-wave{display:flex;justify-content:center;gap:6px;height:38px;align-items:center;opacity:0;transition:var(--t)}.voice-wave.on{opacity:1}.voice-wave .bar{width:6px;border-radius:999px;background:#ffffffb3;animation:sound .45s infinite ease-in-out alternate}.voice-actions{display:flex;justify-content:center;gap:16px;padding:18px 0 6px;flex-wrap:wrap}.circle{width:56px;height:56px;border-radius:50%;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:22px;transition:var(--t);min-height:56px;min-width:56px}.circle:hover{transform:scale(1.04)}.circle.mic{background:#ef4444f2;color:#fff;box-shadow:0 14px 30px #ef444442}.circle.mic.listening{background:#fff;color:#ef4444f2}.circle.ghost{background:#ffffff24;color:#fff;border:1px solid rgba(255,255,255,.2)}.circle.end{background:#ef44441f;color:#ef4444f2;border:1px solid rgba(239,68,68,.2)}@keyframes pulse{0%{box-shadow:0 0 #d97f8c59}70%{box-shadow:0 0 0 26px #d97f8c00}to{box-shadow:0 0 #d97f8c00}}@keyframes sound{0%{height:6px}to{height:32px}}body{margin:0;height:100vh}#root{height:100vh}