@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";.page-bg{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.hero-orb{filter:blur(90px);opacity:.38;will-change:transform;border-radius:50%;position:absolute}.hero-orb-1{background:oklch(72% .18 265);width:600px;height:600px;animation:14s ease-in-out infinite orbFloat1;top:-180px;left:-140px}.hero-orb-2{background:oklch(72% .2 345);width:480px;height:480px;animation:17s ease-in-out infinite orbFloat2;top:-100px;right:-120px}.hero-orb-3{background:oklch(80% .14 180);width:400px;height:400px;animation:20s ease-in-out infinite orbFloat3;bottom:20%;left:30%}.hero-orb-4{background:oklch(72% .18 265);width:360px;height:360px;animation:18s ease-in-out infinite reverse orbFloat1;bottom:5%;right:5%}@keyframes orbFloat1{0%,to{transform:translate(0)scale(1)}33%{transform:translate(40px,-30px)scale(1.06)}66%{transform:translate(-20px,20px)scale(.96)}}@keyframes orbFloat2{0%,to{transform:translate(0)scale(1)}40%{transform:translate(-50px,25px)scale(1.08)}70%{transform:translate(20px,-15px)scale(.95)}}@keyframes orbFloat3{0%,to{transform:translate(0)scale(1)}50%{transform:translate(30px,-40px)scale(1.12)}}.page-bg:after{content:"";background-image:radial-gradient(circle,oklch(50% .02 265/.15) 1px,#0000 1px);background-size:28px 28px;position:absolute;inset:0}.ip-hero-headline em{background:linear-gradient(135deg, var(--indigo-500) 0%, var(--rose-500) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-style:normal}@keyframes heroFadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.ip-hero-badge{animation:heroFadeUp .55s var(--ease-out) .1s both}.ip-hero-headline{animation:heroFadeUp .55s var(--ease-out) .22s both}.ip-hero-sub{animation:heroFadeUp .55s var(--ease-out) .34s both}.ip-hero-trust{animation:heroFadeUp .55s var(--ease-out) .46s both}.ip-hero-trust .ip-trust-item:first-child{animation:heroFadeUp .4s var(--ease-out) .46s both}.ip-hero-trust .ip-trust-item:nth-child(2){animation:heroFadeUp .4s var(--ease-out) .54s both}.ip-hero-trust .ip-trust-item:nth-child(3){animation:heroFadeUp .4s var(--ease-out) .62s both}.ip-hero-trust .ip-trust-item:nth-child(4){animation:heroFadeUp .4s var(--ease-out) .7s both}.ip-hero-badge{position:relative;overflow:hidden}.ip-hero-badge:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff8c,#0000);width:60%;height:100%;animation:3.5s ease-in-out infinite badgeShimmer;position:absolute;top:0;left:-100%}@keyframes badgeShimmer{0%{left:-60%}60%,to{left:130%}}.ip-reveal{opacity:0;transition:opacity .55s var(--ease-out), transform .55s var(--ease-out);transform:translateY(28px)}.ip-reveal.visible{opacity:1;transform:none}.ip-reveal-delay-1{transition-delay:80ms}.ip-reveal-delay-2{transition-delay:.16s}.ip-split-wrapper{position:relative}.ip-split-wrapper:before{content:"";pointer-events:none;z-index:0;background:linear-gradient(#0000 0%,oklch(95% .012 265/.4) 40%,oklch(95% .012 345/.3) 70%,#0000 100%);position:absolute;inset:0}.ip-split-section{z-index:1;position:relative}.ip-path-card{position:relative;overflow:hidden}.ip-path-card:after{content:"";opacity:0;transition:opacity var(--duration-normal) var(--ease-out);pointer-events:none;border-radius:inherit;background:linear-gradient(135deg,#fff0 40%,#ffffff0f 100%);position:absolute;inset:0}.ip-path-card:hover:after{opacity:1}.ip-path-card:hover .ip-feature-icon-wrap{transition:transform .3s var(--ease-spring);transform:scale(1.08)}.ip-feature-icon-wrap{transition:transform .2s var(--ease-out)}.ip-navbar{-webkit-backdrop-filter:blur(24px)saturate(180%);z-index:100;background:#f8f9fc99;border-bottom:1px solid #ffffff8c;align-items:center;gap:12px;height:68px;padding:0 48px;display:flex;position:sticky;top:0;box-shadow:0 1px #6366f114,0 4px 24px #6366f10a}.ip-navbar:before{content:"";background:linear-gradient(90deg, var(--indigo-400) 0%, var(--rose-400) 50%, var(--indigo-400) 100%);opacity:.7;background-size:200% 100%;height:2px;animation:5s linear infinite gradientSlide;position:absolute;top:0;left:0;right:0}@keyframes gradientSlide{0%{background-position:0 0}to{background-position:200% 0}}.ip-navbar-logo{cursor:pointer;align-items:center;gap:10px;text-decoration:none;display:flex}.ip-navbar-logo img{border-radius:var(--radius-sm);width:32px;height:32px;box-shadow:var(--shadow-sm)}.ip-navbar-logo-text{font-family:var(--font-display);letter-spacing:-.02em;background:linear-gradient(135deg, var(--indigo-600) 0%, var(--rose-500) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:800}.ip-navbar-spacer{flex:1}.ip-nav-link{font-family:var(--font-body);color:var(--fg-2);border-radius:var(--radius-sm);transition:color var(--duration-normal) var(--ease-out), background var(--duration-normal) var(--ease-out);cursor:pointer;background:0 0;border:none;padding:6px 14px;font-size:14px;font-weight:500;text-decoration:none}.ip-nav-link:hover{color:var(--color-primary);background:var(--color-primary-subtle)}.ip-nav-btn-primary{font-family:var(--font-body);color:#fff;border-radius:var(--radius-sm);cursor:pointer;box-shadow:var(--shadow-primary), inset 0 1px 0 #ffffff2e;transition:background var(--duration-normal) var(--ease-out), transform var(--duration-fast) var(--ease-out);background:oklch(53% .25 265/.92);border:1px solid oklch(63% .21 265/.4);padding:8px 18px;font-size:14px;font-weight:600}.ip-nav-btn-primary:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.ip-nav-btn-primary:active{transform:scale(.97)}.ip-nav-btn-accent{font-family:var(--font-body);white-space:nowrap;color:#fff;border-radius:var(--radius-sm);cursor:pointer;box-shadow:var(--shadow-accent), inset 0 1px 0 #ffffff2e;transition:background var(--duration-normal) var(--ease-out), transform var(--duration-fast) var(--ease-out);background:oklch(56% .26 345/.9);border:1px solid oklch(66% .22 345/.4);padding:8px 18px;font-size:14px;font-weight:600}.ip-nav-btn-accent:hover{background:var(--color-accent-hover);transform:translateY(-1px)}.ip-nav-btn-accent:active{transform:scale(.97)}.ip-hero{text-align:center;z-index:2;flex-direction:column;align-items:center;max-width:860px;margin:0 auto;padding:96px 24px 80px;display:flex;position:relative}.ip-hero-badge{background:var(--color-primary-subtle);border:1px solid var(--color-primary-border);border-radius:var(--radius-pill);font-family:var(--font-body);color:var(--color-primary);letter-spacing:var(--tracking-wider);text-transform:uppercase;align-items:center;gap:8px;margin-bottom:32px;padding:6px 16px;font-size:12px;font-weight:600;display:inline-flex}.ip-hero-headline{font-family:var(--font-display);letter-spacing:-.03em;color:var(--fg-1);margin-bottom:24px;font-size:clamp(38px,6vw,64px);font-weight:900;line-height:1.08}.ip-hero-sub{font-family:var(--font-body);color:var(--fg-2);max-width:580px;margin-bottom:48px;font-size:18px;font-weight:400;line-height:1.65}.ip-hero-trust{flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;display:flex}.ip-trust-item{font-family:var(--font-body);color:var(--fg-2);align-items:center;gap:8px;font-size:13px;font-weight:500;display:flex}.ip-section-divider{text-align:center;z-index:1;padding:16px 24px 48px;position:relative}.ip-section-divider p{font-family:var(--font-body);color:var(--fg-3);letter-spacing:var(--tracking-wider);text-transform:uppercase;margin-bottom:0;font-size:13px;font-weight:500}.ip-split-section{grid-template-columns:1fr 1fr;gap:24px;max-width:1160px;margin:0 auto;padding:0 32px 100px;display:grid}@media (width<=800px){.ip-split-section{grid-template-columns:1fr}.ip-navbar{padding:0 20px}}.ip-path-card{border-radius:var(--radius-xl);background:var(--bg-surface);border:1px solid var(--border-subtle);box-shadow:var(--shadow-sm);transition:transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.ip-path-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px)}.ip-path-card-header{border-bottom:1px solid var(--border-subtle);padding:36px 36px 28px}.ip-path-card-header.teacher{background:var(--color-primary-subtle)}.ip-path-card-header.student{background:var(--color-accent-subtle)}.ip-path-eyebrow{letter-spacing:.1em;text-transform:uppercase;border-radius:var(--radius-pill);align-items:center;gap:8px;margin-bottom:16px;padding:6px 16px;font-size:13px;font-weight:800;display:inline-flex}.ip-path-eyebrow.teacher{background:var(--color-primary-subtle);color:var(--color-primary);border:1px solid var(--color-primary-border)}.ip-path-eyebrow.student{background:var(--color-accent-subtle);color:var(--color-accent);border:1px solid var(--color-accent-border)}.ip-path-title{font-family:var(--font-display);letter-spacing:-.02em;color:var(--fg-1);margin-bottom:10px;font-size:26px;font-weight:800;line-height:1.15}.ip-path-subtitle{color:var(--fg-2);font-size:14px;line-height:1.6}.ip-path-body{flex-direction:column;flex:1;padding:28px 36px 36px;display:flex}.ip-feature-list{flex-direction:column;gap:18px;margin-bottom:36px;list-style:none;display:flex}.ip-feature-item{align-items:flex-start;gap:14px;display:flex}.ip-feature-icon-wrap{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.ip-feature-icon-wrap.teacher{background:var(--color-primary-subtle)}.ip-feature-icon-wrap.student{background:var(--color-accent-subtle)}.ip-feature-text{flex-direction:column;gap:2px;display:flex}.ip-feature-label{font-family:var(--font-display);color:var(--fg-1);font-size:15px;font-weight:700}.ip-feature-desc{color:var(--fg-2);margin-bottom:0;font-size:13px;line-height:1.55}.ip-topic-pills{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.ip-topic-pill{border-radius:var(--radius-pill);border:1px solid var(--border-subtle);background:var(--bg-page);color:var(--fg-2);align-items:center;gap:5px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-flex}.ip-cta-btn{border-radius:var(--radius-md);cursor:pointer;width:100%;font-family:var(--font-display);transition:transform var(--duration-fast) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out), background var(--duration-normal) var(--ease-out);border:none;justify-content:center;align-items:center;gap:8px;padding:15px 24px;font-size:15px;font-weight:700;display:flex}.ip-cta-btn:active{transform:scale(.97)}.ip-cta-btn.teacher-primary{background:var(--color-primary);color:#fff;box-shadow:var(--shadow-primary)}.ip-cta-btn.teacher-primary:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.ip-cta-btn.student-primary{background:var(--color-accent);color:#fff;box-shadow:var(--shadow-accent)}.ip-cta-btn.student-primary:hover{background:var(--color-accent-hover);transform:translateY(-1px)}.ip-cta-note{text-align:center;color:var(--fg-3);margin-top:12px;font-size:12px;font-weight:500}.ip-cta-note a{color:var(--fg-2);cursor:pointer;text-decoration:underline}.ip-modal-overlay{z-index:200;background:var(--bg-overlay);animation:ipFadeIn .2s var(--ease-out);justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}@keyframes ipFadeIn{0%{opacity:0}to{opacity:1}}.ip-modal-box{background:var(--bg-surface);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);width:100%;max-width:460px;animation:ipSlideUp .25s var(--ease-spring);padding:40px;position:relative}@keyframes ipSlideUp{0%{opacity:0;transform:translateY(24px)scale(.97)}to{opacity:1;transform:none}}.ip-modal-close{border-radius:var(--radius-sm);background:var(--bg-page);cursor:pointer;width:32px;height:32px;color:var(--fg-3);transition:background var(--duration-fast), color var(--duration-fast);border:none;justify-content:center;align-items:center;display:flex;position:absolute;top:16px;right:16px}.ip-modal-close:hover{background:var(--border-subtle);color:var(--fg-1)}.ip-modal-logo{align-items:center;gap:10px;margin-bottom:28px;display:flex}.ip-modal-logo img{border-radius:var(--radius-sm);width:36px;height:36px;box-shadow:var(--shadow-sm)}.ip-modal-logo-text{font-family:var(--font-display);color:var(--fg-1);font-size:17px;font-weight:800}.ip-modal-title{font-family:var(--font-display);letter-spacing:-.02em;color:var(--fg-1);margin-bottom:6px;font-size:24px;font-weight:800}.ip-modal-sub{color:var(--fg-2);margin-bottom:28px;font-size:14px;line-height:1.6}.ip-step-dots{gap:6px;margin-bottom:28px;display:flex}.ip-step-dot{border-radius:var(--radius-pill);height:4px;transition:all var(--duration-normal) var(--ease-out)}.ip-step-dot.active{background:var(--color-accent);width:24px}.ip-step-dot.done{background:var(--color-success);width:16px}.ip-step-dot.inactive{background:var(--border-subtle);width:16px}.ip-form-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.ip-form-label{color:var(--fg-1);font-size:13px;font-weight:600}.ip-form-input{border:1px solid var(--border-default);border-radius:var(--radius-sm);height:44px;font-family:var(--font-body);color:var(--fg-1);background:var(--bg-surface);transition:border-color var(--duration-fast), box-shadow var(--duration-fast);outline:none;padding:0 14px;font-size:14px}.ip-form-input:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px oklch(63% .21 265/.15)}.ip-form-input::placeholder{color:var(--fg-3)}.ip-form-select{border:1px solid var(--border-default);border-radius:var(--radius-sm);height:44px;font-family:var(--font-body);color:var(--fg-1);background:var(--bg-surface);appearance:none;cursor:pointer;transition:border-color var(--duration-fast), box-shadow var(--duration-fast);outline:none;padding:0 14px;font-size:14px}.ip-form-select:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px oklch(63% .21 265/.15)}.ip-modal-cta{border-radius:var(--radius-md);cursor:pointer;width:100%;height:48px;font-family:var(--font-display);background:var(--color-accent);color:#fff;box-shadow:var(--shadow-accent);transition:transform var(--duration-fast) var(--ease-out), background var(--duration-normal);border:none;justify-content:center;align-items:center;gap:8px;margin-top:8px;font-size:15px;font-weight:700;display:flex}.ip-modal-cta:hover{background:var(--color-accent-hover);transform:translateY(-1px)}.ip-modal-cta:active{transform:scale(.97)}.ip-modal-cta.teacher{background:var(--color-primary);box-shadow:var(--shadow-primary)}.ip-modal-cta.teacher:hover{background:var(--color-primary-hover)}.ip-modal-cta:disabled{opacity:.5;cursor:not-allowed;transform:none}.ip-success-state{text-align:center;flex-direction:column;align-items:center;gap:16px;padding:16px 0 8px;display:flex}.ip-success-icon{background:var(--color-success-subtle);width:64px;height:64px;animation:ipPopIn .35s var(--ease-spring);border-radius:50%;justify-content:center;align-items:center;display:flex}@keyframes ipPopIn{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.ip-success-title{font-family:var(--font-display);color:var(--fg-1);font-size:22px;font-weight:800}.ip-success-desc{color:var(--fg-2);margin-bottom:0;font-size:14px;line-height:1.6}.ip-interest-grid{grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:20px;display:grid}.ip-interest-card{border:2px solid var(--border-subtle);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--duration-fast), background var(--duration-fast), transform var(--duration-fast) var(--ease-spring);background:var(--bg-surface);flex-direction:column;align-items:center;gap:6px;padding:14px 10px;display:flex}.ip-interest-card:hover{border-color:var(--color-accent-border);background:var(--color-accent-subtle);transform:translateY(-1px)}.ip-interest-card.selected{border-color:var(--color-accent);background:var(--color-accent-subtle)}.ip-ic-emoji{font-size:22px}.ip-ic-label{color:var(--fg-2);text-align:center;font-size:11px;font-weight:700}.ip-interest-card.selected .ip-ic-label{color:var(--color-accent)}.ip-level-list{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.ip-level-row{border:2px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer;transition:border-color var(--duration-fast), background var(--duration-fast);background:var(--bg-surface);align-items:center;gap:12px;padding:12px 14px;display:flex}.ip-level-row:hover{border-color:var(--border-default);background:var(--bg-page)}.ip-level-row.selected{border-color:var(--color-primary);background:var(--color-primary-subtle)}.ip-level-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.ip-level-row-text{flex:1}.ip-level-row-name{color:var(--fg-1);font-size:13px;font-weight:700}.ip-level-row-desc{color:var(--fg-2);margin-top:1px;margin-bottom:0;font-size:12px}.ip-footer{border-top:1px solid var(--border-subtle);z-index:1;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:32px 48px;display:flex;position:relative}.ip-footer-brand{align-items:center;gap:10px;display:flex}.ip-footer-brand img{border-radius:6px;width:24px;height:24px}.ip-footer-brand span{font-family:var(--font-display);color:var(--fg-2);font-size:14px;font-weight:800}.ip-footer-note{color:var(--fg-3);margin-bottom:0;font-size:12px}.ip-root{z-index:1;flex-direction:column;min-height:100vh;display:flex;position:relative}[data-theme]:not([data-theme=light]) .ip-navbar{background:oklch(18% .02 250/.85);border-bottom-color:oklch(28% .018 250/.5);box-shadow:0 1px #6366f11f,0 4px 24px #00000040}[data-theme]:not([data-theme=light]) .ip-split-wrapper:before{background:linear-gradient(#0000 0%,oklch(22% .06 265/.25) 40%,oklch(22% .06 345/.2) 70%,#0000 100%)}[data-theme]:not([data-theme=light]) .ip-hero-badge:after{background:linear-gradient(90deg,#0000,#ffffff2e,#0000)}[data-theme]:not([data-theme=light]) .ip-path-card:after{background:linear-gradient(135deg,#fff0 40%,#ffffff0a 100%)}:root{--indigo-50:oklch(97% .02 265);--indigo-100:oklch(93% .05 265);--indigo-200:oklch(86% .1 265);--indigo-300:oklch(75% .16 265);--indigo-400:oklch(63% .21 265);--indigo-500:oklch(53% .25 265);--indigo-600:oklch(46% .25 265);--indigo-700:oklch(39% .22 265);--indigo-800:oklch(30% .18 265);--indigo-900:oklch(22% .13 265);--rose-50:oklch(97% .02 345);--rose-100:oklch(93% .05 345);--rose-200:oklch(86% .1 345);--rose-300:oklch(76% .17 345);--rose-400:oklch(66% .22 345);--rose-500:oklch(56% .26 345);--rose-600:oklch(49% .25 345);--rose-700:oklch(40% .21 345);--emerald-50:oklch(97% .02 155);--emerald-100:oklch(93% .06 155);--emerald-200:oklch(87% .11 155);--emerald-400:oklch(69% .18 155);--emerald-500:oklch(58% .2 155);--emerald-600:oklch(49% .18 155);--amber-50:oklch(98% .03 70);--amber-100:oklch(94% .07 70);--amber-400:oklch(76% .18 70);--amber-500:oklch(68% .2 70);--amber-600:oklch(58% .19 70);--red-50:oklch(97% .02 20);--red-400:oklch(65% .22 20);--red-500:oklch(56% .24 20);--red-600:oklch(48% .22 20);--slate-50:oklch(98.5% .005 240);--slate-100:oklch(96% .008 240);--slate-200:oklch(91% .012 240);--slate-300:oklch(83% .015 240);--slate-400:oklch(70% .018 240);--slate-500:oklch(58% .018 240);--slate-600:oklch(47% .018 240);--slate-700:oklch(37% .016 240);--slate-800:oklch(27% .014 240);--slate-900:oklch(18% .012 240);--level-1:oklch(68% .17 148);--level-2:oklch(62% .18 220);--level-3:oklch(52% .22 262);--level-4:oklch(52% .22 305);--level-1-bg:oklch(96% .04 148);--level-2-bg:oklch(96% .04 220);--level-3-bg:oklch(96% .04 262);--level-4-bg:oklch(96% .04 305);--level-1-border:oklch(82% .1 148);--level-2-border:oklch(82% .1 220);--level-3-border:oklch(82% .1 262);--level-4-border:oklch(82% .1 305);--level-1-text:var(--level-1);--level-2-text:var(--level-2);--level-3-text:var(--level-3);--level-4-text:var(--level-4);--bg-page:var(--slate-100);--bg-surface:#fff;--bg-elevated:#fff;--bg-sunken:var(--slate-100);--bg-overlay:#1218288c;--bg-nav:#ffffffeb;--fg-1:var(--slate-900);--fg-2:var(--slate-600);--fg-3:var(--slate-400);--fg-on-primary:#fff;--fg-on-accent:#fff;--color-primary:var(--indigo-500);--color-primary-hover:var(--indigo-600);--color-primary-subtle:var(--indigo-50);--color-primary-border:var(--indigo-200);--color-accent:var(--rose-500);--color-accent-hover:var(--rose-600);--color-accent-subtle:var(--rose-50);--color-accent-border:var(--rose-200);--color-success:var(--emerald-500);--color-success-hover:var(--emerald-600);--color-success-subtle:var(--emerald-50);--color-warning:var(--amber-500);--color-warning-subtle:var(--amber-50);--color-danger:var(--red-500);--color-danger-subtle:var(--red-50);--bg-dark:var(--slate-50);--bg-darker:var(--slate-100);--bg-card:#fff;--bg-card-hover:#fff;--bg-surface-tint:var(--indigo-50);--bg-surface-tint-hover:var(--indigo-100);--surface-1:var(--slate-100);--surface-2:var(--slate-200);--surface-3:var(--slate-300);--primary:var(--indigo-500);--primary-hover:var(--indigo-600);--primary-glow:oklch(53% .25 265/.28);--secondary:var(--rose-500);--secondary-hover:var(--rose-600);--secondary-glow:oklch(56% .26 345/.28);--success:var(--emerald-500);--success-glow:oklch(58% .2 155/.28);--danger:var(--red-500);--danger-glow:oklch(56% .24 20/.28);--text-main:var(--slate-900);--text-muted:var(--slate-600);--text-dark:var(--slate-900);--border-subtle:var(--slate-200);--border-default:var(--slate-300);--border-strong:var(--slate-300);--border-focus:var(--indigo-400);--shadow-xs:0 1px 2px #0f172a0f;--shadow-sm:0 2px 8px #0f172a14, 0 1px 2px #0f172a0a;--shadow-md:0 4px 16px #0f172a1a, 0 2px 4px #0f172a0d;--shadow-lg:0 8px 32px #0f172a1f, 0 2px 8px #0f172a0f;--shadow-xl:0 20px 60px #0f172a24, 0 4px 16px #0f172a12;--shadow-primary:0 4px 18px oklch(53% .25 265/.35);--shadow-accent:0 4px 18px oklch(56% .26 345/.35);--shadow-glass:var(--shadow-md);--space-1:4px;--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;--space-20:80px;--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-pill:9999px;--font-display:"Plus Jakarta Sans", system-ui, sans-serif;--font-body:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-md:17px;--text-lg:18px;--text-xl:20px;--text-2xl:24px;--text-3xl:30px;--text-4xl:36px;--text-5xl:48px;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-extrabold:800;--weight-black:900;--leading-tight:1.15;--leading-snug:1.3;--leading-normal:1.5;--leading-relaxed:1.7;--tracking-tight:-.025em;--tracking-snug:-.015em;--tracking-normal:0;--tracking-wide:.04em;--tracking-wider:.08em;--tracking-widest:.12em;--ease-out:cubic-bezier(0, 0, .2, 1);--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-inout:cubic-bezier(.4, 0, .2, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--duration-fast:.12s;--duration-normal:.2s;--duration-slow:.35s;--transition-fast:.12s cubic-bezier(0, 0, .2, 1);--transition-smooth:.2s cubic-bezier(.4, 0, .2, 1);--color-amber-text:var(--amber-600);--color-orange-text:oklch(55% .21 40)}[data-theme]:not([data-theme=light]){--bg-page:oklch(14% .018 250);--bg-surface:oklch(18% .02 250);--bg-elevated:oklch(22% .022 250);--bg-sunken:oklch(12% .016 250);--bg-overlay:#000000a6;--bg-nav:oklch(18% .02 250/.92);--fg-1:oklch(94% .006 240);--fg-2:oklch(72% .012 240);--fg-3:oklch(50% .014 240);--color-primary:var(--indigo-500);--color-primary-hover:var(--indigo-400);--color-primary-subtle:oklch(22% .06 265);--color-primary-border:oklch(30% .1 265);--color-accent:var(--rose-500);--color-accent-hover:var(--rose-400);--color-accent-subtle:oklch(22% .06 345);--color-accent-border:oklch(30% .1 345);--color-success:var(--emerald-400);--color-success-hover:var(--emerald-200);--color-success-subtle:oklch(20% .06 155);--color-warning:var(--amber-400);--color-warning-subtle:oklch(20% .06 70);--color-danger:var(--red-400);--color-danger-subtle:oklch(20% .06 20);--bg-surface-tint:oklch(22% .06 265);--bg-surface-tint-hover:oklch(26% .08 265);--shadow-xs:0 1px 2px #00000040;--shadow-sm:0 2px 8px #00000059, 0 1px 2px #0003;--shadow-md:0 4px 16px #00000073, 0 2px 4px #00000040;--shadow-lg:0 8px 32px #00000080, 0 2px 8px #0000004d;--shadow-xl:0 20px 60px #0009, 0 4px 16px #00000059;--shadow-primary:0 4px 18px oklch(75% .16 265/.3);--shadow-accent:0 4px 18px oklch(76% .17 345/.3);--level-1-bg:oklch(20% .06 148);--level-2-bg:oklch(20% .06 220);--level-3-bg:oklch(20% .06 262);--level-4-bg:oklch(20% .06 305);--level-1-border:oklch(32% .08 148);--level-2-border:oklch(32% .08 220);--level-3-border:oklch(32% .08 262);--level-4-border:oklch(32% .08 305);--color-amber-text:var(--amber-400);--color-orange-text:oklch(72% .18 40);--level-1-text:oklch(72% .16 148);--level-2-text:oklch(68% .15 220);--level-3-text:oklch(75% .16 265);--level-4-text:oklch(72% .18 305)}*{box-sizing:border-box;margin:0;padding:0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--slate-300);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--indigo-400)}body{font-family:var(--font-body);background-color:var(--bg-page);color:var(--fg-1);min-height:100vh;line-height:var(--leading-relaxed);-webkit-font-smoothing:antialiased;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:var(--leading-snug);color:var(--fg-1);letter-spacing:var(--tracking-snug);margin-bottom:.75rem}h1{font-size:var(--text-4xl);letter-spacing:var(--tracking-tight);font-weight:800}h2{font-size:var(--text-2xl);font-weight:700}h3{font-size:var(--text-xl);font-weight:600}h4{font-size:var(--text-md);font-weight:600}p{color:var(--fg-2);line-height:var(--leading-relaxed);margin-bottom:1rem}code,.mono{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-primary);background:var(--color-primary-subtle);border-radius:var(--radius-xs);padding:2px 6px}.text-gradient{background:linear-gradient(135deg, var(--indigo-400), var(--rose-400));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.glow-text{background:linear-gradient(135deg, var(--fg-1) 0%, var(--color-primary) 55%, var(--color-accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.glow-text.primary{background:linear-gradient(135deg, var(--fg-1) 0%, var(--color-primary) 60%, var(--indigo-600) 100%)}.glow-text.secondary{background:linear-gradient(135deg, var(--fg-1) 0%, var(--color-accent) 60%, var(--rose-600) 100%)}.glass-panel{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:box-shadow var(--duration-normal) var(--ease-out), transform var(--duration-normal) var(--ease-out), border-color var(--duration-normal) var(--ease-out)}.glass-panel:hover{box-shadow:var(--shadow-md);border-color:var(--border-default);transform:translateY(-2px)}[data-theme=light] .glass-panel{-webkit-backdrop-filter:none;box-shadow:var(--shadow-sm);background:#fff;border-radius:20px}.glass-panel.glow-primary:hover,.glass-panel.glow-secondary:hover,.glass-panel.glow-success:hover,.glass-panel.glow-danger:hover{box-shadow:var(--shadow-md);border-color:var(--border-default)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1.5rem}@media (width<=640px){.container{padding:0 1rem}}.app-main{flex-direction:column;flex:1;padding-top:4rem;padding-bottom:4rem;display:flex}.flex-center{justify-content:center;align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.grid-cols-2{grid-template-columns:repeat(2,1fr);gap:1.5rem;display:grid}.grid-cols-3{grid-template-columns:repeat(3,1fr);gap:1.5rem;display:grid}.responsive-grid-2{grid-template-columns:repeat(2,1fr);gap:1.5rem;display:grid}.responsive-grid-3{grid-template-columns:repeat(3,1fr);gap:1.5rem;display:grid}.responsive-flex{gap:1rem;display:flex}.quiz-layout{grid-template-columns:1.15fr 1fr;height:calc(100vh - 58px);display:grid;overflow:hidden}.reading-layout{grid-template-columns:1fr 300px;height:calc(100vh - 58px);display:grid;overflow:hidden}.reading-page-wrapper{flex-direction:column;height:calc(100vh - 58px);display:flex;overflow:hidden}@media (width<=768px){.reading-page-wrapper{height:auto!important;overflow:visible!important}}@media (width<=1024px){.responsive-grid-3{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.grid-cols-2,.grid-cols-3,.responsive-grid-2,.responsive-grid-3{grid-template-columns:1fr}.responsive-flex{flex-direction:column}h1{font-size:var(--text-3xl)}.quiz-layout,.reading-layout{grid-template-columns:1fr!important;height:auto!important;overflow-y:visible!important}.quiz-layout>div,.reading-layout>div{border-right:none!important;height:auto!important;overflow-y:visible!important}.nav-link span,.nav-link-text{display:none}.nav-link{padding:.5rem}.logo-text,.nav-divider,.user-level-badge{display:none!important}}.main-nav{justify-content:space-between;align-items:center;padding:.75rem 2rem;display:flex}@media (width<=768px){.main-nav{padding:.5rem 1rem}}@media (width<=480px){h1{font-size:var(--text-2xl)}.app-main{padding-top:2rem;padding-bottom:2rem}}.btn{border-radius:var(--radius-pill);font-family:var(--font-display);font-weight:700;font-size:var(--text-base);cursor:pointer;transition:all var(--duration-normal) var(--ease-out);letter-spacing:-.01em;border:none;justify-content:center;align-items:center;gap:.5rem;padding:10px 20px;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.btn-primary{background:var(--color-primary);color:#fff;box-shadow:var(--shadow-primary)}.btn-primary:not(:disabled):hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 6px 24px oklch(53% .25 265/.45)}.btn-outline{background:var(--bg-surface);color:var(--fg-1);border:1.5px solid var(--border-default);box-shadow:var(--shadow-xs)}.btn-outline:not(:disabled):hover{border-color:var(--border-strong);background:var(--slate-50);transform:translateY(-1px)}.nav-link{color:var(--fg-2);cursor:pointer;font-family:var(--font-display);font-size:var(--text-sm);border-radius:var(--radius-sm);transition:all var(--duration-fast) var(--ease-out);background:0 0;border:none;align-items:center;gap:.4rem;padding:6px 12px;font-weight:600;display:flex}.nav-link:hover{color:var(--fg-1);background:var(--slate-100)}[data-theme]:not([data-theme=light]) .nav-link:hover{background:oklch(25% .02 240)}.nav-link.active{color:var(--color-primary);background:var(--color-primary-subtle)}.badge{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-xs);background:var(--slate-100);color:var(--fg-2);align-items:center;gap:.3rem;padding:3px 10px;font-weight:800;display:inline-flex}.badge.primary{background:var(--color-primary-subtle);color:var(--color-primary)}.badge.secondary{background:var(--color-accent-subtle);color:var(--color-accent)}.badge.success{background:var(--color-success-subtle);color:var(--color-success)}.badge.danger{background:var(--color-danger-subtle);color:var(--color-danger)}.input-group{flex-direction:column;gap:.4rem;margin-bottom:1.25rem;display:flex}.input-label{font-family:var(--font-body);font-size:var(--text-sm);color:var(--fg-2);font-weight:500}.input-field{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);width:100%;color:var(--fg-1);font-family:var(--font-body);font-size:var(--text-base);box-shadow:var(--shadow-xs);transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out);padding:.75rem 1rem}.input-field::placeholder{color:var(--fg-3)}.input-field:focus{border-color:var(--border-focus);outline:none;box-shadow:0 0 0 3px oklch(63% .21 265/.18)}textarea.input-field{resize:vertical;min-height:120px}@keyframes spin{to{transform:rotate(360deg)}}.spinner{border:2.5px solid var(--border-subtle);border-top-color:var(--color-primary);border-radius:50%;flex-shrink:0;width:20px;height:20px;animation:.8s linear infinite spin;display:inline-block}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fadeInUp var(--duration-slow) var(--ease-out) forwards}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-block{background:linear-gradient(90deg, var(--slate-100) 25%, var(--slate-200) 50%, var(--slate-100) 75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s ease-in-out infinite shimmer}.page-header{text-align:center;margin-bottom:3rem}.page-header h1{margin-bottom:.5rem}.page-header p{font-size:var(--text-lg);max-width:500px;margin:0 auto}