.btn{justify-content:center;align-items:center;gap:var(--space-2);font-family:var(--font-sans);font-weight:var(--weight-semibold);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--duration-normal) var(--ease-out);white-space:nowrap;border:1px solid #0000;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:2px}.btn-sm{font-size:var(--text-sm);min-height:32px;padding:6px 12px}.btn-md{font-size:var(--text-base);min-height:40px;padding:10px 20px}.btn-lg{font-size:var(--text-md);min-height:48px;padding:14px 28px}.btn-full{width:100%}.btn-primary{background:linear-gradient(135deg, var(--accent-cyan), #0284c7);color:#fff;border-color:#0000;box-shadow:0 2px 8px #0ea5e940}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg, var(--accent-cyan-hover), var(--accent-cyan));transform:translateY(-1px);box-shadow:0 4px 16px #0ea5e959}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-default)}.btn-secondary:hover:not(:disabled){background:var(--bg-card-hover);border-color:var(--border-strong)}.btn-ghost{color:var(--text-secondary);background:0 0;border-color:#0000}.btn-ghost:hover:not(:disabled){color:var(--text-primary);background:#ffffff0d}.btn-danger{background:var(--color-danger);color:#fff;border-color:#0000}.btn-danger:hover:not(:disabled){background:#dc2626;box-shadow:0 4px 12px #ef44444d}.btn-accent-orange{background:linear-gradient(135deg, var(--accent-orange), #c2410c);color:#fff}.btn-accent-orange:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 16px #ea580c59}.btn-loading{color:#0000!important}.btn-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.6s linear infinite btn-spin;position:absolute}@keyframes btn-spin{to{transform:rotate(360deg)}}.search-backdrop{background:var(--bg-overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:3000;animation:searchFadeIn var(--duration-fast) var(--ease-out);justify-content:center;align-items:flex-start;padding-top:10vh;display:flex;position:fixed;inset:0}@keyframes searchFadeIn{0%{opacity:0}to{opacity:1}}.search-modal{background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--radius-xl);width:100%;max-width:640px;box-shadow:var(--shadow-xl);flex-direction:column;display:flex;overflow:hidden}.search-header{align-items:center;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--border-default);background:var(--bg-elevated);display:flex}.search-input-icon{color:var(--text-muted);flex-shrink:0}.search-input{color:var(--text-primary);font-size:var(--text-base);background:0 0;border:none;outline:none;flex:1}.search-input::placeholder{color:var(--text-muted)}.search-clear-btn{color:var(--text-muted);cursor:pointer;padding:var(--space-1);background:0 0;border:none;align-items:center;display:flex}.search-shortcut{font-size:var(--text-xs);font-family:var(--font-mono);background:var(--bg-card);border:1px solid var(--border-default);color:var(--text-muted);border-radius:var(--radius-sm);padding:2px 6px}.search-body{max-height:400px;padding:var(--space-3);overflow-y:auto}.search-state{padding:var(--space-8) var(--space-4);text-align:center;color:var(--text-muted)}.search-empty{align-items:center;gap:var(--space-2);flex-direction:column;display:flex}.search-category{margin-bottom:var(--space-3)}.category-title{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--accent-cyan);text-transform:uppercase;letter-spacing:.05em;padding:var(--space-2) var(--space-3)}.search-result-item{align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);cursor:pointer;color:var(--text-primary);transition:background var(--duration-fast) var(--ease-out);display:flex}.search-result-item:hover{background:var(--bg-elevated)}.result-info{flex-direction:column;display:flex}.result-title{font-weight:var(--weight-medium);font-size:var(--text-sm)}.result-sub{font-size:var(--text-xs);color:var(--text-muted)}@media (width<=767px){.search-backdrop{padding:var(--space-4);align-items:stretch}.search-modal{max-height:90vh}.search-body{flex:1;max-height:none}.search-shortcut{display:none}}.navbar{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-subtle);height:var(--nav-height);background:#020610eb;position:fixed;top:0;left:0;right:0}.navbar-inner{max-width:var(--max-width);padding:0 var(--space-6);justify-content:space-between;align-items:center;gap:var(--space-8);height:100%;margin:0 auto;display:flex}.navbar-brand{flex-shrink:0;align-items:center;gap:0;text-decoration:none;display:flex}.navbar-logo-img{object-fit:contain;width:auto;height:36px}.navbar-links{align-items:center;gap:var(--space-1);flex:1;justify-content:center;display:flex}.navbar-link{color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);transition:all var(--duration-normal) var(--ease-out);white-space:nowrap;text-decoration:none}.navbar-link:hover{color:var(--text-primary);background:#ffffff0a}.navbar-link.active{color:var(--accent-cyan);background:var(--accent-cyan-dim)}.navbar-admin-link{color:var(--accent-orange)}.navbar-actions{align-items:center;gap:var(--space-3);flex-shrink:0;display:flex}.navbar-search-btn{align-items:center;gap:var(--space-2);background:var(--bg-surface);border:1px solid var(--border-default);color:var(--text-muted);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-xs);transition:all var(--duration-fast) var(--ease-out);padding:6px 12px;display:flex}.navbar-search-btn:hover{border-color:var(--accent-cyan);color:var(--text-primary);background:var(--bg-elevated)}.search-btn-kbd{font-family:var(--font-mono);background:var(--bg-base);border:1px solid var(--border-strong);border-radius:var(--radius-sm);color:var(--text-muted);padding:1px 4px;font-size:10px}.navbar-avatar{border-radius:var(--radius-full);background:var(--accent-cyan-dim);border:1px solid var(--accent-cyan);width:34px;height:34px;color:var(--accent-cyan);font-weight:var(--weight-bold);font-size:var(--text-sm);cursor:pointer;transition:all var(--duration-normal) var(--ease-out);justify-content:center;align-items:center;display:flex}.navbar-avatar:hover{background:#0ea5e940}.navbar-avatar-letter{text-transform:uppercase}.navbar-mobile-toggle{border:1px solid var(--border-default);border-radius:var(--radius-lg);background:var(--bg-elevated);width:38px;height:38px;color:var(--text-primary);cursor:pointer;transition:all var(--duration-normal) var(--ease-out);justify-content:center;align-items:center;display:none}.navbar-mobile-toggle:hover{border-color:var(--border-strong);background:var(--bg-card-hover)}.navbar-mobile-menu{top:var(--nav-height);background:var(--bg-surface);border-bottom:1px solid var(--border-default);padding:var(--space-4);gap:var(--space-1);animation:navbar-slide-down .2s var(--ease-out);flex-direction:column;display:flex;position:absolute;left:0;right:0}@keyframes navbar-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.navbar-mobile-link{padding:var(--space-3) var(--space-4);color:var(--text-primary);font-weight:var(--weight-semibold);border-radius:var(--radius-lg);transition:background var(--duration-fast);font-size:var(--text-base);cursor:pointer;text-align:left;width:100%;font-family:var(--font-sans);background:0 0;border:none;text-decoration:none;display:block}.navbar-mobile-link:hover{background:#ffffff0a}.navbar-mobile-link.active{color:var(--accent-cyan)}.navbar-mobile-logout{color:var(--color-danger)}.navbar-mobile-auth{gap:var(--space-2);margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--border-default);flex-direction:column;display:flex}@media (width<=767px){.navbar{height:var(--mobile-nav-height)}.navbar-inner{padding:0 var(--space-4)}.navbar-links{display:none}.navbar-mobile-toggle{display:flex}.navbar-actions .navbar-link,.navbar-actions .navbar-avatar{display:none}.navbar-actions a:has(.btn){display:none}.navbar-mobile-menu{top:var(--mobile-nav-height)}}@media (width>=768px){.navbar-mobile-menu{display:none!important}}.mobile-bottom-nav{height:var(--mobile-nav-height);background:var(--bg-surface);border-top:1px solid var(--border-default);z-index:1000;grid-template-columns:repeat(5,1fr);align-items:center;display:none;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 16px #0006}@media (width<=767px){.mobile-bottom-nav{display:grid}}.mobile-nav-item{height:100%;color:var(--text-muted);font-size:var(--text-xs);font-weight:var(--weight-medium);cursor:pointer;min-height:44px;transition:color var(--duration-fast) var(--ease-out);background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:3px;display:flex}.mobile-nav-item:hover,.mobile-nav-item.active{color:var(--accent-cyan)}.mobile-nav-label{line-height:1}.mobile-drawer-backdrop{background:var(--bg-overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2000;animation:fadeIn var(--duration-fast) var(--ease-out);flex-direction:column;justify-content:flex-end;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.mobile-drawer{background:var(--bg-surface);border-top:1px solid var(--border-strong);border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:var(--space-5);max-height:80vh;box-shadow:var(--shadow-xl);animation:slideUp var(--duration-slow) var(--ease-out);overflow-y:auto}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.mobile-drawer-header{padding-bottom:var(--space-4);border-bottom:1px solid var(--border-default);margin-bottom:var(--space-4);justify-content:space-between;align-items:center;display:flex}.drawer-user-info{align-items:center;gap:var(--space-3);display:flex}.drawer-avatar{border-radius:var(--radius-full);background:var(--brand-navy);border:1px solid var(--accent-cyan);width:36px;height:36px;color:var(--accent-cyan);font-weight:var(--weight-bold);font-size:var(--text-sm);justify-content:center;align-items:center;display:flex}.drawer-user-name{font-weight:var(--weight-semibold);color:var(--text-primary);font-size:var(--text-base)}.drawer-user-email{font-size:var(--text-xs);color:var(--text-muted)}.drawer-brand{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text-primary);display:block}.drawer-sub{font-size:var(--text-xs);color:var(--accent-cyan)}.drawer-close-btn{color:var(--text-secondary);padding:var(--space-2);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;min-width:44px;min-height:44px;display:flex}.mobile-drawer-links{gap:var(--space-2);flex-direction:column;display:flex}.drawer-link{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--text-base);font-weight:var(--weight-medium);text-align:left;cursor:pointer;min-height:48px;transition:background var(--duration-fast) var(--ease-out);background:0 0;border:none;display:flex}.drawer-link:hover,.drawer-link:active{background:var(--bg-elevated);color:var(--accent-cyan)}.drawer-admin{color:var(--accent-orange)}.drawer-divider{background:var(--border-default);height:1px;margin:var(--space-3) 0}.drawer-logout{color:var(--color-danger)}.drawer-auth-buttons{gap:var(--space-3);padding-top:var(--space-2);flex-direction:column;display:flex}.drawer-btn{width:100%;padding:var(--space-3);border-radius:var(--radius-md);font-weight:var(--weight-semibold);font-size:var(--text-base);cursor:pointer;border:none;min-height:48px}.drawer-btn-login{background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border-strong)}.drawer-btn-register{background:var(--accent-cyan);color:var(--text-inverse)}.mascot-chamber-section{padding:var(--space-20) 0;background:var(--bg-surface);border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);position:relative;overflow:hidden}.mascot-grid-bg{pointer-events:none;z-index:0;background-image:linear-gradient(#0ea5e90a 1px,#0000 1px),linear-gradient(90deg,#0ea5e90a 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:0}.mascot-section-inner{z-index:1;flex-direction:column;align-items:center;display:flex;position:relative}.mascot-section-header{text-align:center;margin-bottom:var(--space-12);max-width:640px}.mascot-badge{font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;color:var(--accent-orange);background:var(--accent-orange-dim);border-radius:var(--radius-full);margin-bottom:var(--space-3);border:1px solid #ea580c4d;padding:4px 12px;display:inline-block}.mascot-section-title{font-size:var(--text-4xl);margin-bottom:var(--space-2)}.mascot-highlight{background:linear-gradient(135deg, var(--accent-cyan), var(--accent-orange));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.mascot-section-subtitle{font-size:var(--text-md);color:var(--text-secondary)}.mascot-holo-wrapper{justify-content:center;width:100%;max-width:720px;display:flex}.mascot-holo-chamber{border:1px solid var(--border-strong);border-radius:var(--radius-2xl);width:100%;height:480px;box-shadow:var(--shadow-xl), var(--shadow-glow-cyan);cursor:pointer;background:radial-gradient(circle,#0c1a30 0%,#020610 100%);justify-content:center;align-items:center;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .3s;display:flex;position:relative;overflow:hidden}.mascot-holo-chamber.surging{border-color:var(--accent-orange);box-shadow:0 0 50px #ea580c80,0 0 20px #0ea5e980}.mascot-scope-bg{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.mascot-scope-ring{border:1px dashed #0ea5e933;border-radius:50%;width:320px;height:320px;animation:30s linear infinite ring-spin}.mascot-scope-ring-inner{border:1px solid #ea580c26;border-radius:50%;width:220px;height:220px;animation:20s linear infinite ring-spin-reverse;position:absolute}@keyframes ring-spin{to{transform:rotate(360deg)}}@keyframes ring-spin-reverse{to{transform:rotate(-360deg)}}.holo-code-line{font-family:var(--font-mono);color:var(--accent-cyan);opacity:.5;pointer-events:none;z-index:1;text-shadow:0 0 8px #0ea5e966;font-size:.7rem;position:absolute}.line-1,.line-3{color:var(--accent-orange);text-shadow:0 0 8px #ea580c66}.mascot-interactive-video{object-fit:contain;z-index:2;filter:drop-shadow(0 20px 30px #000000b3);width:80%;height:80%;transition:filter .3s;position:relative}.mascot-interactive-video.glitch-glow{filter:drop-shadow(0 0 30px var(--accent-orange)) brightness(1.3)}.surge-banner{bottom:var(--space-4);color:#fff;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--weight-bold);padding:var(--space-2) var(--space-4);border-radius:var(--radius-lg);align-items:center;gap:var(--space-2);z-index:10;background:#ea580ce6;animation:.4s infinite alternate banner-pulse;display:flex;position:absolute}@keyframes banner-pulse{0%{opacity:.8;transform:scale(.98)}to{opacity:1;transform:scale(1)}}@media (width<=767px){.mascot-holo-chamber{height:340px}.holo-code-line{display:none}}.landing{flex-direction:column;min-height:100vh;display:flex}.hero{padding:calc(var(--nav-height) + var(--space-12)) 0 var(--space-16);background:radial-gradient(circle at 50% 20%, #0ea5e914 0%, transparent 60%), var(--bg-base);position:relative;overflow:hidden}.hero-content{gap:var(--space-12);grid-template-columns:1fr 1fr;align-items:center;display:grid}.hero-badge{background:var(--accent-orange-dim);color:var(--accent-orange);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--weight-semibold);margin-bottom:var(--space-4);border:1px solid #ea580c4d;padding:6px 14px;display:inline-block}.hero-title{font-size:var(--text-5xl);font-weight:var(--weight-extrabold);line-height:var(--leading-tight);margin-bottom:var(--space-4);background:linear-gradient(135deg, var(--text-primary) 60%, var(--text-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.hero-subtitle{font-size:var(--text-lg);color:var(--text-secondary);margin-bottom:var(--space-8);max-width:520px}.hero-actions{gap:var(--space-4);margin-bottom:var(--space-8);flex-wrap:wrap;display:flex}.hero-meta{gap:var(--space-4) var(--space-6);color:var(--text-muted);font-size:var(--text-sm);flex-wrap:wrap;display:flex}.hero-meta-item{align-items:center;gap:var(--space-2);display:flex}.hero-code-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl), var(--shadow-glow-cyan);overflow:hidden}.code-card-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle);align-items:center;gap:var(--space-2);background:#0000004d;display:flex}.code-card-dot{border-radius:50%;width:10px;height:10px}.code-card-title{margin-left:var(--space-2);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.code-card-body{padding:var(--space-5);font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);line-height:1.6;overflow-x:auto}.section{padding:var(--space-16) 0}.section-alt{background:var(--bg-surface);border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}.section-title{text-align:center;font-size:var(--text-3xl);margin-bottom:var(--space-2)}.section-subtitle{text-align:center;font-size:var(--text-lg);color:var(--text-muted);margin-bottom:var(--space-12)}.section-cta{margin-top:var(--space-8);justify-content:center;display:flex}.flow-steps{gap:var(--space-6);grid-template-columns:repeat(4,1fr);display:grid}.flow-step{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6);position:relative}.flow-step-num{font-family:var(--font-mono);font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--accent-cyan);margin-bottom:var(--space-3)}.flow-step-text{color:var(--text-primary);font-weight:var(--weight-semibold)}.curriculum-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.curriculum-card{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-5);transition:all var(--duration-normal) var(--ease-out)}.curriculum-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}.curriculum-card-header{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.curriculum-tier{font-size:var(--text-xs);font-weight:var(--weight-semibold);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-sm);padding:2px 8px}.tier-beginner{background:var(--accent-cyan-dim);color:var(--accent-cyan)}.tier-intermediate{background:var(--accent-orange-dim);color:var(--accent-orange)}.tier-advanced{background:var(--accent-purple-dim);color:var(--accent-purple)}.curriculum-count{font-size:var(--text-xs);color:var(--text-muted)}.curriculum-name{font-size:var(--text-md);font-weight:var(--weight-bold)}.benefits-grid{gap:var(--space-4);grid-template-columns:repeat(3,1fr);max-width:900px;margin:0 auto;display:grid}.benefit-item{align-items:center;gap:var(--space-3);background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:var(--space-4);display:flex}.benefit-icon{color:var(--color-success);flex-shrink:0}.section-cta-final{background:linear-gradient(180deg, var(--bg-base), var(--bg-surface));border-top:1px solid var(--border-subtle);text-align:center}.cta-final-title{font-size:var(--text-3xl);margin-bottom:var(--space-2)}.cta-final-text{font-size:var(--text-lg);color:var(--text-secondary);margin-bottom:var(--space-8)}.footer{background:var(--bg-base);border-top:1px solid var(--border-default);padding:var(--space-8) 0;margin-top:auto}.footer-inner{justify-content:space-between;align-items:center;gap:var(--space-6);flex-wrap:wrap;display:flex}.footer-brand{gap:var(--space-1);flex-direction:column;display:flex}.footer-tagline{font-size:var(--text-xs);color:var(--text-muted)}.footer-links{gap:var(--space-6);font-size:var(--text-sm);color:var(--text-secondary);display:flex}.footer-copy{text-align:center;width:100%;font-size:var(--text-xs);color:var(--text-muted);padding-top:var(--space-6);border-top:1px solid var(--border-subtle)}@media (width<=1023px){.hero-content{grid-template-columns:1fr}.flow-steps,.benefits-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=767px){.hero{padding:calc(var(--mobile-nav-height) + var(--space-8)) 0 var(--space-8)}.hero-title{font-size:var(--text-3xl)}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .btn{width:100%}.hero-meta{font-size:var(--text-xs)}.flow-steps,.benefits-grid{grid-template-columns:1fr}.footer-inner{text-align:center;flex-direction:column}.footer-links{flex-wrap:wrap;justify-content:center}}.courses-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.page-header{text-align:center;margin-bottom:var(--space-12)}.page-title{font-size:var(--text-4xl);margin-bottom:var(--space-2)}.page-subtitle{font-size:var(--text-lg);color:var(--text-secondary);max-width:600px;margin:0 auto}.courses-grid{gap:var(--space-8);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.course-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);transition:all var(--duration-normal) var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.course-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.course-card-banner{height:140px;padding:var(--space-4);justify-content:space-between;align-items:flex-start;display:flex;position:relative}.course-theme-cyan .course-card-banner{background:linear-gradient(135deg,#0ea5e933,#0f2e5ccc);border-bottom:1px solid #0ea5e933}.course-theme-orange .course-card-banner{background:linear-gradient(135deg,#ea580c33,#0f2e5ccc);border-bottom:1px solid #ea580c33}.course-lang-tag{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--weight-bold);border-radius:var(--radius-md);text-transform:uppercase;background:#0009;padding:4px 10px}.course-level-tag{color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-semibold);border-radius:var(--radius-md);text-transform:uppercase;background:#ffffff1a;padding:4px 10px}.course-card-content{padding:var(--space-6);flex-direction:column;flex:1;display:flex}.course-card-title{font-size:var(--text-2xl);margin-bottom:var(--space-2)}.course-card-summary{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-6);line-height:1.6}.course-outcomes{margin-bottom:var(--space-6)}.outcomes-heading{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3)}.course-outcomes ul{gap:var(--space-2);flex-direction:column;list-style:none;display:flex}.course-outcomes li{align-items:flex-start;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary);display:flex}.outcome-icon{color:var(--accent-cyan);flex-shrink:0;margin-top:3px}.course-card-footer{padding-top:var(--space-6);border-top:1px solid var(--border-subtle);gap:var(--space-4);flex-direction:column;margin-top:auto;display:flex}.course-meta{gap:var(--space-4);font-size:var(--text-xs);color:var(--text-muted);display:flex}.course-meta span{align-items:center;gap:4px;display:flex}.course-progress-block{flex-direction:column;gap:4px;display:flex}.progress-bar{background:var(--bg-elevated);border-radius:var(--radius-full);height:6px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--accent-cyan), var(--accent-cyan-hover));border-radius:var(--radius-full);height:100%;transition:width var(--duration-slow)}.progress-text{font-size:var(--text-xs);color:var(--accent-cyan);font-weight:var(--weight-semibold)}.skeleton-card{padding:var(--space-6)}@media (width<=767px){.courses-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.page-header{margin-bottom:var(--space-8)}.page-title{font-size:var(--text-2xl)}.courses-grid{gap:var(--space-6);grid-template-columns:1fr}.course-card-content{padding:var(--space-5)}}.course-detail-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.course-header{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);padding:var(--space-8);margin-bottom:var(--space-12)}.course-header-meta{gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.course-title{font-size:var(--text-4xl);margin-bottom:var(--space-3)}.course-summary{font-size:var(--text-lg);color:var(--text-secondary);max-width:800px;margin-bottom:var(--space-8)}.course-actions{gap:var(--space-4);flex-wrap:wrap;display:flex}.syllabus-section{gap:var(--space-6);flex-direction:column;display:flex}.section-heading{font-size:var(--text-2xl)}.chapters-list{gap:var(--space-6);flex-direction:column;display:flex}.chapter-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);overflow:hidden}.chapter-header{padding:var(--space-5) var(--space-6);background:var(--bg-elevated);border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.chapter-info{flex-direction:column;gap:2px;display:flex}.chapter-num{font-size:var(--text-xs);color:var(--accent-cyan);font-weight:var(--weight-bold);text-transform:uppercase;letter-spacing:.05em}.chapter-title{font-size:var(--text-lg)}.lessons-list{flex-direction:column;display:flex}.lesson-row{padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--border-subtle);transition:background var(--duration-fast);justify-content:space-between;align-items:center;display:flex}.lesson-row:last-child{border-bottom:none}.lesson-row:hover{background:#ffffff05}.lesson-left{align-items:center;gap:var(--space-3);display:flex}.lesson-icon{color:var(--accent-cyan)}.lesson-title{font-size:var(--text-base);color:var(--text-primary)}.lesson-right{align-items:center;gap:var(--space-4);display:flex}.lesson-duration{font-size:var(--text-xs);color:var(--text-muted);font-family:var(--font-mono)}.scheduled-tag{font-size:var(--text-xs);color:var(--accent-orange);background:var(--accent-orange-dim);border-radius:var(--radius-sm);padding:2px 8px}.lock-icon{color:var(--text-muted)}.lesson-state-locked{opacity:.5}.error-box{text-align:center;padding:var(--space-16);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);align-items:center;gap:var(--space-4);flex-direction:column;display:flex}@media (width<=767px){.course-detail-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.course-header{padding:var(--space-6);border-radius:var(--radius-xl);margin-bottom:var(--space-8)}.course-title{font-size:var(--text-2xl)}.course-summary{font-size:var(--text-base);margin-bottom:var(--space-6)}.course-actions .btn{flex:auto}.chapter-header{padding:var(--space-4)}.lesson-row{padding:var(--space-3) var(--space-4);gap:var(--space-3)}.lesson-left{flex:1;min-width:0}.lesson-title{font-size:var(--text-sm)}.lesson-right{gap:var(--space-3);flex-shrink:0}.error-box{padding:var(--space-8) var(--space-5)}}.roadmap-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-20) 0;background:var(--bg-base);min-height:calc(100vh - var(--nav-height))}.roadmap-header{text-align:center;max-width:760px;margin:0 auto var(--space-8) auto}.roadmap-badge{padding:var(--space-1) var(--space-3);background:var(--accent-cyan-dim);color:var(--accent-cyan);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3);display:inline-block}.roadmap-title{font-size:var(--text-4xl);font-weight:var(--weight-extrabold);margin-bottom:var(--space-3)}.roadmap-subtitle{font-size:var(--text-lg);color:var(--text-secondary)}.roadmap-legend{justify-content:center;align-items:center;gap:var(--space-3) var(--space-6);margin-bottom:var(--space-10);padding:var(--space-4);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);flex-wrap:wrap;max-width:640px;margin-left:auto;margin-right:auto;display:flex}.legend-item{align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);display:flex}.legend-icon{align-items:center;display:flex}.icon-completed{color:var(--color-success)}.icon-current{color:var(--accent-cyan)}.icon-upcoming{color:var(--color-warning)}.roadmap-tiers-container{gap:var(--space-10);flex-direction:column;display:flex}.roadmap-tier-section{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);padding:var(--space-6) var(--space-8);position:relative;overflow:hidden}.tier-cyan{border-left:4px solid var(--accent-cyan)}.tier-orange{border-left:4px solid var(--accent-orange)}.tier-purple{border-left:4px solid var(--accent-purple)}.tier-header{margin-bottom:var(--space-6)}.tier-badge-title{align-items:center;gap:var(--space-3);margin-bottom:4px;display:flex}.tier-badge-pill{border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;padding:2px 10px}.pill-cyan{background:var(--accent-cyan-dim);color:var(--accent-cyan)}.pill-orange{background:var(--accent-orange-dim);color:var(--accent-orange)}.pill-purple{background:var(--accent-purple-dim);color:var(--accent-purple)}.tier-header h2{font-size:var(--text-2xl)}.tier-sub{font-size:var(--text-sm);color:var(--text-muted)}.tier-families-grid{gap:var(--space-5);grid-template-columns:repeat(3,1fr);display:grid}@media (width<=1023px){.tier-families-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=639px){.tier-families-grid{grid-template-columns:1fr}.roadmap-tier-section{padding:var(--space-5)}}@media (width<=767px){.roadmap-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 var(--space-10)}.roadmap-title{font-size:var(--text-2xl)}.roadmap-subtitle{font-size:var(--text-base)}.roadmap-legend{justify-content:flex-start}.roadmap-bottom-cta{padding:var(--space-8) var(--space-5);margin-top:var(--space-10)}.cta-heading{font-size:var(--text-2xl)}.cta-buttons{flex-direction:column;width:100%}.cta-buttons .btn{width:100%}}.roadmap-card{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-5);gap:var(--space-3);cursor:pointer;transition:all var(--duration-normal) var(--ease-out);flex-direction:column;display:flex}.roadmap-card:hover{border-color:var(--border-strong);background:var(--bg-card-hover);transform:translateY(-2px)}.roadmap-card.status-current{border-color:var(--accent-cyan);background:var(--brand-navy);box-shadow:0 0 20px #0ea5e91f}.roadmap-card.status-locked{opacity:.6}.card-top{justify-content:space-between;align-items:center;display:flex}.lessons-badge{font-size:var(--text-xs);font-family:var(--font-mono);color:var(--text-muted)}.card-family-name{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text-primary)}.card-callout{border:1px solid var(--border-subtle);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--text-secondary);background:#ffffff08;align-items:flex-start;gap:6px;line-height:1.4;display:flex}.callout-icon{color:var(--accent-orange);flex-shrink:0;margin-top:2px}.card-topics{flex-wrap:wrap;gap:6px;margin-top:auto;display:flex}.topic-tag{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-muted);padding:2px 8px;font-size:11px}.roadmap-bottom-cta{margin-top:var(--space-16);text-align:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);padding:var(--space-10) var(--space-6)}.cta-heading{font-size:var(--text-3xl);margin-bottom:var(--space-2)}.cta-sub{font-size:var(--text-base);color:var(--text-secondary);margin-bottom:var(--space-6)}.cta-buttons{justify-content:center;align-items:center;gap:var(--space-4);flex-wrap:wrap;display:flex}.pricing-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.pricing-cards{justify-content:center;display:flex}.pricing-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);width:100%;max-width:440px;padding:var(--space-8);flex-direction:column;display:flex;position:relative}.pricing-card.featured{border-color:var(--accent-cyan);box-shadow:var(--shadow-xl), var(--shadow-glow-cyan)}.pricing-badge{background:var(--accent-cyan);color:var(--text-inverse);font-size:var(--text-xs);font-weight:var(--weight-bold);border-radius:var(--radius-full);text-transform:uppercase;align-self:center;padding:4px 12px;position:absolute;top:-12px}.plan-name{font-size:var(--text-2xl);margin-bottom:var(--space-4);text-align:center}.plan-price{justify-content:center;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-4);display:flex}.price-val{font-size:var(--text-4xl);font-weight:var(--weight-extrabold);color:var(--accent-cyan)}.price-period{font-size:var(--text-sm);color:var(--text-muted)}.plan-desc{font-size:var(--text-sm);color:var(--text-secondary);text-align:center;margin-bottom:var(--space-8)}.plan-features{gap:var(--space-3);margin-bottom:var(--space-8);flex-direction:column;list-style:none;display:flex}.plan-features li{align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--text-primary);display:flex}.plan-features li svg{color:var(--accent-cyan)}@media (width<=767px){.pricing-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.pricing-card{padding:var(--space-6);border-radius:var(--radius-xl)}.price-val{font-size:var(--text-3xl)}}.coderun-root{gap:var(--space-3);flex-direction:column;min-height:540px;display:flex}.coderun-toolbar{align-items:center;gap:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;flex-shrink:0;display:flex}.coderun-select{background:var(--bg-input);border:1px solid var(--border-default);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-sm);border-radius:var(--radius-lg);cursor:pointer;outline:none;min-height:38px;padding:8px 12px}.coderun-select:focus-visible{border-color:var(--accent-cyan)}.template-select{text-overflow:ellipsis;flex:1;min-width:0;max-width:360px}.lang-tabs{background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-lg);flex-shrink:0;display:flex;overflow:hidden}.lang-tab{font-size:var(--text-xs);font-family:var(--font-mono);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;transition:all var(--duration-fast) var(--ease-out);background:0 0;border:none;padding:8px 14px}.lang-tab:hover{color:var(--text-primary);background:#ffffff0a}.lang-tab.active{color:var(--accent-cyan);background:var(--accent-cyan-dim)}.toolbar-spacer{flex:1}.coderun-saved-badge{font-size:var(--text-xs);font-family:var(--font-mono);color:var(--color-success);animation:fadeIn .2s var(--ease-out);align-items:center;gap:5px;display:flex}.btn-kbd{font-family:var(--font-mono);font-size:10px;font-weight:var(--weight-regular);opacity:.85;background:#ffffff26;border-radius:4px;margin-left:6px;padding:1px 5px}.coderun-mobile-tabs{gap:var(--space-2);display:flex}.mobile-tab-btn{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-lg);min-height:44px;color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--duration-fast) var(--ease-out);flex:1;justify-content:center;align-items:center;gap:6px;padding:10px 12px;display:flex}.mobile-tab-btn:hover{border-color:var(--border-strong);color:var(--text-primary)}.mobile-tab-btn.active{background:var(--accent-cyan-dim);border-color:var(--accent-cyan);color:var(--accent-cyan)}.tab-dot{background:var(--accent-cyan);border-radius:50%;width:6px;height:6px;display:inline-block}.coderun-layout,.workspace{gap:var(--space-3);flex-direction:column;flex:1;min-height:0;display:flex}.workspace-editor,.workspace-output{min-width:0;min-height:0;display:flex;overflow:hidden}.problem-pane{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);flex-direction:column;min-height:0;display:flex;overflow:hidden}.problem-pane-head{background:var(--bg-elevated);border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;padding:8px 14px;display:flex}.problem-pane-label{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.problem-toggle-btn{color:var(--text-muted);border-radius:var(--radius-md);cursor:pointer;width:32px;height:32px;transition:all var(--duration-fast) var(--ease-out);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.problem-toggle-btn:hover{color:var(--accent-cyan);background:var(--accent-cyan-dim)}.problem-panel{padding:var(--space-4);overflow-y:auto}.problem-title{font-size:var(--text-lg);letter-spacing:-.01em;margin-bottom:var(--space-3)}.problem-badges{gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.badge{font-size:10px;font-weight:var(--weight-semibold);letter-spacing:.02em;border-radius:var(--radius-full);white-space:nowrap;padding:3px 9px}.badge.difficulty.tone-success{color:#34d399;background:var(--color-success-dim);border:1px solid #10b98159}.badge.difficulty.tone-warning{color:#fbbf24;background:var(--color-warning-dim);border:1px solid #f59e0b59}.badge.difficulty.tone-danger{color:#f87171;background:var(--color-danger-dim);border:1px solid #ef444459}.badge.difficulty.tone-neutral{color:var(--text-secondary);background:var(--bg-elevated);border:1px solid var(--border-default)}.badge.family{color:#a78bfa;background:var(--accent-purple-dim);border:1px solid #7c3aed59}.badge.tier{color:#fb923c;background:var(--accent-orange-dim);border:1px solid #ea580c59}.problem-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed)}.problem-section{margin-top:var(--space-4)}.problem-section-title{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-2)}.example-block{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);margin-bottom:var(--space-2);padding:10px 12px}.example-label{font-size:10px;font-weight:var(--weight-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}.example-line{font-size:var(--text-xs);color:var(--text-secondary);align-items:baseline;gap:8px;margin-bottom:4px;display:flex}.example-key{font-family:var(--font-mono);color:var(--text-muted);flex-shrink:0}.example-line code{color:#e2e8f0;background:#ffffff0a;border-radius:4px;padding:1px 6px;font-size:11px}.example-explanation{align-items:flex-start}.constraints-list{flex-direction:column;gap:6px;list-style:none;display:flex}.constraints-list li{font-size:var(--text-xs);color:var(--text-secondary);align-items:center;gap:8px;display:flex}.constraints-list li:before{content:"";background:var(--accent-cyan);border-radius:50%;flex-shrink:0;width:4px;height:4px}.constraints-list code{color:#cbd5e1}.editor-panel{border:1px solid var(--border-default);border-radius:var(--radius-xl);background:#050b14;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.editor-header{background:var(--bg-elevated);border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;padding:7px 14px;display:flex}.editor-file{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--accent-cyan);align-items:center;gap:6px;display:flex}.editor-linecount{font-family:var(--font-mono);color:var(--text-muted);font-size:10px}.editor-actions{align-items:center;gap:var(--space-2);display:flex}.editor-reset-btn{border-radius:var(--radius-md);width:26px;height:26px;color:var(--text-muted);cursor:pointer;transition:all var(--duration-fast) var(--ease-out);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;display:flex}.editor-reset-btn:hover{color:var(--accent-orange);border-color:var(--accent-orange);background:var(--accent-orange-dim)}.editor-body{flex:1;min-height:0;position:relative;overflow:hidden}.gutter-scroll{pointer-events:none;border-right:1px solid var(--border-subtle);z-index:1;width:44px;position:absolute;top:0;bottom:0;left:0;overflow:hidden}.gutter{will-change:transform;padding-top:12px}.gutter-line{text-align:right;height:20.8px;line-height:20.8px;font-family:var(--font-mono);color:var(--text-muted);-webkit-user-select:none;user-select:none;padding-right:10px;font-size:12px}.coderun-textarea{color:#e2e8f0;width:100%;height:100%;font-family:var(--font-mono);font-size:var(--text-sm);resize:none;white-space:pre;tab-size:2;background:0 0;border:none;outline:none;padding:12px 14px 12px 52px;line-height:20.8px;position:absolute;inset:0;overflow:auto}.output-panel{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.output-toolbar{justify-content:space-between;align-items:center;gap:var(--space-3);border-bottom:1px solid var(--border-subtle);flex-shrink:0;padding:8px 14px;display:flex}.output-status{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;align-items:center;gap:8px;display:flex}.status-dot{background:var(--text-muted);border-radius:50%;flex-shrink:0;width:8px;height:8px}.output-status.is-running .status-dot{background:var(--accent-cyan);animation:1s ease-in-out infinite status-pulse}.output-status.is-done{color:var(--color-success)}.output-status.is-done .status-dot{background:var(--color-success)}.output-status.is-error{color:var(--color-danger)}.output-status.is-error .status-dot{background:var(--color-danger)}.output-status.is-running{color:var(--accent-cyan)}@keyframes status-pulse{0%,to{opacity:1}50%{opacity:.35}}.output-meta{gap:var(--space-2);display:flex}.meta-chip{font-family:var(--font-mono);color:var(--accent-cyan);background:var(--accent-cyan-dim);border-radius:var(--radius-full);border:1px solid #0ea5e940;padding:2px 7px;font-size:10px}.output-body{min-height:0;padding:var(--space-3);gap:var(--space-3);flex-direction:column;flex:1;display:flex;overflow-y:auto}.input-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:5px;display:block}.stdin-input{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-mono);font-size:var(--text-xs);outline:none;min-height:34px;padding:8px 12px}.stdin-input:focus-visible{border-color:var(--accent-cyan)}.stdin-input:disabled{opacity:.6}.console-block{flex-direction:column;display:flex}.stdout-pre,.stderr-pre{border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-3);font-family:var(--font-mono);font-size:var(--text-xs);white-space:pre-wrap;word-break:break-word;background:#020610;min-height:72px;max-height:240px;overflow-y:auto}.stdout-pre{color:var(--color-success)}.console-hint{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--text-muted);line-height:var(--leading-normal);border-left:2px solid var(--border-strong);padding:2px 0 2px var(--space-3)}.stderr-pre{color:var(--color-danger);margin-top:var(--space-2)}.solution-section{border-top:1px solid var(--border-subtle);padding-top:var(--space-3)}.solution-toggle-btn{align-items:center;gap:var(--space-2);border:1px solid var(--border-default);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-medium);border-radius:var(--radius-md);cursor:pointer;min-height:34px;transition:all var(--duration-fast) var(--ease-out);background:0 0;padding:7px 12px;display:flex}.solution-toggle-btn:hover{color:var(--accent-cyan);border-color:var(--accent-cyan)}.solution-content{margin-top:var(--space-2);border:1px solid var(--border-default);border-radius:var(--radius-md);padding:var(--space-3);animation:fadeIn .2s var(--ease-out);background:#030a16}.solution-header{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--accent-cyan);margin-bottom:var(--space-2)}.solution-code{font-family:var(--font-mono);font-size:var(--text-xs);color:#cbd5e1;white-space:pre-wrap;word-break:break-word;max-height:260px;overflow-y:auto}.coderun-mobile-notice{align-items:center;gap:var(--space-2);background:var(--accent-cyan-dim);color:var(--accent-cyan);padding:7px var(--space-3);border-radius:var(--radius-md);font-size:var(--text-xs);border:1px solid #0ea5e940;flex-shrink:0;display:none}.coderun-sticky-mobile{bottom:calc(var(--mobile-nav-height) + 12px);z-index:50;display:none;position:sticky}.coderun-loading{gap:var(--space-3);flex-direction:column;height:100%;display:flex}.coderun-skeleton-bar{flex-shrink:0;width:70%;height:44px}.coderun-skeleton-editor{flex:1}@media (width<=767px){.coderun-root{min-height:0}.run-desktop-btn{display:none}.coderun-mobile-notice{display:flex}.coderun-sticky-mobile{display:block}.mobile-hidden{display:none!important}.template-select{max-width:none}.workspace-editor{height:58vh}.workspace-output{height:52vh}}@media (width>=768px) and (width<=1023px){.coderun-mobile-tabs{display:none}.mobile-hidden{display:flex}.run-desktop-btn{display:inline-flex}.coderun-layout{flex-direction:column}.problem-pane{flex-shrink:0;max-height:320px}.workspace{flex-direction:row;align-items:stretch}.workspace-editor{flex:1.3}.workspace-output{flex:1}}@media (width>=1024px){.coderun-mobile-tabs{display:none}.mobile-hidden{display:flex}.run-desktop-btn{display:inline-flex}.coderun-layout{flex-direction:row;align-items:stretch}.problem-pane{flex-shrink:0;width:380px}.workspace{flex-direction:column}.workspace-editor{flex:1.25}.workspace-output{flex:1}}.coderun-embedded{min-height:0}.coderun-embedded .coderun-toolbar{border-bottom:none;padding-bottom:0}.coderun-embedded .coderun-workspace{gap:var(--space-3);flex-direction:column;flex:1;min-height:0;display:flex}.coderun-embedded .editor-panel{flex:none;min-height:300px}.coderun-embedded .output-panel{flex:none;min-height:220px}.coderun-embedded .lang-tab{padding:7px 11px}@media (width<=767px){.coderun-embedded .editor-panel{min-height:260px}.coderun-embedded .output-panel{min-height:200px}}.practice-page{height:calc(100vh - var(--nav-height));padding-top:var(--nav-height);display:flex;overflow:hidden}.practice-page-inner{max-width:var(--max-width);padding:0 var(--space-6);flex-direction:column;width:100%;height:100%;min-height:0;margin:0 auto;display:flex}.practice-header{padding:var(--space-5) 0 var(--space-4);justify-content:space-between;align-items:flex-end;gap:var(--space-4);flex-wrap:wrap;flex-shrink:0;display:flex}.practice-title{font-size:var(--text-2xl);letter-spacing:-.02em}.practice-subtitle{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-1)}.family-filters{gap:var(--space-2);flex-wrap:wrap;display:flex}.family-chip{background:var(--bg-surface);border:1px solid var(--border-default);color:var(--text-secondary);font-size:var(--text-xs);font-weight:var(--weight-medium);border-radius:var(--radius-full);cursor:pointer;min-height:32px;transition:all var(--duration-fast) var(--ease-out);white-space:nowrap;padding:6px 12px}.family-chip:hover{border-color:var(--border-strong);color:var(--text-primary)}.family-chip.active{background:var(--accent-cyan-dim);border-color:var(--accent-cyan);color:var(--accent-cyan)}.practice-shell{min-height:0;padding-bottom:var(--space-4);flex:1}.practice-shell>*{height:100%}.practice-skeleton{gap:var(--space-3);flex-direction:column;height:100%;display:flex}.practice-skel-bar{flex-shrink:0;width:60%;height:44px}.practice-skel-editor{flex:1}@media (width>=768px) and (width<=1023px){.practice-title{font-size:var(--text-xl)}}@media (width<=767px){.practice-page{height:auto;min-height:calc(100vh - var(--mobile-nav-height));padding-top:var(--mobile-nav-height);padding-bottom:calc(var(--mobile-nav-height) + var(--space-4))}.practice-page-inner{padding:0 var(--space-4)}.practice-header{padding:var(--space-4) 0;align-items:flex-start;gap:var(--space-3);flex-direction:column}.practice-title{font-size:var(--text-xl)}.practice-subtitle{font-size:var(--text-xs)}.family-filters{scrollbar-width:none;flex-wrap:nowrap;width:100%;padding-bottom:2px;overflow-x:auto}.family-filters::-webkit-scrollbar{display:none}.practice-shell{padding-bottom:0}}.sessions-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.sessions-login-gate{text-align:center;padding:var(--space-16);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);align-items:center;gap:var(--space-4);flex-direction:column;display:flex}.sessions-list{gap:var(--space-6);flex-direction:column;max-width:800px;margin:0 auto;display:flex}.session-list-item{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6);gap:var(--space-3);flex-direction:column;display:flex}.session-item-header{gap:var(--space-3);align-items:center;display:flex}.status-pill{font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;border-radius:var(--radius-sm);padding:2px 8px}.status-scheduled{background:var(--accent-cyan-dim);color:var(--accent-cyan)}.status-ended{color:var(--text-muted);background:#ffffff1a}.session-item-provider{font-size:var(--text-xs);color:var(--accent-purple);text-transform:uppercase;font-weight:var(--weight-bold)}.session-item-title{font-size:var(--text-xl)}.session-item-desc{font-size:var(--text-sm);color:var(--text-secondary)}.session-item-footer{padding-top:var(--space-4);border-top:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.session-item-time{font-size:var(--text-xs);color:var(--text-muted);align-items:center;gap:4px;display:flex}@media (width<=767px){.sessions-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.sessions-login-gate{padding:var(--space-8) var(--space-5)}.session-item-header{flex-wrap:wrap}.session-item-title{font-size:var(--text-lg)}.session-item-footer{align-items:flex-start;gap:var(--space-3);flex-direction:column}}.auth-page{min-height:calc(100vh - var(--nav-height));padding:var(--space-8) var(--space-4);background:radial-gradient(circle at 50% 30%, #0ea5e90f 0%, transparent 60%), var(--bg-base);justify-content:center;align-items:center;display:flex}.auth-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);width:100%;max-width:420px;padding:var(--space-8);box-shadow:var(--shadow-xl)}.auth-header{text-align:center;margin-bottom:var(--space-6)}.auth-logo{width:auto;height:44px;margin-bottom:var(--space-4)}.auth-title{font-size:var(--text-2xl);margin-bottom:var(--space-1)}.auth-subtitle{font-size:var(--text-sm);color:var(--text-muted)}.auth-error{align-items:center;gap:var(--space-2);background:var(--color-danger-dim);color:#fca5a5;padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm);margin-bottom:var(--space-4);border:1px solid #ef44444d;display:flex}.auth-form{gap:var(--space-4);flex-direction:column;display:flex}.form-group label{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.form-group input,.form-group select,.form-group textarea{background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-lg);width:100%;color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);transition:all var(--duration-fast);padding:10px 14px}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent-cyan);box-shadow:0 0 0 3px var(--accent-cyan-dim);outline:none}.auth-footer{margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--border-subtle);text-align:center;font-size:var(--text-sm);color:var(--text-muted)}.auth-footer a{color:var(--accent-cyan);font-weight:var(--weight-semibold)}.auth-demo-hint{margin-top:var(--space-4);padding:var(--space-3);background:var(--bg-elevated);border-radius:var(--radius-md);font-size:var(--text-xs);flex-direction:column;gap:4px;display:flex}.auth-demo-hint code{color:var(--accent-cyan);border-radius:var(--radius-sm);background:#0000004d;padding:2px 6px}@media (width<=767px){.auth-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) var(--space-4) var(--space-8)}.auth-card{padding:var(--space-6);border-radius:var(--radius-xl)}}.verify-page{padding:var(--space-16) 0;min-height:calc(100vh - var(--nav-height));justify-content:center;align-items:center;display:flex}.verify-card{background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--radius-2xl);width:100%;max-width:680px;padding:var(--space-10) var(--space-8);box-shadow:var(--shadow-xl);text-align:center;align-items:center;gap:var(--space-6);flex-direction:column;margin:0 auto;display:flex;position:relative}.verify-badge-header{align-items:center;gap:var(--space-3);flex-direction:column;display:flex}.official-seal{background:var(--brand-navy);border:2px solid var(--accent-cyan);width:72px;height:72px;color:var(--accent-cyan);border-radius:50%;justify-content:center;align-items:center;display:flex;box-shadow:0 0 24px #0ea5e933}.verify-status{align-items:center;gap:var(--space-2);color:var(--color-success);font-size:var(--text-sm);font-weight:var(--weight-semibold);background:var(--color-success-dim);border-radius:var(--radius-full);padding:4px 14px;display:flex}.cert-details{gap:var(--space-3);flex-direction:column;width:100%;display:flex}.cert-id-label{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.cert-student-name{font-size:var(--text-3xl);font-weight:var(--weight-extrabold);color:var(--text-primary)}.cert-text{font-size:var(--text-base);color:var(--text-secondary);max-width:500px;margin:0 auto}.cert-course-title{font-size:var(--text-2xl);color:var(--accent-cyan);font-weight:var(--weight-bold)}.cert-meta{justify-content:center;align-items:center;gap:var(--space-3);font-size:var(--text-xs);color:var(--text-muted);display:flex}.cert-actions{align-items:center;gap:var(--space-4);flex-wrap:wrap;justify-content:center;display:flex}.cert-footer-note{align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--text-muted);display:flex}@media (width<=767px){.verify-page{padding:var(--space-8) 0}.verify-card{padding:var(--space-8) var(--space-5);border-radius:var(--radius-xl)}.official-seal{width:56px;height:56px}.cert-student-name{font-size:var(--text-2xl)}.cert-course-title{font-size:var(--text-xl)}.cert-meta{flex-wrap:wrap}.cert-actions{flex-direction:column;width:100%}.cert-actions .btn{width:100%}}.error-page{padding:var(--space-20) 0;min-height:calc(100vh - var(--nav-height));justify-content:center;align-items:center;display:flex}.error-content{text-align:center;align-items:center;gap:var(--space-4);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);max-width:540px;padding:var(--space-12) var(--space-8);box-shadow:var(--shadow-xl);flex-direction:column;margin:0 auto;display:flex}.error-code-badge{background:var(--accent-cyan-dim);color:var(--accent-cyan);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-bold);font-family:var(--font-mono);text-transform:uppercase;padding:4px 14px;display:inline-block}.error-code-forbidden{background:var(--accent-orange-dim);color:var(--accent-orange)}.error-title{font-size:var(--text-4xl);font-weight:var(--weight-extrabold)}.error-subtitle{font-size:var(--text-base);color:var(--text-secondary)}.error-actions{gap:var(--space-4);margin-top:var(--space-4);flex-wrap:wrap;justify-content:center;display:flex}@media (width<=767px){.error-page{padding:calc(var(--mobile-nav-height) + var(--space-8)) 0 var(--space-8)}.error-content{padding:var(--space-8) var(--space-5)}.error-title{font-size:var(--text-2xl)}.error-actions{flex-direction:column;width:100%}.error-actions .btn{width:100%}}.dashboard-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.dashboard-header{justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-8);flex-wrap:wrap;display:flex}.dashboard-title{font-size:var(--text-3xl);margin-bottom:var(--space-1)}.dashboard-subtitle{font-size:var(--text-sm);color:var(--text-muted)}.streak-badge{align-items:center;gap:var(--space-2);background:var(--accent-orange-dim);color:var(--accent-orange);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--weight-bold);white-space:nowrap;border:1px solid #ea580c4d;display:flex}.streak-icon{color:var(--accent-orange)}.dash-section{margin-bottom:var(--space-12)}.dash-section-title{font-size:var(--text-xl);margin-bottom:var(--space-4)}.continue-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));display:grid}.continue-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6);gap:var(--space-4);flex-direction:column;display:flex}.continue-card-header{justify-content:space-between;align-items:center;display:flex}.continue-course-title{font-weight:var(--weight-bold);font-size:var(--text-lg)}.continue-pct{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);font-weight:var(--weight-semibold)}.continue-lesson-info{flex-direction:column;gap:2px;display:flex}.current-lesson-label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase}.current-lesson-title{font-size:var(--text-base);color:var(--text-primary);font-weight:var(--weight-medium)}.dash-empty{text-align:center;padding:var(--space-12);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);align-items:center;gap:var(--space-4);flex-direction:column;display:flex}.sessions-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));display:grid}.session-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6)}.session-header{margin-bottom:var(--space-2);justify-content:space-between;display:flex}.session-provider{font-size:var(--text-xs);text-transform:uppercase;color:var(--accent-purple);font-weight:var(--weight-bold)}.session-duration{font-size:var(--text-xs);color:var(--text-muted)}.session-title{font-size:var(--text-lg);margin-bottom:var(--space-2)}.session-desc{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-4)}.session-footer{padding-top:var(--space-4);border-top:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.session-time{font-size:var(--text-xs);color:var(--text-muted);align-items:center;gap:4px;display:flex}@media (width<=767px){.dashboard-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.dashboard-title{font-size:var(--text-2xl)}.continue-card,.session-card{padding:var(--space-5)}.session-footer{align-items:stretch;gap:var(--space-3);flex-direction:column}.session-footer .btn{width:100%}.dash-empty{padding:var(--space-8) var(--space-5)}}.video-player-container .jw-host{background:#000;width:100%;height:100%;position:relative}.video-player-container .jwplayer{border-radius:var(--radius-xl);overflow:hidden}.video-player-container .jwplayer .jw-controlbar{padding:0 var(--space-4) var(--space-3);background:linear-gradient(#050b1400,#050b14eb)!important}.video-player-container .jwplayer .jw-slider-time .jw-rail{background:#94a3b859}.video-player-container .jwplayer .jw-progress,.video-player-container .jwplayer .jw-buffer{background-color:var(--accent-cyan)}.video-player-container .jwplayer .jw-icon-inline,.video-player-container .jwplayer .jw-button-color{color:#e2e8f0}.video-player-container .jwplayer .jw-button-color:hover{color:var(--accent-cyan)}.video-player-container .jwplayer .jw-settings-menu,.video-player-container .jwplayer .jw-settings-topbar{background:var(--bg-surface);border:1px solid var(--border-default)}.video-player-container .jwplayer .jw-settings-item-active,.video-player-container .jwplayer .jw-option.jw-active-option{color:var(--accent-cyan)}.video-player-container{aspect-ratio:16/9;border-radius:var(--radius-xl);background:#000;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.video-element{object-fit:contain;cursor:pointer;width:100%;height:100%}.resume-toast{z-index:15;background:var(--bg-surface);border:1px solid var(--accent-cyan);color:var(--accent-cyan);border-radius:var(--radius-md);font-size:var(--text-xs);font-family:var(--font-mono);box-shadow:var(--shadow-md);animation:fadeIn var(--duration-fast);align-items:center;gap:6px;padding:6px 12px;display:flex;position:absolute;top:16px;left:16px}.video-controls{padding:var(--space-4);gap:var(--space-2);opacity:0;transition:opacity var(--duration-normal);background:linear-gradient(#0000 0%,#020610f2 100%);flex-direction:column;display:flex;position:absolute;bottom:0;left:0;right:0}.video-controls.visible,.video-player-container:hover .video-controls{opacity:1}.video-seekbar-wrapper{width:100%}.video-seekbar{-webkit-appearance:none;border-radius:var(--radius-full);cursor:pointer;background:#fff3;outline:none;width:100%;height:4px}.video-seekbar::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-cyan);cursor:pointer;border-radius:50%;width:12px;height:12px}.video-controls-row{justify-content:space-between;align-items:center;display:flex}.controls-left,.controls-right{align-items:center;gap:var(--space-3);display:flex}.control-btn{color:var(--text-primary);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;align-items:center;padding:4px;display:flex}.control-btn:hover{color:var(--accent-cyan)}.control-btn-text{border:1px solid var(--border-default);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--text-xs);border-radius:var(--radius-md);cursor:pointer;background:#ffffff1a;padding:2px 8px}.volume-control{align-items:center;gap:var(--space-2);display:flex}.volume-slider{-webkit-appearance:none;border-radius:var(--radius-full);background:#fff3;outline:none;width:60px;height:3px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border-radius:50%;width:8px;height:8px}.video-time-display{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-secondary)}.control-dropdown{position:relative}.dropdown-menu{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-md);z-index:10;flex-direction:column;gap:2px;margin-bottom:8px;padding:4px;display:none;position:absolute;bottom:100%;right:0}.control-dropdown:hover .dropdown-menu{display:flex}.dropdown-menu button{color:var(--text-secondary);font-size:var(--text-xs);border-radius:var(--radius-sm);cursor:pointer;text-align:left;background:0 0;border:none;padding:4px 12px}.dropdown-menu button:hover,.dropdown-menu button.active{background:var(--accent-cyan-dim);color:var(--accent-cyan)}@media (width<=480px){.video-controls{padding:var(--space-3) var(--space-2)}.volume-control{display:none}.video-controls-row,.controls-left,.controls-right{gap:var(--space-2)}.video-time-display{font-size:var(--text-xs)}}.player-watermark{right:var(--space-3);bottom:var(--space-3);z-index:30;border-radius:var(--radius-full);color:var(--accent-cyan);font-family:var(--font-mono);letter-spacing:.02em;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:.85;text-overflow:ellipsis;white-space:nowrap;background:#020610b8;border:1px solid #0ea5e940;align-items:center;gap:6px;max-width:60%;padding:4px 10px;font-size:11px;display:flex;position:absolute;overflow:hidden}.protection-overlay{z-index:50;justify-content:center;align-items:center;gap:var(--space-3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);text-align:center;padding:var(--space-6);background:#020610e6;flex-direction:column;display:flex;position:absolute;inset:0}.protection-overlay .icon{color:var(--accent-orange)}.protection-title{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text-primary)}.protection-sub{font-size:var(--text-sm);color:var(--text-secondary);max-width:420px}.protection-resume{margin-top:var(--space-2);background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-lg);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--duration-fast);padding:10px 24px}.protection-resume:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.lesson-player-page{background:var(--bg-base);height:100vh;color:var(--text-primary);flex-direction:column;display:flex;overflow:hidden}.lesson-player-header{background:var(--bg-surface);border-bottom:1px solid var(--border-default);height:56px;padding:0 var(--space-4);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.header-left{align-items:center;gap:var(--space-3);display:flex;overflow:hidden}.header-back-btn{color:var(--text-secondary);padding:var(--space-2);border-radius:var(--radius-md);align-items:center;min-width:40px;min-height:40px;display:flex}.header-back-btn:hover{color:var(--text-primary);background:#ffffff0d}.header-title-group{flex-direction:column;display:flex;overflow:hidden}.header-course-name{font-size:var(--text-xs);color:var(--accent-cyan);font-weight:var(--weight-semibold);white-space:nowrap}.header-lesson-title{font-size:var(--text-base);font-weight:var(--weight-bold);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.header-right{align-items:center;gap:var(--space-3);display:flex}.header-progress-badge{background:var(--accent-cyan-dim);color:var(--accent-cyan);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);align-items:center;gap:6px;padding:4px 10px;display:flex}@media (width<=600px){.header-progress-badge{display:none}}.map-toggle-btn{background:var(--bg-elevated);border:1px solid var(--border-default);color:var(--text-primary);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--weight-medium);cursor:pointer;align-items:center;gap:6px;padding:6px 12px;display:flex}.map-toggle-btn:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.lesson-player-body{flex:1;grid-template-columns:280px 1fr 380px;display:grid;position:relative;overflow:hidden}.course-map-pane{background:var(--bg-surface);border-right:1px solid var(--border-default);transition:transform var(--duration-slow) var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.course-map-pane.closed{display:none}.course-map-header{padding:var(--space-3) var(--space-4);background:var(--bg-elevated);border-bottom:1px solid var(--border-default);justify-content:space-between;align-items:center;display:flex}.map-title{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.map-close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px;display:flex}.course-map-content{padding:var(--space-3);gap:var(--space-4);flex-direction:column;flex:1;display:flex;overflow-y:auto}.map-chapter-title{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--accent-cyan);margin-bottom:var(--space-2);padding:0 var(--space-2)}.map-lesson-list{flex-direction:column;gap:2px;display:flex}.map-lesson-item{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);color:var(--text-secondary);font-size:var(--text-xs);text-align:left;cursor:pointer;width:100%;transition:all var(--duration-fast);background:0 0;border:none;display:flex}.map-lesson-item:hover:not(:disabled){background:var(--bg-elevated);color:var(--text-primary)}.map-lesson-item.active{background:var(--brand-navy);color:var(--accent-cyan);font-weight:var(--weight-semibold)}.map-lesson-item.locked{opacity:.5;cursor:not-allowed}.icon-done{color:var(--color-success)}.icon-locked{color:var(--text-muted)}.icon-play{color:var(--accent-cyan)}.map-lesson-name{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.stage-pane{padding:var(--space-5);gap:var(--space-4);background:#020610;flex-direction:column;display:flex;overflow-y:auto}.video-unavailable-box{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-12) var(--space-6);text-align:center;color:var(--text-secondary);align-items:center;gap:var(--space-3);flex-direction:column;display:flex}.lock-sub{font-size:var(--text-xs);color:var(--text-muted)}.lesson-content-doc{width:100%;max-width:720px;padding:var(--space-6);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);margin:0 auto}.lesson-info-box{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4) var(--space-5);gap:var(--space-2);flex-direction:column;display:flex}.info-header{justify-content:space-between;align-items:center;display:flex}.info-header h3{font-size:var(--text-base)}.complete-toggle-btn{background:var(--bg-elevated);border:1px solid var(--border-default);color:var(--text-secondary);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--duration-fast);align-items:center;gap:6px;padding:6px 12px;display:flex}.complete-toggle-btn.completed{background:var(--color-success-dim);border-color:var(--color-success);color:var(--color-success)}.info-summary{font-size:var(--text-sm);color:var(--text-secondary)}.tool-pane{background:var(--bg-surface);border-left:1px solid var(--border-default);flex-direction:column;display:flex;overflow:hidden}.tool-pane-tabs{border-bottom:1px solid var(--border-default);background:var(--bg-elevated);display:flex}.tool-tab{padding:var(--space-3);color:var(--text-secondary);font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--weight-semibold);justify-content:center;align-items:center;gap:var(--space-2);cursor:pointer;transition:all var(--duration-fast);background:0 0;border:none;border-bottom:2px solid #0000;flex:1;display:flex}.tool-tab.active{color:var(--accent-cyan);border-bottom-color:var(--accent-cyan);background:var(--bg-surface)}.tool-pane-content{padding:var(--space-4);flex-direction:column;flex:1;display:flex;overflow-y:auto}.notes-editor{gap:var(--space-3);flex-direction:column;height:100%;display:flex}.notes-editor-header{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase;justify-content:space-between;align-items:center;display:flex}.notes-save-badge{color:var(--color-success);font-family:var(--font-mono)}.notes-textarea{background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-lg);width:100%;min-height:200px;color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-sm);padding:var(--space-4);resize:none;outline:none;flex:1;line-height:1.6}.notes-textarea:focus{border-color:var(--accent-cyan)}.lesson-player-footer{background:var(--bg-surface);border-top:1px solid var(--border-default);height:52px;padding:0 var(--space-4);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.footer-center{align-items:center;display:flex}.footer-complete-btn{background:var(--bg-elevated);border:1px solid var(--border-default);color:var(--text-primary);border-radius:var(--radius-md);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--duration-fast);align-items:center;gap:6px;padding:6px 14px;display:flex}.footer-complete-btn.completed{background:var(--color-success-dim);border-color:var(--color-success);color:var(--color-success)}@media (width<=1199px){.lesson-player-body{grid-template-columns:1fr 340px}.course-map-pane{z-index:100;width:280px;box-shadow:var(--shadow-xl);position:absolute;top:0;bottom:0;left:0}}@media (width<=767px){.lesson-player-body{grid-template-rows:auto auto;grid-template-columns:1fr;overflow-y:auto}.stage-pane{padding:var(--space-3);overflow:visible}.tool-pane{border-left:none;border-top:1px solid var(--border-default);min-height:320px;overflow:visible}.tool-pane-content{overflow-y:visible}.map-btn-text{display:none}.lesson-content-doc{padding:var(--space-4)}}.certificates-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.cert-empty{text-align:center;padding:var(--space-16);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);align-items:center;gap:var(--space-3);flex-direction:column;display:flex}.cert-grid{justify-content:center;display:flex}.cert-card{background:var(--bg-surface);border-radius:var(--radius-2xl);width:100%;max-width:760px;padding:var(--space-4);box-shadow:var(--shadow-xl), var(--shadow-glow-cyan)}.cert-border{border:2px solid var(--accent-cyan);border-radius:var(--radius-xl);padding:var(--space-8);background:radial-gradient(circle at 50% 30%,#0ea5e914 0%,#0000 70%),#050b14}.cert-inner{text-align:center;flex-direction:column;align-items:center;display:flex}.cert-logo{width:auto;height:48px;margin-bottom:var(--space-4)}.cert-title-label{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.25em;color:var(--accent-cyan);font-weight:var(--weight-bold);margin-bottom:var(--space-4)}.cert-present-text{font-size:var(--text-sm);color:var(--text-muted);margin-bottom:var(--space-2)}.cert-recipient-name{font-size:var(--text-4xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:var(--space-3);background:linear-gradient(135deg, #fff, var(--accent-cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.cert-body-text{font-size:var(--text-sm);color:var(--text-secondary);max-width:480px;margin-bottom:var(--space-2)}.cert-course-title{font-size:var(--text-2xl);color:var(--accent-orange);margin-bottom:var(--space-8)}.cert-footer{width:100%;padding-top:var(--space-6);border-top:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.cert-meta{font-size:var(--text-xs);color:var(--text-muted);flex-direction:column;align-items:flex-start;gap:2px;display:flex}.cert-sig-code{font-family:var(--font-mono)}@media (width<=767px){.certificates-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.cert-empty{padding:var(--space-8) var(--space-5)}.cert-border{padding:var(--space-6) var(--space-4)}.cert-recipient-name{font-size:var(--text-2xl)}.cert-course-title{font-size:var(--text-xl)}.cert-footer{gap:var(--space-4);flex-direction:column;align-items:flex-start}}@media print{body *{visibility:hidden}.cert-card,.cert-card *{visibility:visible}.cert-card{width:100%;max-width:100%;box-shadow:none;position:absolute;top:0;left:0}.no-print{display:none!important}}.settings-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-20) 0;min-height:calc(100vh - var(--nav-height));background:var(--bg-base)}.settings-header{margin-bottom:var(--space-8)}.settings-title{font-size:var(--text-3xl);margin-bottom:var(--space-2)}.settings-subtitle{font-size:var(--text-base);color:var(--text-secondary)}.settings-alert{align-items:center;gap:var(--space-3);background:var(--color-success-dim);border:1px solid var(--color-success);color:var(--color-success);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm);margin-bottom:var(--space-6);display:flex}.settings-grid{gap:var(--space-8);grid-template-columns:repeat(2,1fr);display:grid}@media (width<=767px){.settings-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 var(--space-8)}.settings-title{font-size:var(--text-2xl)}.settings-grid{grid-template-columns:1fr}.settings-card{padding:var(--space-5)}}.settings-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6);gap:var(--space-4);flex-direction:column;display:flex}.card-title{font-size:var(--text-xl);border-bottom:1px solid var(--border-subtle);padding-bottom:var(--space-3)}.settings-form{gap:var(--space-4);flex-direction:column;display:flex}.form-group{gap:var(--space-2);flex-direction:column;display:flex}.form-label{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);text-transform:uppercase}.form-input,.form-select{background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-sm);padding:var(--space-3);outline:none}.form-input:disabled{opacity:.6;cursor:not-allowed}.role-badge{background:var(--accent-cyan-dim);color:var(--accent-cyan);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;align-self:flex-start;padding:4px 10px;display:inline-block}.form-group-checkbox{margin-top:var(--space-2)}.checkbox-label{align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer;display:flex}.checkbox-label input{width:16px;height:16px;accent-color:var(--accent-cyan)}.admin-dashboard-page{padding:calc(var(--nav-height) + var(--space-8)) 0 var(--space-16);min-height:calc(100vh - var(--nav-height))}.admin-header{margin-bottom:var(--space-8)}.admin-title{font-size:var(--text-3xl);color:var(--accent-orange)}.admin-subtitle{font-size:var(--text-sm);color:var(--text-muted)}.admin-tabs{gap:var(--space-2);margin-bottom:var(--space-8);border-bottom:1px solid var(--border-default);-webkit-overflow-scrolling:touch;scrollbar-width:none;display:flex;overflow-x:auto}.admin-tabs::-webkit-scrollbar{display:none}.admin-tab{padding:var(--space-3) var(--space-6);color:var(--text-secondary);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--weight-semibold);align-items:center;gap:var(--space-2);cursor:pointer;transition:all var(--duration-fast);white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;display:flex}.admin-tab.active{color:var(--accent-orange);border-bottom-color:var(--accent-orange)}.admin-panel{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);padding:var(--space-6)}.panel-header{margin-bottom:var(--space-6);justify-content:space-between;align-items:center;display:flex}.admin-table-wrapper{overflow-x:auto}.admin-table{border-collapse:collapse;text-align:left;width:100%}.admin-table th,.admin-table td{padding:var(--space-4);border-bottom:1px solid var(--border-subtle);font-size:var(--text-sm)}.admin-table th{color:var(--text-muted);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em}.lang-badge{font-family:var(--font-mono);font-size:var(--text-xs);background:var(--bg-elevated);border-radius:var(--radius-sm);padding:2px 8px}.status-tag{font-size:var(--text-xs);border-radius:var(--radius-sm);text-transform:uppercase;font-weight:var(--weight-bold);padding:2px 8px}.status-published{background:var(--color-success-dim);color:var(--color-success)}.status-draft{color:var(--text-muted);background:#ffffff1a}.table-actions{gap:var(--space-1);display:flex}.integrations-list{gap:var(--space-4);flex-direction:column;display:flex}.integration-card{padding:var(--space-5);background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);justify-content:space-between;align-items:center;display:flex}.integration-info h3{font-size:var(--text-md);margin-bottom:2px}.integration-info p{font-size:var(--text-xs);color:var(--text-muted)}@media (width<=767px){.admin-dashboard-page{padding:calc(var(--mobile-nav-height) + var(--space-6)) 0 calc(var(--mobile-nav-height) + var(--space-6))}.admin-title{font-size:var(--text-xl)}.admin-tab{padding:var(--space-3) var(--space-4)}.admin-panel{padding:var(--space-4);border-radius:var(--radius-xl)}.panel-header,.integration-card{align-items:flex-start;gap:var(--space-3);flex-direction:column}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-base:#020610;--bg-surface:#0a1628;--bg-elevated:#0f1f38;--bg-card:#0c1a30;--bg-card-hover:#101f3a;--bg-input:#0a1628;--bg-overlay:#020610d9;--brand-navy:#0f2e5c;--brand-navy-light:#1a3f75;--accent-cyan:#0ea5e9;--accent-cyan-dim:#0ea5e926;--accent-cyan-hover:#38bdf8;--accent-orange:#ea580c;--accent-orange-dim:#ea580c26;--accent-orange-hover:#fb923c;--accent-purple:#7c3aed;--accent-purple-dim:#7c3aed26;--accent-purple-hover:#a78bfa;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--text-inverse:#020610;--color-success:#10b981;--color-success-dim:#10b98126;--color-warning:#f59e0b;--color-warning-dim:#f59e0b26;--color-danger:#ef4444;--color-danger-dim:#ef444426;--border-default:#ffffff14;--border-subtle:#ffffff0a;--border-strong:#ffffff24;--border-focus:var(--accent-cyan);--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"Fira Code", "JetBrains Mono", "Cascadia Code", monospace;--text-xs:.6875rem;--text-sm:.8125rem;--text-base:.9375rem;--text-md:1rem;--text-lg:1.125rem;--text-xl:1.3125rem;--text-2xl:1.625rem;--text-3xl:2rem;--text-4xl:2.5rem;--text-5xl:3.25rem;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-extrabold:800;--leading-tight:1.15;--leading-snug:1.3;--leading-normal:1.5;--leading-relaxed:1.7;--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;--space-24:96px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-2xl:16px;--radius-full:9999px;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 12px #00000040;--shadow-lg:0 12px 32px #00000059;--shadow-xl:0 20px 48px #00000073;--shadow-glow-cyan:0 0 20px #0ea5e926;--shadow-glow-orange:0 0 20px #ea580c26;--duration-fast:.12s;--duration-normal:.2s;--duration-slow:.3s;--duration-slower:.5s;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--max-width:1280px;--nav-height:64px;--mobile-nav-height:56px;--sidebar-width:280px}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;height:100%}body{background-color:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-sans);color:var(--text-primary);font-weight:var(--weight-bold);letter-spacing:-.02em;line-height:var(--leading-tight)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl)}h5{font-size:var(--text-lg)}h6{font-size:var(--text-md)}p{color:var(--text-secondary);line-height:var(--leading-relaxed)}a{color:inherit;transition:color var(--duration-normal) var(--ease-out);text-decoration:none}a:hover{color:var(--accent-cyan)}code,pre,kbd{font-family:var(--font-mono)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--radius-sm);border:2px solid var(--bg-base)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}::selection{color:var(--text-primary);background:#0ea5e94d}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-6);margin:0 auto}@media (width<=767px){.container{padding:0 var(--space-4)}}.skeleton{background:linear-gradient(90deg, var(--bg-elevated) 25%, var(--bg-card-hover) 50%, var(--bg-elevated) 75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-shimmer}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.toast-container{bottom:var(--space-6);right:var(--space-6);z-index:9999;gap:var(--space-3);flex-direction:column;display:flex;position:fixed}@media (width<=767px){.toast-container{left:var(--space-4);right:var(--space-4);bottom:calc(var(--mobile-nav-height) + var(--space-4))}}