@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";:root{--bg: #f8f9fa;--bg-subtle: #f1f3f5;--surface: #ffffff;--surface-2: #f8f9fa;--surface-3: #e9ecef;--surface-hover: #f1f3f5;--border: #e2e8f0;--border-light: #edf2f7;--border-hover: #cbd5e1;--border-active: #059669;--text: #1e293b;--text-secondary: #475569;--text-muted: #64748b;--text-inverse: #ffffff;--primary: #059669;--primary-hover: #047857;--primary-active: #065f46;--primary-light: #ecfdf5;--primary-border: #a7f3d0;--primary-text: #065f46;--secondary: #0284c7;--secondary-hover: #0369a1;--secondary-light: #e0f2fe;--secondary-border: #bae6fd;--secondary-text: #0369a1;--success: #16a34a;--success-hover: #15803d;--success-light: #dcfce7;--success-border: #86efac;--success-text: #15803d;--danger: #dc2626;--danger-hover: #b91c1c;--danger-light: #fee2e2;--danger-border: #fca5a5;--danger-text: #b91c1c;--warning: #d97706;--warning-hover: #b45309;--warning-light: #fef3c7;--warning-border: #fde68a;--warning-text: #b45309;--purple: #7c3aed;--purple-light: #f3e8ff;--purple-text: #6d28d9;--gradient-primary: linear-gradient(135deg, #059669, #0d9488);--gradient-accent: linear-gradient(135deg, #0284c7, #2563eb);--gradient-success: linear-gradient(135deg, #16a34a, #059669);--gradient-warm: linear-gradient(135deg, #d97706, #dc2626);--gradient-surface: #ffffff;--gradient-hero: linear-gradient(135deg, #ecfdf5, #f0fdf4);--glass-bg: rgba(255, 255, 255, .95);--glass-bg-light: rgba(255, 255, 255, .9);--glass-border: #e2e8f0;--glass-blur: blur(8px);--glass-blur-heavy: blur(12px);--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace;--text-xs: .6875rem;--text-sm: .8125rem;--text-base: .9375rem;--text-lg: 1.0625rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--weight-normal: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--leading-tight: 1.2;--leading-snug: 1.35;--leading-normal: 1.5;--leading-relaxed: 1.7;--space-0: 0;--space-1: 4px;--space-1-5: 6px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-xs: 4px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 999px;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .04);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .08), 0 2px 4px -1px rgba(0, 0, 0, .04);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -2px rgba(0, 0, 0, .04);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .08);--shadow-glow-primary: 0 4px 12px rgba(5, 150, 105, .12);--shadow-glow-secondary: 0 4px 12px rgba(2, 132, 199, .12);--shadow-glow-success: 0 4px 12px rgba(22, 163, 74, .12);--shadow-glow-danger: 0 4px 12px rgba(220, 38, 38, .12);--transition-fast: .12s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--transition-spring: .4s cubic-bezier(.34, 1.56, .64, 1);--sidebar-width: 240px;--sidebar-collapsed: 72px;--topbar-height: 64px;--content-max: 1200px;--content-padding: 32px;--mobile-nav-height: 64px;--z-base: 0;--z-dropdown: 100;--z-sticky: 200;--z-modal: 300;--z-toast: 400;--z-tooltip: 500}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);font-size:var(--text-base);font-weight:var(--weight-normal);line-height:var(--leading-normal);color:var(--text);background:var(--bg);min-height:100dvh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:var(--weight-semibold);line-height:var(--leading-tight);color:var(--text)}h1{font-size:var(--text-3xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}h4{font-size:var(--text-lg)}a{color:var(--primary-text);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--primary-hover)}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit;background:none;border:none;outline:none}button{cursor:pointer;-webkit-tap-highlight-color:transparent}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}::selection{background:var(--primary);color:#fff}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes glowPulse{0%,to{box-shadow:0 0 12px #6366f133}50%{box-shadow:0 0 24px #6366f166}}@keyframes borderGlow{0%,to{border-color:var(--primary-border)}50%{border-color:var(--primary)}}@keyframes countUp{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes checkmark{0%{stroke-dashoffset:24}to{stroke-dashoffset:0}}@keyframes typewriter{0%{width:0}to{width:100%}}.page-enter{animation:fadeInUp .4s ease both}.fade-in{animation:fadeIn .3s ease both}.fade-in-up{animation:fadeInUp .4s ease both}.fade-in-left{animation:fadeInLeft .3s ease both}.scale-in{animation:scaleIn .3s ease both}.slide-down{animation:slideDown .2s ease both}.stagger-children>*{animation:fadeInUp .4s ease both}.stagger-children>*:nth-child(1){animation-delay:0ms}.stagger-children>*:nth-child(2){animation-delay:60ms}.stagger-children>*:nth-child(3){animation-delay:.12s}.stagger-children>*:nth-child(4){animation-delay:.18s}.stagger-children>*:nth-child(5){animation-delay:.24s}.stagger-children>*:nth-child(6){animation-delay:.3s}.stagger-children>*:nth-child(7){animation-delay:.36s}.stagger-children>*:nth-child(8){animation-delay:.42s}.skeleton{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);background-size:400% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md)}.skeleton-text{height:1em;width:80%;margin-bottom:var(--space-2)}.skeleton-title{height:1.5em;width:60%;margin-bottom:var(--space-3)}.skeleton-card{height:120px;width:100%}.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite}.hover-lift{transition:transform var(--transition-base),box-shadow var(--transition-base)}.hover-lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.hover-glow{transition:box-shadow var(--transition-base)}.hover-glow:hover{box-shadow:var(--shadow-glow-primary)}.animation-fadeIn{animation:fadeIn .3s ease both}.app-frame{display:grid;grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:1fr;min-height:100dvh;background:var(--bg)}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100dvh;display:flex;flex-direction:column;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-right:1px solid var(--border);padding:var(--space-6) var(--space-4);z-index:var(--z-sticky);overflow-y:auto;overflow-x:hidden}.brand{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);margin-bottom:var(--space-5);text-decoration:none;color:var(--text);border-radius:var(--radius-md);transition:background var(--transition-fast);border-bottom:1px solid var(--border);padding-bottom:var(--space-4)}.brand:hover{background:var(--surface-2);color:var(--text)}.brand-mark{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--gradient-primary);color:#fff;font-weight:var(--weight-bold);font-size:var(--text-sm);flex-shrink:0;box-shadow:var(--shadow-glow-primary)}.brand div{display:flex;flex-direction:column;min-width:0}.brand strong{font-size:var(--text-sm);font-weight:var(--weight-semibold);white-space:nowrap}.brand small{font-size:var(--text-xs);color:var(--text-muted);white-space:nowrap}.student-nav{flex:1;display:flex;flex-direction:column;gap:var(--space-1)}.nav-section-label{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;padding:var(--space-2) var(--space-3);margin-top:var(--space-2);margin-bottom:var(--space-1)}.student-nav-link{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-3);border-radius:var(--radius-md);color:var(--text-secondary);text-decoration:none;font-size:var(--text-sm);font-weight:var(--weight-medium);transition:all var(--transition-fast);position:relative}.student-nav-link:hover{background:var(--surface-2);color:var(--text)}.student-nav-link.active{background:var(--primary-light);color:var(--primary-text);font-weight:var(--weight-semibold);box-shadow:inset 0 0 0 1px var(--primary-border)}.student-nav-link.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:60%;background:var(--gradient-primary);border-radius:0 var(--radius-full) var(--radius-full) 0}.nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.nav-divider{height:1px;background:var(--border);margin:var(--space-3) var(--space-3)}.sidebar-footer{margin-top:auto;padding-top:var(--space-4);border-top:1px solid var(--border)}.user-panel{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);transition:background var(--transition-fast)}.user-panel:hover{background:var(--surface-2)}.avatar{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-full);background:var(--gradient-primary);color:#fff;font-size:var(--text-xs);font-weight:var(--weight-bold);flex-shrink:0}.avatar-sm{width:28px;height:28px;font-size:10px}.avatar-img{object-fit:cover;background:var(--surface-2)}.user-panel div{flex:1;min-width:0}.user-panel strong{font-size:var(--text-sm);font-weight:var(--weight-medium);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-panel small{font-size:var(--text-xs);color:var(--text-muted)}.admin-entry{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-sm);color:var(--text-muted);transition:all var(--transition-fast)}.admin-entry:hover{background:var(--surface-3);color:var(--text)}.app-main{grid-column:2;display:flex;flex-direction:column;min-height:100dvh;min-width:0;background:var(--bg)}.app-main.exam-app-main{grid-column:1 / -1}.topbar{display:flex;align-items:center;justify-content:space-between;height:var(--topbar-height);padding:0 var(--content-padding);background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:var(--z-sticky)}.topbar>div:first-child{display:flex;flex-direction:column}.topbar strong{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text)}.topbar small{font-size:var(--text-xs);color:var(--text-muted)}.topbar-actions{display:flex;align-items:center;gap:var(--space-2)}.topbar-pill{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);background:var(--surface-2);border:1px solid var(--border);cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.topbar-pill:hover{background:var(--surface-3);color:var(--text);border-color:var(--border-hover)}.topbar-pill.ghost{background:transparent;border-color:transparent}.topbar-pill.ghost:hover{background:var(--surface-2)}.user-panel,.user-menu,.topbar-user-menu{position:relative}.user-menu-trigger{border:0;cursor:pointer;font:inherit;color:inherit}.sidebar-user-trigger{width:100%;display:flex;align-items:center;gap:var(--space-3);padding:0;background:transparent;text-align:left}.topbar-user-trigger{padding:2px}.user-trigger-copy{flex:1;min-width:0}.user-chevron{color:var(--text-muted);font-size:var(--text-sm);transition:transform var(--transition-fast)}.user-menu-trigger[aria-expanded=true] .user-chevron{transform:rotate(180deg)}.user-menu-dropdown{position:absolute;right:0;bottom:calc(100% + var(--space-3));width:min(300px,calc(100vw - 32px));padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-xl);z-index:calc(var(--z-sticky) + 20)}.topbar-user-menu .user-menu-dropdown{top:calc(100% + var(--space-3));bottom:auto}.user-menu-head{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2);border-radius:var(--radius-md);background:var(--surface-2)}.user-menu-head div{min-width:0}.user-menu-head strong,.user-menu-head small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-menu-head strong{font-size:var(--text-sm);color:var(--text)}.user-menu-head small{font-size:var(--text-xs);color:var(--text-muted)}.user-menu-badge-row{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-2) 0;font-size:var(--text-xs)}.user-menu-badge-row span{color:var(--text-muted)}.user-menu-badge-row strong{color:var(--primary-text)}.user-menu-actions{display:grid;gap:var(--space-2);margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--border)}.user-menu-actions a,.user-menu-actions button{width:100%;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);border:0;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font:inherit;font-size:var(--text-sm);text-align:left;text-decoration:none;cursor:pointer;transition:all var(--transition-fast)}.user-menu-actions a:hover,.user-menu-actions button:hover{background:var(--surface-2);color:var(--text)}.user-menu-actions .danger{color:var(--danger, #dc2626)}.content{flex:1;padding:var(--content-padding);max-width:var(--content-max);width:100%;min-width:0;margin:0 auto}.content.exam-content{max-width:100%;padding:0}.mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:var(--mobile-nav-height);background:var(--glass-bg);backdrop-filter:var(--glass-blur-heavy);-webkit-backdrop-filter:var(--glass-blur-heavy);border-top:1px solid var(--border);z-index:var(--z-sticky);align-items:center;justify-content:space-around;padding:0 var(--space-2)}.mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);color:var(--text-muted);font-size:10px;font-weight:var(--weight-medium);text-decoration:none;transition:all var(--transition-fast);min-width:56px}.mobile-bottom-nav a:hover,.mobile-bottom-nav a.active{color:var(--primary-text)}.mobile-bottom-nav a.active{background:var(--primary-light)}.mobile-bottom-nav a svg{width:20px;height:20px}.glass-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--transition-base)}.glass-card:hover{border-color:var(--border-hover)}.glass-card.interactive:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--border-hover)}.glass-card.glow:hover{box-shadow:var(--shadow-glow-primary);border-color:var(--primary-border)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6)}.card-compact{padding:var(--space-4)}.card-flush{padding:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-semibold);line-height:1;cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent;white-space:nowrap;text-decoration:none;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:var(--shadow-xs)}.btn-primary:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--surface-2);color:var(--text);border-color:var(--border)}.btn-secondary:hover:not(:disabled){background:var(--surface-3);border-color:var(--border-hover)}.btn-outline{background:transparent;color:var(--primary-text);border-color:var(--primary-border)}.btn-outline:hover:not(:disabled){background:var(--primary-light);border-color:var(--primary)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover:not(:disabled){background:var(--surface-2);color:var(--text)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--danger-hover);box-shadow:var(--shadow-glow-danger)}.btn-success{background:var(--success);color:#fff}.btn-success:hover:not(:disabled){background:var(--success-hover);box-shadow:var(--shadow-glow-success)}.btn.secondary{background:var(--surface-2);color:var(--text);border-color:var(--border)}.btn.secondary:hover:not(:disabled){background:var(--surface-3);border-color:var(--border-hover)}.btn.subtle{background:transparent;color:var(--primary-text);border-color:var(--primary-border)}.btn.subtle:hover:not(:disabled){background:var(--primary-light);border-color:var(--primary)}.btn.ghost{background:transparent;color:var(--text-secondary)}.btn.ghost:hover:not(:disabled){background:var(--surface-2);color:var(--text)}.btn.danger{background:var(--danger);color:#fff}.btn.danger:hover:not(:disabled){background:var(--danger-hover);box-shadow:var(--shadow-glow-danger)}.btn.good{background:var(--success);color:#fff}.btn.good:hover:not(:disabled){background:var(--success-hover);box-shadow:var(--shadow-glow-success)}.btn-xs{padding:var(--space-1) var(--space-3);font-size:var(--text-xs);border-radius:var(--radius-sm)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-base);border-radius:var(--radius-lg)}.btn-icon{width:36px;height:36px;padding:0;border-radius:var(--radius-md)}.btn-icon.btn-sm{width:28px;height:28px}.btn-icon.btn-lg{width:44px;height:44px}.btn-group{display:flex;gap:var(--space-2)}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);line-height:1.4;white-space:nowrap}.badge-primary{background:var(--primary-light);color:var(--primary-text);border:1px solid var(--primary-border)}.badge-secondary{background:var(--secondary-light);color:var(--secondary-text);border:1px solid var(--secondary-border)}.badge-success{background:var(--success-light);color:var(--success-text);border:1px solid var(--success-border)}.badge-warning{background:var(--warning-light);color:var(--warning-text);border:1px solid var(--warning-border)}.badge-danger{background:var(--danger-light);color:var(--danger-text);border:1px solid var(--danger-border)}.badge-purple{background:var(--purple-light);color:var(--purple-text);border:1px solid rgba(168,85,247,.3)}.badge-ghost{background:var(--surface-2);color:var(--text-secondary);border:1px solid var(--border)}.pill-tabs{display:flex;gap:var(--space-1);padding:var(--space-1);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);overflow-x:auto;scrollbar-width:none}.pill-tabs::-webkit-scrollbar{display:none}.pill-tab{padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:none;background:none}.pill-tab:hover{color:var(--text);background:var(--surface-2)}.pill-tab.active{background:var(--primary);color:#fff;font-weight:var(--weight-semibold);box-shadow:var(--shadow-xs)}.input-field{width:100%;padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-size:var(--text-sm);transition:all var(--transition-fast)}.input-field:hover{border-color:var(--border-hover)}.input-field:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.input-field::placeholder{color:var(--text-muted)}.input-group{display:flex;flex-direction:column;gap:var(--space-2)}.input-group label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary)}.textarea-field{width:100%;padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-size:var(--text-sm);resize:vertical;min-height:100px;transition:border-color var(--transition-fast)}.textarea-field:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.checkbox-card{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.checkbox-card:hover{border-color:var(--border-hover);background:var(--surface-2)}.checkbox-card.checked{border-color:var(--primary-border);background:var(--primary-light)}.checkbox-card .check-box{width:20px;height:20px;border:2px solid var(--border-hover);border-radius:var(--radius-xs);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-fast)}.checkbox-card.checked .check-box{background:var(--primary);border-color:var(--primary)}.progress-track{height:6px;background:var(--surface-2);border-radius:var(--radius-full);overflow:hidden}.progress-track.lg{height:10px}.progress-fill{height:100%;background:var(--gradient-primary);border-radius:var(--radius-full);transition:width var(--transition-slow)}.progress-fill.success{background:var(--gradient-success)}.progress-fill.warning{background:var(--warning)}.progress-fill.danger{background:var(--danger)}.progress-labeled{display:flex;flex-direction:column;gap:var(--space-2)}.progress-labeled .progress-info{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-muted)}.score-ring{position:relative;width:120px;height:120px}.score-ring svg{transform:rotate(-90deg)}.score-ring .ring-bg{fill:none;stroke:var(--surface-2);stroke-width:8}.score-ring .ring-fill{fill:none;stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset 1s ease}.score-ring .ring-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-ring .ring-value{font-size:var(--text-2xl);font-weight:var(--weight-bold)}.score-ring .ring-unit{font-size:var(--text-xs);color:var(--text-muted)}.stat-card{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}.stat-card .stat-icon{width:44px;height:44px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:var(--text-xl);flex-shrink:0}.stat-card .stat-value{font-size:var(--text-2xl);font-weight:var(--weight-bold);line-height:1}.stat-card .stat-label{font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--space-1)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-16) var(--space-8);text-align:center}.empty-state .empty-icon{font-size:48px;margin-bottom:var(--space-4);opacity:.5}.empty-state .empty-title{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin-bottom:var(--space-2)}.empty-state .empty-desc{font-size:var(--text-sm);color:var(--text-muted);max-width:400px}.tooltip-wrapper{position:relative;display:inline}.tooltip-content{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);padding:var(--space-2) var(--space-3);background:var(--surface-3);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--text);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity var(--transition-fast);z-index:var(--z-tooltip);box-shadow:var(--shadow-md)}.tooltip-wrapper:hover .tooltip-content{opacity:1}.modal-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);animation:fadeIn .2s ease}.modal-content{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-8);max-width:480px;width:90%;animation:scaleIn .3s ease;box-shadow:var(--shadow-xl)}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-6)}.modal-header h3{font-size:var(--text-lg)}.divider{height:1px;background:var(--border);margin:var(--space-6) 0}.divider-sm{margin:var(--space-3) 0}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-5)}.section-header h2{font-size:var(--text-xl);font-weight:var(--weight-semibold)}.section-header h3{font-size:var(--text-lg);font-weight:var(--weight-semibold)}.section-head,.workspace-head{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm)}.section-head.compact{padding:var(--space-5)}.section-head .eyebrow,.workspace-head .eyebrow{display:inline-flex;align-items:center;width:fit-content;margin-bottom:var(--space-2)}.section-head h1,.workspace-head h1{font-size:var(--text-3xl);font-weight:var(--weight-bold);margin-bottom:var(--space-2)}.section-head p,.workspace-head p{color:var(--text-secondary);font-size:var(--text-base);margin:0}.page-title{margin-bottom:var(--space-8);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm)}.page-title h1{font-size:var(--text-3xl);font-weight:var(--weight-bold);margin-bottom:var(--space-2)}.page-title p{color:var(--text-secondary);font-size:var(--text-base)}.breadcrumb{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-muted);margin-bottom:var(--space-5)}.breadcrumb a{color:var(--text-muted)}.breadcrumb a:hover{color:var(--text)}.breadcrumb .sep{font-size:var(--text-xs)}.breadcrumb .current{color:var(--text);font-weight:var(--weight-medium)}.audio-player{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}.audio-player .play-btn{width:40px;height:40px;border-radius:var(--radius-full);background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all var(--transition-fast);border:none}.audio-player .play-btn:hover{background:var(--primary-hover);transform:scale(1.05)}.audio-player .audio-track{flex:1;height:4px;background:var(--surface-3);border-radius:var(--radius-full);overflow:hidden;cursor:pointer}.audio-player .audio-progress{height:100%;background:var(--gradient-primary);border-radius:var(--radius-full);transition:width .1s linear}.audio-player .audio-time{font-size:var(--text-xs);color:var(--text-muted);font-variant-numeric:tabular-nums;min-width:40px;text-align:right}.choice-list{display:flex;flex-direction:column;gap:var(--space-2)}.choice-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.choice-item:hover{border-color:var(--border-hover);background:var(--surface-2)}.choice-item.selected{border-color:var(--primary-border);background:var(--primary-light)}.choice-item.correct{border-color:var(--success-border);background:var(--success-light)}.choice-item.wrong{border-color:var(--danger-border);background:var(--danger-light)}.choice-item .choice-label{width:28px;height:28px;border-radius:var(--radius-full);background:var(--surface-3);display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:var(--weight-semibold);flex-shrink:0;transition:all var(--transition-fast)}.choice-item.selected .choice-label{background:var(--primary);color:#fff}.choice-item.correct .choice-label{background:var(--success);color:#fff}.choice-item.wrong .choice-label{background:var(--danger);color:#fff}.choice-item .choice-text{font-size:var(--text-sm);flex:1}.tag{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-medium);background:var(--surface-2);color:var(--text-secondary);border:1px solid var(--border)}.figma-page{animation:fadeInUp .4s ease both;max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-8);padding-bottom:var(--space-12)}.figma-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm)}.figma-page-head>div:first-child,.figma-page-head-text{min-width:0;flex:1 1 420px}.figma-page-head-action,.figma-page-head-meta,.figma-page-head>div:last-child:not(:first-child){display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);flex-wrap:wrap}.figma-page-head h1{font-size:var(--text-3xl);font-weight:var(--weight-bold);color:var(--text);margin-bottom:var(--space-2)}.figma-page-head p{font-size:var(--text-base);color:var(--text-secondary);margin:0}.figma-blue-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);background:var(--primary);color:#fff!important;font-weight:var(--weight-semibold);font-size:var(--text-sm);line-height:1;text-decoration:none;border:1px solid var(--primary);box-shadow:var(--shadow-xs);transition:all var(--transition-fast);cursor:pointer}.figma-blue-btn:hover{background:var(--primary-hover);border-color:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.figma-blue-btn.small{padding:var(--space-1-5) var(--space-3);font-size:var(--text-xs);border-radius:var(--radius-sm)}.figma-blue-btn.muted-btn{background:var(--surface-2);color:var(--text)!important;border-color:var(--border)}.figma-blue-btn.muted-btn:hover{background:var(--surface-3);border-color:var(--border-hover)}.figma-outline-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);background:var(--surface);color:var(--text-secondary);border:1px solid var(--border);font-size:var(--text-sm);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.figma-outline-btn:hover{background:var(--surface-2);border-color:var(--border-hover);color:var(--text)}.figma-outline-btn.danger{color:var(--danger-text);border-color:var(--danger-border);background:var(--danger-light)}.figma-outline-btn.danger:hover{color:#fff;background:var(--danger);border-color:var(--danger)}.figma-import-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm)}.figma-import-box h3{font-size:var(--text-lg);font-weight:var(--weight-semibold)}.figma-import-box p{color:var(--text-secondary)}.figma-import-box textarea{width:100%!important;box-sizing:border-box;padding:var(--space-3) var(--space-4)!important;border:1px solid var(--border)!important;border-radius:var(--radius-md)!important;background:var(--surface-2);color:var(--text);font-family:var(--font-mono)!important;font-size:var(--text-sm)!important;line-height:var(--leading-normal);resize:vertical}.figma-import-box textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 3px var(--primary-light)}.figma-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4)}.figma-stat-grid article{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);display:flex;align-items:center;gap:var(--space-4);box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.figma-stat-grid article:hover{border-color:var(--primary-border);transform:translateY(-2px);box-shadow:var(--shadow-md)}.figma-stat-grid article strong{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text);line-height:1.2}.figma-stat-grid article small{font-size:var(--text-xs);color:var(--text-secondary);margin-top:2px}.figma-stat-icon{width:44px;height:44px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:var(--text-lg);font-weight:var(--weight-bold);flex-shrink:0}.figma-stat-icon.blue{background:#e0f2fe;color:#0284c7}.figma-stat-icon.teal{background:#ccfbf1;color:#0d9488}.figma-stat-icon.purple{background:#f3e8ff;color:#7c3aed}.figma-stat-icon.green{background:#dcfce7;color:#16a34a}.figma-stat-icon.amber{background:#fef3c7;color:#d97706}.figma-stat-icon.red{background:#fee2e2;color:#dc2626}.figma-stat-grid article div{display:flex;flex-direction:column}.figma-stat-grid article strong{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text)}.figma-stat-grid article small{font-size:var(--text-xs);color:var(--text-secondary)}.figma-tab-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-sm)}.figma-tabbar{display:flex;gap:var(--space-1);padding:0 var(--space-4);background:var(--surface-2);border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none}.figma-tabbar::-webkit-scrollbar{display:none}.figma-tabbar button,.figma-tabbar a{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-4);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-muted);background:transparent;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;text-decoration:none}.figma-tabbar button:hover,.figma-tabbar a:hover{color:var(--text);background:transparent}.figma-tabbar button.active,.figma-tabbar a.active{background:transparent;color:var(--primary-text);font-weight:var(--weight-semibold);border-bottom-color:var(--primary)}.figma-tab-body{padding:var(--space-6)}.figma-test-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-5)}.figma-test-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-4);transition:all var(--transition-fast);box-shadow:var(--shadow-xs)}.figma-test-card:hover{border-color:var(--primary-border);transform:translateY(-2px);box-shadow:var(--shadow-md)}.figma-test-card:hover .figma-test-head h2{color:var(--primary-text)}.figma-test-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2)}.figma-test-meta .progress{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--primary);background:var(--primary-light);padding:2px 8px;border-radius:var(--radius-sm)}.figma-test-meta small{font-size:var(--text-xs);color:var(--text-muted)}.figma-test-head h2{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text);margin-bottom:var(--space-2)}.figma-test-head p{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed);margin:0}.figma-card-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border-light);padding-top:var(--space-3);font-size:var(--text-xs);color:var(--text-muted)}.figma-progress-list{display:flex;flex-direction:column;gap:var(--space-3)}.figma-progress-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-4);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);text-decoration:none;color:var(--text);transition:all var(--transition-fast)}.figma-progress-row:hover{background:var(--surface-3);border-color:var(--primary-border)}.figma-quick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-4)}.figma-quick-card{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);text-decoration:none;color:var(--text);font-weight:var(--weight-medium);box-shadow:var(--shadow-xs);transition:all var(--transition-fast)}.figma-quick-card:hover{border-color:var(--primary-border);transform:translateY(-2px);box-shadow:var(--shadow-md);background:var(--surface)}.figma-quick-card div{display:flex;flex-direction:column;gap:2px}.figma-quick-card div strong{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text)}.figma-quick-card div small{font-size:var(--text-xs);color:var(--text-muted)}.figma-action-icon{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;transition:transform var(--transition-fast)}.figma-quick-card:hover .figma-action-icon{transform:scale(1.1)}.figma-action-icon.blue{background:var(--secondary-light);color:var(--secondary)}.figma-action-icon.teal{background:#ccfbf1;color:#0d9488}.figma-action-icon.amber{background:var(--warning-light);color:var(--warning)}.figma-action-icon.purple{background:var(--purple-light);color:var(--purple)}.figma-action-icon.red{background:var(--danger-light);color:var(--danger)}.figma-action-icon.green{background:var(--success-light);color:var(--success)}.figma-progress-track{width:100%;height:8px;background:var(--surface-3);border-radius:var(--radius-full);overflow:hidden;margin-top:var(--space-2)}.figma-progress-fill{height:100%;background:var(--primary);border-radius:var(--radius-full);transition:width .5s ease}.figma-option-list{display:flex;flex-direction:column;gap:var(--space-3);margin:var(--space-4) 0}.figma-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);color:var(--text);text-align:left;width:100%}.figma-option:hover:not(:disabled){border-color:var(--primary-border);background:var(--surface-2)}.figma-option.--selected{border-color:var(--primary);background:var(--primary-light);font-weight:var(--weight-semibold)}.figma-option.--correct{border-color:var(--success);background:var(--success-light);color:var(--success);font-weight:var(--weight-bold)}.figma-option.--wrong{border-color:var(--danger);background:var(--danger-light);color:var(--danger)}.study-center-container{max-width:760px;margin:0 auto;width:100%;animation:fadeInUp .3s ease}.quizlet-card-scene{width:100%;height:380px;perspective:1200px;cursor:pointer;-webkit-user-select:none;user-select:none}@media(max-width:640px){.quizlet-card-scene{height:340px}}.quizlet-card-inner{width:100%;height:100%;position:relative;transition:transform .6s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;box-shadow:var(--shadow-md);border-radius:var(--radius-2xl)}.quizlet-card-inner.is-flipped{transform:rotateY(180deg)}.quizlet-card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:var(--radius-2xl);background:var(--surface);border:2px solid var(--border);padding:var(--space-8);display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center}.quizlet-card-front{background:#fff}.quizlet-card-front:hover{border-color:var(--primary);box-shadow:var(--shadow-lg)}.quizlet-card-back{background:#fdfefc;transform:rotateY(180deg);border-color:#059669}.quizlet-source-tag{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--primary);background:var(--primary-light);padding:6px 14px;border-radius:var(--radius-full)}.quizlet-main-text{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center}.quizlet-main-text h2{font-size:var(--text-3xl);font-weight:var(--weight-bold);color:var(--text);line-height:var(--leading-tight)}.quizlet-hint{font-size:var(--text-xs);color:var(--text-muted);font-style:italic}.quizlet-details{background:var(--surface-2);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--text);text-align:left;width:100%;max-width:520px}.quizlet-nav-bar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap}.phrase-tooltip{position:relative;display:inline;cursor:pointer;color:inherit;font-weight:700;padding:2px 6px;margin:0 1px;border-radius:8px;background:linear-gradient(transparent 55%,#ffe1aa 55%);transition:background .15s ease,transform .15s ease}.phrase-tooltip:hover{background:#ffe1aa}.phrase-popover{position:fixed;left:0;top:0;transform:translate(-50%,calc(-100% - 14px)) scale(.95);transform-origin:bottom center;width:min(310px,88vw);background:#0f172af5;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#f8fafc;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.15);box-shadow:0 20px 25px -5px #0000004d,0 8px 10px -6px #0003;display:flex;flex-direction:column;gap:8px;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s cubic-bezier(.34,1.56,.64,1);z-index:9999;pointer-events:none;text-align:left;line-height:1.4}.phrase-popover:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:rgba(15,23,42,.96) transparent transparent transparent}.phrase-tooltip:hover .phrase-popover,.phrase-tooltip:focus-within .phrase-popover{opacity:1;visibility:visible;transform:translate(-50%,calc(-100% - 8px)) scale(1);pointer-events:auto}.phrase-popover strong{font-size:15px;font-weight:800;color:#34d399;letter-spacing:.3px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:6px}.phrase-popover span{color:#f1f5f9;font-weight:600;font-size:14px}.phrase-popover small{color:#94a3b8;font-size:12px;font-style:italic;line-height:1.45}.phrase-popover .phrase-pop-role{color:#a78bfa;font-style:normal;font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase}.phrase-popover .phrase-pop-pattern{color:#cbd5e1;font-style:normal}.phrase-popover .phrase-pop-pattern b{color:#34d399}.phrase-popover .phrase-pop-example{color:#e2e8f0;font-style:normal;background:#60a5fa14;border-left:2px solid rgba(96,165,250,.5);padding:6px 8px;border-radius:4px;display:block}.phrase-popover .phrase-pop-example b{color:#60a5fa}.phrase-popover .phrase-pop-example i{font-style:italic}.phrase-popover .phrase-pop-example-vi{display:block;margin-top:3px;color:#94a3b8;font-size:11px}.phrase-popover .phrase-pop-note{color:#fde68a;font-style:normal;background:#fbbf2414;border-left:2px solid rgba(251,191,36,.5);padding:6px 8px;border-radius:4px}.phrase-panel{margin-top:var(--space-4);background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4)}.phrase-panel-head{display:flex;align-items:center;gap:8px;margin-bottom:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px dashed var(--border);color:var(--primary-text);font-size:var(--text-sm);font-weight:800;letter-spacing:.02em}.phrase-panel-head svg{color:var(--primary)}.phrase-panel-head small{margin-left:auto;font-size:11px;font-weight:700;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-full);padding:2px 8px}.phrase-panel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-3)}.phrase-card{background:var(--surface-2);border:1px solid var(--border);border-left:3px solid var(--primary);border-radius:var(--radius-md);padding:10px 12px;display:flex;flex-direction:column;gap:6px;transition:border-color .15s,box-shadow .15s}.phrase-card:hover{border-color:var(--primary-border);box-shadow:var(--shadow-xs)}.phrase-card-head{display:flex;align-items:center;gap:6px}.phrase-card-head strong{flex:1;font-size:var(--text-sm);font-weight:800;color:var(--primary-text);line-height:1.3}.phrase-card-vi{font-size:var(--text-xs);color:var(--text);font-weight:600;line-height:1.4}.phrase-card-meta{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:11px;color:var(--text-secondary)}.phrase-card-tag{display:inline-block;padding:1px 7px;background:var(--surface-3);border-radius:var(--radius-full);font-weight:700;font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}.phrase-card-pattern{font-family:var(--font-mono);font-size:11px}.phrase-card-pattern b{color:var(--primary);font-weight:700;margin-right:4px}.phrase-card-example{font-size:11.5px;color:var(--text);background:var(--surface);border-left:2px solid #60a5fa;border-radius:var(--radius-sm);padding:5px 8px;line-height:1.5}.phrase-card-example b{color:#2563eb;margin-right:4px}.phrase-card-example i{font-style:italic;color:var(--text)}.phrase-card-example-vi{margin-top:3px;color:var(--text-secondary);font-size:11px;font-style:italic}.phrase-card-note{font-size:11px;color:#b45309;background:#fef3c7;border-radius:var(--radius-sm);padding:5px 8px;line-height:1.45}.key-pop{position:absolute;color:#0d9488;font-family:var(--font-mono, monospace);font-size:26px;font-weight:900;pointer-events:none;z-index:100;animation:keyPopFly .6s cubic-bezier(.2,.8,.2,1) forwards;text-shadow:0 4px 12px rgba(13,148,136,.3)}@keyframes keyPopFly{0%{opacity:1;transform:scale(.5) translateY(0) rotate(-12deg)}50%{opacity:.95;transform:scale(1.4) translateY(-32px) rotate(6deg)}to{opacity:0;transform:scale(1) translateY(-64px) rotate(18deg)}}.typing-glow{box-shadow:0 0 0 4px #0d948840,0 0 25px #0d948833!important;border-color:#0d9488!important}.dashboard{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-8)}.dashboard-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-8);position:relative;box-shadow:var(--shadow-sm);overflow:hidden}.dashboard-hero:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);border-radius:var(--radius-xl) var(--radius-xl) 0 0}.dashboard-hero h1{font-size:var(--text-3xl);font-weight:var(--weight-bold);margin-bottom:var(--space-2);color:var(--text)}.dashboard-hero .subtitle{color:var(--text-secondary);font-size:var(--text-base);margin-bottom:var(--space-4)}.streak-badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:#fef3c7;color:#b45309;border:1px solid #fde68a;border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--weight-semibold)}.dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}.action-card{display:flex;flex-direction:column;gap:var(--space-3);text-decoration:none;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.action-card:hover{border-color:var(--border-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.action-card .action-icon{width:48px;height:48px;border-radius:var(--radius-lg);background:var(--surface-2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:var(--shadow-xs);margin-bottom:var(--space-1)}.action-card .action-title{font-size:var(--text-lg);font-weight:var(--weight-semibold)}.action-card .action-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.skill-section{display:flex;flex-direction:column;gap:var(--space-4)}.skill-row{display:flex;align-items:center;gap:var(--space-4)}.skill-row .skill-name{width:100px;font-size:var(--text-sm);font-weight:var(--weight-medium)}.skill-row .progress-track{flex:1}.skill-row .skill-pct{width:48px;text-align:right;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--primary)}@media(max-width:1024px){.dashboard-grid,.stats-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.dashboard-grid,.stats-grid{grid-template-columns:1fr}}.toeic-hub{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-8)}.test-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}.test-card{display:flex;flex-direction:column;gap:var(--space-4)}.test-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4)}.test-card-header h3{font-size:var(--text-xl);font-weight:var(--weight-bold)}.test-card-parts{display:flex;flex-wrap:wrap;gap:var(--space-2)}.part-chip{padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--weight-medium);background:var(--surface-2);color:var(--text-secondary);border:1px solid var(--border);text-decoration:none;transition:all var(--transition-fast)}.part-chip:hover:not(.locked){background:var(--surface-3);color:var(--text);border-color:var(--border-hover)}.part-chip.completed{background:var(--success-light);color:var(--success-text);border-color:var(--success-border)}.part-chip.locked{opacity:.4;cursor:not-allowed}.test-progress{display:flex;flex-direction:column;gap:var(--space-2)}.test-progress .progress-info{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-muted)}.test-overview{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-8)}.part-section{display:flex;flex-direction:column;gap:var(--space-4)}.part-card{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding:var(--space-5) var(--space-6)}.part-card .part-left{display:flex;align-items:center;gap:var(--space-5)}.part-number{width:48px;height:48px;border-radius:var(--radius-lg);background:var(--surface-2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--primary-text);flex-shrink:0}.part-info{display:flex;flex-direction:column;gap:var(--space-1)}.part-info h4{font-size:var(--text-lg);font-weight:var(--weight-semibold)}.part-info p{font-size:var(--text-sm);color:var(--text-secondary)}.part-actions{display:flex;gap:var(--space-3);flex-shrink:0}@media(max-width:768px){.test-grid{grid-template-columns:1fr}.part-card{flex-direction:column;align-items:stretch;gap:var(--space-4);min-width:0}.part-card .part-left{align-items:flex-start;min-width:0}.part-info{min-width:0}.part-actions{width:100%;justify-content:stretch;flex-wrap:wrap;flex-shrink:1}.part-actions .btn{flex:1 1 180px;white-space:normal;line-height:1.25}}.toeic-exam-screen{height:100dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--text);overflow:hidden}.toeic-exam-header{position:sticky;top:0;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6);height:56px;background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border);z-index:var(--z-sticky)}.toeic-exam-header .exam-part-label{padding:var(--space-1) var(--space-3);background:var(--primary-light);color:var(--primary-text);border:1px solid var(--primary-border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold)}.toeic-exam-header .exam-question-counter{font-size:var(--text-sm);color:var(--text-secondary);font-weight:var(--weight-medium)}.toeic-exam-body{flex:1;min-height:0;display:grid;grid-template-columns:1.1fr .9fr;gap:20px;padding:var(--space-5) var(--space-6);align-items:stretch;max-width:1400px;margin:0 auto;width:100%;overflow:hidden}.toeic-exam-split{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);max-width:1200px;margin:0 auto}.toeic-question-image{border-radius:var(--radius-lg);overflow:hidden;background:var(--surface);border:1px solid var(--border);margin-bottom:var(--space-4);max-height:400px;display:flex;align-items:center;justify-content:center}.toeic-question-image img{max-height:400px;object-fit:contain}.toeic-audio-bar{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:var(--space-6)}.toeic-listening-panel{display:flex;flex-direction:column;gap:var(--space-4);height:100%;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.toeic-question-panel{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}.toeic-question-scroll{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-3);padding-right:var(--space-2);scrollbar-width:thin;scrollbar-color:var(--border) transparent}.toeic-question-text{font-size:var(--text-lg);font-weight:var(--weight-semibold);line-height:var(--leading-relaxed);margin-bottom:var(--space-2)}.toeic-option-list,.figma-option-list{display:flex;flex-direction:column;gap:var(--space-3)}.toeic-option,.figma-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;font-size:var(--text-sm)}.toeic-option:hover:not(:disabled),.figma-option:hover:not(:disabled){border-color:var(--primary);background:var(--primary-light);transform:translate(4px);box-shadow:var(--shadow-sm)}.toeic-option.selected,.figma-option.selected,.figma-option.--selected{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.1)}.toeic-option.correct,.figma-option.correct,.figma-option.--correct{border-color:var(--success);background:var(--success-light);box-shadow:var(--shadow-sm)}.toeic-option.wrong,.figma-option.wrong,.figma-option.--wrong{border-color:var(--danger);background:var(--danger-light);box-shadow:var(--shadow-sm)}.toeic-option:disabled,.figma-option:disabled{cursor:not-allowed}.option-label,.figma-option-letter{width:36px;height:36px;border-radius:var(--radius-full);background:var(--surface-3);display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:var(--weight-bold);flex-shrink:0;transition:all var(--transition-fast)}.figma-option>span:last-child{display:flex;flex-direction:column;gap:2px;flex:1}.figma-option strong{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text)}.figma-option small{font-size:var(--text-xs);color:var(--text-secondary);font-weight:var(--weight-normal)}.selected .option-label,.selected .figma-option-letter,.--selected .option-label,.--selected .figma-option-letter{background:var(--primary);color:#fff;font-weight:var(--weight-bold)}.correct .option-label,.correct .figma-option-letter,.--correct .option-label,.--correct .figma-option-letter{background:var(--success);color:#fff;font-weight:var(--weight-bold)}.wrong .option-label,.wrong .figma-option-letter,.--wrong .option-label,.--wrong .figma-option-letter{background:var(--danger);color:#fff;font-weight:var(--weight-bold)}.toeic-question-nav{display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-6);margin-top:var(--space-6);border-top:1px solid var(--border)}.toeic-exam-submit{padding:var(--space-8);text-align:center}.toeic-explanation{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--success);border-radius:var(--radius-md);padding:var(--space-5);margin-top:var(--space-4);animation:fadeInUp .3s ease}.toeic-explanation.wrong-explanation{border-left-color:var(--danger)}.toeic-transcript{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4);margin-top:var(--space-4)}.transcript-turn{display:flex;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--border)}.transcript-turn:last-child{border-bottom:none}.speaker-label{padding:2px var(--space-2);border-radius:var(--radius-sm);background:var(--surface-3);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-semibold);height:fit-content}.transcript-word{display:inline;transition:background var(--transition-fast);padding:1px 2px}.transcript-word.active{background:var(--primary-light);color:var(--primary-text);border-radius:var(--radius-xs)}.toeic-passage{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);font-size:var(--text-base);line-height:var(--leading-relaxed)}.passage-blank{display:inline-block;min-width:60px;padding:0 var(--space-2);border-bottom:2px dashed var(--border-hover);text-align:center;color:var(--text-secondary)}.passage-blank.filled{border-bottom-color:var(--primary);color:var(--primary-text);font-weight:var(--weight-semibold)}.part7-screen .toeic-exam-body{display:flex;flex-direction:column;gap:var(--space-4);max-width:none;width:100%;padding:var(--space-5) clamp(20px,4vw,64px)}.part7-layout{display:grid;grid-template-columns:minmax(560px,1.12fr) minmax(460px,.88fr);gap:var(--space-5);max-width:1680px;width:100%;margin:0 auto;min-height:0;flex:1}.part7-passage-panel,.part7-question-panel{min-height:0;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}.part7-passage-panel{display:flex;flex-direction:column}.part7-passage-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);padding:var(--space-5);border-bottom:1px solid var(--border);background:linear-gradient(180deg,#fffffff2,#f8fafce0)}.part7-passage-toolbar h2{margin:var(--space-1) 0 0;font-size:var(--text-xl);color:var(--text)}.part7-document{flex:1;min-height:0;overflow:auto;padding:clamp(24px,3vw,44px);background:linear-gradient(180deg,#fffffffa,#ffffffeb),var(--surface);background-size:24px 24px}.part7-doc-url{display:inline-flex;width:fit-content;max-width:100%;margin-bottom:var(--space-4);padding:7px 12px;border-radius:999px;background:#eef6ff;color:#1d4ed8;font-size:var(--text-sm);font-weight:800;overflow-wrap:anywhere}.part7-doc-url.muted{background:#0f172a0f;color:var(--text-secondary)}.part7-document h3{margin:0 0 var(--space-5);color:var(--text);font-size:clamp(22px,2vw,30px);line-height:1.25;letter-spacing:0}.part7-doc-body{display:flex;flex-direction:column;gap:var(--space-4)}.part7-doc-body p,.part7-translation-box p{margin:0;font-family:var(--font-sans);font-size:clamp(16px,1.05vw,18px);line-height:1.78;color:var(--text)}.part7-translation-box{margin-top:var(--space-6);padding:var(--space-5);border-radius:var(--radius-lg);border:1px solid var(--primary-border);background:linear-gradient(180deg,#ecfdf5b8,#ffffffe6)}.part7-translation-box>span{display:block;margin-bottom:var(--space-3);color:var(--primary-text);font-size:var(--text-xs);font-weight:900;text-transform:uppercase}.part7-translation-box h4{margin:0 0 var(--space-3);color:var(--text);font-size:var(--text-lg)}.part7-question-panel{display:flex;flex-direction:column}.part7-score-strip{display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--border);background:var(--surface-2)}.part7-question-list{flex:1;min-height:0;overflow:auto;padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-4)}.part7-question-card{border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);background:var(--surface);box-shadow:var(--shadow-xs)}.part7-question-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-3);font-size:var(--text-xs);font-weight:800;color:var(--text-muted);text-transform:uppercase}.part7-question-card h3{margin:0 0 var(--space-3);font-size:var(--text-lg);line-height:1.45;color:var(--text)}.part7-question-card .toeic-option{align-items:flex-start}.part7-option-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;text-align:left}.part7-option-copy strong{display:block;color:var(--text);font-size:var(--text-base);line-height:1.45}.part7-option-copy small{display:block;color:var(--text-secondary);font-size:var(--text-sm);line-height:1.5;font-weight:500}.part7-question-vi{margin:-4px 0 var(--space-3);color:var(--text-secondary);font-size:var(--text-sm);line-height:1.55}.part7-result-ok{color:var(--success)}.part7-result-bad{color:var(--danger)}.part7-phrase-bank{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--space-3)}.part7-phrase-bank span{border:1px solid var(--border);border-radius:999px;padding:6px 10px;background:#ffffffa6;color:var(--text-secondary);font-size:var(--text-xs)}.part7-nav{max-width:1680px;width:100%;margin:0 auto;padding:var(--space-3) 0 0;flex-shrink:0}.part7-mini-map{display:flex;gap:5px;max-width:min(70vw,980px);overflow-x:auto;padding:2px}.part7-mini-map button{width:30px;height:30px;flex:0 0 auto;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);font-size:var(--text-xs);font-weight:800;cursor:pointer}.part7-mini-map button.active{background:var(--primary);border-color:var(--primary);color:#fff}.part7-submit-summary{max-width:1480px;margin:var(--space-3) auto 0;padding:var(--space-3) var(--space-4);border:1px solid var(--success);border-radius:var(--radius-lg);background:var(--success-light);color:var(--success-text);text-align:center}.p7-body{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.p7-passage-col{display:flex;flex-direction:column;min-height:0;overflow:hidden;margin:var(--space-1) 0;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-xs)}.p7-passage-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:var(--surface);flex-shrink:0}.p7-passage-title{margin:var(--space-1) 0 0;font-size:var(--text-xl);color:var(--text)}.p7-passage-actions{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}.p7-restart-btn{padding:4px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-secondary);font-size:var(--text-xs);cursor:pointer}.p7-restart-btn:hover{background:var(--surface-2)}.p7-done-count{font-size:var(--text-xs);font-weight:700;color:var(--text-muted)}.p7-document{flex:1;min-height:0;overflow-y:auto;padding:clamp(20px,2.5vw,40px)}.p7-doc-url{display:inline-flex;width:fit-content;max-width:100%;margin-bottom:var(--space-4);padding:6px 12px;border-radius:999px;background:#eef6ff;color:#1d4ed8;font-size:var(--text-sm);font-weight:800;overflow-wrap:anywhere}.p7-doc-heading{margin:0 0 var(--space-5);padding-bottom:var(--space-3);border-bottom:2px solid var(--border);font-size:clamp(18px,1.8vw,26px);font-weight:800;letter-spacing:.01em;line-height:1.3;color:var(--text)}.p7-graphic{margin:0 0 var(--space-5);padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-2)}.p7-graphic img{display:block;width:100%;max-height:min(520px,58vh);object-fit:contain;border-radius:var(--radius-sm)}.p7-doc-body{display:flex;flex-direction:column;gap:var(--space-3)}.p7-doc-body p{margin:0;font-size:clamp(15px,1vw,17px);line-height:1.78;color:var(--text)}.p6-body{grid-template-columns:1.1fr .9fr}.p6-left{display:flex;flex-direction:column;gap:0;padding:var(--space-4);overflow:hidden}.p6-doc-card{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-4);box-shadow:var(--shadow-xs);overflow:hidden}.p6-doc-toolbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.p6-skin-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:var(--primary-light);color:var(--primary-text);font-size:var(--text-xs);font-weight:var(--weight-bold)}.p6-listen-wrap .btn,.p6-listen-wrap .btn.subtle{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:var(--text-xs);font-weight:var(--weight-semibold)}.p6-paper{flex:1;min-height:0;overflow-y:auto;border-radius:var(--radius-lg);padding:clamp(24px,3vw,44px);scrollbar-width:thin;scrollbar-color:var(--border) transparent}.p6-blank{display:inline-flex;align-items:center;justify-content:center;min-width:78px;min-height:26px;padding:1px 10px;margin:0 3px;border-radius:999px;background:linear-gradient(135deg,var(--primary),var(--primary-hover));color:#fff;font-family:var(--font-sans);font-size:13px;font-weight:var(--weight-bold);border:none;cursor:pointer;box-shadow:0 2px 6px #0596694d,inset 0 1px #fff3;transition:transform .14s ease,box-shadow .14s ease;vertical-align:baseline}.p6-blank:hover{transform:translateY(-1px);box-shadow:0 4px 12px #05966966}.p6-blank.is-filled{animation:p5BlankFill .35s ease both}.p6-blank span{opacity:.85;font-style:italic;font-family:Georgia,serif}.p6-skin-notice .p6-paper{background:#fdfaf3;border:1px solid #d9c99a;border-top:5px solid #7a5f2b;color:#2a2415;font-family:Georgia,Times New Roman,serif}.p6-notice-heading{text-align:center;font-size:clamp(22px,2.4vw,32px);font-weight:900;letter-spacing:.12em;padding-bottom:var(--space-3);border-bottom:2px double #7a5f2b;margin-bottom:var(--space-5)}.p6-notice-body{font-size:clamp(15px,1.05vw,17px);line-height:2;white-space:pre-wrap}.p6-notice-signature{margin-top:var(--space-6);text-align:right;font-style:italic;color:#7a5f2b;font-size:var(--text-sm);font-weight:700}.p6-skin-email .p6-paper{background:#fff;border:1px solid #dbe3ee;padding:0;font-family:-apple-system,Segoe UI,Roboto,sans-serif;color:#1e293b}.p6-email-headers{background:linear-gradient(180deg,#f4f7fb,#eef2f7);border-bottom:1px solid #dbe3ee;padding:14px 20px;display:grid;gap:6px}.p6-email-row{display:grid;grid-template-columns:68px 1fr;gap:12px;font-size:13px}.p6-email-label{color:#64748b;font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.05em;padding-top:2px}.p6-email-value{color:#1e293b;font-weight:500;overflow-wrap:anywhere}.p6-email-body{padding:clamp(20px,2vw,32px);font-size:clamp(14px,1vw,16px);line-height:1.85;white-space:pre-wrap}.p6-skin-letter .p6-paper{background:linear-gradient(180deg,#fdfbf3,#fbf6e8);border:1px solid #eadfc4;background-image:linear-gradient(180deg,#fdfbf3,#fbf6e8),repeating-linear-gradient(to bottom,transparent 0px,transparent 33px,rgba(120,90,30,.08) 33px,rgba(120,90,30,.08) 34px);background-blend-mode:multiply;position:relative;font-family:Georgia,Times New Roman,serif;color:#2d2416}.p6-skin-letter .p6-paper:before{content:"";position:absolute;top:0;bottom:0;left:clamp(40px,5vw,60px);width:1px;background:#c83c3c2e}.p6-letter-greeting{font-size:clamp(16px,1.15vw,19px);font-weight:600;margin-bottom:var(--space-4)}.p6-letter-body{font-size:clamp(15px,1.05vw,17px);line-height:2;white-space:pre-wrap}.p6-letter-closing{margin-top:var(--space-6);font-style:italic;font-size:clamp(15px,1.05vw,17px)}.p6-letter-signature{margin-top:6px;font-family:Brush Script MT,Segoe Script,cursive;font-size:clamp(20px,1.6vw,24px);color:#4a3a12;white-space:pre-wrap}.p6-skin-review .p6-paper{background:#fefefe;border:1px solid #e6e6e6;font-family:Georgia,Times New Roman,serif;color:#1f2937;background-image:linear-gradient(90deg,rgba(0,0,0,.02) 1px,transparent 1px),linear-gradient(180deg,#fff,#f9fafb);background-size:100% 100%}.p6-review-body{font-size:clamp(15px,1.05vw,17px);line-height:1.95;column-count:1;white-space:pre-wrap}.p6-review-body:first-letter{font-size:3em;float:left;line-height:.85;padding:4px 8px 0 0;font-weight:800;color:var(--primary);font-family:Georgia,serif}.p6-review-byline{margin-top:var(--space-5);padding-top:var(--space-3);border-top:1px solid #e6e6e6;text-align:right;font-style:italic;font-weight:600;color:var(--text-secondary);font-size:var(--text-sm)}.p6-passage-vi{flex-shrink:0;max-height:38%;overflow-y:auto;margin-top:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface-2);border:1px solid var(--border);scrollbar-width:thin;scrollbar-color:var(--border) transparent}.p6-passage-vi p{margin:0;font-size:var(--text-sm);line-height:1.7;color:var(--text);white-space:pre-wrap}.p6-right{display:flex;flex-direction:column;overflow:hidden;padding:0}.p6-right-head{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);background:var(--surface)}.p6-right-head-info{display:flex;flex-direction:column;gap:2px}.p6-right-head-info strong{font-size:var(--text-base);color:var(--text)}.p6-questions-scroll{flex:1;min-height:0;overflow-y:auto;padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3);scrollbar-width:thin;scrollbar-color:var(--border) transparent}.p6-q-tabs{flex-shrink:0;display:flex;gap:6px;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap}.p3-q-tab.is-right{border-color:var(--success);background:var(--success-light);color:var(--success-text)}.p3-q-tab.is-wrong{border-color:var(--danger);background:var(--danger-light);color:var(--danger-text)}.p6-question-scroll{flex:1;min-height:0;overflow-y:auto;padding:var(--space-4) var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);scrollbar-width:thin;scrollbar-color:var(--border) transparent;animation:fadeInUp .2s ease both}.p6-question-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.p6-actions{flex-shrink:0;display:flex;gap:var(--space-3);align-items:center;justify-content:center;padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);background:var(--surface)}.p7-left{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);overflow:hidden}.p7-doc-card{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-4);box-shadow:var(--shadow-xs);overflow:hidden}.p7-doc-toolbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}.p7-doc-toolbar-info{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;min-width:0}.p7-doc-scroll{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-3);padding-right:4px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.p7-paper{border-radius:var(--radius-lg);padding:clamp(20px,2.5vw,36px)}.p7-skin-email{background:#fff;border:1px solid #dbe3ee;padding:0;font-family:-apple-system,Segoe UI,Roboto,sans-serif;color:#1e293b}.p7-skin-letter{background:linear-gradient(180deg,#fdfbf3,#fbf6e8);border:1px solid #eadfc4;background-image:linear-gradient(180deg,#fdfbf3,#fbf6e8),repeating-linear-gradient(to bottom,transparent 0px,transparent 33px,rgba(120,90,30,.08) 33px,rgba(120,90,30,.08) 34px);background-blend-mode:multiply;position:relative;font-family:Georgia,Times New Roman,serif;color:#2d2416}.p7-skin-letter:before{content:"";position:absolute;top:0;bottom:0;left:clamp(40px,5vw,60px);width:1px;background:#c83c3c2e}.p7-skin-notice{background:#fdfaf3;border:1px solid #d9c99a;border-top:5px solid #7a5f2b;color:#2a2415;font-family:Georgia,Times New Roman,serif}.p7-skin-webpage{background:#fff;border:1px solid #e2e8f0;padding:0;overflow:hidden;font-family:-apple-system,Segoe UI,Roboto,sans-serif}.p7-url-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;background:linear-gradient(180deg,#f8fafc,#eef2f7);border-bottom:1px solid #e2e8f0;color:#334155;font-size:12px}.p7-url-text{font-family:SF Mono,Menlo,Consolas,monospace;color:#0369a1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.p7-webpage-heading{margin:0;padding:clamp(18px,2vw,28px) clamp(20px,2.2vw,32px) 4px;font-size:clamp(20px,1.8vw,26px);font-weight:800;color:#0f172a;line-height:1.3}.p7-webpage-body{padding:clamp(12px,1.5vw,20px) clamp(20px,2.2vw,32px) clamp(20px,2.2vw,32px);font-size:clamp(14px,1vw,16px);line-height:1.75;color:#1e293b;white-space:pre-wrap}.p7-skin-article{background:#fefefe;border:1px solid #e6e6e6;font-family:Georgia,Times New Roman,serif;color:#1f2937}.p7-article-heading{margin:0 0 var(--space-4);padding-bottom:var(--space-3);border-bottom:2px solid #1f2937;font-size:clamp(22px,2vw,28px);font-weight:800;line-height:1.25;color:#0f172a}.p7-article-body{font-size:clamp(15px,1.05vw,17px);line-height:1.95;white-space:pre-wrap}.p7-article-body:first-letter{font-size:3em;float:left;line-height:.85;padding:4px 8px 0 0;font-weight:800;color:var(--primary);font-family:Georgia,serif}.p7-passage-vi{flex-shrink:0;margin-top:var(--space-2);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface-2);border:1px solid var(--border)}.p7-passage-vi p{margin:0 0 8px;font-size:var(--text-sm);line-height:1.7;color:var(--text);white-space:pre-wrap}.p7-passage-vi p:last-child{margin-bottom:0}.p7-right{display:flex;flex-direction:column;overflow:hidden}.p7-translation-box{margin-top:var(--space-6);padding:var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--primary-border);background:linear-gradient(180deg,#ecfdf5b8,#ffffffe6)}.p7-translation-label{display:block;margin-bottom:var(--space-3);color:var(--primary-text);font-size:var(--text-xs);font-weight:900;text-transform:uppercase;letter-spacing:.05em}.p7-translation-box .p7-doc-body p,.p7-translation-box>p{margin:0;color:var(--text-secondary);font-size:var(--text-sm);line-height:1.7}.p7-nav{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);border-radius:0 0 var(--radius-lg) var(--radius-lg);flex-shrink:0;background:var(--surface-2)}.p7-nav-btn{padding:7px 14px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:var(--text-sm);font-weight:600;cursor:pointer;flex-shrink:0}.p7-nav-btn:hover:not(:disabled){background:var(--surface-2)}.p7-nav-btn:disabled{opacity:.35;cursor:default}.p7-mini-map{display:flex;gap:5px;flex:1;overflow-x:auto;padding:2px}.p7-mini-btn{width:28px;height:28px;flex:0 0 auto;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);font-size:var(--text-xs);font-weight:800;cursor:pointer}.p7-mini-btn.is-active{background:var(--primary);border-color:var(--primary);color:#fff}.p7-mini-btn.is-done{background:var(--success-light);border-color:var(--success);color:var(--success-text)}.p7-question-col{display:flex;flex-direction:column;min-height:0;overflow:hidden}.p7-question-list{flex:1;min-height:0;overflow-y:auto;padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-4)}.p7-check-row{flex-shrink:0;display:flex;justify-content:center;padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);background:var(--surface)}.p7-check-row .figma-primary-btn{width:min(100%,320px);justify-content:center}.p7-question-card{border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4);background:var(--surface)}.p7-question-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-3);font-size:var(--text-xs);font-weight:800;color:var(--text-muted);text-transform:uppercase}.p7-result-ok{color:var(--success)}.p7-result-bad{color:var(--danger)}.p7-question-text{margin:0 0 var(--space-3);font-size:var(--text-base);font-weight:600;line-height:1.5;color:var(--text)}.p7-question-vi{margin:-8px 0 var(--space-3);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.5}.p7-option-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;text-align:left}.p7-option-copy strong{display:block;font-size:var(--text-sm);line-height:1.45}.p7-option-copy small{display:block;font-size:var(--text-xs);color:var(--text-secondary);line-height:1.4}.p5-sentence-card{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-4) var(--space-4) var(--space-4);box-shadow:var(--shadow-xs);overflow:hidden}.p5-reveal-fixed{flex-shrink:0}.p5-reveal-shell{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}.p5-reveal-scroll{flex:1;min-height:0;overflow-y:auto;padding-right:6px;padding-bottom:32px;scrollbar-width:thin;scrollbar-color:var(--border) transparent;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 calc(100% - 24px),transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 calc(100% - 24px),transparent 100%)}.p5-scroll-hint{position:absolute;left:50%;bottom:4px;transform:translate(-50%);display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;background:var(--primary);color:#fff;font-size:11px;font-weight:700;box-shadow:0 4px 14px #05966959;pointer-events:none;animation:p5HintBob 1.6s ease-in-out infinite;z-index:3}.p5-scroll-hint svg{animation:p5HintArrow 1.6s ease-in-out infinite}@keyframes p5HintBob{0%,to{transform:translate(-50%);opacity:1}50%{transform:translate(-50%,-4px);opacity:.85}}@keyframes p5HintArrow{0%,to{transform:translateY(0)}50%{transform:translateY(2px)}}.p5-speak-mini{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;border-radius:999px;border:1px solid var(--primary-border);background:var(--primary-light);color:var(--primary-text);cursor:pointer;flex-shrink:0;transition:all .16s ease;margin-left:auto}.p5-speak-mini:hover{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 0 0 4px #0596692e;transform:scale(1.08)}.p5-speak-mini:active{transform:scale(.94)}.p5-sentence-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);flex-shrink:0;flex-wrap:wrap}.p5-tag-cluster{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.p5-grammar-chip{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);color:var(--text-secondary);font-size:11px;font-weight:var(--weight-semibold);letter-spacing:.02em}.p5-tag-toggle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text-muted);cursor:pointer;transition:all .15s ease}.p5-tag-toggle:hover{border-color:var(--border-hover);color:var(--text)}.p5-tag-toggle.is-on{border-color:var(--primary-border);background:var(--primary-light);color:var(--primary-text)}.p5-sentence-tag{display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 10px;border-radius:999px;background:var(--primary-light);color:var(--primary-text);font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:.03em}.p5-tag-dot{width:6px;height:6px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 3px #05966926}.p5-listen-wrap .btn,.p5-listen-wrap .btn.subtle{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:var(--text-xs);font-weight:var(--weight-semibold)}.p5-paper{flex-shrink:0;min-height:200px;display:flex;align-items:center;justify-content:center;padding:clamp(28px,4vw,56px) clamp(24px,3vw,44px);background:linear-gradient(180deg,#fdfbf3,#fbf6e8);border:1px solid #eadfc4;border-radius:var(--radius-lg);box-shadow:inset 0 1px #fff9,0 1px 2px #00000008;background-image:linear-gradient(180deg,#fdfbf3,#fbf6e8),repeating-linear-gradient(to bottom,transparent 0px,transparent 39px,rgba(120,90,30,.08) 39px,rgba(120,90,30,.08) 40px);background-blend-mode:multiply;position:relative}.p5-paper:before{content:"";position:absolute;top:0;bottom:0;left:clamp(40px,5vw,68px);width:1px;background:#c83c3c2e}.p5-sentence-text{margin:0;max-width:640px;font-family:Georgia,Times New Roman,serif;font-size:clamp(20px,1.7vw,28px);font-weight:500;line-height:2;color:#2d2416;text-align:center;letter-spacing:.005em}.p5-blank{display:inline-flex;align-items:center;justify-content:center;min-width:100px;min-height:34px;padding:2px 14px;margin:0 4px;border-radius:999px;background:linear-gradient(135deg,var(--primary),var(--primary-hover));color:#fff;font-family:var(--font-sans);font-size:clamp(15px,1.1vw,18px);font-weight:var(--weight-bold);box-shadow:0 2px 8px #05966959,inset 0 1px #ffffff40;letter-spacing:.01em;transition:transform .2s ease,box-shadow .2s ease}.p5-blank.is-filled{animation:p5BlankFill .35s ease both}@keyframes p5BlankFill{0%{transform:scale(.85);box-shadow:0 0 #05966959}60%{transform:scale(1.05);box-shadow:0 0 0 6px #05966926}to{transform:scale(1);box-shadow:0 2px 8px #05966959}}.p5-blank-hint{opacity:.9;font-family:Georgia,serif;font-style:italic}.p5-reveal-panel{display:flex;flex-direction:column;gap:var(--space-3);flex-shrink:0;animation:fadeInUp .35s ease both}.p5-reveal-block{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface-2);border:1px solid var(--border)}.p5-reveal-label{display:block;margin-bottom:6px;font-size:var(--text-xs);font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--primary-text)}.p5-reveal-block p{margin:0;font-size:var(--text-sm);line-height:1.65;color:var(--text)}.p5-phrase-list{display:flex;flex-direction:column;gap:6px}.p5-phrase-item{display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.p5-phrase-item:hover{border-color:var(--primary-border);box-shadow:0 1px 6px #05966914}.p5-phrase-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.p5-phrase-head strong{font-size:var(--text-sm);color:var(--text)}.p5-phrase-role{display:inline-flex;align-items:center;padding:1px 8px;border-radius:999px;background:var(--primary-light);color:var(--primary-text);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}.p5-phrase-vi{font-size:var(--text-xs);color:var(--text-secondary)}.p5-phrase-pattern{display:inline-block;align-self:flex-start;padding:3px 10px;background:#f5f7fa;border:1px dashed var(--border-hover);border-radius:var(--radius-sm);font-family:SF Mono,Menlo,Consolas,monospace;font-size:12px;color:var(--primary-hover);font-weight:600}.p5-phrase-note{display:inline-flex;align-items:flex-start;gap:4px;color:var(--text-muted);font-size:11px;line-height:1.4;font-style:italic}.p5-phrase-note svg{flex-shrink:0;margin-top:2px}.p5-vocab-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}.p5-vocab-item{display:flex;flex-direction:column;gap:2px;padding:8px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm)}.p5-vocab-head{display:flex;align-items:baseline;gap:6px}.p5-vocab-head strong{font-size:var(--text-sm);color:var(--text)}.p5-vocab-pos{font-size:10px;font-weight:700;color:var(--primary);background:var(--primary-light);padding:1px 6px;border-radius:999px;font-style:normal;text-transform:lowercase}.p5-vocab-item>span{font-size:var(--text-xs);color:var(--text-secondary);line-height:1.4}.exam-result-body{flex:1;min-height:0;overflow-y:auto;padding:var(--space-6) var(--space-5) var(--space-12)}.exam-result-body .exam-review-panel{max-width:1100px;margin:0 auto}.exam-review-panel{display:flex;flex-direction:column;gap:var(--space-6);width:100%;animation:fadeInUp .4s ease both}.exam-score-banner{display:flex;align-items:center;gap:var(--space-5);padding:var(--space-5) var(--space-6);background:linear-gradient(135deg,var(--surface) 0%,var(--surface-2) 100%);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md)}.exam-score-circle{width:88px;height:88px;flex-shrink:0;display:grid;place-items:center;border-radius:999px;font-size:var(--text-xl);font-weight:var(--weight-bold);border:1px solid var(--border)}.exam-score-circle.excellent{background:var(--success-light);color:var(--success-text);border-color:var(--success-border)}.exam-score-circle.good{background:var(--primary-light);color:var(--primary-text);border-color:var(--primary-border)}.exam-score-circle.poor{background:var(--warning-light, #fff7ed);color:var(--warning-text, #c2410c);border-color:var(--warning-border, #fed7aa)}.exam-score-content{min-width:0;display:flex;flex-direction:column;gap:var(--space-2)}.exam-score-label{color:var(--text);font-size:var(--text-lg);font-weight:var(--weight-bold)}.exam-score-stats{display:flex;align-items:center;gap:var(--space-3);color:var(--text-muted)}.exam-score-stat{display:flex;align-items:baseline;gap:6px}.exam-score-stat-value{color:var(--text);font-size:var(--text-xl);font-weight:var(--weight-bold)}.exam-score-stat-label{color:var(--text-secondary);font-size:var(--text-sm)}.exam-review-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--space-3)}.exam-review-item{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:transform .15s ease,box-shadow .15s ease}.exam-review-item:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.exam-review-item.correct{border-color:var(--success-border);background:linear-gradient(180deg,var(--success-light) 0%,var(--surface) 22%)}.exam-review-item.wrong{border-color:var(--danger-border, #fecaca);background:linear-gradient(180deg,var(--danger-light, #fef2f2) 0%,var(--surface) 22%)}.exam-review-status{width:28px;height:28px;display:grid;place-items:center;border-radius:999px;background:var(--surface-2);color:var(--text-muted);font-size:var(--text-sm);font-weight:var(--weight-bold)}.exam-review-item.correct .exam-review-status{background:var(--success-light);color:var(--success-text)}.exam-review-item.wrong .exam-review-status{background:var(--danger-light, #fef2f2);color:var(--danger-text, #b91c1c)}.exam-review-question{min-width:0}.exam-review-question-num{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--weight-semibold)}.exam-review-question-text{margin-top:2px;overflow:hidden;color:var(--text);font-size:var(--text-sm);line-height:1.45;text-overflow:ellipsis;white-space:nowrap}.exam-review-drill-btns{display:flex;align-items:center;gap:8px}.exam-review-drill-btn{min-height:32px;padding:6px 10px;border:1px solid var(--border);border-radius:var(--radius-full);background:var(--surface-2);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--transition-fast)}.exam-review-drill-btn:hover{border-color:var(--primary-border);background:var(--primary-light);color:var(--primary-text)}.exam-review-detail-btn{min-height:32px;padding:6px 12px;border:1px solid var(--primary-border);border-radius:var(--radius-full);background:var(--primary-light);color:var(--primary-text);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;white-space:nowrap;transition:all var(--transition-fast)}.exam-review-detail-btn:hover{background:var(--primary);color:#fff}.exam-review-footer{display:flex;justify-content:center;padding-top:var(--space-2)}.score-circle-container{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:var(--space-8)}.review-list{display:flex;flex-direction:column;gap:var(--space-3)}.review-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md)}@media(max-width:768px){.toeic-exam-screen{height:auto;min-height:100dvh;overflow:auto}.toeic-exam-split{grid-template-columns:1fr;gap:var(--space-4)}.toeic-exam-header{padding:0 var(--space-4)}.toeic-exam-body{padding:var(--space-4);grid-template-columns:1fr;gap:16px;overflow:visible;height:auto}.toeic-listening-panel{height:auto;overflow-y:visible}.toeic-question-panel{height:auto;overflow:visible}.toeic-question-scroll{overflow-y:visible;flex:none}.toeic-question-actions{padding-right:0}.exam-header-actions{flex-wrap:wrap;gap:var(--space-2)}.exam-score-banner{align-items:flex-start;flex-direction:column}.exam-review-item{grid-template-columns:28px minmax(0,1fr)}.exam-review-drill-btns{grid-column:2;flex-wrap:wrap}.exam-review-question-text{white-space:normal}.toeic-media-stage{flex:none;min-height:220px;max-height:320px}.part1-photo-frame,.exam-graphic,.part1-exam-image{max-height:300px}.part7-layout{grid-template-columns:1fr}.part7-passage-panel,.part7-question-panel,.part7-document,.part7-question-list{overflow:visible}.part7-mini-map{max-width:100%}.part7-nav{flex-wrap:wrap}}.page-stack{display:flex;flex-direction:column;gap:var(--space-6);max-width:1100px;margin:0 auto;padding-bottom:var(--space-12);animation:fadeInUp .35s ease both}.section-head.warm-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-6);flex-wrap:wrap;box-shadow:var(--shadow-sm)}.section-head.warm-hero h1{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text);margin:var(--space-2) 0 var(--space-1)}.section-head.warm-hero p{font-size:var(--text-sm);color:var(--text-secondary);margin:0;line-height:1.5;max-width:680px}.topic-pill{display:inline-block;background:var(--primary-light);color:var(--primary);border:1px solid var(--primary-border);padding:4px 14px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;letter-spacing:.05em}.hero-progress{display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-3);min-width:240px}@media(max-width:768px){.hero-progress{align-items:flex-start;width:100%}}.btn.subtle{background:var(--surface-2);border:1px solid var(--border);color:var(--text-secondary);padding:6px 14px;border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--transition-fast)}.btn.subtle:hover{background:var(--surface-3);color:var(--text);border-color:var(--border-hover)}.tabs{display:flex;gap:var(--space-2);padding:var(--space-2);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);width:fit-content;flex-wrap:wrap}.tab-btn{background:transparent;border:none;padding:8px 18px;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.tab-btn:hover{color:var(--text);background:var(--surface-3)}.tab-btn.active{background:var(--surface);color:var(--primary);box-shadow:var(--shadow-sm);font-weight:var(--weight-bold)}.toeic-media-stage{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4);display:flex;justify-content:center;align-items:center;flex:1;min-height:0;overflow:hidden;box-shadow:var(--shadow-sm)}.toeic-photo-stage{padding:var(--space-3)}.part1-photo-frame{flex:1;min-height:0;width:100%;overflow:hidden;border-radius:var(--radius-md);display:flex;justify-content:center;align-items:center}.exam-graphic,.part1-exam-image{width:auto;max-width:100%;height:100%;max-height:100%;object-fit:contain;border-radius:var(--radius-sm);display:block}.exam-question-head{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-1)}.exam-question-vi{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-4);font-style:italic}.exam-title{display:flex;flex-direction:column;gap:4px}.exam-title span{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.exam-title strong{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text)}.exam-header-actions{display:flex;gap:var(--space-3);align-items:center}.exam-pill{display:inline-flex;align-items:center;padding:6px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary)}.exam-mode-select{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary)}.exam-mode-select select{padding:4px 8px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--text);cursor:pointer;transition:all var(--transition-fast)}.exam-mode-select select:hover{border-color:var(--border-hover);background:var(--surface-2)}.toeic-audio-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-sm)}.exam-section-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-3);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-secondary)}.figma-audio-bar{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md)}.figma-play-btn{width:36px;height:36px;border-radius:var(--radius-md);background:var(--primary);color:#fff;border:none;display:flex;align-items:center;justify-content:center;font-size:var(--text-lg);font-weight:var(--weight-bold);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.figma-play-btn:hover:not(:disabled){background:var(--primary-hover);transform:scale(1.05);box-shadow:var(--shadow-sm)}.figma-play-btn:disabled{opacity:.5;cursor:not-allowed}.figma-track{flex:1;height:6px;background:var(--surface-3);border:none;border-radius:999px;padding:0;cursor:pointer;overflow:hidden;position:relative}.figma-track span{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-hover));border-radius:999px;transition:width .1s linear}.figma-time{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary);background:var(--surface);padding:4px 10px;border-radius:var(--radius-sm);border:1px solid var(--border);min-width:50px;text-align:center}.figma-volume{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary);background:var(--surface);padding:4px 10px;border-radius:var(--radius-sm);border:1px solid var(--border)}.toeic-question-actions{flex-shrink:0;display:flex;gap:var(--space-3);align-items:center;justify-content:flex-end;margin-top:0;padding-top:var(--space-3);padding-bottom:var(--space-1);border-top:1px solid var(--border)}.exam-icon-btn{width:40px;height:40px;border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text);cursor:pointer;transition:all var(--transition-fast)}.exam-icon-btn:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-hover)}.exam-icon-btn:disabled{opacity:.4;cursor:not-allowed}.figma-primary-btn{padding:10px 24px;border-radius:var(--radius-md);background:var(--primary);color:#fff;border:none;font-size:var(--text-sm);font-weight:var(--weight-bold);cursor:pointer;box-shadow:var(--shadow-sm);transition:all var(--transition-fast);display:inline-flex;align-items:center;gap:8px}.figma-primary-btn:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.figma-primary-btn:disabled{background:var(--surface-3);color:var(--text-muted);cursor:not-allowed;box-shadow:none;border:1px solid var(--border)}.figma-explanation{padding:var(--space-4);border-radius:var(--radius-md);margin-top:var(--space-4);font-size:var(--text-sm);line-height:1.55;animation:fadeInUp .25s ease both}.figma-explanation.correct{background:var(--success-light);border:1px solid var(--success-border);color:var(--success-text)}.figma-explanation.wrong{background:var(--danger-light);border:1px solid var(--danger-border);color:var(--danger-text)}.figma-explanation.neutral{background:var(--surface-2);border:1px solid var(--border);color:var(--text)}.p1-screen{height:100dvh;display:flex;flex-direction:column;background:#f0f2f5;color:var(--text);overflow:hidden}.p1-header{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);height:56px;padding:0 var(--space-5);background:var(--surface);border-bottom:1px solid var(--border);z-index:10}.p1-header-left{display:flex;align-items:center;gap:var(--space-2);min-width:0}.p1-back-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-md);color:var(--text-secondary);text-decoration:none;transition:all var(--transition-fast);flex-shrink:0}.p1-back-btn:hover{background:var(--surface-2);color:var(--text)}.p1-breadcrumb{display:flex;align-items:center;gap:5px;min-width:0}.p1-bc-parent{font-size:var(--text-xs);color:var(--primary-text);font-weight:var(--weight-medium);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.p1-bc-sep{font-size:var(--text-xs);color:var(--text-muted)}.p1-bc-current{font-size:var(--text-sm);font-weight:var(--weight-bold);color:var(--text);white-space:nowrap}.p1-header-right{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}.p1-mode-pill{display:flex;align-items:center;gap:6px;padding:5px 10px 5px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);color:var(--text-secondary);transition:border-color var(--transition-fast)}.p1-mode-pill:focus-within{border-color:var(--primary)}.p1-mode-select{background:transparent;border:none;color:var(--text);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;outline:none}.p1-q-counter{display:flex;align-items:center;gap:6px;padding:5px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);color:var(--text-secondary);min-height:30px}.p1-q-counter:disabled{opacity:1}.p1-q-counter.is-clickable{cursor:pointer;transition:all var(--transition-fast)}.p1-q-counter.is-clickable:hover,.p1-q-counter.is-clickable[aria-expanded=true]{background:var(--primary-light);border-color:var(--primary-border);color:var(--primary-text)}.p1-q-counter strong{color:var(--primary-text);font-weight:var(--weight-bold);font-size:var(--text-sm)}.trainer-nav-wrap{position:relative}.trainer-nav-caret{color:var(--text-muted);transition:transform var(--transition-fast)}.p1-q-counter[aria-expanded=true] .trainer-nav-caret{transform:rotate(180deg)}.trainer-nav-popover{position:absolute;top:calc(100% + 10px);right:0;z-index:80;width:min(420px,calc(100vw - 32px));max-height:min(520px,calc(100dvh - 88px));display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.trainer-nav-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.trainer-nav-head strong{display:block;font-size:var(--text-sm);color:var(--text)}.trainer-nav-head span{display:block;max-width:220px;overflow:hidden;color:var(--text-muted);font-size:var(--text-xs);text-overflow:ellipsis;white-space:nowrap}.trainer-nav-restart{flex-shrink:0;padding:6px 10px;border:1px solid var(--danger-border, #fecaca);border-radius:var(--radius-full);background:var(--danger-light, #fef2f2);color:var(--danger-text, #b91c1c);font-size:var(--text-xs);font-weight:var(--weight-bold);cursor:pointer}.trainer-nav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:8px;overflow-y:auto;padding-right:2px}.trainer-nav-item{min-height:36px;display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-2);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-bold);cursor:pointer;transition:all var(--transition-fast)}.trainer-nav-item:hover{border-color:var(--primary-border);color:var(--primary-text)}.trainer-nav-item.is-done{background:var(--success-light);border-color:var(--success-border);color:var(--success-text)}.trainer-nav-item.is-active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 0 3px var(--primary-light)}.trainer-nav-item.is-active svg{color:#fff}.p1-lang-pill{padding:5px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.p1-lang-pill:hover{background:var(--surface-2);border-color:var(--border-hover);color:var(--text)}.p1-progress-bar{height:3px;background:var(--surface-3);flex-shrink:0}.p1-progress-fill{height:100%;background:var(--gradient-primary);transition:width .5s ease}.p1-body{flex:1;min-height:0;display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden}.p1-left{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:#f0f2f5;border-right:1px solid var(--border);overflow:hidden}.p1-audio-row{flex-shrink:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-3) var(--space-4);box-shadow:var(--shadow-xs);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.p1-audio-row.is-playing{border-color:var(--primary-border);box-shadow:0 0 0 3px var(--primary-light),var(--shadow-sm)}.p1-audio-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-2)}.p1-audio-eyebrow{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em}.p1-audio-controls{display:flex;align-items:center;gap:var(--space-3)}.p1-play-btn{width:44px;height:44px;border-radius:var(--radius-full);background:var(--primary);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all var(--transition-fast);box-shadow:0 2px 8px #0596694d}.p1-play-btn:hover{background:var(--primary-hover);transform:scale(1.06);box-shadow:0 4px 14px #05966966}.p1-play-btn:active{transform:scale(.96)}.p1-play-btn.is-playing{background:var(--primary);box-shadow:0 2px 8px #0596694d}.p1-play-btn.is-playing:hover{background:var(--primary-hover)}.p1-track-area{flex:1;display:flex;align-items:center;min-width:0;height:36px}.p1-waveform{display:flex;align-items:center;gap:2px;width:100%;height:36px;overflow:hidden}.p1-wave-bar{flex:1;border-radius:2px;background:var(--primary);min-width:2px;max-width:5px;animation:p1Wave .7s ease-in-out infinite alternate;opacity:.7}@keyframes p1Wave{0%{height:3px;opacity:.4}to{height:22px;opacity:.85}}.p1-track{flex:1;height:4px;background:var(--surface-3);border-radius:var(--radius-full);position:relative;overflow:visible}.p1-track-fill{height:100%;background:var(--primary);border-radius:var(--radius-full);transition:width .1s linear}.p1-track-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:var(--primary);border:2px solid white;box-shadow:var(--shadow-sm);transition:left .1s linear}.p1-time-display{font-size:12px;font-weight:600;color:var(--text-muted);white-space:nowrap;font-variant-numeric:tabular-nums;min-width:90px;text-align:right}.p1-photo-stage{flex:1;min-height:0;position:relative;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);transition:border-color .4s ease,box-shadow .4s ease}.p1-photo-stage.is-playing{border-color:var(--primary-border);box-shadow:0 0 0 4px var(--primary-light),var(--shadow-md);animation:p1StageGlow 2.5s ease-in-out infinite}@keyframes p1StageGlow{0%,to{box-shadow:0 0 0 3px var(--primary-light),var(--shadow-md)}50%{box-shadow:0 0 0 6px #0596691f,var(--shadow-lg)}}.p1-photo-ring{position:absolute;inset:-2px;border-radius:inherit;background:conic-gradient(from 0deg,transparent 0%,rgba(5,150,105,.7) 12%,transparent 25%,transparent 75%,rgba(13,148,136,.5) 88%,transparent 100%);animation:p1RingSpin 2.2s linear infinite;mask:radial-gradient(ellipse at center,transparent calc(100% - 2.5px),black 100%);-webkit-mask:radial-gradient(ellipse at center,transparent calc(100% - 2.5px),black 100%);z-index:2;pointer-events:none}@keyframes p1RingSpin{to{transform:rotate(360deg)}}.p1-photo-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;position:relative;z-index:1;border-radius:var(--radius-lg);padding:var(--space-4)}.p1-now-playing-badge{position:absolute;bottom:var(--space-4);left:50%;transform:translate(-50%);z-index:3;display:inline-flex;align-items:center;gap:6px;padding:5px 14px;background:#059669e0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;color:#fff;animation:fadeInUp .3s ease both;box-shadow:0 2px 12px #05966959}.p1-pulse-dot{width:7px;height:7px;border-radius:50%;background:#fff;animation:p1PulseDot 1.2s ease-in-out infinite}@keyframes p1PulseDot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.65)}}.p1-pre-play-hint{position:absolute;display:flex;flex-direction:column;align-items:center;gap:var(--space-2);color:var(--text-muted);z-index:1;pointer-events:none;text-align:center}.p1-pre-play-hint span{font-size:var(--text-xs);font-weight:var(--weight-medium)}.p1-right{display:flex;flex-direction:column;background:var(--surface);overflow:hidden}.p1-scroll{flex:1;min-height:0;overflow-y:auto;padding:var(--space-5) var(--space-5) var(--space-3);display:flex;flex-direction:column;gap:var(--space-4);scrollbar-width:thin;scrollbar-color:var(--border) transparent}.p1-q-header{display:flex;align-items:center;gap:var(--space-2)}.p1-q-eyebrow{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--primary-text)}.p1-q-text{font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--text);line-height:1.5;margin:0}.p1-options{display:flex;flex-direction:column;gap:var(--space-2)}.p1-option{display:flex;align-items:center;gap:var(--space-3);width:100%;padding:11px var(--space-4);background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;text-align:left;transition:all .14s ease}.p1-option:hover:not(:disabled){border-color:var(--primary);background:var(--primary-light)}.p1-option:disabled{cursor:not-allowed}.p1-option.picked{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 3px #05966914}.p1-option.correct{border-color:var(--success);background:var(--success-light)}.p1-option.wrong{border-color:var(--danger);background:var(--danger-light)}.p1-opt-circle{width:34px;height:34px;border-radius:var(--radius-full);border:2px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:700;color:var(--text-secondary);flex-shrink:0;transition:all .14s ease}.p1-option:hover:not(:disabled) .p1-opt-circle{border-color:var(--primary);color:var(--primary)}.p1-option.picked .p1-opt-circle{border-color:var(--primary);background:var(--primary);color:#fff}.p1-option.correct .p1-opt-circle{border-color:var(--success);background:var(--success);color:#fff}.p1-option.wrong .p1-opt-circle{border-color:var(--danger);background:var(--danger);color:#fff}.p1-opt-label{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.p1-opt-label strong{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text);line-height:1.4}.p1-option.picked .p1-opt-label strong{color:var(--primary-hover);font-weight:var(--weight-semibold)}.p1-option.correct .p1-opt-label strong{color:var(--success-text);font-weight:var(--weight-semibold)}.p1-option.wrong .p1-opt-label strong{color:var(--danger-text)}.p1-opt-label small{font-size:var(--text-xs);color:var(--text-muted);font-style:italic}.p1-option.correct .p1-opt-label small{color:var(--success-text);opacity:.8}.p1-opt-icon{flex-shrink:0}.p1-option.correct .p1-opt-icon{color:var(--success)}.p1-option.wrong .p1-opt-icon{color:var(--danger)}.p1-explanation{border-radius:var(--radius-lg);padding:var(--space-4);font-size:var(--text-sm);line-height:1.6;animation:fadeInUp .25s ease both;border-left:3px solid transparent}.p1-expl-badge{display:block;font-weight:700;margin-bottom:var(--space-2);font-size:var(--text-sm)}.p1-explanation p{margin:0;opacity:.85}.p1-explanation.correct{background:var(--success-light);border-color:var(--success);color:var(--success-text)}.p1-explanation.wrong{background:var(--danger-light);border-color:var(--danger);color:var(--danger-text)}.p1-explanation.neutral{background:var(--surface-2);border-color:var(--border-hover);color:var(--text-secondary)}.p1-expl-section{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px dashed rgba(0,0,0,.08)}.p1-expl-section:first-of-type{margin-top:var(--space-2);padding-top:var(--space-2);border-top:none}.p1-expl-section-label{display:block;margin-bottom:6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:.75}.p1-expl-section p{margin:0 0 6px;font-size:var(--text-sm);line-height:1.65;opacity:.92}.p1-expl-section p:last-child{margin-bottom:0}.p1-expl-traps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}.p1-expl-traps li{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;background:#ffffff8c;border-radius:var(--radius-sm);font-size:var(--text-sm);line-height:1.55}.p1-expl-trap-choice{flex-shrink:0;width:22px;height:22px;display:grid;place-items:center;border-radius:999px;background:#00000014;color:inherit;font-size:12px;font-weight:800}.p1-actions{flex-shrink:0;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);background:var(--surface)}.p1-nav-btn{width:44px;height:44px;flex-shrink:0;border-radius:var(--radius-md);background:var(--surface);border:1.5px solid var(--border);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast)}.p1-nav-btn:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-hover);color:var(--text)}.p1-nav-btn:disabled{opacity:.3;cursor:not-allowed}.p1-cta-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:44px;padding:0 var(--space-5);background:var(--primary);color:#fff;border:1px solid var(--primary);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:700;cursor:pointer;box-shadow:var(--shadow-xs);transition:all var(--transition-fast)}.p1-cta-btn:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.p1-cta-btn:active:not(:disabled){transform:translateY(0)}.p1-cta-btn:disabled{background:var(--surface-3);color:var(--text-muted);border-color:var(--border);box-shadow:none;cursor:not-allowed}.p1-cta-btn.submit{background:var(--primary)}.p1-cta-btn.submit:hover:not(:disabled){background:var(--primary-hover)}@media(max-width:768px){.p1-screen{height:auto;min-height:100dvh;overflow:auto}.p1-body{grid-template-columns:1fr;overflow:visible;height:auto}.p1-left{border-right:none;border-bottom:1px solid var(--border);overflow:visible}.p1-photo-stage{min-height:220px;flex:none;height:280px}.p1-right{overflow:visible}.p1-scroll{overflow-y:visible;flex:none}.p1-bc-parent,.p1-bc-sep{display:none}.p2-stage{min-height:240px;flex:none}}.p1-photo-stage.p2-stage-audio{flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4)}.p2-orb{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--space-4);z-index:1}.p2-orb-core{width:96px;height:96px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--primary);background:var(--primary-light);border:1.5px solid var(--primary-border);transition:transform .3s ease}.p1-photo-stage.is-playing .p2-orb-core{animation:p2OrbPulse 1.6s ease-in-out infinite}@keyframes p2OrbPulse{0%,to{transform:scale(1);box-shadow:0 0 #05966940}50%{transform:scale(1.05);box-shadow:0 0 0 14px #05966900}}.p2-eq{display:flex;align-items:flex-end;gap:4px;height:36px}.p2-eq-bar{width:5px;height:20%;border-radius:999px;background:var(--border-hover);transition:background .3s ease}.p2-eq-bar.on{background:var(--primary);animation:p2EqDance .8s ease-in-out infinite alternate}@keyframes p2EqDance{0%{height:12%}to{height:100%}}.p2-prompt-vi{font-size:var(--text-sm);color:var(--text-secondary);font-style:italic;margin:-4px 0 0}.p3-q-tabs{display:flex;gap:var(--space-2);margin-bottom:var(--space-4)}.p3-q-tab{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:36px;border-radius:var(--radius-md);border:1.5px solid var(--border);background:var(--surface-2);color:var(--text-secondary);font-size:var(--text-sm);font-weight:700;cursor:pointer;transition:all var(--transition-fast)}.p3-q-tab:hover{border-color:var(--primary-border);color:var(--primary-text);background:var(--primary-light)}.p3-q-tab.is-active{border-color:var(--primary);background:var(--primary);color:#fff;box-shadow:0 0 0 3px #05966926}.p3-q-tab.is-done:not(.is-active){border-color:var(--success-border);color:var(--success-text);background:var(--success-light)}.p2-opt-listen{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-full);background:var(--surface-2);border:1px solid var(--border);color:var(--text-secondary);flex-shrink:0;cursor:pointer;transition:all var(--transition-fast)}.p2-opt-listen:hover{background:var(--primary-light);border-color:var(--primary-border);color:var(--primary)}.p1-option.is-tts{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.p1-option.is-tts .p1-opt-circle{background:var(--primary);border-color:var(--primary);color:#fff}button.p1-audio-hint-tag{cursor:pointer;transition:all var(--transition-fast)}button.p1-audio-hint-tag:hover{background:var(--primary-light);border-color:var(--primary-border);color:var(--primary-text)}.p2-audio-tools{display:inline-flex;align-items:center;gap:6px;margin-left:auto}.p2-sub-switch{display:inline-flex;align-items:center;gap:7px;cursor:pointer;-webkit-user-select:none;user-select:none}.p2-sub-switch input{display:none}.p2-sub-switch-track{position:relative;width:36px;height:20px;border-radius:999px;background:var(--border);border:1.5px solid var(--border);transition:background .22s ease,border-color .22s ease,box-shadow .22s ease;flex-shrink:0}.p2-sub-switch input:checked~.p2-sub-switch-track{background:var(--primary);border-color:var(--primary);box-shadow:0 0 0 3px #10b9812e}.p2-sub-switch-thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0003;transition:transform .22s cubic-bezier(.34,1.4,.64,1)}.p2-sub-switch input:checked~.p2-sub-switch-track .p2-sub-switch-thumb{transform:translate(16px)}.p2-sub-switch-label{font-size:11px;font-weight:800;color:var(--text-secondary);letter-spacing:.04em;transition:color .2s}.p2-sub-switch:has(input:checked) .p2-sub-switch-label{color:var(--primary-text)}.p2-opt-audio-mask{display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 2px;opacity:.55}.p2-opt-mask-bar{width:3px;border-radius:2px;background:currentColor;animation:p2MaskWave 1.2s ease-in-out infinite alternate}@keyframes p2MaskWave{0%{transform:scaleY(.35);opacity:.5}to{transform:scaleY(1);opacity:1}}.p2-sub-panel{width:100%;animation:p2SubPanelIn .28s cubic-bezier(.2,.8,.2,1) both}.p2-sub-scroll{display:flex;flex-direction:column;gap:var(--space-3);max-height:260px;overflow-y:auto;padding:2px 2px 4px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.p2-sub-scroll::-webkit-scrollbar{width:4px}.p2-sub-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:999px}.p2-sub-row{display:flex;align-items:flex-start;gap:var(--space-3);max-width:90%;animation:p2SubRowIn .4s cubic-bezier(.34,1.2,.64,1) both}.p2-sub-row.is-past{opacity:.52}.p2-sub-avatar-wrap{position:relative;width:34px;height:34px;flex-shrink:0}.p2-sub-avatar{width:34px;height:34px;border-radius:50%;background:var(--surface-3);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:var(--text-secondary);text-transform:uppercase;box-shadow:var(--shadow-xs);transition:border-color .2s}.p2-sub-row.is-active .p2-sub-avatar{border-color:var(--primary);color:var(--primary-text);background:var(--primary-light)}.p2-sub-avatar-pulse{position:absolute;inset:-3px;border-radius:50%;border:2px solid rgba(5,150,105,.45);animation:p2AvatarPulse 1.6s ease-out infinite;pointer-events:none}@keyframes p2AvatarPulse{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.7)}}.p2-sub-bubble{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);border-top-left-radius:var(--radius-xs);padding:var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow-xs);transition:border-color .2s,box-shadow .2s,transform .2s;min-width:0}.p2-sub-row.is-active .p2-sub-bubble{border-color:var(--primary);box-shadow:0 0 0 3px #0596691a,var(--shadow-sm);transform:translateY(-1px)}.p2-sub-row.is-past .p2-sub-bubble{background:var(--surface-2)}.p2-sub-bubble-head{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.p2-sub-speaker-name{color:var(--text-secondary)}.p2-sub-row.is-active .p2-sub-speaker-name{color:var(--primary-text)}.p2-sub-label{opacity:.7}.p2-sub-live{display:inline-flex;align-items:center;gap:4px;padding:1px 6px;background:#ef4444;color:#fff;border-radius:var(--radius-full);font-size:9px;font-weight:900;letter-spacing:.06em;animation:p2LiveFade 1.4s ease-in-out infinite}.p2-sub-live-dot{width:5px;height:5px;background:#fff;border-radius:50%}@keyframes p2LiveFade{0%,to{opacity:1}50%{opacity:.65}}.p2-sub-bubble-body{font-size:var(--text-sm);color:var(--text);line-height:1.55}.p2-sub-bubble-vi{font-size:var(--text-xs);color:var(--text-secondary);border-top:1px dashed var(--border);padding-top:5px;margin-top:3px;font-style:italic}.p2-sub-row.is-active .p2-sub-bubble-vi{border-top-color:var(--primary-border);color:var(--primary-text)}.p2-karaoke-flow{display:inline}.p2-karaoke-word{border-radius:3px;transition:background .12s,color .12s}.p2-karaoke-word.past{color:var(--primary-text)}.p2-karaoke-word.active{background:var(--primary-light);color:var(--primary-text);box-shadow:0 0 0 2px var(--primary-border);font-weight:700}@keyframes p2SubPanelIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes p2SubRowIn{to{opacity:1;transform:translateY(0)}}.mode-selector{max-width:800px;margin:0 auto;padding:var(--space-8) var(--space-4);animation:fadeInUp .4s ease both}.mode-header{text-align:center;margin-bottom:var(--space-8)}.mode-header h2{font-size:var(--text-2xl);font-weight:var(--weight-bold);margin-bottom:var(--space-2)}.mode-part-name{display:inline-block;padding:var(--space-1) var(--space-3);background:var(--surface-2);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-sm);margin-bottom:var(--space-4)}.mode-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}.mode-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-8);text-align:center;cursor:pointer;transition:all var(--transition-base);display:flex;flex-direction:column;align-items:center}.mode-card:hover{border-color:var(--primary-border);transform:translateY(-4px);box-shadow:var(--shadow-glow-primary)}.mode-card .mode-icon{width:72px;height:72px;border-radius:var(--radius-xl);background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;font-size:32px;margin-bottom:var(--space-5);box-shadow:var(--shadow-md)}.mode-card.practice-card .mode-icon{background:var(--gradient-accent)}.mode-card .mode-title{font-size:var(--text-xl);font-weight:var(--weight-bold);margin-bottom:var(--space-2)}.mode-card .mode-desc{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-6);line-height:var(--leading-normal);flex:1}.mode-card .mode-btn{width:100%}@media(max-width:768px){.mode-cards{grid-template-columns:1fr}}.grammar-home,.grammar-quiz{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-6)}.grammar-topic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-4)}.grammar-topic-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);text-decoration:none;color:var(--text);transition:all var(--transition-fast);box-shadow:var(--shadow-sm)}.grammar-topic-card:hover{border-color:var(--primary);background:var(--surface);transform:translateY(-2px);box-shadow:var(--shadow-md)}.grammar-practice-layout{display:grid;grid-template-columns:280px 1fr;gap:var(--space-6);align-items:start}@media(max-width:900px){.grammar-practice-layout{grid-template-columns:1fr}}.study-card.grammar-side{position:sticky;top:80px}.grammar-question-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-2);margin-top:var(--space-4)}.grammar-question-nav button{padding:var(--space-2);border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface-2);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--transition-fast)}.grammar-question-nav button:hover{border-color:var(--primary)}.grammar-question-nav button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.grammar-sentence{font-size:var(--text-lg);font-weight:var(--weight-medium);line-height:var(--leading-relaxed);color:var(--text);padding:var(--space-4) var(--space-5);background:var(--surface-2);border-radius:var(--radius-lg);border-left:4px solid var(--primary);margin:var(--space-4) 0}.choice-grid{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-6)}.choice{display:flex;align-items:center;width:100%;padding:var(--space-3.5) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);color:var(--text);font-family:inherit;font-size:var(--text-sm);font-weight:var(--weight-medium);text-align:left}.choice:hover{border-color:var(--border-hover);background:var(--surface-2)}.choice.correct{background:var(--success-light);border-color:var(--success);color:var(--success-text);font-weight:var(--weight-semibold)}.choice.wrong{background:var(--danger-light);border-color:var(--danger);color:var(--danger-text)}.choice.word-form-choice{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast)}.choice.word-form-choice:hover{border-color:var(--primary-border);background:var(--surface-2)}.choice.word-form-choice.correct{background:var(--success-light);border-color:var(--success);color:var(--success)}.choice.word-form-choice.wrong{background:var(--danger-light);border-color:var(--danger);color:var(--danger)}.word-form-choice-main{display:flex;align-items:center;gap:var(--space-3)}.word-form-choice-letter{font-weight:var(--weight-bold);color:var(--primary)}.word-form-choice-word{font-weight:var(--weight-semibold)}.word-form-choice-meta{font-size:var(--text-xs);color:var(--text-secondary)}.explanation-panel{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);margin-top:var(--space-4)}.word-form-option-table{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3)}.word-form-option-row{display:flex;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--border-light);font-size:var(--text-sm)}.word-form-option-row.correct{background:var(--success-light);border-color:var(--success)}.pattern-list{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-4)}.pattern-chip{background:var(--primary-light);color:var(--primary);font-size:var(--text-xs);font-weight:var(--weight-semibold);padding:4px 10px;border-radius:var(--radius-full)}.source-hint-list{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3)}.source-hint{padding:var(--space-2) var(--space-3);background:var(--surface);border-left:3px solid var(--accent);border-radius:var(--radius-sm);font-size:var(--text-xs)}.word-form-vocab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-3);margin-top:var(--space-4)}.mini-card{padding:var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md)}.study-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm);transition:all var(--transition-fast);margin-bottom:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3)}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2)}.switch-line{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);margin:var(--space-2) 0 var(--space-4);cursor:pointer;-webkit-user-select:none;user-select:none;width:fit-content}.switch-line input[type=checkbox]{width:16px;height:16px;accent-color:var(--primary);cursor:pointer}.pill{display:inline-block;padding:2px 10px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;background:var(--surface-3);color:var(--text-muted)}.pill.ok{background:var(--success-light);color:var(--success-text);border:1px solid var(--success-border)}.eyebrow{display:inline-block;font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-1)}.grammar-quiz-page .section-head.warm-hero{margin-bottom:0}.grammar-side-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.grammar-side-head strong{font-size:var(--text-sm)}.grammar-side-head span{color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--weight-semibold)}.grammar-question-nav button.done{background:var(--success-light);border-color:var(--success-border);color:var(--success-text)}.grammar-question-nav button.wrong{background:var(--danger-light);border-color:var(--danger-border);color:var(--danger-text)}.grammar-question-nav button.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:var(--shadow-glow-primary)}.grammar-main{gap:var(--space-4)}.grammar-question-card{padding:var(--space-8);gap:var(--space-5)}.grammar-card-head{align-items:flex-start;margin-bottom:0}.grammar-card-head h2{font-size:var(--text-xl);margin:0}.grammar-sentence-large{margin:0;padding:var(--space-6);border:1px solid var(--border);border-left:4px solid var(--primary);background:linear-gradient(180deg,var(--surface),var(--surface-2));font-size:clamp(1.35rem,2.1vw,1.9rem);font-weight:var(--weight-bold);line-height:1.35}.grammar-choice-grid{margin-bottom:0}.grammar-choice{gap:var(--space-3);min-height:56px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);box-shadow:var(--shadow-xs)}.grammar-choice:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.choice-letter{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-full);background:var(--surface-2);border:1px solid var(--border);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-bold);flex-shrink:0}.choice-copy{flex:1;min-width:0;font-size:var(--text-base);font-weight:var(--weight-semibold)}.choice-state{color:var(--success-text);font-size:var(--text-xs);font-weight:var(--weight-bold);white-space:nowrap}.choice.correct .choice-letter{background:var(--success);border-color:var(--success);color:#fff}.choice.wrong .choice-letter{background:var(--danger);border-color:var(--danger);color:#fff}.grammar-feedback{margin-top:0;display:flex;flex-direction:column;gap:var(--space-4)}.grammar-feedback.is-correct{border-color:var(--success-border);background:var(--success-light)}.grammar-feedback.is-wrong{border-color:var(--danger-border);background:var(--danger-light)}.grammar-feedback-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}.grammar-feedback-head h3{font-size:var(--text-lg)}.grammar-flash-grid{margin-top:var(--space-2)}.grammar-nav-row{display:flex;justify-content:space-between;gap:var(--space-3)}.small{color:var(--text-muted);font-size:var(--text-sm)}.note-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4)}@media(max-width:900px){.study-card.grammar-side{position:static}}@media(max-width:640px){.grammar-question-card{padding:var(--space-5)}.grammar-sentence-large{padding:var(--space-4);font-size:var(--text-xl)}.grammar-choice{align-items:flex-start}.choice-state{display:none}.grammar-nav-row{flex-direction:column}.grammar-nav-row .btn{width:100%}}.writing-home,.writing-practice{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-6)}.topic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-4)}.topic-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);text-decoration:none;color:var(--text);transition:all var(--transition-fast);box-shadow:var(--shadow-sm)}.topic-card:hover{border-color:var(--primary);background:var(--surface);transform:translateY(-2px);box-shadow:var(--shadow-md)}.word-boxes{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-4) 0}.word-box{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-4);color:var(--text);font-weight:var(--weight-medium);text-align:center;cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-xs)}.word-box:hover{border-color:var(--primary);background:var(--surface)}.word-box.correct{background:var(--success-light);border-color:var(--success);color:var(--success)}.word-box.wrong{background:var(--danger-light);border-color:var(--danger);color:var(--danger)}.wd-card{position:relative;overflow:hidden;border:1px solid rgba(230,126,34,.22);border-radius:30px;background:radial-gradient(circle at 12% 0%,rgba(243,156,18,.14),transparent 34%),linear-gradient(145deg,#fff8ee,#fffdf8 48%,#fff);color:#2b241d;padding:clamp(22px,3vw,34px);box-shadow:0 28px 70px #5b39151c,0 1px #ffffffe6 inset;isolation:isolate}.wd-card-glow{position:absolute;inset:auto -120px -160px auto;width:360px;height:360px;border-radius:999px;background:radial-gradient(circle,rgba(230,126,34,.16),transparent 64%);pointer-events:none;z-index:-1}.wd-header,.wd-footer,.wd-quick-actions,.wd-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.wd-header{justify-content:space-between;margin-bottom:20px}.wd-eyebrow{display:inline-flex;align-items:center;width:fit-content;border:1px solid rgba(230,126,34,.25);border-radius:999px;background:#ffffffb8;color:#9a4f08;padding:7px 11px;font-size:12px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 10px 24px #e67e2214}.wd-header h2{margin:12px 0 4px;color:#2b241d;font-size:clamp(28px,4vw,44px);line-height:1.02;letter-spacing:-.02em}.wd-header p{margin:0;color:#7d6d5d;font-weight:700}.wd-progress-ring{--wd-progress: 0%;display:grid;place-items:center;width:104px;height:104px;border-radius:50%;background:radial-gradient(circle at center,#fffdf8 0 58%,transparent 59%),conic-gradient(#e67e22 var(--wd-progress),rgba(230,126,34,.14) 0);box-shadow:0 18px 36px #e67e2224}.wd-progress-ring strong{color:#2b241d;font-size:22px;line-height:1}.wd-progress-ring span{color:#9a4f08;font-size:11px;font-weight:900;text-transform:uppercase}.wd-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:14px 0 20px}.wd-toggle{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;border:1px solid rgba(230,126,34,.18);border-radius:18px;background:#ffffffb8;padding:12px 14px;cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.wd-toggle:hover{transform:translateY(-1px);border-color:#e67e225c;box-shadow:0 12px 28px #2b241d12}.wd-toggle input{position:absolute;opacity:0;pointer-events:none}.wd-switch{position:relative;width:42px;height:24px;border-radius:999px;background:#ead9c5;transition:background .18s ease}.wd-switch:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 3px 8px #2b241d2e;transition:transform .18s ease}.wd-toggle input:checked+.wd-switch{background:linear-gradient(135deg,#e67e22,#f39c12)}.wd-toggle input:checked+.wd-switch:after{transform:translate(18px)}.wd-toggle strong,.wd-toggle small{display:block}.wd-toggle strong{color:#2b241d;font-size:13px;line-height:1.2}.wd-toggle small{margin-top:2px;color:#8b7764;font-size:11px;font-weight:800}.wd-prompt-box{position:relative;border:1px solid rgba(230,126,34,.32);border-radius:26px;background:linear-gradient(135deg,#fff8eeeb,#fff);padding:clamp(20px,3vw,28px);box-shadow:0 16px 34px #5b391514,0 1px #ffffffe6 inset}.wd-prompt-box:before{content:"“";position:absolute;top:2px;right:22px;color:#e67e222e;font-family:Georgia,serif;font-size:92px;line-height:1}.wd-prompt-box span{display:block;color:#b45f12;font-size:12px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}.wd-prompt-box blockquote{position:relative;margin:0;color:#2b241d;font-size:clamp(20px,2.4vw,26px);font-weight:950;line-height:1.42;max-width:980px}.wd-quick-actions{margin:16px 0}.wd-input-zone{display:grid;gap:9px}.wd-input-zone label{color:#654;font-size:13px;font-weight:950;letter-spacing:.04em;text-transform:uppercase}.wd-textarea{width:100%;min-height:166px;resize:vertical;border:2px solid #f0bd7f;border-radius:24px;background:#ffffffdb;color:#2b241d;padding:20px 22px;font-size:clamp(18px,2vw,21px);font-weight:750;line-height:1.65;outline:none;box-shadow:0 18px 40px #2b241d12,0 1px #fffffff2 inset;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease,transform .2s ease}.wd-textarea::placeholder{color:#b09b84;font-weight:650}.wd-textarea:focus{border-color:#e67e22;background:#fff;box-shadow:0 0 0 5px #f39c122e,0 18px 40px #2b241d14}.wd-textarea.is-wrong{border-color:#e74c3c;background:#fff3f1;animation:wdShake .36s ease both,wdErrorFlash 1.2s ease both}.wd-textarea.is-passed{border-color:#1f9d55;background:#f1fff7}.wd-feedback{display:grid;gap:10px;border-radius:22px;padding:17px 18px;margin-top:16px;animation:wdPanelIn .22s ease both}.wd-feedback strong{display:block;font-size:16px}.wd-feedback p{margin:4px 0 0;line-height:1.55}.wd-feedback-error{border:1px solid rgba(231,76,60,.24);background:#fff3f1;color:#8f2418}.wd-feedback-success{border:1px solid rgba(31,157,85,.24);background:linear-gradient(135deg,#effff6,#fff);color:#116337;box-shadow:0 16px 34px #1f9d5514}.wd-feedback-hint{border:1px solid rgba(40,120,200,.22);background:#eff7ff;color:#1b4d7d}.wd-word-compare,.wd-answer-chips{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.wd-word-compare span,.wd-answer-chips span{border-radius:999px;padding:7px 10px;font-size:13px;font-weight:950}.wd-word-compare .bad{background:#ffe1dd;color:#c0392b;text-decoration:line-through}.wd-word-compare .good,.wd-answer-chips span{background:#ddf8e9;color:#167342}.wd-word-compare .arrow{background:transparent;color:#8b7764}.wd-footer{justify-content:space-between;border-top:1px solid rgba(230,126,34,.14);margin-top:20px;padding-top:18px}.wd-nav-actions,.wd-main-actions{display:flex;flex-wrap:wrap;gap:10px}.wd-btn{min-height:44px;border:0;border-radius:15px;padding:0 17px;color:#2b241d;font-weight:950;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease}.wd-btn:hover:not(:disabled){transform:translateY(-1px)}.wd-btn:disabled{cursor:not-allowed;opacity:.48}.wd-btn-primary{background:linear-gradient(135deg,#e67e22,#f39c12);color:#fff;box-shadow:0 15px 28px #e67e2245}.wd-btn-secondary{border:1px solid rgba(230,126,34,.24);background:#ffffffe0;box-shadow:0 10px 22px #2b241d0f}.wd-btn-ghost{background:transparent;color:#9a4f08}.wd-key-pop{position:absolute;z-index:5;border-radius:999px;background:#f39c1221;color:#e67e22;padding:5px 9px;font-size:12px;font-weight:950;pointer-events:none;animation:wdKeyPop .72s ease forwards;box-shadow:0 0 18px #f39c1252}.wd-confetti{pointer-events:none;position:fixed;inset:0;z-index:9999;overflow:hidden}.wd-confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:3px;animation:wdConfettiFall 1.3s ease-in forwards}@keyframes wdShake{0%,to{transform:translate(0)}18%{transform:translate(-8px)}36%{transform:translate(7px)}54%{transform:translate(-5px)}72%{transform:translate(4px)}}@keyframes wdErrorFlash{0%,to{background:#fff3f1}45%{background:#ffe1dd}}@keyframes wdKeyPop{0%{opacity:0;transform:translateY(14px) scale(.88)}18%{opacity:1}to{opacity:0;transform:translateY(-42px) scale(1.16)}}@keyframes wdPanelIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes wdConfettiFall{0%{opacity:1;transform:translateY(0) rotate(0)}to{opacity:0;transform:translateY(105vh) rotate(620deg)}}@media(max-width:860px){.wd-toolbar{grid-template-columns:1fr}.wd-progress-ring{width:86px;height:86px}.wd-footer,.wd-nav-actions,.wd-main-actions{align-items:stretch;width:100%}.wd-btn,.wd-nav-actions,.wd-main-actions{width:100%}}.review-home,.review-page{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-6)}.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-4)}.review-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.review-card:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.mode-tabs{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-6);padding:var(--space-3);background:var(--surface-2);border-radius:var(--radius-xl);border:1px solid var(--border)}.mode-tabs button.tab-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);color:var(--text-secondary);font-weight:var(--weight-medium);cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-xs);padding:8px 16px!important;font-size:var(--text-sm)!important;margin:0!important}.mode-tabs button.tab-btn:hover{border-color:var(--primary);color:var(--text);background:var(--surface-3);transform:translateY(-1px)}.mode-tabs button.tab-btn.active{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important;font-weight:var(--weight-bold);box-shadow:var(--shadow-sm)}.card-grid.two{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--space-6);align-items:stretch}@media(max-width:768px){.card-grid.two{grid-template-columns:1fr}}.flashcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-5);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-4);transition:all var(--transition-base);position:relative;overflow:hidden;min-height:240px}.flashcard:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:var(--shadow-lg)}.flashcard.flipped{border-color:var(--primary);background:#f0fdf4}.flash-surface{width:100%;flex:1;background:transparent;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-4);cursor:pointer;text-align:center;border-radius:var(--radius-lg);transition:all var(--transition-fast);outline:none}.flash-surface:hover{background:#00000005}.flash-surface .eyebrow{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--primary);background:#fff;padding:4px 12px;border-radius:var(--radius-full);border:1px solid var(--border);box-shadow:var(--shadow-xs);margin-bottom:var(--space-2)}.flash-surface strong{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text);line-height:var(--leading-snug);margin:var(--space-2) 0;transition:color var(--transition-fast)}.flashcard:hover .flash-surface strong{color:var(--primary)}.flash-surface small{font-size:var(--text-xs);color:var(--text-muted);font-style:italic;margin-top:var(--space-2)}.flash-back{display:flex;flex-direction:column;gap:var(--space-2);align-items:center;animation:fadeIn .3s ease;padding-top:var(--space-3);border-top:1px dashed var(--border);width:100%}.flash-back span{font-size:var(--text-xl);font-weight:var(--weight-bold);color:#047857}.flash-back small{font-size:var(--text-sm);color:var(--text-secondary);font-style:normal;line-height:var(--leading-relaxed)}.flashcard .action-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border-light);padding-top:var(--space-3);width:100%;z-index:2}.progress-page{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:var(--space-6)}.progress-overview{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4)}.progress-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-4);box-shadow:var(--shadow-sm)}.auth-page{min-height:100dvh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:var(--space-4);position:relative;overflow:hidden}.auth-page:before{content:"";position:absolute;top:10%;left:50%;transform:translate(-50%);width:500px;height:500px;background:var(--primary-light);filter:blur(120px);border-radius:50%;pointer-events:none}.auth-card{max-width:440px;width:100%;padding:var(--space-8);position:relative;z-index:1;animation:scaleIn .3s ease}.auth-logo{display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-6);text-decoration:none;color:var(--text)}.auth-title{text-align:center;font-size:var(--text-2xl);font-weight:var(--weight-bold);margin-bottom:var(--space-6)}.auth-tabs{display:flex;margin-bottom:var(--space-6);background:var(--surface-2);padding:var(--space-1);border-radius:var(--radius-full)}.auth-tab{flex:1;text-align:center;padding:var(--space-2);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);border:none;background:none}.auth-tab.active{background:var(--gradient-primary);color:#fff;font-weight:var(--weight-semibold)}.auth-form{display:flex;flex-direction:column;gap:var(--space-4)}.auth-error{padding:var(--space-3);background:var(--danger-light);border:1px solid var(--danger-border);border-radius:var(--radius-md);color:var(--danger-text);font-size:var(--text-sm);text-align:center}.auth-footer{text-align:center;margin-top:var(--space-6);font-size:var(--text-sm);color:var(--text-secondary)}.auth-subtitle{text-align:center;color:var(--text-secondary);font-size:var(--text-sm);margin:calc(-1 * var(--space-4)) 0 var(--space-6)}.auth-google-area{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);min-height:60px;justify-content:center}.auth-google-btn{display:flex;justify-content:center}.auth-google-loading{font-size:var(--text-sm);color:var(--text-secondary)}.ti-landing{--ti-ink: #0f172a;--ti-muted: #475569;--ti-green: #10b981;--ti-blue: #0ea5e9;--ti-bg: #f8fafc;min-height:100dvh;background:var(--ti-bg);color:var(--ti-ink);overflow-x:clip;font-family:var(--font-sans, "Inter", system-ui, sans-serif)}.ti-logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:1.35rem;letter-spacing:-.02em;color:var(--ti-ink)}.ti-logo-mark{width:38px;height:38px;filter:drop-shadow(0 4px 10px rgba(16,185,129,.35));transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.ti-logo:hover .ti-logo-mark{transform:rotate(-8deg) scale(1.08)}.ti-logo-text em{font-style:normal;background:linear-gradient(120deg,var(--ti-green),var(--ti-blue));-webkit-background-clip:text;background-clip:text;color:transparent}.ti-logo.compact{font-size:1.1rem}.ti-logo.compact .ti-logo-mark{width:28px;height:28px}.ti-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,5vw,56px);background:#f8fafccc;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(15,23,42,.06);animation:ti-drop .6s ease both}@keyframes ti-drop{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.ti-nav-brand{text-decoration:none}.ti-nav-links{display:flex;gap:clamp(14px,3vw,32px)}.ti-nav-links a{color:var(--ti-muted);text-decoration:none;font-weight:600;font-size:.95rem;position:relative}.ti-nav-links a:after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--ti-green),var(--ti-blue));transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.ti-nav-links a:hover:after{transform:scaleX(1)}.ti-btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease;will-change:transform}.ti-btn.primary{background:linear-gradient(120deg,var(--ti-green),var(--ti-blue));background-size:160% 160%;color:#fff;box-shadow:0 8px 24px #10b98159;animation:ti-gradient-shift 5s ease infinite}.ti-btn.primary:hover{transform:translateY(-3px);box-shadow:0 14px 32px #10b98173}.ti-btn.ghost{border:2px solid rgba(15,23,42,.14);color:var(--ti-ink);background:#fff}.ti-btn.ghost:hover{transform:translateY(-3px);border-color:var(--ti-green)}.ti-btn.small{padding:9px 18px;font-size:.9rem}.ti-btn.big{padding:15px 30px;font-size:1.05rem}.ti-btn-arrow{transition:transform .25s ease}.ti-btn:hover .ti-btn-arrow{transform:translate(4px)}.ti-btn.pulse{animation:ti-gradient-shift 5s ease infinite,ti-pulse 2.4s ease-in-out infinite}@keyframes ti-pulse{0%,to{box-shadow:0 8px 24px #10b98159,0 0 #10b98166}50%{box-shadow:0 8px 24px #10b98159,0 0 0 14px #10b98100}}@keyframes ti-gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.ti-hero{position:relative;padding:clamp(48px,8vw,96px) clamp(16px,5vw,56px) clamp(56px,8vw,110px);overflow:hidden}.ti-blob{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;pointer-events:none;animation:ti-blob-float 14s ease-in-out infinite}.ti-blob.b1{width:480px;height:480px;background:#a7f3d0;top:-140px;left:-100px;transform:translate(calc(var(--mx, 0) * 18px),calc(var(--my, 0) * 18px))}.ti-blob.b2{width:420px;height:420px;background:#bae6fd;top:60px;right:-120px;animation-delay:-5s;transform:translate(calc(var(--mx, 0) * -24px),calc(var(--my, 0) * -24px))}.ti-blob.b3{width:300px;height:300px;background:#fef08a;bottom:-120px;left:38%;opacity:.35;animation-delay:-9s}@keyframes ti-blob-float{0%,to{scale:1}50%{scale:1.15}}.ti-hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,64px);align-items:center;max-width:1180px;margin:0 auto}.ti-badge{display:inline-block;padding:7px 16px;border-radius:999px;background:#fff;border:1px solid rgba(16,185,129,.3);color:#047857;font-weight:700;font-size:.85rem;box-shadow:0 4px 14px #10b9811f;animation:ti-rise .7s ease .1s both}.ti-hero h1{margin:20px 0 0;font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.14;letter-spacing:-.03em;font-weight:850;animation:ti-rise .7s ease .22s both}.ti-gradient-text{background:linear-gradient(120deg,var(--ti-green),var(--ti-blue),var(--ti-green));background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ti-gradient-shift 4s linear infinite}.ti-hero-sub{margin:18px 0 0;max-width:34rem;color:var(--ti-muted);font-size:clamp(1rem,1.6vw,1.15rem);line-height:1.65;animation:ti-rise .7s ease .34s both}.ti-hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;animation:ti-rise .7s ease .46s both}.ti-hero-trust{display:block;margin-top:16px;font-size:.86rem;color:var(--ti-muted);animation:ti-rise .7s ease .58s both}@keyframes ti-rise{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.ti-hero-visual{position:relative;min-height:380px;display:flex;align-items:center;justify-content:center;animation:ti-rise .8s ease .4s both}.ti-demo-card{position:relative;width:min(360px,100%);background:#fff;border-radius:20px;border:1px solid rgba(15,23,42,.07);box-shadow:0 24px 60px #0f172a24;padding:20px;animation:ti-card-float 6s ease-in-out infinite}@keyframes ti-card-float{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}.ti-demo-head{display:flex;align-items:center;gap:10px;font-size:.8rem;color:var(--ti-muted)}.ti-demo-tag{background:linear-gradient(120deg,var(--ti-green),var(--ti-blue));color:#fff;font-weight:800;padding:3px 10px;border-radius:999px}.ti-demo-timer{margin-left:auto;font-variant-numeric:tabular-nums}.ti-demo-sentence{margin:16px 0 14px;font-size:1rem;line-height:1.55;font-weight:600}.ti-demo-blank{display:inline-block;min-width:74px;border-bottom:2px dashed var(--ti-blue);animation:ti-blink 1.6s ease infinite}@keyframes ti-blink{0%,to{border-color:var(--ti-blue)}50%{border-color:transparent}}.ti-demo-options{display:grid;gap:8px}.ti-demo-opt{padding:9px 14px;border-radius:12px;border:1.5px solid rgba(15,23,42,.08);font-size:.92rem;font-weight:600;background:#fff;display:flex;align-items:center;justify-content:space-between}.ti-demo-opt.picked{animation:ti-opt-pick 7s ease infinite}.ti-demo-check{opacity:0;font-style:normal;animation:ti-check-in 7s ease infinite}@keyframes ti-opt-pick{0%,24%{border-color:#0f172a14;background:#fff;color:inherit}30%,38%{border-color:var(--ti-blue);background:#eff6ff}46%,92%{border-color:var(--ti-green);background:#ecfdf5;color:#047857}to{border-color:#0f172a14;background:#fff}}@keyframes ti-check-in{0%,44%{opacity:0;transform:scale(.4)}50%,92%{opacity:1;transform:scale(1)}to{opacity:0}}.ti-demo-explain{margin-top:12px;padding:10px 14px;border-radius:12px;background:#ecfdf5;border:1px solid rgba(16,185,129,.25);display:flex;flex-direction:column;gap:2px;font-size:.85rem;color:#065f46;opacity:0;animation:ti-explain-in 7s ease infinite}@keyframes ti-explain-in{0%,48%{opacity:0;transform:translateY(8px)}56%,92%{opacity:1;transform:translateY(0)}to{opacity:0}}.ti-demo-toast{position:absolute;top:-14px;right:-10px;background:#fbbf24;color:#78350f;font-weight:800;font-size:.85rem;padding:7px 14px;border-radius:999px;box-shadow:0 8px 20px #fbbf2466;opacity:0;animation:ti-toast-in 7s ease infinite}@keyframes ti-toast-in{0%,50%{opacity:0;transform:translateY(10px) scale(.7)}58%,88%{opacity:1;transform:translateY(0) scale(1)}96%,to{opacity:0;transform:translateY(-8px) scale(.9)}}.ti-float-chip{position:absolute;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:999px;padding:8px 16px;font-size:.85rem;font-weight:700;box-shadow:0 10px 26px #0f172a1f;animation:ti-chip-float 5s ease-in-out infinite}.ti-float-chip.c1{top:4%;left:-4%;animation-delay:-1s}.ti-float-chip.c2{top:16%;right:-6%;animation-delay:-2.4s}.ti-float-chip.c3{bottom:12%;left:-8%;animation-delay:-3.2s}.ti-float-chip.c4{bottom:-2%;right:2%;animation-delay:-4.1s}@keyframes ti-chip-float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.ti-marquee{overflow:hidden;background:var(--ti-ink);padding:13px 0;transform:rotate(-1deg) scale(1.02)}.ti-marquee-track{display:flex;gap:38px;width:max-content;animation:ti-marquee 30s linear infinite}.ti-marquee-track span{color:#e2e8f0;font-weight:700;font-size:.88rem;white-space:nowrap;display:flex;align-items:center;gap:38px}.ti-marquee-track span:after{content:"✦";color:var(--ti-green)}@keyframes ti-marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.ti-section{max-width:1180px;margin:0 auto;padding:clamp(60px,9vw,110px) clamp(16px,5vw,56px) 0;text-align:center}.ti-kicker{display:inline-block;color:#047857;font-weight:800;font-size:.82rem;text-transform:uppercase;letter-spacing:.14em}.ti-h2{margin:12px auto 0;max-width:40rem;font-size:clamp(1.5rem,3.4vw,2.3rem);letter-spacing:-.02em;line-height:1.2;font-weight:820}.ti-reveal{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}.ti-reveal.in-view{opacity:1;transform:translateY(0)}.ti-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px;text-align:left}.ti-feature-card{height:100%;background:#fff;border:1px solid rgba(15,23,42,.07);border-radius:18px;padding:26px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.ti-feature-card:hover{transform:translateY(-8px);border-color:#10b98166;box-shadow:0 22px 48px #0f172a1f}.ti-feature-icon{display:inline-grid;place-items:center;width:52px;height:52px;font-size:1.5rem;border-radius:14px;background:linear-gradient(135deg,#ecfdf5,#e0f2fe);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.ti-feature-card:hover .ti-feature-icon{transform:scale(1.15) rotate(-6deg)}.ti-feature-card h3{margin:16px 0 8px;font-size:1.08rem;font-weight:800}.ti-feature-card p{margin:0;color:var(--ti-muted);font-size:.93rem;line-height:1.6}.ti-stats{margin-top:clamp(60px,9vw,110px);background:linear-gradient(120deg,#064e3b,#0c4a6e);padding:clamp(40px,6vw,64px) clamp(16px,5vw,56px)}.ti-stats-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;text-align:center}.ti-stat strong{display:block;font-size:clamp(2rem,4.6vw,3.1rem);font-weight:850;background:linear-gradient(120deg,#6ee7b7,#7dd3fc);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}.ti-stat span{color:#cbd5e1;font-size:.9rem;font-weight:600}.ti-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px;text-align:left}.ti-step{position:relative;height:100%;background:#fff;border:1px solid rgba(15,23,42,.07);border-radius:18px;padding:28px 26px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.ti-step:hover{transform:translateY(-8px);box-shadow:0 22px 48px #0f172a1f}.ti-step-n{position:absolute;top:-18px;right:6px;font-size:5.4rem;font-weight:900;color:#10b9811a;letter-spacing:-.06em}.ti-step h3{margin:0 0 8px;font-size:1.08rem;font-weight:800}.ti-step p{margin:0;color:var(--ti-muted);font-size:.93rem;line-height:1.6}.ti-final{position:relative;text-align:center;padding:clamp(70px,10vw,130px) clamp(16px,5vw,56px);overflow:hidden}.ti-blob.b4{width:520px;height:520px;background:#a7f3d0;left:50%;top:50%;translate:-50% -50%;opacity:.35}.ti-final-inner{position:relative}.ti-final h2{margin:0;font-size:clamp(1.7rem,4vw,2.7rem);font-weight:850;letter-spacing:-.02em}.ti-final p{margin:14px 0 28px;color:var(--ti-muted);font-size:1.05rem}.ti-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:26px clamp(16px,5vw,56px);border-top:1px solid rgba(15,23,42,.07);color:var(--ti-muted);font-size:.88rem}.ti-footer nav{display:flex;gap:20px}.ti-footer nav a{color:var(--ti-muted);text-decoration:none;font-weight:600}.ti-footer nav a:hover{color:var(--ti-green)}@media(max-width:900px){.ti-hero-inner{grid-template-columns:1fr}.ti-hero-visual{min-height:340px;margin-top:12px}.ti-feature-grid,.ti-steps,.ti-stats-grid{grid-template-columns:1fr 1fr}.ti-nav-links{display:none}}@media(max-width:560px){.ti-feature-grid,.ti-steps{grid-template-columns:1fr}.ti-float-chip.c1,.ti-float-chip.c3{left:0}.ti-float-chip.c2,.ti-float-chip.c4{right:0}}@media(prefers-reduced-motion:reduce){.ti-landing *,.ti-landing *:before,.ti-landing *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ti-reveal{opacity:1;transform:none}}.dictation-hub{animation:fadeInUp .4s ease both;max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-8)}.dictation-steps{display:flex;flex-direction:column;gap:var(--space-8)}.dictation-step{display:flex;flex-direction:column;gap:var(--space-4)}.step-title{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-lg);font-weight:var(--weight-semibold)}.step-number{width:28px;height:28px;border-radius:var(--radius-full);background:var(--gradient-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:var(--weight-bold)}.part-select-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.part-select-card{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.part-select-card:hover{border-color:var(--border-hover);background:var(--surface-2)}.part-select-card.selected{border-color:var(--primary-border);background:var(--primary-light)}.part-select-icon{font-size:24px}.part-select-info{flex:1}.part-select-name{font-size:var(--text-sm);font-weight:var(--weight-semibold);display:block}.part-select-desc{font-size:var(--text-xs);color:var(--text-muted)}.test-select-list{display:flex;flex-direction:column;gap:var(--space-2)}.dictation-summary{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.dictation-session{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-6);animation:fadeInUp .4s ease both}.dictation-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--space-4);border-bottom:1px solid var(--border)}.dictation-item-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-6)}@media(max-width:768px){.part-select-grid{grid-template-columns:1fr}.dictation-hub,.dictation-step,.dictation-summary{max-width:100%;min-width:0}.dictation-step .flex.gap-2{flex-wrap:wrap}.part-select-card,.part-select-info{min-width:0}.dictation-start-btn{width:100%;min-width:0!important;white-space:normal;line-height:1.25}}.toeic-copy-row{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);transition:border-color var(--transition-base),background var(--transition-base)}.toeic-copy-row.passed{border-color:var(--success-border);background:var(--success-light)}.toeic-copy-row.wrong{border-color:var(--danger-border);background:var(--danger-light);animation:dictShake .4s ease}@keyframes dictShake{0%,to{transform:translate(0)}20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.toeic-copy-label{display:flex;align-items:center;gap:var(--space-2)}.toeic-copy-label>span:first-child{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:800;color:var(--text-secondary);flex-shrink:0}.toeic-copy-row.passed .toeic-copy-label>span:first-child{background:var(--success);border-color:var(--success);color:#fff}.toeic-copy-label>span:first-child:empty{display:none}.toeic-copy-label .btn.subtle{margin-left:auto;padding:4px 12px;font-size:var(--text-xs);gap:5px}.toeic-copy-label .btn.subtle:before{content:"";width:0;height:0;border-left:7px solid currentColor;border-top:4px solid transparent;border-bottom:4px solid transparent}.toeic-copy-main{display:flex;flex-direction:column;gap:var(--space-3)}.toeic-copy-main>.small{font-size:var(--text-sm);color:var(--text-secondary);font-style:italic;line-height:1.5}.toeic-word-boxes{display:flex;flex-wrap:wrap;gap:8px;margin:0}.word-cell{position:relative;display:inline-flex;height:46px;min-width:4ch;flex-shrink:0}.word-input{width:100%;height:100%;min-width:0;padding:0 10px;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-size:var(--text-base);font-weight:var(--weight-bold);text-align:center;font-family:var(--font-mono);letter-spacing:.02em;outline:none;transition:all var(--transition-fast)}.word-input::placeholder{color:var(--text-muted)}.word-input:focus{border-color:var(--primary);background:var(--surface);box-shadow:0 0 0 3px var(--primary-light)}.word-input.correct{border-color:var(--success);background:var(--success-light);color:var(--success-text)}.word-input.speaking{border-color:var(--primary);background:var(--primary-light);color:var(--primary-text)}@property --ring-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}.word-cell-ring{position:absolute;inset:-3px;border-radius:10px;padding:2.5px;background:conic-gradient(from var(--ring-angle),transparent 0%,var(--primary) 12%,transparent 32%,transparent 68%,var(--primary) 88%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:wordRingSpin 1.1s linear infinite;pointer-events:none;z-index:0}@keyframes wordRingSpin{to{--ring-angle: 360deg}}@supports not (background: conic-gradient(from var(--ring-angle),#000,#fff)){.word-cell-ring{background:none;box-shadow:0 0 0 2px var(--primary);animation:none}}.feedback-line{font-size:var(--text-xs);color:var(--text-muted);line-height:1.4;min-height:1.2em}.feedback-line.ok-text{color:var(--success-text);font-weight:var(--weight-bold)}.feedback-line.bad-text{color:var(--danger-text);font-weight:var(--weight-semibold)}.typing-reveal{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--success-text);background:var(--surface);border:1px dashed var(--success-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);line-height:1.5;word-break:break-word}.typing-caret{display:inline-block;width:2px;height:1em;background:var(--success);margin-left:2px;vertical-align:text-bottom;animation:dictCaret .8s step-end infinite}@keyframes dictCaret{0%,to{opacity:1}50%{opacity:0}}.phrase-review{display:flex;flex-direction:column;gap:4px;padding-top:var(--space-2);border-top:1px dashed var(--border)}.phrase-review .small.muted{font-size:11px;color:var(--text-muted)}.phrase-review-text{font-size:var(--text-sm);line-height:1.7;color:var(--text)}.p1-dict-progress-pill{margin-left:auto;padding:2px 10px;background:var(--primary-light);color:var(--primary-text);border:1px solid var(--primary-border);border-radius:var(--radius-full);font-size:11px;font-weight:700}.p1-dict-rows{display:flex;flex-direction:column;gap:var(--space-3)}.p1-dict-row{transition:opacity var(--transition-base)}.p1-q-text kbd{display:inline-block;padding:1px 6px;background:var(--surface-3);border:1px solid var(--border);border-bottom-width:2px;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-secondary)}.p1-audio-hint-tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-full);padding:2px 8px}.spk-hub{display:flex;flex-direction:column;gap:var(--space-5);animation:fadeInUp .35s ease both}.spk-hub-hero{display:flex;align-items:center;gap:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-xs);position:relative;overflow:hidden}.spk-hub-hero:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gradient-primary)}.spk-hub-hero-icon{width:40px;height:40px;border-radius:var(--radius-md);background:var(--primary-light);border:1px solid var(--primary-border);display:flex;align-items:center;justify-content:center;color:var(--primary);flex-shrink:0}.spk-hub-hero-icon svg{width:20px;height:20px}.spk-hub-hero>div:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.spk-hub-title{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text);margin:0;line-height:1.2}.spk-hub-subtitle{font-size:var(--text-xs);color:var(--text-muted);margin:0;line-height:1.4}.spk-hub-test-select{display:flex;flex-direction:column;gap:3px;flex-shrink:0}.spk-select-label{font-size:10px;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em}.spk-select{padding:6px 28px 6px 10px;border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--surface);color:var(--text);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;min-width:220px;outline:none;transition:border-color var(--transition-fast)}.spk-select:focus{border-color:var(--primary)}.spk-stats-row{display:flex;gap:var(--space-2);align-items:center}.spk-stat-chip{display:inline-flex;align-items:baseline;gap:6px;padding:6px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);box-shadow:var(--shadow-xs)}.spk-stat-num{font-size:var(--text-base);font-weight:800;color:var(--text);line-height:1;font-variant-numeric:tabular-nums}.spk-stat-label{font-size:var(--text-xs);color:var(--text-muted);font-weight:var(--weight-medium)}.spk-section{display:flex;flex-direction:column;gap:var(--space-3)}.spk-section-header{display:flex;align-items:center;gap:10px;padding:0 2px}.spk-section-icon{width:28px;height:28px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}.spk-section-icon svg{width:14px;height:14px}.spk-icon-blue,.spk-icon-purple{background:var(--primary-light);color:var(--primary);border:1px solid var(--primary-border)}.spk-section-header>div:nth-child(2){display:flex;align-items:baseline;gap:8px;min-width:0;flex:1}.spk-section-title{font-size:var(--text-sm);font-weight:var(--weight-bold);color:var(--text);margin:0;white-space:nowrap}.spk-section-desc{font-size:var(--text-xs);color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spk-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-full);font-size:11px;font-weight:700;flex-shrink:0}.spk-badge-blue,.spk-badge-purple{background:var(--primary-light);color:var(--primary);border:1px solid var(--primary-border)}.spk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-3)}.spk-card{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:14px 16px;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-xs);transition:all var(--transition-fast);position:relative;overflow:hidden}.spk-card:before{content:"";position:absolute;top:0;left:0;bottom:0;width:3px;background:var(--primary);transform:scaleY(0);transform-origin:center;transition:transform var(--transition-fast)}.spk-card-mono:before{background:var(--primary)}.spk-card:hover{border-color:var(--primary-border);transform:translateY(-2px);box-shadow:var(--shadow-md)}.spk-card-mono:hover{border-color:var(--primary-border)}.spk-card:hover:before{transform:scaleY(1)}.spk-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.spk-card-badge{font-size:10px;font-weight:800;padding:2px 8px;border-radius:var(--radius-full);letter-spacing:.03em}.spk-card-turns{font-size:11px;color:var(--text-muted);font-weight:var(--weight-semibold)}.spk-card-preview{font-size:var(--text-sm);color:var(--text);line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3em}.spk-card-speakers{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-top:8px;border-top:1px dashed var(--border)}.spk-card-speakers-inner{display:flex;gap:4px;flex-wrap:wrap;flex:1;min-width:0}.spk-speaker-tag{display:inline-flex;align-items:center;gap:4px;padding:1px 7px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-full);font-size:10px;color:var(--text-secondary);font-weight:var(--weight-semibold)}.spk-speaker-dot{width:5px;height:5px;border-radius:50%;background:var(--primary);flex-shrink:0}.spk-speaker-mono{background:var(--primary-light);border-color:var(--primary-border);color:var(--primary)}.spk-card-arrow{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:var(--radius-full);background:var(--surface-2);color:var(--text-muted);flex-shrink:0;transition:all var(--transition-fast)}.spk-card:hover .spk-card-arrow{background:var(--primary);color:#fff;transform:translate(2px)}.spk-card-mono:hover .spk-card-arrow{background:var(--primary)}.spk-session{display:flex;flex-direction:column;min-height:100dvh;background:#f0f2f5}.spk-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);min-height:60vh;color:var(--text-secondary)}.spk-empty-icon{color:var(--text-muted)}.spk-empty h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text);margin:0}.spk-sess-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);height:56px;padding:0 var(--space-5);background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;z-index:10}.spk-sess-header-left{display:flex;align-items:center;gap:var(--space-2);min-width:0}.spk-back-btn{width:32px;height:32px;border-radius:var(--radius-md);color:var(--text-secondary);text-decoration:none;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);flex-shrink:0}.spk-back-btn:hover{background:var(--surface-2);color:var(--text)}.spk-sess-breadcrumb{display:flex;align-items:center;gap:5px;min-width:0}.spk-sess-bc-parent{font-size:var(--text-xs);color:var(--primary);font-weight:var(--weight-medium);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.spk-sess-bc-sep{font-size:var(--text-xs);color:var(--text-muted)}.spk-sess-bc-current{font-size:var(--text-sm);font-weight:var(--weight-bold);color:var(--text);white-space:nowrap}.spk-sess-header-right{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}.spk-sess-q-badge{padding:4px 10px;background:var(--primary-light);color:var(--primary);border:1px solid var(--primary-border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700}.spk-sess-counter{display:flex;align-items:center;gap:3px;padding:4px 10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);color:var(--text-secondary)}.spk-sess-counter-num{font-weight:700;color:var(--text);font-size:var(--text-sm)}.spk-sess-counter-sep{color:var(--text-muted)}.spk-sess-counter-total{color:var(--text-secondary)}.spk-exit-btn{width:32px;height:32px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface);color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast)}.spk-exit-btn:hover{background:var(--danger-light);border-color:var(--danger);color:var(--danger)}.spk-sess-progress{height:3px;background:var(--surface-3);flex-shrink:0}.spk-sess-progress-fill{height:100%;background:var(--gradient-primary);transition:width .5s ease}.spk-sess-body{flex:1;overflow-y:auto;padding:var(--space-5) var(--space-6);max-width:860px;width:100%;margin:0 auto}.spk-sess-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-5);background:var(--surface);border-top:1px solid var(--border);flex-shrink:0}.spk-nav-btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:9px var(--space-4);background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:all var(--transition-fast)}.spk-nav-btn:hover:not(:disabled){border-color:var(--border-hover);color:var(--text);background:var(--surface-2)}.spk-nav-btn:disabled{opacity:.35;cursor:not-allowed}.spk-nav-next{background:var(--primary);color:#fff;border-color:var(--primary)}.spk-nav-next:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover);color:#fff}.spk-sess-pos{font-size:var(--text-sm);color:var(--text-secondary)}.spk-sess-pos strong{color:var(--primary)}.speaking-article{display:flex;flex-direction:column;gap:var(--space-5)}.speaking-setup-panel{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-5) var(--space-6);display:flex;flex-direction:column;gap:var(--space-4)}.speaking-setup-panel h3{font-size:var(--text-sm);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em;margin:0 0 var(--space-1)}.setup-row{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}.setup-label{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-secondary);min-width:150px;flex-shrink:0}.role-chip{display:inline-flex;align-items:center;gap:var(--space-2);padding:6px 14px;border-radius:var(--radius-full);background:var(--surface-2);border:1.5px solid var(--border);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:all var(--transition-fast)}.role-chip:hover:not(:disabled){background:var(--surface-3);border-color:var(--border-hover);color:var(--text)}.role-chip.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 8px #05966940}.role-chip:disabled{opacity:.4;cursor:not-allowed}.role-avatar-sm{width:22px;height:22px;border-radius:50%;object-fit:cover;border:1.5px solid rgba(255,255,255,.6);flex-shrink:0}.chat-container{display:flex;flex-direction:column;gap:var(--space-4);background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-5)}.chat-turn{display:flex;gap:var(--space-3);align-items:flex-start;max-width:88%;transition:opacity var(--transition-base)}.chat-turn.mine{align-self:flex-end;flex-direction:row-reverse}.chat-turn.done{opacity:.65}.chat-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--border);box-shadow:var(--shadow-xs);flex-shrink:0}.chat-turn.active .chat-avatar{border-color:var(--primary);box-shadow:0 0 0 3px #05966926}.chat-bubble{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);border-top-left-radius:var(--radius-xs);padding:var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:var(--space-1);box-shadow:var(--shadow-xs)}.chat-turn.mine .chat-bubble{background:var(--primary-light);border-color:var(--primary-border);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xs)}.chat-turn.active .chat-bubble{border-color:var(--primary);box-shadow:var(--shadow-sm),0 0 0 2px #0596691a}.speaker-header{display:flex;align-items:center;gap:var(--space-1);font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.chat-turn.mine .speaker-header{justify-content:flex-end;color:var(--primary)}.hidden-line{font-size:var(--text-sm);font-style:italic;color:var(--text-muted);background:var(--surface-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);text-align:center}.karaoke-flow{line-height:1.8;font-size:var(--text-sm);color:var(--text)}.karaoke-word{display:inline-block;margin-right:.26em;padding:0 2px;border-radius:3px;transition:all .12s ease}.karaoke-word.active{background:var(--primary);color:#fff;font-weight:700;transform:scale(1.08)}.karaoke-word.past{color:var(--text-muted)}.translation-text{font-size:var(--text-xs);color:var(--text-secondary);border-top:1px dashed var(--border);padding-top:var(--space-2);margin-top:var(--space-1);font-style:italic}.chat-turn.mine .translation-text{border-top-color:var(--primary-border)}.speaking-action-bar{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-5) var(--space-6);display:flex;flex-direction:column;align-items:center;gap:var(--space-3);text-align:center;box-shadow:var(--shadow-sm);animation:fadeInUp .25s ease both}.action-buttons-row{display:flex;gap:var(--space-2);flex-wrap:wrap;justify-content:center;align-items:center}.recording-controls{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-5);background:var(--primary-light);border:2px solid var(--primary-border);border-radius:var(--radius-xl);width:100%;transition:all var(--transition-base)}.recording-controls.active{background:var(--danger-light);border-color:var(--danger)}.mic-button{width:72px;height:72px;border-radius:50%;background:var(--primary);border:3px solid white;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;transition:all var(--transition-fast);box-shadow:0 4px 16px #0596694d;color:#fff}.mic-button:hover:not(:disabled){transform:scale(1.06);box-shadow:0 6px 24px #05966966}.recording-controls.active .mic-button{background:var(--danger);box-shadow:0 4px 16px #ef44444d;animation:pulse-recording 1.5s ease-in-out infinite}@keyframes pulse-recording{0%,to{box-shadow:0 0 #ef444480}50%{box-shadow:0 0 0 16px #ef444400}}.recording-status{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-secondary)}.recording-status.active{color:var(--danger)}.recording-status:before{content:"";width:7px;height:7px;background:var(--text-muted);border-radius:50%}.recording-status.active:before{background:var(--danger);animation:blink-dot 1s ease-in-out infinite}@keyframes blink-dot{0%,to{opacity:1}50%{opacity:.25}}.waveform-container{width:100%;height:48px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;gap:2px;padding:var(--space-2);overflow:hidden}.waveform-bar{width:3px;height:25%;background:var(--primary);border-radius:999px;opacity:.55;transition:height .1s linear}.waveform-bar.active{opacity:1}.ai-feedback-panel{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm);animation:fadeInUp .35s ease both}.feedback-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);padding-bottom:var(--space-4);border-bottom:1px solid var(--border)}.feedback-score-badge{width:56px;height:56px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-2xl);font-weight:var(--weight-bold);box-shadow:var(--shadow-sm);flex-shrink:0}.feedback-title h3{margin:0;font-size:var(--text-lg);font-weight:var(--weight-bold)}.feedback-title p{margin:0;font-size:var(--text-sm);color:var(--text-secondary)}.feedback-sections{display:flex;flex-direction:column;gap:var(--space-3)}.feedback-section{background:var(--surface-2);border-left:3px solid var(--primary);border-radius:var(--radius-md);padding:var(--space-4)}.feedback-section.warning{border-color:#f59e0b;background:#fffbeb}.feedback-section.success{border-color:var(--success);background:var(--success-light)}.feedback-section-title{font-size:var(--text-xs);font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--text);margin-bottom:var(--space-2)}.feedback-section-content{font-size:var(--text-sm);line-height:1.6;color:var(--text-secondary)}.feedback-item{display:flex;gap:var(--space-2);font-size:var(--text-sm)}.feedback-item:before{content:"✓";color:var(--success);font-weight:700;flex-shrink:0}.feedback-item.issue:before{content:"⚠";color:#f59e0b}.speaking-retry-section{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--border)}.retry-button-group{display:flex;gap:var(--space-3);flex-wrap:wrap}.retry-button{flex:1;min-width:140px;padding:11px 20px;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-bold);cursor:pointer;border:none;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:var(--space-2)}.retry-button.primary{background:var(--primary);color:#fff;box-shadow:0 2px 8px #05966933}.retry-button.primary:hover{background:var(--primary-hover);transform:translateY(-1px)}.retry-button.secondary{background:var(--surface-2);color:var(--text);border:1.5px solid var(--border)}.retry-button.secondary:hover{background:var(--surface-3);border-color:var(--border-hover)}.spk-screen{height:100dvh;display:flex;flex-direction:column;background:#f0f2f5;overflow:hidden}.spk-body{flex:1;min-height:0;display:grid;grid-template-columns:420px 1fr;overflow:hidden}.spk-control{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:#f0f2f5;border-right:1px solid var(--border);overflow-y:auto}.spk-now-card{position:relative;display:flex;align-items:center;gap:var(--space-3);background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-4);box-shadow:var(--shadow-xs);overflow:hidden;transition:border-color .4s ease,box-shadow .4s ease}.spk-now-card.is-machine{border-color:var(--primary-border);box-shadow:0 0 0 3px #05966914,var(--shadow-sm)}.spk-now-card.is-mine{border-color:var(--primary-border);box-shadow:0 0 0 3px var(--primary-light),var(--shadow-sm)}.spk-now-card.is-done{background:var(--success-light);border-color:var(--success-border)}.spk-now-ring{position:absolute;inset:-2px;border-radius:inherit;background:conic-gradient(from 0deg,transparent 0%,rgba(5,150,105,.6) 12%,transparent 25%,transparent 75%,rgba(5,150,105,.5) 88%,transparent 100%);animation:spkRingSpin 2.2s linear infinite;mask:radial-gradient(ellipse at center,transparent calc(100% - 2px),black 100%);-webkit-mask:radial-gradient(ellipse at center,transparent calc(100% - 2px),black 100%);pointer-events:none;z-index:0}.spk-now-card.is-mine .spk-now-ring{background:conic-gradient(from 0deg,transparent 0%,rgba(5,150,105,.7) 12%,transparent 25%,transparent 75%,rgba(13,148,136,.5) 88%,transparent 100%)}@keyframes spkRingSpin{to{transform:rotate(360deg)}}.spk-now-avatar-wrap{position:relative;width:56px;height:56px;border-radius:50%;flex-shrink:0;z-index:1}.spk-now-avatar{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid white;box-shadow:var(--shadow-sm);display:block}.spk-now-done-overlay{position:absolute;inset:0;border-radius:50%;background:#059669e6;color:#fff;display:flex;align-items:center;justify-content:center;animation:spkPopIn .4s cubic-bezier(.34,1.56,.64,1) both}@keyframes spkPopIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.spk-now-info{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0;z-index:1}.spk-now-eyebrow{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.spk-now-card.is-mine .spk-now-eyebrow{color:var(--primary-text)}.spk-now-card.is-machine .spk-now-eyebrow{color:var(--primary)}.spk-now-card.is-done .spk-now-eyebrow{color:var(--success-text)}.spk-now-name{font-size:var(--text-base);font-weight:700;color:var(--text);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spk-now-mini-bars{display:flex;align-items:flex-end;gap:2px;height:16px;margin-top:4px}.spk-mini-bar{width:3px;height:30%;background:var(--text-muted);border-radius:999px;opacity:.35}.spk-mini-bar.is-on{background:var(--primary);opacity:.8;animation:spkBarDance .7s ease-in-out infinite alternate}.spk-now-card.is-mine .spk-mini-bar.is-on{background:var(--primary)}@keyframes spkBarDance{0%{height:18%}to{height:95%}}.spk-action-zone{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-5);display:flex;flex-direction:column;align-items:center;gap:var(--space-3);box-shadow:var(--shadow-xs);min-height:168px;justify-content:center}.spk-action-finish{display:flex;flex-direction:column;gap:var(--space-2);width:100%}.spk-mega-btn{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:13px var(--space-5);border:1px solid transparent;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:700;cursor:pointer;transition:all var(--transition-fast)}.spk-mega-primary{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:var(--shadow-xs)}.spk-mega-primary:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.spk-mega-success{background:var(--success);border-color:var(--success);color:#fff;box-shadow:var(--shadow-xs)}.spk-mega-success:hover:not(:disabled){background:var(--success-hover);border-color:var(--success-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.spk-mega-warning{background:var(--warning);border-color:var(--warning);color:#fff;box-shadow:var(--shadow-xs)}.spk-mega-warning:hover:not(:disabled){background:var(--warning-hover);border-color:var(--warning-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.spk-mic-mega{position:relative;width:96px;height:96px;border-radius:50%;border:none;background:var(--gradient-primary);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 28px #05966966;transition:all .2s ease}.spk-mic-mega:hover:not(.is-listening){transform:scale(1.06);box-shadow:0 10px 32px #05966980}.spk-mic-mega:active{transform:scale(.96)}.spk-mic-mega.is-listening{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 8px 28px #ef444466;animation:spkMicPulse 1.4s ease-in-out infinite}@keyframes spkMicPulse{0%,to{box-shadow:0 8px 28px #ef444466}50%{box-shadow:0 8px 32px #ef4444b3}}.spk-mic-icon{display:flex;align-items:center;justify-content:center;z-index:2}.spk-mic-ripple{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(239,68,68,.6);opacity:0;pointer-events:none}.spk-mic-mega.is-listening .spk-mic-ripple{animation:spkMicRipple 1.8s ease-out infinite}.spk-mic-mega.is-listening .spk-mic-ripple-2{animation:spkMicRipple 1.8s ease-out .6s infinite}@keyframes spkMicRipple{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}.spk-mic-label{font-size:var(--text-sm);font-weight:600;color:var(--text-secondary);text-align:center}.spk-mic-mega.is-listening+.spk-mic-label{color:#dc2626}.spk-sub-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;width:100%}.spk-chip-btn{padding:6px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.spk-chip-btn:hover{background:var(--surface-3);color:var(--text);border-color:var(--border-hover)}.spk-status-area{width:100%;display:flex;flex-direction:column;gap:4px;padding-top:var(--space-2);border-top:1px dashed var(--border);animation:fadeIn .3s ease both}.spk-heard{font-size:var(--text-xs);color:var(--text-secondary);background:var(--surface-2);padding:6px 10px;border-radius:var(--radius-md);margin:0}.spk-heard strong{color:var(--text)}.spk-status{font-size:var(--text-xs);font-weight:600;color:var(--primary-text);margin:0;text-align:center}.spk-settings{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-4) var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);box-shadow:var(--shadow-xs)}.spk-set-group{display:flex;flex-direction:column;gap:6px}.spk-set-label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted)}.spk-set-chips{display:flex;flex-wrap:wrap;gap:4px}.spk-set-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.spk-set-chip:hover:not(:disabled){background:var(--surface-3);border-color:var(--border-hover);color:var(--text)}.spk-set-chip.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 6px #05966940}.spk-set-chip:disabled{opacity:.4;cursor:not-allowed}.spk-set-avatar{width:18px;height:18px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.5)}.spk-group-nav{display:flex;gap:var(--space-2);margin-top:auto;padding-top:var(--space-2)}.spk-nav-mini{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:8px 12px;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:600;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.spk-nav-mini:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-hover);color:var(--text)}.spk-nav-mini:disabled{opacity:.4;cursor:not-allowed}.spk-chat-pane{display:flex;flex-direction:column;background:var(--surface);overflow:hidden}.spk-chat-pane-head{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border)}.spk-chat-eyebrow{display:block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:2px}.spk-chat-title{font-size:var(--text-base);font-weight:700;color:var(--text);margin:0}.spk-chat-progress{display:flex;flex-direction:column;align-items:flex-end;gap:5px;min-width:140px}.spk-chat-progress-text{font-size:var(--text-xs);font-weight:700;color:var(--text-secondary)}.spk-chat-progress-bar{width:140px;height:5px;background:var(--surface-3);border-radius:999px;overflow:hidden}.spk-chat-progress-fill{height:100%;background:var(--primary);border-radius:999px;transition:width .5s ease}.spk-chat-scroll{flex:1;min-height:0;overflow-y:auto;padding:var(--space-5) var(--space-6);display:flex;flex-direction:column;gap:var(--space-4);scrollbar-width:thin;scrollbar-color:var(--border) transparent}.spk-bubble-row{display:flex;gap:var(--space-3);align-items:flex-start;max-width:86%;animation:spkBubbleIn .45s cubic-bezier(.34,1.2,.64,1) both}.spk-bubble-row.mine{align-self:flex-end;flex-direction:row-reverse}.spk-bubble-row.done{opacity:.6}@keyframes spkBubbleIn{0%{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.spk-bubble-avatar-wrap{position:relative;width:38px;height:38px;flex-shrink:0}.spk-bubble-avatar{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid var(--border);box-shadow:var(--shadow-xs)}.spk-bubble-row.active .spk-bubble-avatar,.spk-bubble-row.mine.active .spk-bubble-avatar{border-color:var(--primary)}.spk-bubble-avatar-pulse{position:absolute;inset:-3px;border-radius:50%;border:2px solid rgba(5,150,105,.5);animation:spkAvatarPulse 1.6s ease-out infinite;pointer-events:none}.spk-bubble-row.mine .spk-bubble-avatar-pulse{border-color:#05966980}@keyframes spkAvatarPulse{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.7)}}.spk-bubble{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-xl);border-top-left-radius:var(--radius-xs);padding:var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:var(--space-1);box-shadow:var(--shadow-xs);transition:all .25s ease}.spk-bubble-row.mine .spk-bubble{background:var(--primary-light);border-color:var(--primary-border);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xs)}.spk-bubble-row.active .spk-bubble{border-color:var(--primary);box-shadow:0 0 0 3px #0596691f,var(--shadow-sm);transform:translateY(-1px)}.spk-bubble-row.mine.active .spk-bubble{background:var(--primary-light);border-color:var(--primary);box-shadow:0 0 0 3px #0596691f,var(--shadow-sm)}.spk-bubble-head{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.spk-bubble-row.mine .spk-bubble-head{justify-content:flex-end;color:var(--primary-text)}.spk-bubble-name{white-space:nowrap}.spk-bubble-mine-tag{padding:1px 7px;background:var(--primary);color:#fff;border-radius:var(--radius-full);font-size:9px;font-weight:800;letter-spacing:.04em}.spk-bubble-live{display:inline-flex;align-items:center;gap:4px;padding:1px 7px;background:#ef4444;color:#fff;border-radius:var(--radius-full);font-size:9px;font-weight:800;letter-spacing:.06em;animation:spkLiveFade 1.4s ease-in-out infinite}.spk-live-dot{width:5px;height:5px;background:#fff;border-radius:50%}@keyframes spkLiveFade{0%,to{opacity:1}50%{opacity:.6}}.spk-bubble-body{font-size:var(--text-sm);color:var(--text);line-height:1.5}.spk-bubble-hidden{display:inline-flex;align-items:center;gap:6px;font-style:italic;color:var(--text-muted);background:#0000000a;padding:4px 10px;border-radius:var(--radius-md);font-size:var(--text-xs)}.spk-bubble-vi{font-size:var(--text-xs);color:var(--text-secondary);border-top:1px dashed var(--border);padding-top:6px;margin-top:4px;font-style:italic}.spk-bubble-row.mine .spk-bubble-vi{border-top-color:var(--primary-border)}.spk-bubble-duck{font-size:var(--text-xs);font-weight:700;color:#d97706;margin-top:4px}@media(max-width:1024px){.spk-body{grid-template-columns:360px 1fr}}@media(max-width:768px){.spk-hub-hero{flex-wrap:wrap;gap:var(--space-3)}.spk-hub-test-select{margin-left:0;width:100%}.spk-select{min-width:unset;width:100%}.spk-stats-row{flex-wrap:wrap}.spk-grid{grid-template-columns:1fr}.spk-screen{height:auto;min-height:100dvh;overflow:auto}.spk-body{grid-template-columns:1fr;overflow:visible}.spk-control{border-right:none;border-bottom:1px solid var(--border);overflow:visible}.spk-chat-pane{overflow:visible}.spk-chat-scroll{overflow-y:visible;flex:none;padding:var(--space-4)}.p1-bc-parent,.p1-bc-sep{display:none}}.hidden{display:none!important}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.self-start{align-self:flex-start}.self-center{align-self:center}.self-end{align-self:flex-end}.grid{display:grid}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-5{gap:var(--space-5)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.m-0{margin:0}.mt-1{margin-top:var(--space-1)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mt-8{margin-top:var(--space-8)}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mb-8{margin-bottom:var(--space-8)}.p-0{padding:0}.p-2{padding:var(--space-2)}.p-3{padding:var(--space-3)}.p-4{padding:var(--space-4)}.p-6{padding:var(--space-6)}.p-8{padding:var(--space-8)}.text-xs{font-size:var(--text-xs)}.text-sm{font-size:var(--text-sm)}.text-base{font-size:var(--text-base)}.text-lg{font-size:var(--text-lg)}.text-xl{font-size:var(--text-xl)}.text-2xl{font-size:var(--text-2xl)}.text-3xl{font-size:var(--text-3xl)}.font-normal{font-weight:var(--weight-normal)}.font-medium{font-weight:var(--weight-medium)}.font-semibold{font-weight:var(--weight-semibold)}.font-bold{font-weight:var(--weight-bold)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-primary{color:var(--text)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-accent{color:var(--primary-text)}.text-success{color:var(--success-text)}.text-danger{color:var(--danger-text)}.text-warning{color:var(--warning-text)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.w-full{width:100%}.h-full{height:100%}.min-h-0{min-height:0}.relative{position:relative}.absolute{position:absolute}.sticky{position:sticky}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.cursor-pointer{cursor:pointer}.cursor-default{cursor:default}.select-none{-webkit-user-select:none;user-select:none}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.border{border:1px solid var(--border)}.border-t{border-top:1px solid var(--border)}.border-b{border-bottom:1px solid var(--border)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-full{border-radius:var(--radius-full)}.gradient-text{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1024px){:root{--content-padding: 24px}.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){:root{--content-padding: 16px;--topbar-height: 56px}.app-frame{grid-template-columns:1fr}.sidebar{display:none}.app-main{grid-column:1;padding-bottom:var(--mobile-nav-height)}.mobile-bottom-nav{display:flex}.content{padding:var(--content-padding);padding-bottom:calc(var(--mobile-nav-height) + var(--space-4));overflow-x:clip}.topbar{gap:var(--space-3)}.topbar>div:first-child{min-width:0}.topbar-actions{flex-shrink:0;gap:var(--space-1)}.topbar-actions .topbar-pill:not(.language-toggle):not(.ghost){display:none}.figma-page,.page-stack,.toeic-hub,.test-overview,.dictation-hub,.speaking-hub,.study-center-container,.quizlet-card-scene{max-width:100%;width:100%;min-width:0}.figma-page-head,.section-head,.workspace-head,.page-title,.glass-card,.card,.figma-tab-card,.figma-test-card,.figma-quick-card,.test-card,.part-card,.dictation-step,.conversation-card{max-width:100%;min-width:0}.figma-page-head,.section-head,.workspace-head{align-items:stretch}.section-head>.flex,.workspace-head>.flex,.section-head .flex.gap-2,.workspace-head .flex.gap-2{flex-direction:column;align-items:stretch;width:100%;min-width:0}.figma-page-head .figma-blue-btn,.section-head .btn,.workspace-head .btn{width:100%;white-space:normal;line-height:1.25}.figma-stat-grid,.figma-test-grid,.figma-quick-grid,.conversation-grid{grid-template-columns:1fr!important}.figma-tabbar,.mode-tabs{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.figma-tabbar::-webkit-scrollbar,.mode-tabs::-webkit-scrollbar{display:none}.mode-tabs button.tab-btn{max-width:min(320px,78vw);overflow:hidden;text-overflow:ellipsis}.figma-progress-row{flex-direction:column;align-items:stretch;gap:var(--space-3)}.figma-progress-row>div,.figma-progress-track{width:100%;min-width:0}.quizlet-nav-bar{flex-direction:column;align-items:stretch}.quizlet-nav-bar .btn{width:100%;white-space:normal}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.page-title h1{font-size:var(--text-2xl)}.pill-tabs{border-radius:var(--radius-md)}.hide-mobile{display:none!important}.topbar{padding:0 var(--content-padding)}.topbar>div:first-child small{display:none}}@media(min-width:1440px){:root{--content-max: 1400px}}@media(min-width:769px){.show-mobile-only{display:none!important}}@media(hover:none){.hover-lift:hover,.glass-card.interactive:hover{transform:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media print{.sidebar,.topbar,.mobile-bottom-nav{display:none!important}.app-frame{grid-template-columns:1fr}.app-main{grid-column:1}body{background:#fff;color:#000}}