@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Rajdhani:wght@400;600;700&family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@400;600;700&family=JetBrains+Sans:wght@400;600;700&family=Quicksand:wght@400;500;600;700&family=Nunito:wght@400;500;600;700&display=swap";.logo-wrapper{display:flex;align-items:center;gap:14px;justify-content:center}.logo-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.logo-image{display:block;height:100%;width:auto;object-fit:contain;filter:drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-default .logo-image{filter:invert(1) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-light .logo-image{filter:brightness(1.1) contrast(1.1) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-vintage .logo-image{filter:sepia(.8) contrast(1.1) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-hello-kitty .logo-image{filter:brightness(1.2) saturate(1.3) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-monochrome .logo-image{filter:grayscale(1) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-sunburst .logo-image{filter:brightness(1.15) saturate(1.2) hue-rotate(-10deg) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-enhanced-forest .logo-image{filter:hue-rotate(120deg) saturate(1.3) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.theme-gold .logo-image{filter:sepia(.3) saturate(1.4) brightness(1.1) drop-shadow(0 0 10px var(--color-glow-strong)) drop-shadow(0 0 20px var(--color-glow))}.logo-large .logo-icon{width:60px;height:72px}.logo-medium .logo-icon{width:45px;height:54px}.logo-small .logo-icon{width:30px;height:36px}.logo-text{font-family:var(--font-heading);font-weight:900;color:var(--color-accent);letter-spacing:3px;font-size:32px;line-height:1;text-shadow:0 0 15px var(--color-glow-strong),0 0 30px var(--color-glow);text-transform:uppercase}.logo-large .logo-text{font-size:32px;letter-spacing:.5px}.logo-medium .logo-text{font-size:24px;letter-spacing:.3px}.logo-small .logo-text{font-size:18px;letter-spacing:.2px}@media(max-width:768px){.logo-large .logo-icon{width:45px;height:54px}.logo-large .logo-text{font-size:24px}.logo-wrapper{gap:12px}}.homepage-container{min-height:100vh;background:linear-gradient(135deg,#0a0a0a,#1a1a1a,#0f0f0f);display:flex;flex-direction:column;align-items:center;position:relative;overflow-x:hidden;color:#fff}.homepage-header{width:100%;padding:30px 20px;background:#0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:2px solid rgba(255,255,255,.1);display:flex;justify-content:center;align-items:center}.homepage-content{text-align:center;max-width:1200px;margin:0 auto;padding:80px 20px 60px;position:relative;z-index:2}.homepage-title{font-family:Orbitron,sans-serif;font-size:64px;font-weight:900;color:#0f8;margin:0 0 20px;letter-spacing:2px;line-height:1.1;text-shadow:0 0 20px rgba(0,255,136,.5),0 0 40px rgba(0,255,136,.3);text-transform:uppercase}.homepage-tagline{font-family:Rajdhani,sans-serif;font-size:24px;color:#ccc;font-weight:400;line-height:1.6;max-width:800px;margin:0 auto 60px;letter-spacing:1px}.header-section{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1300px;gap:30px;margin:0 auto}.header-right{display:flex;align-items:center;gap:20px}.user-info-header{display:flex;align-items:center;gap:12px;cursor:pointer;padding:8px 16px;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1)}.user-info-header:hover{background:#00ff881a}.profile-picture-small{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid rgba(0,255,136,.5);box-shadow:0 0 10px #00ff884d}.profile-picture-placeholder-small{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#0f8,#00cc6a);border:2px solid rgba(0,255,136,.5);display:flex;align-items:center;justify-content:center;color:#000;font-weight:900;font-family:Orbitron,sans-serif;font-size:18px;box-shadow:0 0 10px #00ff884d}.user-name-header{color:#0f8;font-family:Rajdhani,sans-serif;font-size:16px;font-weight:600;letter-spacing:.5px;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.language-selector{background:#0009;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#0f8;border:2px solid rgba(0,255,136,.3);padding:10px 40px 10px 16px;border-radius:8px;cursor:pointer;font-family:Rajdhani,sans-serif;font-size:16px;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #0f83;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2300ff88' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.language-selector:hover{background-color:#000c;border-color:#0f89;box-shadow:0 0 20px #0f86;transform:translateY(-2px)}.language-selector:focus{outline:none;border-color:#0f8;box-shadow:0 0 0 3px #00ff884d}.level-display{background:#00000080;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid rgba(0,255,136,.2);border-radius:16px;padding:40px;margin:0 0 50px;box-shadow:0 8px 32px #00000080,0 0 30px #00ff881a}.current-level-badge{text-align:center;margin-bottom:20px}.level-badge-text{display:block;font-family:Orbitron,sans-serif;font-size:42px;font-weight:900;color:#0f8;margin-bottom:12px;letter-spacing:2px;text-shadow:0 0 15px rgba(0,255,136,.5);text-transform:uppercase}.level-badge-subtext{display:block;font-family:Rajdhani,sans-serif;font-size:18px;color:#ff6b35;font-weight:700;margin-top:8px;letter-spacing:1px;text-transform:uppercase}.progress-section-home{margin-top:20px}.progress-info-home{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-family:Rajdhani,sans-serif;font-size:16px;color:#ccc;font-weight:600;letter-spacing:1px}.progress-bar-container-home{width:100%;height:16px;background:#0009;border:1px solid rgba(0,255,136,.3);border-radius:8px;overflow:hidden;box-shadow:inset 0 2px 4px #00000080}.progress-bar-fill-home{height:100%;background:linear-gradient(90deg,#0f8,#00cc6a);border-radius:8px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:0 0 15px #0f89,inset 0 0 10px #00ff884d}.homepage-actions{display:flex;flex-direction:column;gap:12px;align-items:center;margin-top:20px}.logout-button{padding:14px 28px;background:#0009;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid rgba(255,0,0,.4);border-radius:8px;color:#f44;font-family:Rajdhani,sans-serif;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #f003;letter-spacing:1px}.logout-button:hover{background:#000c;border-color:#f009;transform:translateY(-2px);box-shadow:0 0 20px #f006}.cta-button{background:linear-gradient(135deg,#0f8,#00cc6a);color:#000;border:2px solid #00ff88;padding:18px 50px;font-family:Orbitron,sans-serif;font-size:18px;font-weight:900;border-radius:8px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 20px #00ff8880,0 4px 15px #0000004d;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:2px}.cta-button:hover{transform:translateY(-2px);box-shadow:0 0 30px #0f8c,0 6px 20px #0006;background:linear-gradient(135deg,#0fa,#0f8)}.cta-button:active{transform:translateY(0);box-shadow:0 0 15px #0f86,0 2px 10px #0000004d}.cta-button-secondary{background:#0009;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#fff;border:2px solid rgba(255,107,53,.5);padding:18px 50px;font-family:Orbitron,sans-serif;font-size:18px;font-weight:700;border-radius:8px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 15px #ff6b354d,0 4px 15px #0000004d;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:2px}.cta-button-secondary:hover{transform:translateY(-2px);border-color:#ff6b35cc;box-shadow:0 0 25px #ff6b3580,0 6px 20px #0006;background:#000c}.cta-button-secondary:active{transform:translateY(0);box-shadow:0 0 10px #ff6b354d,0 2px 10px #0000004d}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;max-width:1000px;width:100%;margin:80px auto 0;padding:0 20px;position:relative;z-index:2;box-sizing:border-box}.feature-card{background:#00000080;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid rgba(0,255,136,.2);border-radius:16px;padding:40px 32px;text-align:center;box-shadow:0 8px 32px #00000080,0 0 30px #00ff881a;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.feature-card:hover{transform:translateY(-8px);border-color:#0f86;box-shadow:0 16px 48px #000000b3,0 0 40px #0f83}.feature-icon{font-size:64px;margin-bottom:20px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.1))}.feature-card h3{font-family:Orbitron,sans-serif;font-size:24px;color:#0f8;margin:0 0 12px;font-weight:900;letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 10px rgba(0,255,136,.3)}.feature-card p{font-family:Rajdhani,sans-serif;font-size:16px;color:#ccc;margin:0;line-height:1.6;letter-spacing:.5px}@media(max-width:768px){.homepage-title{font-size:36px;letter-spacing:1px}.homepage-tagline{font-size:18px}.header-section{flex-direction:column;gap:20px;align-items:center}.features-grid{grid-template-columns:1fr}.level-badge-text{font-size:32px}}.landing-page{min-height:100vh;background:var(--gradient-card-hard);color:var(--color-text-primary);scroll-behavior:smooth}.hero-section{position:relative;min-height:100vh;width:100%;overflow:hidden;background:#000}.hero-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;z-index:1}.hero-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:#0009}@media(min-width:768px){.hero-overlay{background:linear-gradient(to bottom,#000c,#0009,#0000004d)}}.top-navbar{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-xl);height:64px;background:#00000073;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}@media(min-width:768px){.top-navbar{padding:0 var(--spacing-3xl);height:68px}}.navbar-left{display:flex;align-items:center;gap:var(--spacing-md)}.navbar-logo{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}@media(min-width:768px){.navbar-logo{width:40px;height:40px}}.navbar-brand-text{font-family:var(--font-heading);font-size:var(--font-size-md);font-weight:var(--font-weight-extrabold);color:#fff;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.7);display:none}@media(min-width:640px){.navbar-brand-text{display:block}}.navbar-right{display:flex;align-items:center;gap:var(--spacing-sm)}@media(min-width:640px){.navbar-right{gap:var(--spacing-md)}}.navbar-lang-select{background:#ffffff14;border:1px solid rgba(255,255,255,.2);color:#fff;padding:6px 28px 6px 10px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-normal);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;display:none}@media(min-width:480px){.navbar-lang-select{display:block}}.navbar-lang-select:hover{background-color:#ffffff26;border-color:#ffffff59}.navbar-lang-select:focus{outline:none;border-color:#fff6}.navbar-icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);color:#fff}.navbar-icon-btn:hover{background:#ffffff1a}.navbar-icon-btn:active{background:#ffffff26}.navbar-icon{width:22px;height:22px}@media(min-width:768px){.navbar-icon{width:24px;height:24px}}.navbar-register-btn{padding:8px 16px;font-family:var(--font-heading);font-size:var(--font-size-xs);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;color:#000;background:linear-gradient(135deg,#0f8,#00cc6a);border:2px solid #00ff88;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);white-space:nowrap;box-shadow:0 0 16px #00ff8859}@media(min-width:640px){.navbar-register-btn{padding:10px 20px;font-size:var(--font-size-sm)}}.navbar-register-btn:hover{transform:translateY(-2px);box-shadow:0 0 24px #00ff8880;background:linear-gradient(135deg,#33ff9e,#0f8)}.navbar-register-btn:active{transform:translateY(0)}.navbar-login-btn{padding:8px 16px;font-family:var(--font-heading);font-size:var(--font-size-xs);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;color:#fff;background:#00000059;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.35);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);white-space:nowrap}@media(min-width:640px){.navbar-login-btn{padding:10px 20px;font-size:var(--font-size-sm)}}.navbar-login-btn:hover{transform:translateY(-2px);background:#0000008c;border-color:#ffffff8c;box-shadow:0 0 20px #ffffff1f}.navbar-login-btn:active{transform:translateY(0)}.hero-content-wrapper{position:relative;z-index:10;display:flex;flex-direction:column;min-height:100vh;padding-top:64px}@media(min-width:768px){.hero-content-wrapper{padding-top:68px}}.hero-lang-select{background:#00000080!important;border:1px solid rgba(255,255,255,.25)!important;color:#fff!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.hero-lang-select:hover{background:#000000b3!important;border-color:#fff6!important}.hero-center{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl);padding-bottom:calc(var(--spacing-4xl) + 80px)}@media(min-width:768px){.hero-center{padding:var(--spacing-3xl);padding-bottom:calc(var(--spacing-4xl) + 100px)}}.hero-text-box{max-width:700px;text-align:center}.hero-headline{font-family:var(--font-heading);font-size:clamp(1.8rem,5vw,3.5rem);font-weight:var(--font-weight-extrabold);color:#fff;margin:0 0 var(--spacing-lg) 0;line-height:1.1;letter-spacing:var(--letter-spacing-normal);text-transform:uppercase;text-shadow:0 4px 24px rgba(0,0,0,.9),0 8px 48px rgba(0,0,0,.7)}.hero-description{font-family:var(--font-body);font-size:clamp(.95rem,2vw,1.15rem);color:#ffffffd9;margin:0 auto var(--spacing-2xl);line-height:1.7;max-width:580px;text-shadow:0 2px 12px rgba(0,0,0,.8)}.hero-cta-group{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md)}@media(min-width:480px){.hero-cta-group{flex-direction:row;justify-content:center;gap:var(--spacing-lg)}}.hero-btn{padding:var(--spacing-md) var(--spacing-2xl);font-family:var(--font-heading);font-size:var(--font-size-md);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-normal);min-width:180px;box-shadow:0 8px 32px #00000080}@media(min-width:768px){.hero-btn{padding:var(--spacing-lg) var(--spacing-3xl);font-size:var(--font-size-lg);min-width:200px}}.hero-btn-primary{background:linear-gradient(135deg,#0f8,#00cc6a);color:#000;border:2px solid #00ff88;box-shadow:0 0 24px #00ff8873,0 8px 32px #00000080}.hero-btn-primary:hover{transform:translateY(-3px);box-shadow:0 0 36px #00ff88a6,0 12px 44px #0009;background:linear-gradient(135deg,#33ff9e,#0f8)}.hero-btn-primary:active{transform:translateY(-1px)}.hero-btn-secondary{background:#00000059;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;border:2px solid rgba(255,255,255,.35)}.hero-btn-secondary:hover{transform:translateY(-3px);background:#0000008c;border-color:#ffffff8c;box-shadow:0 0 20px #ffffff1f,0 12px 40px #0009}.hero-btn-secondary:active{transform:translateY(-1px)}.hero-bottom-fade{position:absolute;bottom:0;left:0;right:0;height:140px;z-index:5;background:linear-gradient(to bottom,transparent 0%,rgba(10,10,10,.5) 50%,var(--color-bg-secondary) 100%);pointer-events:none}.language-selector-container{flex-shrink:0}.language-selector{background:var(--color-bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--color-accent);border:2px solid var(--color-border-default);padding:var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);transition:all var(--transition-normal);box-shadow:var(--shadow-glow-sm);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%232dfe87' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-md) center;padding-right:var(--spacing-2xl)}.language-selector:hover{background-color:var(--color-bg-card-hover);border-color:var(--color-border-hover);box-shadow:var(--shadow-glow-md);transform:translateY(-2px)}.language-selector:focus{outline:none;border-color:var(--color-border-active);box-shadow:0 0 0 3px var(--color-accent-soft)}.landing-features{padding:var(--spacing-4xl) var(--spacing-lg);background:var(--color-bg-secondary)}.features-container{max-width:1200px;margin:0 auto}.features-title{font-family:var(--font-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);text-align:center;margin:0 0 var(--spacing-lg) 0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;text-shadow:0 0 20px var(--color-glow-strong)}.features-subtitle{font-family:var(--font-body);font-size:var(--font-size-lg);color:var(--color-text-primary);text-align:center;margin:0 auto var(--spacing-3xl) auto;max-width:800px;line-height:var(--line-height-relaxed)}.features-grid-landing{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-xl);margin-top:var(--spacing-2xl)}@media(max-width:1024px){.features-grid-landing{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.features-grid-landing{grid-template-columns:1fr}}.feature-card-landing{background:var(--gradient-card-soft);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:.5px solid var(--color-border-default);border-top:2px solid var(--color-primary-500);border-radius:var(--radius-xl);padding:var(--spacing-2xl) var(--spacing-xl);text-align:center;transition:all var(--transition-normal);box-shadow:var(--shadow-card);display:flex;flex-direction:column}.feature-card-landing:hover{transform:translateY(-4px);border-color:var(--color-border-hover);box-shadow:var(--shadow-card-hover)}.feature-image-container{width:100%;height:200px;margin-bottom:var(--spacing-lg);border-radius:var(--radius-md);overflow:hidden;background:var(--color-bg-secondary);display:flex;align-items:center;justify-content:center;position:relative}.feature-image{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:var(--radius-md);transition:transform var(--transition-normal)}.feature-card-landing:hover .feature-image{transform:scale(1.05)}.feature-image-container:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,var(--color-accent-soft) 0%,transparent 100%);opacity:0;transition:opacity var(--transition-normal);border-radius:var(--radius-md);z-index:1;pointer-events:none}.feature-card-landing:hover .feature-image-container:before{opacity:.2}.feature-icon{font-size:var(--font-size-4xl);margin-bottom:var(--spacing-lg)}.feature-card-landing h3{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0 0 var(--spacing-md) 0;letter-spacing:var(--letter-spacing-normal);text-transform:uppercase}.feature-card-landing p{font-family:var(--font-body);font-size:var(--font-size-md);color:var(--color-text-primary);margin:0;line-height:var(--line-height-relaxed)}.landing-pricing{padding:var(--spacing-4xl) var(--spacing-lg);background:var(--gradient-card-hard);position:relative;overflow:hidden}.pricing-container{max-width:1400px;margin:0 auto;text-align:center}.pricing-title{font-family:var(--font-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);text-align:center;margin:0 0 var(--spacing-lg) 0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;text-shadow:0 0 30px var(--color-glow-strong),0 0 60px var(--color-glow)}.pricing-subtitle{font-family:var(--font-body);font-size:var(--font-size-lg);color:var(--color-text-primary);text-align:center;margin:0 0 var(--spacing-4xl) 0;max-width:900px;margin-left:auto;margin-right:auto;line-height:var(--line-height-relaxed)}.pricing-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-xl);margin-top:var(--spacing-3xl);max-width:1600px;margin-left:auto;margin-right:auto;align-items:stretch}@media(min-width:1400px){.pricing-cards{grid-template-columns:repeat(5,1fr)}}@media(min-width:1200px)and (max-width:1399px){.pricing-cards{grid-template-columns:repeat(3,1fr)}}@media(min-width:768px)and (max-width:1199px){.pricing-cards{grid-template-columns:repeat(2,1fr)}}.pricing-card{background:var(--color-bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid var(--color-border-default);border-radius:var(--radius-xl);padding:var(--spacing-2xl);position:relative;transition:all var(--transition-normal);box-shadow:var(--shadow-card);display:flex;flex-direction:column;text-align:left}.pricing-card:hover{transform:translateY(-8px);border-color:var(--color-border-hover);box-shadow:var(--shadow-card-hover),var(--shadow-glow-md)}.pricing-card-featured{background:linear-gradient(135deg,var(--color-accent-soft) 0%,var(--color-bg-card) 100%);border-color:var(--color-accent);border-width:3px;box-shadow:var(--shadow-lg),0 0 40px var(--color-glow-strong);transform:scale(1.05);z-index:1}.pricing-card-featured:hover{transform:scale(1.08) translateY(-8px);box-shadow:var(--shadow-xl),0 0 60px var(--color-glow-strong)}@media(max-width:1199px){.pricing-card-featured{transform:scale(1)}.pricing-card-featured:hover{transform:translateY(-8px)}}.pricing-badges{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);align-items:center;text-align:center}.pricing-badge-most-popular{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e293b;font-family:var(--font-heading);font-size:var(--font-size-xs);font-weight:var(--font-weight-extrabold);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-md);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);box-shadow:var(--shadow-md);align-self:center;margin-bottom:var(--spacing-md);display:inline-block}.pricing-badge-save{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e293b;font-family:var(--font-heading);font-size:var(--font-size-xs);font-weight:var(--font-weight-extrabold);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-md);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);box-shadow:var(--shadow-sm);align-self:flex-start}.pricing-card-title{font-family:var(--font-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);color:var(--color-text-primary);margin:0 0 var(--spacing-md) 0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;line-height:var(--line-height-tight)}.pricing-card-description{font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0 0 var(--spacing-lg) 0;line-height:var(--line-height-normal);min-height:2.5em}.pricing-card-price-group{display:flex;flex-direction:column;gap:var(--spacing-xs);margin:0 0 var(--spacing-md) 0}.pricing-card-price{font-family:var(--font-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0 0 var(--spacing-md) 0;text-shadow:0 0 20px var(--color-glow-strong);line-height:var(--line-height-tight)}.pricing-card-price-group .pricing-card-price{margin:0}.pricing-card-price-secondary{font-family:var(--font-body);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);margin:0;line-height:var(--line-height-normal)}.pricing-card-billed{font-family:var(--font-body);font-size:var(--font-size-xs);color:var(--color-text-muted);margin:0 0 var(--spacing-xl) 0;line-height:var(--line-height-normal)}.pricing-card-button{padding:var(--spacing-md) var(--spacing-xl);font-family:var(--font-heading);font-size:var(--font-size-md);font-weight:var(--font-weight-extrabold);color:var(--color-text-primary);background:transparent;border:2px solid var(--color-border-default);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-normal);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);margin-bottom:var(--spacing-xl);width:100%;min-height:48px}.pricing-card-button:hover{background:var(--color-bg-card-hover);border-color:var(--color-accent);color:var(--color-accent);box-shadow:var(--shadow-glow-md);transform:translateY(-2px)}.pricing-card-button-featured{background:var(--color-accent);color:var(--color-neutral-0);border-color:var(--color-accent);box-shadow:var(--shadow-glow-md)}.pricing-card-button-featured:hover{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-neutral-0);box-shadow:var(--shadow-glow-lg);transform:translateY(-2px)}.pricing-card-features{list-style:none;padding:0;margin:0;text-align:left;flex:1;display:flex;flex-direction:column;gap:var(--spacing-xs)}.pricing-card-features li{font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-primary);padding:var(--spacing-xs) 0;padding-left:var(--spacing-lg);position:relative;line-height:var(--line-height-relaxed);display:flex;align-items:flex-start}.pricing-card-features li:not(.pricing-feature-disabled):before{content:"✓";position:absolute;left:0;color:var(--color-accent);font-weight:var(--font-weight-extrabold);font-size:var(--font-size-md);line-height:var(--line-height-relaxed);margin-top:2px}.pricing-feature-disabled{color:var(--color-text-muted);opacity:.85}.pricing-card-features li.pricing-feature-disabled:before{content:"×"!important;color:#ff4d4d!important;font-weight:var(--font-weight-extrabold);font-size:var(--font-size-md);margin-top:2px;line-height:var(--line-height-relaxed);position:absolute;left:0}.pricing-card-features-free li.pricing-feature-disabled:before{content:"×"!important;color:#ff4d4d!important;font-weight:var(--font-weight-extrabold);font-size:var(--font-size-md);margin-top:2px;line-height:var(--line-height-relaxed);position:absolute;left:0}.pricing-card-footer{margin-top:auto;padding-top:var(--spacing-lg);border-top:1px solid var(--color-border-default)}.pricing-card-includes{font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-primary);margin:0 0 var(--spacing-xs) 0;font-weight:var(--font-weight-semibold)}.pricing-card-note{font-family:var(--font-body);font-size:var(--font-size-xs);color:var(--color-text-secondary);margin:0}.landing-leaderboard{padding:var(--spacing-4xl) var(--spacing-lg);background:var(--gradient-card-hard)}.leaderboard-container{max-width:800px;margin:0 auto;background:var(--color-bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid var(--color-border-default);border-radius:var(--radius-xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-lg),var(--shadow-glow-subtle)}.leaderboard-title{font-family:var(--font-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);text-align:center;margin:0 0 var(--spacing-md) 0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;text-shadow:0 0 15px var(--color-glow-strong)}.leaderboard-subtitle{font-family:var(--font-body);font-size:var(--font-size-lg);color:var(--color-text-primary);text-align:center;margin:0 0 var(--spacing-xl) 0}.leaderboard-period-selector{display:flex;gap:var(--spacing-md);justify-content:center;margin-bottom:var(--spacing-xl)}.period-btn{padding:var(--spacing-md) var(--spacing-lg);background:var(--color-bg-card);border:2px solid var(--color-border-default);border-radius:var(--radius-md);color:var(--color-text-primary);font-family:var(--font-body);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-normal);letter-spacing:var(--letter-spacing-normal)}.period-btn:hover{background:var(--color-bg-card-hover);border-color:var(--color-border-hover);color:var(--color-accent)}.period-btn.active{background:var(--gradient-primary);border-color:var(--color-accent);color:var(--color-neutral-0);box-shadow:var(--shadow-glow-md);font-weight:var(--font-weight-extrabold)}.leaderboard-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.leaderboard-entry{display:flex;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-bg-secondary);border:.5px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--transition-normal)}.leaderboard-entry:hover{background:var(--color-bg-tertiary);border-color:var(--color-border-hover);box-shadow:var(--shadow-glow-sm);transform:translate(4px)}.leaderboard-rank{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);min-width:60px;text-align:center}.leaderboard-nickname{flex:1;font-family:var(--font-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);letter-spacing:var(--letter-spacing-tight)}.leaderboard-time{font-family:var(--font-body);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-accent);min-width:100px;text-align:right}.leaderboard-loading,.leaderboard-empty{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-secondary);font-family:var(--font-body);font-size:var(--font-size-lg)}.landing-footer{padding:var(--spacing-2xl) var(--spacing-lg);text-align:center;background:var(--color-bg-secondary);border-top:2px solid var(--color-border-muted)}.landing-footer p{font-family:var(--font-body);font-size:var(--font-size-md);color:var(--color-text-secondary);margin:0}@media(max-width:768px){.landing-header{padding:var(--spacing-md) var(--spacing-lg)}.landing-content{padding-top:var(--spacing-3xl)}.landing-title{font-size:var(--font-size-4xl)}.landing-subtitle{font-size:var(--font-size-xl)}.landing-description{font-size:var(--font-size-lg)}.features-grid-landing{grid-template-columns:1fr}.landing-cta{flex-direction:column}.landing-cta-button{width:100%}.leaderboard-entry{flex-wrap:wrap}.leaderboard-time{text-align:left;width:100%}.pricing-title{font-size:var(--font-size-3xl)}.pricing-subtitle{font-size:var(--font-size-md)}.pricing-cards{grid-template-columns:1fr;gap:var(--spacing-lg);max-width:100%}.pricing-card-featured{transform:scale(1)}.pricing-card-featured:hover{transform:translateY(-8px)}.pricing-card{padding:var(--spacing-xl)}.pricing-card-title{font-size:var(--font-size-xl)}.pricing-card-price{font-size:var(--font-size-2xl)}}.lesson-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;align-items:center}.lesson-badge{padding:5px 12px;border-radius:12px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#000;cursor:help;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 6px #0006,inset 0 1px #fff3;position:relative;border:1px solid rgba(0,0,0,.2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.lesson-badge:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,.1) 0%,transparent 100%);pointer-events:none}.lesson-badge:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 4px 12px #00000080,inset 0 1px #ffffff4d;z-index:10}.lesson-badge:active{transform:translateY(0) scale(1.02)}.badge-text{font-family:Rajdhani,sans-serif;position:relative;z-index:1;display:block}.theme-toggle-container{position:fixed;bottom:var(--spacing-lg);left:var(--spacing-lg);z-index:var(--z-tooltip)}.theme-toggle-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-card);border:1px solid var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;color:var(--color-accent);transition:all var(--transition-normal);box-shadow:var(--shadow-sm),var(--shadow-glow-subtle);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.theme-toggle-btn:hover{background:var(--color-bg-card-hover);border-color:var(--color-border-hover);transform:rotate(90deg);box-shadow:var(--shadow-md),var(--shadow-glow-sm)}.theme-toggle-btn:active{transform:rotate(90deg) scale(.95)}.theme-toggle-btn svg{width:18px;height:18px;transition:transform var(--transition-normal)}.theme-menu{position:absolute;bottom:calc(100% + var(--spacing-xs));left:0;min-width:140px;background:var(--color-bg-card);border:1px solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg),var(--shadow-glow-md);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow:hidden;z-index:calc(var(--z-tooltip) + 1);max-height:320px;overflow-y:auto}.theme-menu-item{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:transparent;border:none;color:var(--color-text-primary);font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-align:left;cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-sm)}.theme-menu-item:hover{background:var(--color-bg-card-hover);color:var(--color-accent)}.theme-menu-item.active{background:var(--color-accent-soft);color:var(--color-accent);font-weight:var(--font-weight-semibold)}.theme-check{color:var(--color-accent);font-weight:var(--font-weight-bold)}@media(max-width:768px){.theme-toggle-container{bottom:var(--spacing-md);left:var(--spacing-md)}.theme-toggle-btn{width:36px;height:36px}.theme-toggle-btn svg{width:16px;height:16px}.theme-menu{min-width:120px;max-height:280px}}.lesson-list-container{min-height:100vh;background:var(--color-bg);padding:0;position:relative;color:var(--color-text-primary)}.lesson-list-container:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 20% 0%,var(--color-glow-subtle) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,var(--color-glow-subtle) 0%,transparent 50%);pointer-events:none;z-index:0;opacity:.5}.lessons-list-header{background:var(--color-surface);border-bottom:1px solid var(--color-border-muted);padding:20px 28px;position:relative;z-index:100}.lessons-header-inner{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:32px;max-width:1300px;margin:0 auto}.lessons-header-left{display:flex;align-items:center;gap:16px}.lessons-header-logo{height:44px;width:auto;object-fit:contain;flex-shrink:0;cursor:pointer;transition:all .2s ease;opacity:.9}.lessons-header-logo:hover{opacity:1;transform:scale(1.05)}.lessons-header-center{display:flex}.lessons-header-exit-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--color-border-muted);background:var(--color-bg-tertiary);color:var(--color-text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s ease-out;flex-shrink:0;margin-left:auto}.lessons-header-exit-btn:hover{border-color:var(--color-border-hover);color:var(--color-text-primary);background:var(--color-bg-card-hover);transform:scale(1.03)}.lessons-header-exit-btn:active{transform:scale(.98)}.lessons-header-title-section{display:flex;flex-direction:column;gap:4px}.lessons-header-label{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.lessons-header-title{font-family:var(--font-heading);font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-text-primary);margin:0;line-height:1.2}.lessons-header-right{display:flex;align-items:center;justify-content:flex-end;gap:12px}.lessons-container{max-width:1300px;margin:0 auto;padding:48px 40px 80px;position:relative;z-index:2}@media(max-width:768px){.lessons-container{padding:32px 20px 60px}}.level-group{margin-bottom:80px}.level-group:last-child{margin-bottom:0}.level-summary-strip{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;padding:20px 28px;background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:16px;margin-bottom:40px;box-shadow:0 1px 3px #0000001a}.level-summary-left{display:flex;flex-direction:column;gap:6px}.level-summary-title{font-family:var(--font-heading);font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-text-primary);margin:0;line-height:1.2}.level-summary-subtext{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.level-summary-center{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:200px}.level-summary-progress-wrapper{width:100%;max-width:300px;display:flex;flex-direction:column;gap:8px;align-items:center}.level-summary-progress-bar{width:100%;height:6px;background:var(--color-bg-tertiary);border-radius:10px;overflow:hidden;position:relative}.level-summary-progress-fill{height:100%;background:linear-gradient(180deg,var(--color-accent) 0%,var(--color-accent) 100%);border-radius:10px;transition:width .4s cubic-bezier(.4,0,.2,1);position:relative;opacity:.9}.level-summary-progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:10px 10px 0 0}.level-summary-progress-text{font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--color-text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.level-summary-right{display:flex;align-items:center;justify-content:flex-end}.level-summary-stat-pill{display:inline-flex;align-items:center;padding:6px 12px;border-radius:20px;border:1px solid;font-family:var(--font-body);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;transition:all .15s ease-out;background:linear-gradient(135deg,var(--color-accent-soft) 0%,var(--color-accent-hover) 100%);border-color:var(--color-border);box-shadow:0 0 12px var(--color-glow-subtle),inset 0 1px #ffffff1a;color:var(--color-text-primary)}.path-container{position:relative;padding:0}.path-segment{position:relative;margin-bottom:56px}.path-segment:last-child{margin-bottom:0}.path-connector{position:absolute;left:28px;top:-32px;width:3px;height:32px;background:linear-gradient(180deg,var(--color-accent) 0%,transparent 100%);border-radius:2px;z-index:1;box-shadow:var(--shadow-glow-sm)}.path-connector.locked{background:linear-gradient(180deg,var(--color-border-muted) 0%,transparent 100%);opacity:.4;box-shadow:none}.level-section{margin-bottom:32px}.section-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;margin-bottom:20px;border-bottom:1px solid var(--color-border-muted);transition:all .15s ease-out}.section-header.unlocked{border-bottom-color:var(--color-border)}.section-header.locked{opacity:.45;border-bottom-color:var(--color-border-muted)}.section-header.current{border-bottom-color:var(--color-accent);border-bottom-width:2px}.section-header-left{display:flex;align-items:center;gap:12px}.section-code-pill{display:inline-flex;align-items:center;padding:6px 12px;border-radius:20px;border:1px solid;font-family:var(--font-body);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;transition:all .15s ease-out;background:linear-gradient(135deg,var(--color-accent-soft) 0%,var(--color-accent-hover) 100%);border-color:var(--color-border);box-shadow:0 0 12px var(--color-glow-subtle),inset 0 1px #ffffff1a;color:var(--color-text-primary)}.section-header-right{display:flex;align-items:center;gap:12px}.section-progress-wrapper{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.section-progress-text{font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--color-text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.section-progress-text.section-progress-completed{color:var(--color-accent)}.section-progress-bar{width:120px;height:4px;background:var(--color-bg-tertiary);border-radius:10px;overflow:hidden;position:relative}.section-progress-fill{height:100%;background:linear-gradient(180deg,var(--color-accent) 0%,var(--color-accent) 100%);border-radius:10px;transition:width .4s cubic-bezier(.4,0,.2,1);position:relative;opacity:.9}.section-progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:10px 10px 0 0}.section-condition-pill{display:inline-flex;align-items:center;padding:4px 10px;border-radius:16px;background:var(--color-bg-tertiary);border:1px solid var(--color-border-muted);font-family:var(--font-body);font-size:11px;font-weight:500;color:var(--color-text-secondary);white-space:nowrap}.section-lessons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}.sub-level-progress-section{margin-top:0;width:100%}.sub-level-progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.sub-level-progress-text{font-family:var(--font-body);font-size:13px;color:var(--color-text-secondary);font-weight:500;letter-spacing:.2px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.next-sub-level-info{font-size:12px;color:var(--color-accent);font-weight:500;opacity:.8}.sub-level-progress-bar{width:100%;height:6px;background:var(--color-bg-tertiary);border:none;border-radius:3px;overflow:hidden;box-shadow:inset 0 1px 3px #0000001a}.sub-level-progress-fill{height:100%;background:var(--gradient-primary);border-radius:3px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-glow-sm)}.sub-level-progress-fill.completed{background:var(--color-success);box-shadow:var(--shadow-glow-md);animation:none}@media(max-width:1024px){.section-lessons-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}@media(max-width:768px){.lessons-list-header{padding:16px 20px}.lessons-header-inner{grid-template-columns:1fr;gap:20px}.lessons-header-left{justify-content:flex-start}.lessons-header-logo{height:38px}.lessons-header-center{order:3}.lessons-header-right{justify-content:flex-end;order:2;margin-left:auto;width:100%}.lessons-header-exit-btn{width:34px;height:34px}.level-summary-strip{grid-template-columns:1fr;gap:20px;padding:20px}.level-summary-center{width:100%;min-width:auto}.section-header{flex-direction:column;align-items:flex-start;gap:12px}.section-header-right{width:100%;justify-content:space-between}.section-progress-wrapper{width:100%;align-items:flex-start}.section-progress-bar{width:100%;max-width:200px}.section-lessons-grid{grid-template-columns:1fr;gap:16px}.lesson-card-modern{padding:18px}}@media(max-width:480px){.lessons-container{padding:24px 16px 60px}.lessons-header-title,.level-summary-title{font-size:14px}}.theme-light .lessons-list-header{background:linear-gradient(180deg,#fff,#f8fafc);box-shadow:0 1px 3px #0000000f,0 1px #fff inset}.theme-light .lessons-header-exit-btn{background:#f5f5f5;border-color:#e0e0e0;color:#666}.theme-light .lessons-header-exit-btn:hover{border-color:#ccc;color:#333;background:#ebebeb}.theme-light .level-summary-strip{background:#fff;box-shadow:0 1px 3px #0000000f}.theme-light .level-summary-progress-bar{background:var(--color-bg-tertiary)}.theme-light .level-summary-progress-fill{background:var(--color-accent);opacity:.9}.theme-light .level-summary-stat-pill,.theme-light .section-code-pill{background:var(--color-accent-soft);border-color:var(--color-border);box-shadow:none}.theme-light .section-progress-bar{background:var(--color-bg-tertiary)}.theme-light .section-progress-fill{background:var(--color-accent);opacity:.9}.theme-light .section-progress-text.section-progress-completed{color:var(--color-accent)}.theme-light .lesson-card-modern{background:#fff;box-shadow:0 1px 3px #0000000f}.theme-light .lesson-card-modern-bpm-pill{background:var(--color-accent-soft);border-color:var(--color-border);box-shadow:none}.theme-light .lesson-card-modern-progress-bar{background:var(--color-bg-tertiary)}.theme-light .lesson-card-modern-progress-fill{background:var(--color-accent);opacity:.9}.theme-light .lesson-card-modern-rank-pill:before{background:linear-gradient(135deg,rgba(0,0,0,.05) 0%,transparent 50%)}.lesson-card-modern{background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:16px;padding:20px;cursor:pointer;transition:all .15s ease-out;box-shadow:0 1px 3px #0000001a;position:relative;display:flex;flex-direction:column;gap:12px;min-height:160px}.lesson-card-modern:hover:not(.locked){transform:translateY(-2px);box-shadow:0 4px 12px #00000026;border-color:var(--color-border)}.lesson-card-modern.locked{opacity:.5;cursor:not-allowed}.lesson-card-modern-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.lesson-card-modern-title-section{flex:1;min-width:0}.lesson-card-modern-code{font-family:var(--font-heading);font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-text-primary);margin-bottom:4px;line-height:1.2}.lesson-card-modern-name{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.lesson-card-modern-bpm-pill{display:inline-flex;align-items:center;padding:5px 14px;border-radius:20px;border:1px solid var(--color-accent);background:var(--color-accent-soft);font-family:var(--font-body);font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-accent);box-shadow:0 0 12px var(--color-glow-subtle);transition:all .15s ease-out;flex-shrink:0}.lesson-card-modern-middle{display:flex;align-items:center;margin:4px 0}.lesson-card-modern-rank-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;border:1px solid;font-family:var(--font-body);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;transition:all .15s ease-out;position:relative}.lesson-card-modern-rank-pill:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.1) 0%,transparent 50%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:.4;pointer-events:none}.lesson-card-modern-rank-pill[data-tier=bronze]{background:linear-gradient(135deg,#cd7f321f,#8b5a2b2e);border-color:#cd7f3259;box-shadow:0 0 12px #cd7f3226,inset 0 1px #ffffff1a}.lesson-card-modern-rank-pill[data-tier=silver]{background:linear-gradient(135deg,#a8b4c41f,#8a9aaf2e);border-color:#a8b4c459;box-shadow:0 0 12px #a8b4c426,inset 0 1px #ffffff1a}.lesson-card-modern-rank-pill[data-tier=gold]{background:linear-gradient(135deg,#f5a6231f,#ffa5002e);border-color:#f5a62359;box-shadow:0 0 12px #f5a62333,inset 0 1px #ffffff1a}.lesson-card-modern-rank-pill[data-tier=platinum]{background:linear-gradient(135deg,#25ced11f,#0891b22e);border-color:#25ced159;box-shadow:0 0 12px #25ced133,inset 0 1px #ffffff1a}.lesson-card-modern-rank-pill[data-tier=diamond]{background:linear-gradient(135deg,#7c5cff1f,#4f46e533);border-color:#7c5cff66;box-shadow:0 0 16px #7c5cff40,inset 0 1px #ffffff1a}.lesson-card-modern-rank-pill[data-tier=master]{background:linear-gradient(135deg,#9d4edd24,#7c3aed38);border-color:#9d4edd66;box-shadow:0 0 16px #9d4edd4d,inset 0 1px #ffffff1a}.lesson-card-modern-rank-pill[data-tier=not_trained]{background:#94a3b814;border-color:var(--color-border-muted);box-shadow:inset 0 1px #ffffff0d}.lesson-rank-icon{font-size:14px;line-height:1;display:flex;align-items:center;filter:drop-shadow(0 0 2px rgba(255,255,255,.2))}.lesson-rank-label{line-height:1.1;letter-spacing:.08em}.lesson-card-modern-footer{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-top:12px;border-top:1px solid var(--color-border-muted)}.lesson-card-modern-time{font-family:var(--font-body);font-size:12px;font-weight:500;color:var(--color-text-secondary);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.lesson-card-modern-progress-bar{width:100%;height:6px;background:var(--color-bg-tertiary);border-radius:10px;overflow:hidden;position:relative}.lesson-card-modern-progress-fill{height:100%;background:linear-gradient(180deg,var(--color-accent) 0%,var(--color-accent) 100%);border-radius:10px;transition:width .4s cubic-bezier(.4,0,.2,1);position:relative;opacity:.9}.lesson-card-modern-progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:10px 10px 0 0}.lesson-card-modern-progress-fill.completed{background:var(--color-success)}.lesson-card-modern-locked{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--color-bg-tertiary);border-radius:12px;color:var(--color-text-muted);border:1px solid var(--color-border-muted);margin-top:auto}.locked-icon{font-size:18px;opacity:.5}.lesson-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);opacity:0;transition:opacity .3s ease}.lesson-card:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 50% 0%,var(--color-glow-subtle) 0%,transparent 60%);opacity:0;transition:opacity .3s ease;pointer-events:none}.lesson-card:hover:not(.locked):before{opacity:1}.lesson-card:hover:not(.locked):after{opacity:1}.lesson-card:hover:not(.locked){transform:translateY(-6px) scale(1.015);border-color:var(--color-border-hover);box-shadow:var(--shadow-card-hover)}.lesson-card:active:not(.locked){transform:translateY(-3px) scale(1.01)}.lesson-card.locked{opacity:.4;cursor:not-allowed;border-color:var(--color-border-muted)}.lesson-card.current-sub-level{border-color:var(--color-border-active);box-shadow:var(--shadow-card),0 0 0 2px var(--color-accent-soft)}.lesson-card-content{display:flex;flex-direction:column;height:100%;gap:0;position:relative;z-index:1}.lesson-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:0;flex:1;min-height:0}.lesson-card-title-section{flex:1;min-width:0;display:flex;flex-direction:column;height:100%}.lesson-card-title{font-family:var(--font-heading);font-size:16px;font-weight:700;color:var(--color-text-primary);margin:0 0 4px;letter-spacing:-.3px;text-transform:none;text-shadow:none;line-height:1.3;transition:color .2s ease}.lesson-card-artist-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:6px;margin-bottom:4px}.lesson-card-artist{flex:1;min-width:0}.lesson-card-bpm-inline{flex-shrink:0}.lesson-card:hover:not(.locked) .lesson-card-title{color:var(--color-accent)}.lesson-card-artist{font-family:var(--font-body);font-size:13px;color:var(--color-text-muted);margin:0;letter-spacing:.2px;font-weight:400}.lesson-card-tier{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;border-width:1.5px;border-style:solid;font-family:var(--font-body);font-weight:700;font-size:11px;letter-spacing:.5px;margin-bottom:2px;transition:all .3s cubic-bezier(.4,0,.2,1);max-width:100%;box-sizing:border-box;position:relative;overflow:hidden;text-transform:uppercase}.lesson-card-tier:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.12) 50%,transparent 100%);transition:left .5s ease}.lesson-card:hover .lesson-card-tier:before{left:100%}.lesson-card:hover .lesson-card-tier{transform:scale(1.02);filter:brightness(1.1)}.lesson-card-tier[data-tier=bronze]{background:linear-gradient(135deg,#cd7f3233,#8b5a2b4d);border-color:#cd7f3280;box-shadow:0 2px 8px #cd7f3233,inset 0 1px #ffffff14}.lesson-card:hover .lesson-card-tier[data-tier=bronze]{box-shadow:0 4px 16px #cd7f3266,0 0 20px #cd7f3240}.lesson-card-tier[data-tier=silver]{background:linear-gradient(135deg,#a8b4c433,#8a9aaf4d);border-color:#a8b4c480;box-shadow:0 2px 8px #a8b4c433,inset 0 1px #ffffff1f}.lesson-card:hover .lesson-card-tier[data-tier=silver]{box-shadow:0 4px 16px #a8b4c466,0 0 20px #a8b4c440}.lesson-card-tier[data-tier=gold]{background:linear-gradient(135deg,#f5a62333,#ffa5004d);border-color:#f5a62380;box-shadow:0 2px 8px #f5a62340,inset 0 1px #ffffff1f}.lesson-card:hover .lesson-card-tier[data-tier=gold]{box-shadow:0 4px 16px #f5a62380,0 0 24px #f5a62359}.lesson-card-tier[data-tier=platinum]{background:linear-gradient(135deg,#25ced133,#0891b24d);border-color:#25ced180;box-shadow:0 2px 8px #25ced140,inset 0 1px #ffffff1f}.lesson-card:hover .lesson-card-tier[data-tier=platinum]{box-shadow:0 4px 16px #25ced180,0 0 24px #25ced159}.lesson-card-tier[data-tier=diamond]{background:linear-gradient(135deg,#7c5cff38,#4f46e552);border-color:#7c5cff8c;box-shadow:0 2px 10px #7c5cff4d,inset 0 1px #ffffff1f}.lesson-card:hover .lesson-card-tier[data-tier=diamond]{box-shadow:0 4px 20px #7c5cff8c,0 0 28px #7c5cff66}.lesson-card-tier[data-tier=master]{background:linear-gradient(135deg,#9d4edd40,#7c3aed59);border-color:#9d4edd99;box-shadow:0 2px 12px #9d4edd59,inset 0 1px #ffffff1f}.lesson-card:hover .lesson-card-tier[data-tier=master]{box-shadow:0 4px 24px #9d4edd99,0 0 32px #9d4edd73}.lesson-card-tier[data-tier=not_trained]{background:linear-gradient(135deg,#d2b48c2e,#b4966e40);border-color:#cd7f324d;box-shadow:0 2px 6px #b4966e26}.lesson-card:hover .lesson-card-tier[data-tier=not_trained]{box-shadow:0 4px 12px #cd7f3240,0 0 16px #cd7f3226;border-color:#cd7f3273}.lesson-tier-medal{font-size:15px;line-height:1;display:inline-flex;align-items:center;justify-content:center;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.lesson-tier-label{font-size:11px;line-height:1.2;font-weight:700;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;flex-shrink:1;min-width:0;text-shadow:0 1px 2px rgba(0,0,0,.2)}.lesson-card-progress{display:flex;flex-direction:column;gap:8px;margin-top:0;padding-top:12px;border-top:1px solid var(--color-border-muted);flex-shrink:0}.lesson-card-time{font-family:var(--font-body);font-size:12px;color:var(--color-text-secondary);font-weight:500;letter-spacing:.2px}.lesson-card-progress-bar{width:100%;height:4px;background:var(--color-bg-tertiary);border:none;border-radius:2px;overflow:hidden;box-shadow:inset 0 1px 2px #0000001a}.lesson-card-progress-fill{height:100%;background:var(--gradient-primary);border-radius:3px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-glow-sm)}.lesson-card-progress-fill.completed{background:var(--color-success);box-shadow:var(--shadow-glow-md);animation:none}.lesson-card-locked{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--color-bg);border-radius:12px;color:var(--color-text-muted);border:1px solid var(--color-border-muted);margin-top:auto}.locked-icon-small{font-size:18px;opacity:.5}.locked-text{font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:.2px}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--color-text-primary);text-align:center;padding:40px}.loading-spinner{width:48px;height:48px;border:3px solid var(--color-border-muted);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:24px;box-shadow:var(--shadow-glow-sm)}.retry-button{background:var(--gradient-primary);color:var(--color-neutral-0);border:none;padding:14px 32px;border-radius:12px;font-family:var(--font-body);font-size:14px;font-weight:700;cursor:pointer;margin-top:24px;transition:all .25s ease;text-transform:uppercase;letter-spacing:1px;box-shadow:var(--shadow-button)}.retry-button:hover{transform:translateY(-3px);box-shadow:var(--shadow-button-hover)}.lesson-badges{display:flex;gap:8px;flex-wrap:wrap}.difficulty-badge{display:inline-flex;align-items:center;padding:6px 12px;border-radius:20px;font-family:var(--font-body);font-size:11px;font-weight:600;box-shadow:none;text-transform:uppercase;letter-spacing:.5px}.duration-badge,.bpm-badge{display:inline-flex;align-items:center;padding:5px 10px;border-radius:18px;font-family:var(--font-body);font-size:10px;font-weight:600;background:var(--color-bg);color:var(--color-text-secondary);border:1px solid var(--color-border-muted);box-shadow:none;letter-spacing:.3px}.lessons-path{position:relative;padding-left:60px;display:flex;flex-direction:column;gap:20px}.path-lesson-wrapper{position:relative}.path-line-to-lesson{position:absolute;left:-32px;top:-16px;width:3px;height:16px;background:linear-gradient(180deg,var(--color-accent) 0%,transparent 100%);border-radius:2px;z-index:1;box-shadow:var(--shadow-glow-subtle)}.path-line-to-lesson.locked{background:var(--color-border-muted);opacity:.3;box-shadow:none}.lesson-node{background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:16px;padding:24px;cursor:pointer;transition:all .35s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-card);position:relative;z-index:2;overflow:hidden}.lesson-node:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);opacity:0;transition:opacity .3s ease}.lesson-node:hover:not(.locked):before{opacity:1}.lesson-node:hover:not(.locked){transform:translate(8px) translateY(-4px);border-color:var(--color-border-hover);box-shadow:var(--shadow-card-hover)}.lesson-node.locked{opacity:.4;cursor:not-allowed}.lesson-node.current-sub-level{border-color:var(--color-border-active);box-shadow:var(--shadow-card),0 0 0 2px var(--color-accent-soft)}.lesson-node-content{display:flex;flex-direction:column;gap:14px}.lesson-node-header{flex:1}.lesson-header-top{display:flex;justify-content:space-between;align-items:flex-start;width:100%;gap:16px;flex-wrap:wrap}.lesson-node-title{font-family:var(--font-heading);font-size:17px;font-weight:700;color:var(--color-text-primary);margin:0 0 6px;letter-spacing:-.2px;text-transform:none;text-shadow:none;transition:color .2s ease}.lesson-node:hover:not(.locked) .lesson-node-title{color:var(--color-accent)}.lesson-node-artist{font-family:var(--font-body);font-size:13px;color:var(--color-text-muted);margin:0;letter-spacing:.2px}.lesson-node-progress{display:flex;flex-direction:column;gap:10px;padding-top:14px;border-top:1px solid var(--color-border-muted)}.lesson-node-time{font-family:var(--font-body);font-size:13px;color:var(--color-text-secondary);font-weight:500;letter-spacing:.2px}.lesson-node-progress-bar{width:100%;height:5px;background:var(--color-bg-tertiary);border:none;border-radius:3px;overflow:hidden}.lesson-node-progress-fill{height:100%;background:var(--gradient-primary);border-radius:3px;transition:width .5s ease;box-shadow:var(--shadow-glow-sm)}.lesson-node-progress-fill.completed{background:var(--color-success)}.lesson-node-locked{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--color-bg);border-radius:10px;color:var(--color-text-muted);border:1px solid var(--color-border-muted)}@media(max-width:768px){.level-group-header{flex-direction:column;gap:20px;padding:24px;text-align:left;border-left-width:3px}.level-group-title{font-size:22px}.level-header-stats{width:100%;justify-content:flex-start}.lessons-path{padding-left:40px}.path-connector,.path-line-to-lesson{left:20px}.sub-level-header{flex-direction:row;text-align:left;gap:16px;padding:14px 0}.sub-level-info{flex-direction:column;align-items:flex-start;gap:10px}.lesson-card{padding:24px;min-height:200px}.lesson-card-title{font-size:16px}}.lesson-list-header,.lesson-list-top,.lesson-list-header-logo,.pathway-name-header,.lesson-list-subtitle,.level-display-inline{display:none}.lesson-player-container{min-height:100vh;height:100vh;background:var(--color-bg);display:flex;flex-direction:column;position:relative;color:var(--color-text-primary);overflow:hidden}.lesson-player-header-section{display:none}.lesson-header-center{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;z-index:1;pointer-events:none}.lesson-header-center .logo-wrapper{pointer-events:auto}.lesson-header-left{display:flex;align-items:center;gap:var(--spacing-md);flex:1;min-width:0;max-width:40%}.lesson-back-btn-icon{background:var(--color-bg-secondary);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--color-accent);border:1px solid var(--color-border-default);padding:var(--spacing-sm);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;box-shadow:var(--shadow-sm),var(--shadow-glow-subtle)}.lesson-back-btn-icon:hover{background:var(--color-bg-tertiary);border-color:var(--color-border-hover);transform:translate(-2px);box-shadow:var(--shadow-md),var(--shadow-glow-sm);color:var(--color-accent)}.theme-default .lesson-back-btn-icon:hover,.theme-light .lesson-back-btn-icon:hover,.theme-stealth .lesson-back-btn-icon:hover,.theme-vintage .lesson-back-btn-icon:hover,.theme-hello-kitty .lesson-back-btn-icon:hover,.theme-kuromi .lesson-back-btn-icon:hover{color:var(--color-accent)}.theme-monochrome .lesson-back-btn-icon:hover{color:var(--color-text-primary)}.theme-sunburst .lesson-back-btn-icon:hover,.theme-enhanced-forest .lesson-back-btn-icon:hover{color:var(--color-accent)}.lesson-back-btn-icon:active{transform:translate(-1px)}.lesson-title-section{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.lesson-artist-row{display:flex;align-items:center;gap:var(--spacing-sm);flex-wrap:wrap}.lesson-title-main{font-family:var(--font-heading);margin:0;color:var(--color-accent);font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-normal);text-transform:uppercase;text-shadow:0 0 12px var(--color-glow);line-height:var(--line-height-tight);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lesson-artist-subtle{font-family:var(--font-body);color:var(--color-text-secondary);font-size:var(--font-size-sm);margin:0;font-weight:var(--font-weight-normal);letter-spacing:var(--letter-spacing-tight);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}.lesson-header-right{display:flex;align-items:center;flex-shrink:0;flex:1;justify-content:flex-end;min-width:0;max-width:40%}.status-badge-cluster{display:flex;align-items:center;gap:var(--spacing-sm);flex-wrap:wrap}.status-badge{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-tight);white-space:nowrap;transition:all var(--transition-fast);box-shadow:var(--shadow-sm)}.status-badge-icon{font-size:var(--font-size-sm);line-height:1;display:flex;align-items:center}.status-badge-text{line-height:var(--line-height-tight)}.status-badge-level{text-transform:uppercase}.status-badge-bpm{background:var(--color-bg-card);color:var(--color-accent);border:1px solid var(--color-border-default);box-shadow:var(--shadow-glow-subtle)}.back-btn{background:var(--color-bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--color-text-primary);border:2px solid var(--color-border-default);padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);transition:all var(--transition-normal);white-space:nowrap;box-shadow:var(--shadow-glow-sm);letter-spacing:var(--letter-spacing-normal)}.back-btn:hover{background:var(--color-bg-card-hover);border-color:var(--color-border-hover);transform:translateY(-2px);box-shadow:var(--shadow-glow-md);color:var(--color-accent)}.theme-default .back-btn:hover,.theme-light .back-btn:hover,.theme-stealth .back-btn:hover,.theme-vintage .back-btn:hover,.theme-hello-kitty .back-btn:hover,.theme-kuromi .back-btn:hover{color:var(--color-accent)}.theme-monochrome .back-btn:hover{color:var(--color-text-primary)}.theme-sunburst .back-btn:hover,.theme-enhanced-forest .back-btn:hover{color:var(--color-accent)}.difficulty-badge{display:inline-block;padding:6px 14px;border-radius:8px;font-family:var(--font-heading);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:1px}.difficulty-level-1{background:var(--color-success);color:#000;box-shadow:var(--shadow-glow-sm)}.difficulty-level-2{background:var(--color-warning);color:#000;box-shadow:var(--shadow-glow-sm)}.difficulty-level-3{background:var(--color-error);color:#fff;box-shadow:var(--shadow-glow-sm)}.bpm-range-badge{display:inline-block;padding:6px 14px;border-radius:8px;font-family:var(--font-body);font-size:12px;font-weight:600;background:var(--color-bg-card);color:var(--color-accent);border:2px solid var(--color-border);box-shadow:var(--shadow-glow-subtle);letter-spacing:1px}.progress-section-compact{background:var(--color-bg-secondary);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--color-border-default);padding:var(--spacing-sm) var(--spacing-lg)}.progress-section-top{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);margin-bottom:var(--spacing-sm)}.progress-info-group{display:flex;align-items:center;gap:var(--spacing-md);font-family:var(--font-body);flex-wrap:wrap}.progress-label-text{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-tight)}.progress-time-value{color:var(--color-accent);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-tight)}.tier-badge-modern{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:6px 12px;border-radius:8px;border:1.5px solid;font-family:var(--font-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);white-space:nowrap;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:.5px}.tier-badge-modern:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.15) 50%,transparent 100%);transition:left .6s ease}.tier-badge-modern:hover:before{left:100%}.tier-badge-modern:hover{transform:translateY(-1px);filter:brightness(1.1)}.tier-badge-modern[data-tier=bronze]{background:linear-gradient(135deg,#cd7f3233,#8b5a2b4d);border-color:#cd7f3280;box-shadow:0 2px 8px #cd7f3240,inset 0 1px #ffffff1a}.tier-badge-modern[data-tier=bronze]:hover{box-shadow:0 4px 16px #cd7f3266,0 0 20px #cd7f324d}.tier-badge-modern[data-tier=silver]{background:linear-gradient(135deg,#a8b4c433,#8a9aaf4d);border-color:#a8b4c480;box-shadow:0 2px 8px #a8b4c440,inset 0 1px #ffffff26}.tier-badge-modern[data-tier=silver]:hover{box-shadow:0 4px 16px #a8b4c466,0 0 20px #a8b4c44d}.tier-badge-modern[data-tier=gold]{background:linear-gradient(135deg,#f5a62333,#ffa5004d);border-color:#f5a62380;box-shadow:0 2px 8px #f5a62340,inset 0 1px #ffffff26}.tier-badge-modern[data-tier=gold]:hover{box-shadow:0 4px 16px #f5a62380,0 0 24px #f5a62366}.tier-badge-modern[data-tier=platinum]{background:linear-gradient(135deg,#25ced133,#0891b24d);border-color:#25ced180;box-shadow:0 2px 8px #25ced140,inset 0 1px #ffffff26}.tier-badge-modern[data-tier=platinum]:hover{box-shadow:0 4px 16px #25ced180,0 0 24px #25ced166}.tier-badge-modern[data-tier=diamond]{background:linear-gradient(135deg,#7c5cff33,#4f46e54d);border-color:#7c5cff80;box-shadow:0 2px 8px #7c5cff4d,inset 0 1px #ffffff26}.tier-badge-modern[data-tier=diamond]:hover{box-shadow:0 4px 16px #7c5cff80,0 0 28px #7c5cff80}.tier-badge-modern[data-tier=master]{background:linear-gradient(135deg,#9d4edd40,#7c3aed59);border-color:#9d4edd99;box-shadow:0 2px 10px #9d4edd59,inset 0 1px #ffffff26}.tier-badge-modern[data-tier=master]:hover{box-shadow:0 4px 20px #9d4edd99,0 0 32px #9d4edd80}.tier-badge-modern[data-tier=not_trained]{background:linear-gradient(135deg,#d2b48c33,#b4966e47);border-color:#cd7f3259;box-shadow:0 2px 6px #b4966e2e}.tier-badge-icon{font-size:15px;line-height:1;display:flex;align-items:center;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.tier-badge-label{line-height:var(--line-height-tight);letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.progress-bar-modern{width:100%;height:5px;background:var(--color-accent-soft);border-radius:var(--radius-sm);overflow:hidden;box-shadow:inset 0 1px 2px var(--shadow-sm)}.progress-bar-fill-modern{height:100%;background:var(--gradient-primary);border-radius:var(--radius-sm);transition:width var(--transition-slow);box-shadow:var(--shadow-glow-md),inset 0 0 4px var(--color-glow);position:relative;overflow:hidden}.progress-bar-fill-modern:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.2) 50%,transparent 100%);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-family:Rajdhani,sans-serif;font-size:14px;font-weight:600;letter-spacing:1px}.progress-label{color:#ccc}.progress-time{color:#0f8}.progress-bar-container{width:100%;height:16px;background:#0009;border:1px solid rgba(0,255,136,.3);border-radius:8px;overflow:hidden;box-shadow:inset 0 2px 4px #00000080}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#0f8,#00cc6a);border-radius:8px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:0 0 15px #0f89,inset 0 0 10px #00ff884d}.lesson-practice-time{margin-top:12px;padding-top:12px;border-top:1px solid rgba(0,255,136,.2);display:flex;align-items:center;justify-content:center;gap:8px;font-family:Rajdhani,sans-serif;font-size:14px;font-weight:600;letter-spacing:1px}.lesson-time-label{color:#ccc}.lesson-time-value{color:#0f8;font-weight:700;text-shadow:0 0 10px rgba(0,255,136,.4)}.lesson-target-time{color:#999;font-size:.9em;margin-left:4px}.newly-added-time{color:#d946ef;font-weight:900;text-shadow:0 0 8px rgba(217,70,239,.5);animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,to{opacity:1;text-shadow:0 0 8px rgba(217,70,239,.5)}50%{opacity:.8;text-shadow:0 0 12px rgba(217,70,239,.7)}}.lesson-player-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;z-index:1;position:relative}.lesson-player-main-layout{display:flex;gap:var(--spacing-lg);padding:var(--spacing-lg);align-items:flex-start;position:relative}.video-panel{flex-shrink:0;background:var(--color-alphatab-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-xl);border:2px solid var(--color-alphatab-border);box-shadow:var(--shadow-lg),var(--shadow-glow-subtle);display:flex;flex-direction:column;overflow:hidden;position:sticky;top:var(--spacing-lg);align-self:flex-start;min-width:200px;max-width:800px}.video-wrapper{position:relative;width:100%;background:#000;overflow:hidden;padding-bottom:56.25%;border-radius:var(--radius-lg)}.video-wrapper video.sync-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;border-radius:var(--radius-lg)}.video-resizer{position:fixed;top:0;bottom:0;width:4px;cursor:col-resize;background:transparent;transition:background-color .2s ease,width .2s ease;z-index:10;pointer-events:auto;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:none}.video-resizer:hover{width:6px;background:var(--color-bg-card-hover);border-left:1px solid var(--color-border);border-right:1px solid var(--color-border)}.video-resizer:active{width:6px;background:var(--color-bg-card-hover);border-left:1px solid var(--color-accent);border-right:1px solid var(--color-accent)}.resizer-handle{width:3px;height:100%;position:absolute;left:50%;top:0;transform:translate(-50%);background:var(--color-border);border-radius:2px;transition:all .2s ease;opacity:.7;margin:0;padding:0;box-shadow:0 0 4px var(--color-glow-subtle);display:flex;align-items:center;justify-content:center}.resizer-grip-icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:20px;height:32px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:4px;display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);font-size:12px;line-height:1;letter-spacing:-2px;font-weight:700;opacity:.9;box-shadow:0 2px 4px #0003;transition:all .2s ease}.video-resizer:hover .resizer-handle{width:3px;height:100%;background:var(--color-accent);opacity:1;box-shadow:0 0 8px var(--color-glow)}.video-resizer:hover .resizer-grip-icon{background:var(--color-bg-card-hover);border-color:var(--color-accent);color:var(--color-accent);opacity:1;box-shadow:0 2px 8px var(--color-glow)}.video-resizer:active .resizer-handle{background:var(--color-accent);opacity:1;box-shadow:0 0 12px var(--color-glow-strong)}.video-resizer:active .resizer-grip-icon{background:var(--color-bg-card-hover);border-color:var(--color-accent);color:var(--color-accent);opacity:1;transform:translate(-50%,-50%) scale(1.05)}.tab-container-wrapper{flex:1;min-width:0;height:100%;overflow:visible;background:transparent}@media(max-width:1024px){.lesson-player-main-layout{flex-direction:column}.video-panel{position:relative;top:0;width:100%!important;max-width:100%}.video-resizer{width:100%;height:8px;cursor:row-resize}.resizer-handle{width:100%;height:2px}.video-resizer:hover .resizer-handle{width:100%;height:3px}}.tab-container{max-width:100%;overflow-x:auto;min-height:400px;background:var(--color-alphatab-bg)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-xl);padding:var(--spacing-lg);border:2px solid var(--color-alphatab-border);box-shadow:var(--shadow-lg),var(--shadow-glow-subtle)}.theme-hello-kitty .tab-container{background:var(--color-alphatab-bg)!important;backdrop-filter:none;-webkit-backdrop-filter:none;border:2.2px solid var(--color-alphatab-border);border-radius:24px;box-shadow:var(--shadow-card)}.theme-hello-kitty .tab-container svg,.theme-hello-kitty .tab-container canvas{border-radius:12px}.theme-hello-kitty .tab-container svg circle[r],.theme-hello-kitty .tab-container svg ellipse{fill:var(--color-alphatab-note)!important;stroke:var(--color-text-primary)!important;stroke-width:2px!important}.theme-hello-kitty .tab-container svg line{stroke:var(--color-alphatab-text)!important;stroke-width:2px!important;opacity:.4}.theme-hello-kitty .at-cursor-bar{background:transparent!important;border:none!important;box-shadow:none!important}.theme-kuromi .tab-container{background:var(--color-alphatab-bg)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid var(--color-alphatab-border);border-radius:18px;box-shadow:var(--shadow-card)}.theme-kuromi .tab-container svg,.theme-kuromi .tab-container canvas{border-radius:10px}.theme-kuromi .tab-container svg circle[r],.theme-kuromi .tab-container svg ellipse{fill:var(--color-alphatab-note)!important;stroke:var(--color-accent)!important;stroke-width:1.5px!important}.theme-kuromi .tab-container svg line{stroke:var(--color-alphatab-text)!important;stroke-width:1.5px!important;opacity:.5}.theme-kuromi .at-cursor-bar{background:transparent!important;border:none!important;box-shadow:none!important}.tab-container>div:not(.selection-drag-handles-overlay){display:block!important;visibility:visible!important;min-height:400px;width:100%}.tab-container svg,.tab-container canvas{display:block!important;visibility:visible!important;max-width:100%;background-color:var(--color-alphatab-bg)!important;border-radius:var(--radius-sm)}.tab-container>div:not(.selection-drag-handles-overlay){background-color:var(--color-alphatab-bg)!important}.selection-drag-handles-overlay{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:50}.selection-drag-handle{position:absolute;width:5px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:ew-resize;z-index:100;pointer-events:auto;background:var(--color-accent, #22c55e);border:1px solid rgba(0,0,0,.2);border-radius:3px;box-shadow:0 0 8px color-mix(in srgb,var(--color-accent, #22c55e) 50%,transparent),0 2px 4px #0000004d;transition:box-shadow .2s ease,width .15s ease}.selection-drag-handle:hover{width:7px;box-shadow:0 0 12px color-mix(in srgb,var(--color-accent, #22c55e) 70%,transparent),0 3px 8px #0006}.selection-drag-handle:active{width:6px;box-shadow:0 0 6px color-mix(in srgb,var(--color-accent, #22c55e) 40%,transparent),0 1px 3px #0000004d}.selection-drag-handle:before{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);width:12px;height:12px;background:var(--color-accent, #22c55e);border:1px solid rgba(0,0,0,.2);border-radius:50%;box-shadow:0 0 6px color-mix(in srgb,var(--color-accent, #22c55e) 50%,transparent),0 2px 3px #0000004d,inset 0 1px 2px #ffffff4d}.selection-drag-handle:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:12px;height:12px;background:var(--color-accent, #22c55e);border:1px solid rgba(0,0,0,.2);border-radius:50%;box-shadow:0 0 6px color-mix(in srgb,var(--color-accent, #22c55e) 50%,transparent),0 2px 3px #0000004d}.selection-drag-handle svg{display:none}.video-container{margin-bottom:20px;background:#0009;border:1px solid rgba(217,70,239,.3);border-radius:12px;padding:16px;box-shadow:0 8px 32px #0006,inset 0 1px #ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.video-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid rgba(217,70,239,.3)}.video-title{font-family:Orbitron,sans-serif;font-size:16px;font-weight:700;color:#d946ef;margin:0;text-shadow:0 0 6px rgba(217,70,239,.3);text-transform:uppercase;letter-spacing:1px}.video-toggle-btn{background:#d946ef26;border:1px solid rgba(217,70,239,.4);color:#d946ef;padding:6px 12px;border-radius:6px;cursor:pointer;font-family:Orbitron,sans-serif;font-size:12px;font-weight:700;transition:all .2s;text-transform:uppercase;letter-spacing:1px;box-shadow:0 2px 8px #0000004d}.video-toggle-btn:hover{background:#d946ef40;box-shadow:0 0 12px #d946ef66;transform:translateY(-1px)}.video-wrapper{position:relative;width:100%;overflow:hidden;border-radius:8px;background:#00000080;transition:all .3s ease}.video-container.collapsed .video-wrapper{padding-bottom:25%;height:0}.video-container.expanded .video-wrapper{padding-bottom:56.25%;height:0}.youtube-iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none;border-radius:8px}.sync-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;border-radius:8px}.lesson-player-controls-bottom{flex-shrink:0;height:56px;background:var(--color-bg-primary);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:1px solid var(--color-border-default);z-index:100;box-shadow:0 -4px 12px var(--shadow-md),var(--shadow-glow-subtle);display:flex;align-items:center;padding:0 var(--spacing-lg);overflow:visible}.controls-bottom-content{display:flex;align-items:center;gap:var(--spacing-md);width:100%;flex-wrap:nowrap;justify-content:center;position:relative;overflow:visible}.control-group-transport,.control-group-tempo,.control-group-track{display:flex;align-items:center;gap:var(--spacing-sm);flex-shrink:0;padding:0 var(--spacing-md);border-radius:var(--radius-md);height:40px;position:relative;overflow:visible}.control-divider{width:1px;height:32px;background:var(--color-border-default);flex-shrink:0}.control-btn-play{width:40px;height:40px;background:var(--color-accent-soft);border:1.5px solid var(--color-border-default);color:var(--color-accent);border-radius:var(--radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);flex-shrink:0}.control-btn-play:hover{background:var(--color-accent-hover);border-color:var(--color-border-hover);transform:scale(1.05);box-shadow:var(--shadow-glow-sm)}.control-btn-play:active{transform:scale(.98)}.control-btn-icon{width:36px;height:36px;background:transparent;border:1px solid var(--color-border-muted);color:var(--color-text-secondary);border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);flex-shrink:0}.control-btn-icon:hover{background:var(--color-accent-soft);border-color:var(--color-border-hover);color:var(--color-text-primary);transform:translateY(-1px)}.control-btn-icon.active{background:var(--color-accent-soft);border-color:var(--color-border-active);color:var(--color-accent);box-shadow:var(--shadow-glow-sm)}.control-btn-icon.active:hover{background:var(--color-accent-hover);border-color:var(--color-border-hover)}.control-btn-range-adjust{width:30px;height:30px;border-color:var(--color-border-active);color:var(--color-accent)}.control-btn-range-adjust:hover{background:var(--color-accent-soft);color:var(--color-accent);box-shadow:var(--shadow-glow-sm)}.control-group-tempo{position:relative;z-index:1000}.tempo-display{display:flex;align-items:center;gap:4px;background:var(--color-bg-card);border:1px solid var(--color-border-muted);border-radius:var(--radius-sm);padding:4px;cursor:pointer;transition:all var(--transition-fast)}.tempo-display:hover{border-color:var(--color-border-hover);background:var(--color-bg-card-hover)}.tempo-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:transparent;border:none;border-radius:var(--radius-xs);color:var(--color-text-primary);font-size:16px;font-weight:var(--font-weight-bold);cursor:pointer;transition:all var(--transition-fast)}.tempo-btn:hover{background:var(--color-bg-hover)}.tempo-btn:active{background:var(--color-bg-active)}.tempo-info{display:flex;align-items:baseline;gap:4px;min-width:50px;padding:0 4px;justify-content:center}.tempo-bpm{font-family:var(--font-mono);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-accent-primary);line-height:1}.tempo-unit{font-family:var(--font-mono);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-transform:uppercase}.tempo-popup{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:8px;background:var(--color-bg-card);border:1px solid var(--color-border-default);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);min-width:220px;box-shadow:var(--shadow-lg);z-index:9999;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.tempo-popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sm);padding-bottom:var(--spacing-xs);border-bottom:1px solid var(--color-border-muted)}.tempo-popup-title{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.tempo-popup-value{font-family:var(--font-mono);font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--color-accent-primary)}.tempo-popup-slider{padding:var(--spacing-sm) 0}.tempo-slider-track{position:relative;height:6px;margin-bottom:var(--spacing-md)}.tempo-slider-fill{position:absolute;top:0;left:0;height:100%;background:var(--color-accent-primary);border-radius:3px;pointer-events:none}.tempo-slider-labels{display:flex;justify-content:space-between;position:relative;font-size:11px;color:var(--color-text-muted);padding-top:var(--spacing-xs)}.tempo-original-marker{position:absolute;transform:translate(-50%);color:var(--color-accent-primary);font-weight:var(--font-weight-bold);font-size:11px}.tempo-popup-hint{margin-top:var(--spacing-sm);padding-top:var(--spacing-sm);border-top:1px solid var(--color-border-muted);font-size:10px;color:var(--color-text-muted);text-align:center;font-family:var(--font-mono);letter-spacing:.02em}.control-group-volume{position:relative;z-index:1000}.volume-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--color-bg-card);border:1px solid var(--color-border-muted);border-radius:var(--radius-sm);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast)}.volume-btn:hover{background:var(--color-bg-card-hover);border-color:var(--color-border-hover)}.volume-btn.muted{color:var(--color-text-muted)}.volume-popup{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:8px;background:var(--color-bg-card);border:1px solid var(--color-border-default);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);min-width:180px;box-shadow:var(--shadow-lg);z-index:9999;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.volume-popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sm);padding-bottom:var(--spacing-xs);border-bottom:1px solid var(--color-border-muted)}.volume-popup-title{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.volume-popup-value{font-family:var(--font-mono);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-accent-primary)}.volume-slider-container{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-xs) 0}.volume-slider{flex:1;height:6px;background:var(--color-border-muted);border-radius:3px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.volume-slider::-webkit-slider-runnable-track{height:6px;background:var(--color-border-muted);border-radius:3px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:var(--color-border-active)!important;border:none!important;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000040;margin-top:-6px}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.15);background:var(--color-accent)!important;box-shadow:0 3px 8px #00000059}.volume-slider::-moz-range-track{height:6px;background:var(--color-border-muted);border-radius:3px}.volume-slider::-moz-range-thumb{width:18px;height:18px;background:var(--color-border-active)!important;border:none!important;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000040}.volume-slider::-moz-range-thumb:hover{transform:scale(1.15);background:var(--color-accent)!important}.volume-mute-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:transparent;border:1px solid var(--color-border-muted);border-radius:var(--radius-xs);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.volume-mute-btn:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.volume-mute-btn.muted{background:var(--color-bg-muted);color:var(--color-text-muted)}.tempo-slider-wrapper{position:relative;width:100%;display:flex;align-items:center}.tempo-slider{width:100%;height:6px;background:var(--color-border-muted);border-radius:3px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:background var(--transition-fast);position:relative;z-index:1}.tempo-slider:hover{background:var(--color-border-default)}.tempo-slider::-webkit-slider-runnable-track{height:6px;background:var(--color-border-muted);border-radius:3px}.tempo-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:var(--color-border-active)!important;border:none!important;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000040;margin-top:-6px;transition:all var(--transition-fast)}.tempo-slider::-webkit-slider-thumb:hover{transform:scale(1.15);background:var(--color-accent)!important;box-shadow:0 3px 8px #00000059}.tempo-slider::-moz-range-track{height:6px;background:var(--color-border-muted);border-radius:3px}.tempo-slider::-moz-range-thumb{width:18px;height:18px;background:var(--color-border-active)!important;border:none!important;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000040;transition:all var(--transition-fast)}.tempo-slider::-moz-range-thumb:hover{transform:scale(1.15);background:var(--color-accent)!important}.tempo-slider::-moz-range-thumb:hover{transform:scale(1.2);box-shadow:var(--shadow-glow-lg),var(--shadow-md)}.control-select-track{background:var(--color-bg-card);border:1px solid var(--color-border-muted);color:var(--color-text-primary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;min-width:140px;transition:all var(--transition-fast)}.control-select-track:hover{background:var(--color-bg-card-hover);border-color:var(--color-border-hover)}.control-select-track:focus{outline:none;border-color:var(--color-border-active);box-shadow:var(--shadow-glow-sm)}.control-group-transpose{display:flex;align-items:center;gap:var(--spacing-sm);flex-shrink:0;padding:0 var(--spacing-md);border-radius:var(--radius-md);height:40px;position:relative;overflow:visible}.transpose-control{display:flex;align-items:center;gap:4px;background:var(--color-bg-card);border:1px solid var(--color-border-muted);border-radius:var(--radius-sm);padding:2px 6px 2px 8px}.transpose-icon{color:var(--color-text-secondary);flex-shrink:0;margin-right:2px}.transpose-control:not(.disabled) .transpose-icon{color:var(--color-text-primary)}.transpose-control.disabled .transpose-icon{color:var(--color-text-muted)}.transpose-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:transparent;border:none;border-radius:var(--radius-xs);color:var(--color-text-primary);font-size:16px;font-weight:var(--font-weight-bold);cursor:pointer;transition:all var(--transition-fast)}.transpose-btn:hover:not(:disabled){background:var(--color-bg-hover)}.transpose-btn:active:not(:disabled){background:var(--color-bg-active)}.transpose-btn:disabled{opacity:.3;cursor:not-allowed}.transpose-reset{margin-left:4px;border-left:1px solid var(--color-border-muted);padding-left:6px}.transpose-value{min-width:32px;text-align:center;font-family:var(--font-mono);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold)}.transpose-zero{color:var(--color-text-secondary)}.transpose-positive,.transpose-negative{color:var(--color-accent-primary)}.transpose-disabled{color:var(--color-text-muted)}.transpose-control.disabled{opacity:.5;cursor:not-allowed;background:var(--color-bg-muted)}.transpose-control.disabled .transpose-btn{cursor:not-allowed;pointer-events:none}.sidebar-toggle,.controls-sidebar{display:none}@media(max-width:768px){.lesson-player-header-section{min-height:90px;max-height:100px}.lesson-player-controls-bottom{height:64px;padding:0 12px}.controls-bottom-content{gap:8px;justify-content:flex-start;overflow:visible}.control-group-transport,.control-group-tempo,.control-group-track{padding:0 8px;height:44px;gap:6px}.control-btn-play{width:44px;height:44px}.control-btn-icon{width:40px;height:40px}.tempo-display{padding:3px}.tempo-btn{width:24px;height:24px;font-size:14px}.tempo-info{min-width:50px}.tempo-bpm{font-size:14px}.tempo-percentage{font-size:10px}.tempo-popup{min-width:240px;padding:var(--spacing-sm)}.control-select-track{min-width:120px;font-size:12px;padding:6px 10px}.control-group-transpose{padding:0 6px;height:44px}.transpose-btn{width:26px;height:26px;font-size:14px}.transpose-value{min-width:28px;font-size:12px}.control-divider{height:28px}.lesson-player-header{padding:10px 12px}.lesson-header-content{gap:12px}.lesson-header-left{gap:8px;min-width:0;max-width:35%}.lesson-header-right{max-width:35%}.lesson-header-center{display:none}.lesson-back-btn-icon{width:32px;height:32px;padding:6px}.lesson-title-main{font-size:18px;letter-spacing:.5px}.lesson-artist-subtle{font-size:12px}.status-badge-cluster{gap:6px}.status-badge{padding:5px 10px;font-size:11px;gap:4px}.status-badge-icon{font-size:12px}.progress-section-compact{padding:8px 12px}.progress-section-top{gap:8px;margin-bottom:6px}.progress-label-text{font-size:12px}.progress-time-value{font-size:13px}.tier-badge-modern{padding:3px 8px;font-size:11px;gap:4px}.tier-badge-icon{font-size:12px}.progress-bar-modern{height:4px}}.sidebar-toggle{display:none;background:#0009;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#0f8;border:2px solid rgba(0,255,136,.3);border-right:none;border-radius:8px 0 0 8px;cursor:pointer;font-size:20px;font-weight:700;z-index:1000;display:flex;align-items:center;justify-content:center;box-shadow:-2px 0 15px #00000080,0 0 10px #0f83;transition:all .3s cubic-bezier(.4,0,.2,1)}.sidebar-toggle:hover{background:#000c;border-color:#0f89;box-shadow:-2px 0 20px #000000b3,0 0 20px #0f86;transform:translateY(-50%) scale(1.05)}.sidebar-toggle.open{right:280px}.controls-sidebar{position:fixed;right:-280px;top:80px;width:280px;height:calc(100vh - 80px);background:#000c;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-left:2px solid rgba(0,255,136,.2);overflow-y:auto;box-shadow:-2px 0 20px #000000b3,0 0 30px #00ff881a;transition:right .3s ease;z-index:999}.controls-sidebar.open{right:0}.controls-panel-compact{padding:16px;display:flex;flex-direction:column;gap:16px}.sidebar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding-bottom:12px;border-bottom:1px solid rgba(0,255,136,.2)}.sidebar-header h3{font-family:Orbitron,sans-serif;margin:0;font-size:20px;font-weight:900;color:#0f8;letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 10px rgba(0,255,136,.5)}.sidebar-close-btn{background:#0009;border:1px solid rgba(0,255,136,.3);width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:24px;color:#0f8;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);line-height:1;font-weight:600;box-shadow:0 0 10px #0f83}.sidebar-close-btn:hover{background:#000c;border-color:#0f89;box-shadow:0 0 20px #0f86;transform:rotate(90deg)}.control-section{padding:16px;background:#00000080;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:12px;border:2px solid rgba(0,255,136,.2);box-shadow:0 2px 8px #00000080,0 0 15px #00ff881a}.control-section-header{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-weight:600;font-size:16px;color:#0f8;font-family:Rajdhani,sans-serif;letter-spacing:1px;text-transform:uppercase}.control-icon{font-size:20px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.control-title{font-size:16px}.play-pause-btn-compact{width:100%;background:linear-gradient(135deg,#0f8,#00cc6a);color:#000;border:2px solid #00ff88;padding:16px;font-family:Orbitron,sans-serif;font-size:16px;font-weight:900;border-radius:8px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 20px #00ff8880,0 4px 15px #0000004d;text-transform:uppercase;letter-spacing:2px}.play-pause-btn-compact:hover{transform:translateY(-2px);box-shadow:0 0 30px #0f8c,0 6px 20px #0006;background:linear-gradient(135deg,#0fa,#0f8)}.play-pause-btn-compact:active{transform:translateY(0);box-shadow:0 0 15px #0f86,0 2px 10px #0000004d}.control-compact-item{margin-bottom:12px}.control-compact-item:last-child{margin-bottom:0}.toggle-label-compact{display:flex;align-items:center;gap:8px;cursor:pointer}.toggle-checkbox{width:20px;height:20px;cursor:pointer;accent-color:#58cc02}.toggle-text-compact{font-size:14px;-webkit-user-select:none;user-select:none;color:#ccc;font-weight:600;font-family:Rajdhani,sans-serif;letter-spacing:.5px}.control-label-compact{display:flex;flex-direction:column;gap:6px}.control-label-text{font-family:Rajdhani,sans-serif;font-size:14px;color:#ccc;font-weight:600;letter-spacing:.5px}.control-range-info{font-family:Rajdhani,sans-serif;font-size:12px;color:#999;font-weight:400;letter-spacing:.5px}.tempo-control-row{display:flex;align-items:center;gap:6px;margin-bottom:6px}.tempo-input-compact{width:70px;padding:6px 10px;border:2px solid rgba(0,255,136,.3);border-radius:8px;font-size:14px;font-weight:600;text-align:center;background:#0009;color:#fff;font-family:Rajdhani,sans-serif;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #0f83;letter-spacing:1px}.tempo-input-compact:focus{outline:none;border-color:#0f8;box-shadow:0 0 0 3px #00ff884d,0 0 15px #0f83;background:#000c}.tempo-input-compact::-webkit-inner-spin-button,.tempo-input-compact::-webkit-outer-spin-button{opacity:1;height:20px}select.tempo-input-compact,.control-section select{width:100%;padding:8px 40px 8px 8px;font-size:14px;background:#0009;border:2px solid rgba(0,255,136,.3);border-radius:8px;color:#fff;font-family:Rajdhani,sans-serif;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #0f83;letter-spacing:.5px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2300ff88' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}select.tempo-input-compact:focus,.control-section select:focus{outline:none;border-color:#0f8;box-shadow:0 0 0 3px #00ff884d,0 0 15px #0f83;background-color:#000c}select.tempo-input-compact option,.control-section select option{background:#1a1a1a;color:#fff;padding:8px;font-family:Rajdhani,sans-serif}.volume-slider-compact,.tempo-slider-compact{width:100%;height:8px;border-radius:8px;background:#0009;border:1px solid rgba(0,255,136,.3);outline:none;-webkit-appearance:none;cursor:pointer;box-shadow:inset 0 2px 4px #00000080}.volume-slider-compact::-webkit-slider-thumb,.tempo-slider-compact::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#0f8;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #00ff8880;border:2px solid #000}.volume-slider-compact::-webkit-slider-thumb:hover,.tempo-slider-compact::-webkit-slider-thumb:hover{box-shadow:0 0 20px #0f8c;transform:scale(1.1)}.volume-slider-compact::-moz-range-thumb,.tempo-slider-compact::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#0f8;cursor:pointer;border:2px solid #000;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #00ff8880}.volume-slider-compact::-moz-range-thumb:hover,.tempo-slider-compact::-moz-range-thumb:hover{box-shadow:0 0 20px #0f8c;transform:scale(1.1)}.volume-slider-compact:disabled{opacity:.3;cursor:not-allowed}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:#fff;text-align:center}.loading-container p{font-family:Rajdhani,sans-serif;font-size:18px;color:#ccc;margin-top:20px;letter-spacing:1px}.loading-spinner{width:50px;height:50px;border:4px solid rgba(0,0,0,.6);border-top-color:#0f8;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px;box-shadow:0 0 20px #00ff8880}@media(max-width:768px){.tab-container-wrapper{padding:var(--spacing-lg) var(--spacing-md) var(--spacing-md) var(--spacing-md)}.tab-container{padding:var(--spacing-md)}.control-section{padding:10px}.video-container{padding:12px}.video-container.collapsed .video-wrapper{padding-bottom:30%}.video-container.expanded .video-wrapper{padding-bottom:56.25%}.video-title{font-size:14px}.video-toggle-btn{font-size:11px;padding:5px 10px}}.alphaTab{background-color:var(--color-alphatab-bg)!important;border-radius:var(--radius-sm);padding:var(--spacing-lg)}.tab-container svg text,.tab-container svg tspan{fill:var(--color-alphatab-text)!important;color:var(--color-alphatab-text)!important}.tab-container svg line{stroke:var(--color-alphatab-text)!important;opacity:.4}.tab-container svg path:not([fill=none]){fill:var(--color-alphatab-text)!important}.tab-container svg path[fill=none]{stroke:var(--color-alphatab-text)!important;opacity:.6}.tab-container svg circle[r],.tab-container svg ellipse{fill:var(--color-alphatab-note)!important;stroke:var(--color-accent-soft)!important;stroke-width:1px!important}.tab-container svg line[stroke-width]{stroke:var(--color-alphatab-text)!important;opacity:.7}.at-cursor-bar{background:transparent!important;border:none!important;box-shadow:none!important}.at-selection div{background:var(--color-accent-soft)!important;border:1px solid var(--color-border-default)!important}.at-cursor-beat{background:var(--color-alphatab-cursor)!important;box-shadow:0 0 6px var(--color-glow-strong)!important}.at-highlight *{fill:var(--color-accent)!important;stroke:var(--color-accent)!important;filter:drop-shadow(0 0 6px var(--color-glow-strong))!important}.tab-container canvas{background-color:var(--color-alphatab-bg)!important;border-radius:var(--radius-sm)}.tab-container a[href*=alphatab],.tab-container a[href*=alphaTab],.tab-container a[href*=coderline]{display:none!important}.idle-warning-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.idle-warning-modal{background:var(--color-bg-card);border:2px solid var(--color-accent);border-radius:var(--radius-xl);padding:var(--spacing-2xl);max-width:480px;width:90%;text-align:center;box-shadow:var(--shadow-xl),var(--shadow-glow-lg);animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.idle-warning-modal__icon{font-size:64px;margin-bottom:var(--spacing-lg);filter:drop-shadow(0 0 10px var(--color-glow-strong))}.idle-warning-modal__title{font-family:var(--font-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0 0 var(--spacing-md) 0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase}.idle-warning-modal__body{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-primary);margin:0 0 var(--spacing-lg) 0;line-height:var(--line-height-relaxed)}.idle-warning-modal__countdown{font-family:var(--font-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0 0 var(--spacing-xl) 0;text-shadow:0 0 20px var(--color-glow-strong);letter-spacing:var(--letter-spacing-wide)}.idle-warning-modal__button{width:100%;padding:var(--spacing-md) var(--spacing-xl);background:var(--gradient-primary);color:var(--color-neutral-0);border:none;border-radius:var(--radius-lg);font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-extrabold);cursor:pointer;transition:all var(--transition-normal);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;box-shadow:var(--shadow-glow-md),var(--shadow-md)}.idle-warning-modal__button:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow-lg),var(--shadow-lg)}.idle-warning-modal__button:active{transform:translateY(0)}.idle-warning-modal__button:focus{outline:2px solid var(--color-accent);outline-offset:2px}.lesson-cockpit{--metal-bg-header: radial-gradient( ellipse at top center, #111827 0%, #02040a 70% );--metal-surface-glass: rgba(10, 14, 22, .95);--metal-border-soft: rgba(148, 163, 184, .18);--metal-divider-soft: rgba(148, 163, 184, .08);--metal-accent-green: #5cff72;--metal-accent-cyan: #46e5ff;--metal-accent-orange: #ff5c39;--metal-text-primary: #f9fafb;--metal-text-muted: rgba(148, 163, 184, .85);--metal-glow-green: 0 0 20px rgba(92, 255, 114, .25);--metal-glow-strong: 0 0 30px rgba(92, 255, 114, .4)}.lesson-cockpit{position:relative;background:var(--metal-bg-header);border-bottom:1px solid var(--metal-border-soft);box-shadow:0 8px 32px #00000080,0 1px #ffffff08 inset;padding:20px 28px;z-index:100}.cockpit-saving-indicator{position:absolute;top:8px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;padding:4px 14px;background:#5cff721a;border:1px solid rgba(92,255,114,.3);border-radius:20px;font-size:11px;font-weight:600;color:var(--metal-accent-green);letter-spacing:.5px;text-transform:uppercase;animation:slideDown .25s ease-out;z-index:10}.cockpit-saving-spinner{animation:spin .8s linear infinite;color:var(--metal-accent-green)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.cockpit-inner{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:32px}.cockpit-left{display:flex;align-items:center;gap:16px}.cockpit-logo{height:44px;width:auto;object-fit:contain;flex-shrink:0;cursor:pointer;transition:all .2s ease;opacity:.9}.cockpit-logo:hover{opacity:1;transform:scale(1.05)}.cockpit-exit-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--color-border-muted, var(--metal-border-soft));background:var(--color-bg-tertiary, rgba(0, 0, 0, .1));color:var(--color-text-muted, var(--metal-text-muted));cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s ease-out;flex-shrink:0}.cockpit-exit-btn:hover{border-color:var(--color-border-hover, var(--color-border));color:var(--color-text-primary);background:var(--color-bg-card-hover, rgba(0, 0, 0, .15));transform:scale(1.03)}.cockpit-exit-btn:active{transform:scale(.98)}.cockpit-identity{display:flex;flex-direction:column;gap:8px;min-width:0}.cockpit-title-row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}.cockpit-lesson-code{font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--metal-text-primary);white-space:nowrap}.cockpit-technique{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--metal-text-muted);white-space:nowrap}.cockpit-bpm-pill{display:inline-flex;align-items:center;padding:5px 14px;border-radius:20px;border:1px solid var(--metal-accent-green);background:#5cff7214;font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--metal-accent-green);box-shadow:0 0 12px #5cff7226;transition:all .16s ease-out;width:fit-content}.cockpit-bpm-pill:hover{box-shadow:var(--metal-glow-green);transform:scale(1.02)}.cockpit-center{display:flex;flex-direction:column;align-items:center;justify-content:center}.cockpit-progress-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;width:100%;margin-top:8px;gap:16px}.cockpit-progress-stats{justify-self:start;width:100%;display:flex;align-items:center}.cockpit-bpm-text{justify-self:end;width:100%;display:flex;align-items:center;justify-content:flex-end}.cockpit-progress-wrapper{width:100%;max-width:360px;display:flex;flex-direction:column;gap:8px;align-items:center}.cockpit-progress-bar{width:100%;height:6px;background:#ffffff1f;border-radius:10px;overflow:hidden;position:relative}.cockpit-progress-fill{height:100%;background:linear-gradient(180deg,var(--metal-accent-green) 0%,rgba(61,219,100,.85) 100%);border-radius:10px;transition:width .4s cubic-bezier(.4,0,.2,1);position:relative}.cockpit-progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:10px 10px 0 0}.cockpit-progress-active{box-shadow:0 0 10px var(--metal-accent-green),0 0 20px #5cff724d;animation:progressGlow 2s ease-in-out infinite}@keyframes progressGlow{0%,to{box-shadow:0 0 8px var(--metal-accent-green)}50%{box-shadow:0 0 16px var(--metal-accent-green),0 0 24px #5cff7266}}.cockpit-progress-saving{opacity:.6}.cockpit-progress-stats{display:flex;align-items:center;justify-content:flex-start;gap:6px;font-family:var(--font-body, "Inter", sans-serif);flex-shrink:0}.cockpit-live-dot{width:7px;height:7px;border-radius:50%;background:var(--metal-accent-green);box-shadow:0 0 8px var(--metal-accent-green);animation:pulse 1.5s ease-in-out infinite;flex-shrink:0}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.cockpit-time{font-size:var(--font-size-sm, 13px);font-weight:700;color:var(--metal-text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.2}.cockpit-time-active{color:var(--metal-accent-green)!important}.cockpit-time-separator{font-size:var(--font-size-sm, 13px);color:var(--metal-text-muted);font-weight:400;opacity:.7;margin:0 1px}.cockpit-time-target{font-size:var(--font-size-sm, 13px);font-weight:600;color:var(--metal-text-muted);font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.2;opacity:.9}.cockpit-bpm-text{display:flex;align-items:center;justify-content:flex-end;font-family:var(--font-body, "Inter", sans-serif)}.cockpit-bpm-value{font-size:var(--font-size-sm, 13px);font-weight:700;color:var(--metal-text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.2}.cockpit-bpm-label{font-size:var(--font-size-sm, 13px);font-weight:600;color:var(--metal-text-primary);letter-spacing:-.01em;line-height:1.2;margin-left:2px}.cockpit-progress-percent{font-size:11px;font-weight:700;color:var(--color-accent, var(--metal-accent-cyan));background:var(--color-accent-soft, rgba(70, 229, 255, .1));padding:2px 8px;border-radius:10px;letter-spacing:.05em;border:1px solid var(--color-border-muted, rgba(70, 229, 255, .2))}.cockpit-right{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-left:auto;flex-shrink:0}.cockpit-rank-badge{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 12px;border-radius:20px;border:1px solid;font-family:var(--font-body, "Inter", sans-serif);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;transition:all .15s cubic-bezier(.4,0,.2,1);cursor:default;position:relative;justify-self:center}.cockpit-rank-badge:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:20px;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.1) 0%,transparent 50%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:.4;pointer-events:none}.cockpit-rank-badge:hover{transform:scale(1.02)}.cockpit-rank-badge[data-tier=bronze]{background:linear-gradient(135deg,#cd7f321f,#8b5a2b2e);border-color:#cd7f3259;box-shadow:0 0 12px #cd7f3226,inset 0 1px #ffffff1a}.cockpit-rank-badge[data-tier=silver]{background:linear-gradient(135deg,#a8b4c41f,#8a9aaf2e);border-color:#a8b4c459;box-shadow:0 0 12px #a8b4c426,inset 0 1px #ffffff1a}.cockpit-rank-badge[data-tier=gold]{background:linear-gradient(135deg,#f5a6231f,#ffa5002e);border-color:#f5a62359;box-shadow:0 0 12px #f5a62333,inset 0 1px #ffffff1a}.cockpit-rank-badge[data-tier=platinum]{background:linear-gradient(135deg,#25ced11f,#0891b22e);border-color:#25ced159;box-shadow:0 0 12px #25ced133,inset 0 1px #ffffff1a}.cockpit-rank-badge[data-tier=diamond]{background:linear-gradient(135deg,#7c5cff1f,#4f46e533);border-color:#7c5cff66;box-shadow:0 0 16px #7c5cff40,inset 0 1px #ffffff1a}.cockpit-rank-badge[data-tier=master]{background:linear-gradient(135deg,#9d4edd24,#7c3aed38);border-color:#9d4edd66;box-shadow:0 0 16px #9d4edd4d,inset 0 1px #ffffff1a}.cockpit-rank-badge[data-tier=not_trained]{background:#94a3b814;border-color:var(--metal-border-soft);box-shadow:inset 0 1px #ffffff0d}.cockpit-rank-icon{font-size:14px;line-height:1;display:flex;align-items:center;filter:drop-shadow(0 0 2px rgba(255,255,255,.2))}.cockpit-rank-label{line-height:1.1;letter-spacing:.08em}.theme-light .lesson-cockpit{--metal-bg-header: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);--metal-surface-glass: rgba(255, 255, 255, .98);--metal-border-soft: rgba(0, 0, 0, .08);--metal-text-primary: #1e293b;--metal-text-muted: rgba(71, 85, 105, .85);--metal-accent-green: #10b981;--metal-accent-cyan: #0891b2;--metal-glow-green: 0 0 12px rgba(16, 185, 129, .2);box-shadow:0 1px 3px #0000000f,0 1px #fff inset}.theme-light .cockpit-exit-btn{background:#f5f5f5;border-color:#e0e0e0;color:#666}.theme-light .cockpit-exit-btn:hover{border-color:#ccc;color:#333;background:#ebebeb}.theme-light .cockpit-progress-bar{background:#00000014}.theme-light .cockpit-rank-badge:before{background:linear-gradient(135deg,rgba(0,0,0,.05) 0%,transparent 50%)}.theme-light .cockpit-bpm-pill{background:#10b98114;border-color:#10b9814d;box-shadow:none}.theme-light .cockpit-progress-bar{background:#0000000f}.theme-light .cockpit-progress-fill{background:linear-gradient(90deg,#10b981,#059669)}.theme-light .cockpit-progress-percent{background:var(--color-accent-soft, rgba(16, 185, 129, .1));color:var(--color-accent, #059669);border-color:var(--color-border-muted, rgba(16, 185, 129, .2))}.theme-light .cockpit-saving-indicator{background:#10b98114;border-color:#10b98133;color:#059669}.theme-gold .lesson-cockpit{--metal-accent-green: #d4af37;--metal-accent-cyan: #c9a227;--metal-glow-green: 0 0 15px rgba(212, 175, 55, .25)}.theme-gold .cockpit-bpm-pill{border-color:#d4af37;background:#d4af371a;color:#d4af37}.theme-gold .cockpit-progress-fill{background:linear-gradient(90deg,#d4af37,#c9a227)}.theme-gold .cockpit-live-dot{background:#d4af37;box-shadow:0 0 8px #d4af37}.theme-gold .cockpit-time-active{color:#d4af37!important}.theme-gold .cockpit-progress-percent{background:#d4af371f;color:#d4af37;border-color:#d4af3740}.theme-gold .cockpit-exit-btn{background:#d4af3714;border-color:#d4af3733;color:#d4af3799}.theme-gold .cockpit-exit-btn:hover{border-color:#d4af3766;color:#d4af37;background:#d4af3726}.theme-hello-kitty .lesson-cockpit{--metal-bg-header: linear-gradient(180deg, #fff0f5 0%, #ffe4ec 100%);--metal-surface-glass: rgba(255, 240, 245, .98);--metal-border-soft: rgba(255, 105, 180, .2);--metal-text-primary: #1a1a1a;--metal-text-muted: rgba(80, 60, 70, .85);--metal-accent-green: #ff69b4;--metal-accent-cyan: #ff91af;--metal-glow-green: 0 0 12px rgba(255, 105, 180, .2);box-shadow:0 1px 3px #ff69b41a,0 1px #fff inset}.theme-hello-kitty .cockpit-exit-btn{background:#fffc;border-color:#ff69b433;color:#999}.theme-hello-kitty .cockpit-exit-btn:hover{border-color:#ff69b466;color:#ff69b4;background:#ffffffe6}.theme-hello-kitty .cockpit-lesson-code,.theme-hello-kitty .cockpit-time{color:#1a1a1a}.theme-hello-kitty .cockpit-bpm-pill{border-color:#ff69b4;background:#ff69b41a;color:#ff69b4}.theme-hello-kitty .cockpit-progress-bar{background:#ff69b426}.theme-hello-kitty .cockpit-progress-fill{background:linear-gradient(90deg,#ff91af,#ff69b4)}.theme-hello-kitty .cockpit-live-dot{background:#ff69b4;box-shadow:0 0 8px #ff69b4}.theme-hello-kitty .cockpit-time-active{color:#ff69b4!important}.theme-hello-kitty .cockpit-time-target,.theme-hello-kitty .cockpit-time-separator{color:#503c46b3}.theme-hello-kitty .cockpit-progress-percent{background:#ff69b41f;color:#ff69b4;border-color:#ff69b440}.theme-kuromi .lesson-cockpit{--metal-accent-green: #9370db;--metal-accent-cyan: #ba55d3;--metal-glow-green: 0 0 15px rgba(147, 112, 219, .3)}.theme-kuromi .cockpit-bpm-pill{border-color:#9370db;background:#9370db1f;color:#9370db}.theme-kuromi .cockpit-progress-fill{background:linear-gradient(90deg,#9370db,#ba55d3)}.theme-kuromi .cockpit-live-dot{background:#9370db;box-shadow:0 0 8px #9370db}.theme-kuromi .cockpit-time-active{color:#9370db!important}.theme-kuromi .cockpit-progress-percent{background:#9370db1f;color:#9370db;border-color:#9370db40}.theme-kuromi .cockpit-exit-btn{background:#9370db14;border-color:#9370db33;color:#9370db99}.theme-kuromi .cockpit-exit-btn:hover{border-color:#9370db66;color:#9370db;background:#9370db26}.theme-monochrome .lesson-cockpit{--metal-accent-green: var(--color-text-primary, #ffffff);--metal-accent-cyan: var(--color-text-secondary, #888888);--metal-glow-green: none}.theme-monochrome .cockpit-bpm-pill{border-color:var(--color-border, #333);background:#ffffff0d;color:var(--color-text-primary, #fff);box-shadow:none}.theme-monochrome .cockpit-progress-fill{background:var(--color-text-primary, #fff)}.theme-monochrome .cockpit-progress-active{box-shadow:none}.theme-monochrome .cockpit-rank-badge{background:#ffffff0d!important;border-color:var(--color-border, #333)!important;box-shadow:none!important}.theme-monochrome .cockpit-rank-label{color:var(--color-text-primary, #fff)!important}.theme-monochrome .cockpit-progress-percent{background:#ffffff14;color:var(--color-text-primary, #fff);border-color:var(--color-border, rgba(255, 255, 255, .15))}.theme-monochrome .cockpit-exit-btn{background:#ffffff0d;border-color:#ffffff26;color:#ffffff80}.theme-monochrome .cockpit-exit-btn:hover{border-color:#ffffff4d;color:#fff;background:#ffffff1a}.theme-sunburst .lesson-cockpit{--metal-accent-green: #ff8c00;--metal-accent-cyan: #ffa500;--metal-glow-green: 0 0 15px rgba(255, 140, 0, .3)}.theme-sunburst .cockpit-bpm-pill{border-color:#ff8c00;background:#ff8c001a;color:#ff8c00}.theme-sunburst .cockpit-progress-fill{background:linear-gradient(90deg,#ff8c00,orange)}.theme-sunburst .cockpit-live-dot{background:#ff8c00;box-shadow:0 0 8px #ff8c00}.theme-sunburst .cockpit-time-active{color:#ff8c00!important}.theme-sunburst .cockpit-progress-percent{background:#ff8c001f;color:#ff8c00;border-color:#ff8c0040}.theme-sunburst .cockpit-exit-btn{background:#ff8c0014;border-color:#ff8c0033;color:#ff8c0099}.theme-sunburst .cockpit-exit-btn:hover{border-color:#ff8c0066;color:#ff8c00;background:#ff8c0026}.theme-enhanced-forest .lesson-cockpit{--metal-accent-green: #22c55e;--metal-accent-cyan: #10b981;--metal-glow-green: 0 0 15px rgba(34, 197, 94, .3)}.theme-enhanced-forest .cockpit-bpm-pill{border-color:#22c55e;background:#22c55e1a;color:#22c55e}.theme-enhanced-forest .cockpit-progress-fill{background:linear-gradient(90deg,#22c55e,#10b981)}.theme-enhanced-forest .cockpit-progress-percent{background:#22c55e1f;color:#22c55e;border-color:#22c55e40}.theme-enhanced-forest .cockpit-exit-btn{background:#22c55e14;border-color:#22c55e33;color:#22c55e99}.theme-enhanced-forest .cockpit-exit-btn:hover{border-color:#22c55e66;color:#22c55e;background:#22c55e26}.theme-vintage .lesson-cockpit{--metal-bg-header: linear-gradient(180deg, #f5f0e6 0%, #ebe4d4 100%);--metal-surface-glass: rgba(245, 240, 230, .98);--metal-border-soft: rgba(139, 90, 43, .2);--metal-text-primary: #3d2914;--metal-text-muted: rgba(90, 70, 50, .8);--metal-accent-green: #8b5a2b;--metal-accent-cyan: #a0522d;--metal-glow-green: 0 0 10px rgba(139, 90, 43, .15);box-shadow:0 1px 3px #8b5a2b1a,0 1px #fffc inset}.theme-vintage .cockpit-exit-btn{background:#fff9;border-color:#8b5a2b33;color:#9a7b5a}.theme-vintage .cockpit-exit-btn:hover{border-color:#8b5a2b59;color:#6b4a2a;background:#fffc}.theme-vintage .cockpit-lesson-code,.theme-vintage .cockpit-time{color:#3d2914}.theme-vintage .cockpit-technique{color:#5a4632bf}.theme-vintage .cockpit-bpm-pill{border-color:#8b5a2b;background:#8b5a2b1a;color:#8b5a2b;box-shadow:none}.theme-vintage .cockpit-progress-bar{background:#8b5a2b1f}.theme-vintage .cockpit-progress-fill{background:linear-gradient(90deg,sienna,#8b5a2b)}.theme-vintage .cockpit-live-dot{background:#8b5a2b;box-shadow:0 0 6px #8b5a2b80}.theme-vintage .cockpit-time-active{color:#8b5a2b!important}.theme-vintage .cockpit-time-target,.theme-vintage .cockpit-time-separator{color:#5a4632a6}.theme-vintage .cockpit-progress-percent{background:#8b5a2b1a;color:#8b5a2b;border-color:#8b5a2b33}.theme-vintage .cockpit-rank-badge{background:#8b5a2b14!important;border-color:#8b5a2b40!important}@media(max-width:900px){.cockpit-inner{grid-template-columns:1fr;gap:20px}.cockpit-left{justify-content:flex-start}.cockpit-logo{height:38px}.cockpit-center{order:3}.cockpit-right{justify-content:flex-end;order:2;margin-left:auto;width:100%}.cockpit-progress-wrapper{max-width:100%}.cockpit-progress-row{gap:12px;grid-template-columns:1fr auto 1fr}}@media(max-width:640px){.lesson-cockpit{padding:16px 18px}.cockpit-inner{gap:16px}.cockpit-logo{height:32px}.cockpit-exit-btn{width:34px;height:34px}.cockpit-lesson-code{font-size:14px}.cockpit-technique{font-size:10px}.cockpit-time,.cockpit-time-separator,.cockpit-time-target,.cockpit-bpm-value,.cockpit-bpm-label{font-size:12px}.cockpit-progress-row{gap:10px}.cockpit-rank-badge{padding:6px 12px;font-size:10px}.cockpit-rank-icon{font-size:14px}}.tooltip-wrapper{position:relative;display:inline-block}.tooltip-text{background-color:var(--color-bg-overlay);color:var(--color-text-primary);text-align:center;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);position:fixed;z-index:var(--z-tooltip);font-family:var(--font-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);white-space:nowrap;pointer-events:none;transition:opacity var(--transition-fast),transform var(--transition-fast);border:1px solid var(--color-border-default);box-shadow:var(--shadow-md),var(--shadow-glow-sm);opacity:1}.tooltip-bottom.tooltip-text:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:var(--color-bg-overlay) transparent transparent transparent}.tooltip-top.tooltip-text:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent var(--color-bg-overlay) transparent}.tooltip-left.tooltip-text:after{content:"";position:absolute;left:100%;top:50%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent var(--color-bg-overlay)}.tooltip-right.tooltip-text:after{content:"";position:absolute;right:100%;top:50%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent var(--color-bg-overlay) transparent transparent}.tooltip-text.tooltip-bottom:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:var(--color-bg-overlay) transparent transparent transparent}.tooltip-text.tooltip-top:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent var(--color-bg-overlay) transparent}.tooltip-text.tooltip-left:after{content:"";position:absolute;left:100%;top:50%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent var(--color-bg-overlay)}.tooltip-text.tooltip-right:after{content:"";position:absolute;right:100%;top:50%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent var(--color-bg-overlay) transparent transparent}.driver-active .driver-overlay,.driver-active *{pointer-events:none}.driver-active .driver-active-element,.driver-active .driver-active-element *,.driver-popover,.driver-popover *{pointer-events:auto}@keyframes animate-fade-in{0%{opacity:0}to{opacity:1}}.driver-fade .driver-overlay{animation:animate-fade-in .2s ease-in-out}.driver-fade .driver-popover{animation:animate-fade-in .2s}.driver-popover{all:unset;box-sizing:border-box;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px #0006;z-index:1000000000;position:fixed;top:0;right:0;background-color:#fff}.driver-popover *{font-family:Helvetica Neue,Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif}.driver-popover-title{font:19px/normal sans-serif;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1;margin:0}.driver-popover-close-btn{all:unset;position:absolute;top:0;right:0;width:32px;height:28px;cursor:pointer;font-size:18px;font-weight:500;color:#d2d2d2;z-index:1;text-align:center;transition:color;transition-duration:.2s}.driver-popover-close-btn:hover,.driver-popover-close-btn:focus{color:#2d2d2d}.driver-popover-title[style*=block]+.driver-popover-description{margin-top:5px}.driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;font-weight:400;zoom:1}.driver-popover-footer{margin-top:15px;text-align:right;zoom:1;display:flex;align-items:center;justify-content:space-between}.driver-popover-progress-text{font-size:13px;font-weight:400;color:#727272;zoom:1}.driver-popover-footer button{all:unset;display:inline-block;box-sizing:border-box;padding:3px 7px;text-decoration:none;text-shadow:1px 1px 0 #fff;background-color:#fff;color:#2d2d2d;font:12px/normal sans-serif;cursor:pointer;outline:0;zoom:1;line-height:1.3;border:1px solid #ccc;border-radius:3px}.driver-popover-footer .driver-popover-btn-disabled{opacity:.5;pointer-events:none}:not(body):has(>.driver-active-element){overflow:hidden!important}.driver-no-interaction,.driver-no-interaction *{pointer-events:none!important}.driver-popover-footer button:hover,.driver-popover-footer button:focus{background-color:#f7f7f7}.driver-popover-navigation-btns{display:flex;flex-grow:1;justify-content:flex-end}.driver-popover-navigation-btns button+button{margin-left:4px}.driver-popover-arrow{content:"";position:absolute;border:5px solid #fff}.driver-popover-arrow-side-over{display:none}.driver-popover-arrow-side-left{left:100%;border-right-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-right{right:100%;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-top{top:100%;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}.driver-popover-arrow-side-bottom{bottom:100%;border-left-color:transparent;border-top-color:transparent;border-right-color:transparent}.driver-popover-arrow-side-center{display:none}.driver-popover-arrow-side-left.driver-popover-arrow-align-start,.driver-popover-arrow-side-right.driver-popover-arrow-align-start{top:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-start,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-start{left:15px}.driver-popover-arrow-align-end.driver-popover-arrow-side-left,.driver-popover-arrow-align-end.driver-popover-arrow-side-right{bottom:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-end,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-end{right:15px}.driver-popover-arrow-side-left.driver-popover-arrow-align-center,.driver-popover-arrow-side-right.driver-popover-arrow-align-center{top:50%;margin-top:-5px}.driver-popover-arrow-side-top.driver-popover-arrow-align-center,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-center{left:50%;margin-left:-5px}.driver-popover-arrow-none{display:none}.lesson-tour-help-button{position:fixed;bottom:24px;right:24px;z-index:9998;width:48px;height:48px;border-radius:50%;background:var(--color-primary, #3b82f6);border:2px solid var(--color-border, rgba(255, 255, 255, .2));box-shadow:0 4px 12px var(--color-shadow, rgba(0, 0, 0, .3)),0 0 20px #3b82f64d;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1)}.lesson-tour-help-button:hover{transform:scale(1.1);background:var(--color-primary-hover, #2563eb);box-shadow:0 6px 20px var(--color-shadow, rgba(0, 0, 0, .4)),0 0 30px #3b82f680}.lesson-tour-help-button:active{transform:scale(.95)}.lesson-tour-help-button .help-icon{font-size:24px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}[data-theme=light] .lesson-tour-help-button,[data-theme=retro-light] .lesson-tour-help-button{background:#3b82f6;border-color:#0000001a;box-shadow:0 4px 12px #00000026,0 0 20px #3b82f640}[data-theme=light] .lesson-tour-help-button:hover,[data-theme=retro-light] .lesson-tour-help-button:hover{background:#2563eb;box-shadow:0 6px 20px #0003,0 0 30px #3b82f666}.lesson-tour-popover{--driver-popover-bg: var(--color-surface, #1e293b);--driver-popover-text: var(--color-text, #f1f5f9)}.driver-popover{background:var(--color-surface, #1e293b)!important;color:var(--color-text, #f1f5f9)!important;border-radius:16px!important;box-shadow:0 20px 50px #0006,0 0 40px #3b82f626!important;border:1px solid rgba(255,255,255,.1)!important;max-width:400px!important}[data-theme=light] .driver-popover,[data-theme=retro-light] .driver-popover{background:#fff!important;color:#1e293b!important;border:1px solid rgba(0,0,0,.1)!important;box-shadow:0 20px 50px #00000026,0 0 40px #3b82f61a!important}.driver-popover-title{font-size:1.25rem!important;font-weight:700!important;color:var(--color-primary, #3b82f6)!important;margin-bottom:12px!important;padding-right:24px!important}.driver-popover-description{font-size:.95rem!important;line-height:1.6!important;color:var(--color-text-secondary, #94a3b8)!important}[data-theme=light] .driver-popover-title,[data-theme=retro-light] .driver-popover-title{color:#2563eb!important}[data-theme=light] .driver-popover-description,[data-theme=retro-light] .driver-popover-description{color:#475569!important}.driver-popover-progress-text{font-size:.8rem!important;color:var(--color-text-muted, #64748b)!important;margin-bottom:12px!important}.driver-popover-navigation-btns{gap:8px!important;margin-top:16px!important}.driver-popover-prev-btn,.driver-popover-next-btn{padding:10px 20px!important;border-radius:8px!important;font-weight:600!important;font-size:.9rem!important;transition:all .2s ease!important;border:none!important}.driver-popover-prev-btn{background:var(--color-surface-hover, #334155)!important;color:var(--color-text, #f1f5f9)!important}.driver-popover-prev-btn:hover{background:var(--color-surface-active, #475569)!important}.driver-popover-next-btn{background:linear-gradient(135deg,var(--color-primary, #3b82f6) 0%,#2563eb 100%)!important;color:#fff!important}.driver-popover-next-btn:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8)!important;transform:translateY(-1px);box-shadow:0 4px 12px #3b82f666!important}[data-theme=light] .driver-popover-prev-btn,[data-theme=retro-light] .driver-popover-prev-btn{background:#e2e8f0!important;color:#1e293b!important}[data-theme=light] .driver-popover-prev-btn:hover,[data-theme=retro-light] .driver-popover-prev-btn:hover{background:#cbd5e1!important}.driver-popover-close-btn{color:var(--color-text-muted, #64748b)!important;width:28px!important;height:28px!important;border-radius:6px!important;transition:all .2s ease!important}.driver-popover-close-btn:hover{background:var(--color-surface-hover, #334155)!important;color:var(--color-text, #f1f5f9)!important}[data-theme=light] .driver-popover-close-btn,[data-theme=retro-light] .driver-popover-close-btn{color:#64748b!important}[data-theme=light] .driver-popover-close-btn:hover,[data-theme=retro-light] .driver-popover-close-btn:hover{background:#e2e8f0!important;color:#1e293b!important}.driver-popover-arrow{border-color:var(--color-surface, #1e293b)!important}.driver-popover-arrow-side-left{border-right-color:var(--color-surface, #1e293b)!important}.driver-popover-arrow-side-right{border-left-color:var(--color-surface, #1e293b)!important}.driver-popover-arrow-side-top{border-bottom-color:var(--color-surface, #1e293b)!important}.driver-popover-arrow-side-bottom{border-top-color:var(--color-surface, #1e293b)!important}[data-theme=light] .driver-popover-arrow,[data-theme=retro-light] .driver-popover-arrow{border-color:#fff!important}[data-theme=light] .driver-popover-arrow-side-left,[data-theme=retro-light] .driver-popover-arrow-side-left{border-right-color:#fff!important}[data-theme=light] .driver-popover-arrow-side-right,[data-theme=retro-light] .driver-popover-arrow-side-right{border-left-color:#fff!important}[data-theme=light] .driver-popover-arrow-side-top,[data-theme=retro-light] .driver-popover-arrow-side-top{border-bottom-color:#fff!important}[data-theme=light] .driver-popover-arrow-side-bottom,[data-theme=retro-light] .driver-popover-arrow-side-bottom{border-top-color:#fff!important}[data-theme=light] .driver-popover-progress-text,[data-theme=retro-light] .driver-popover-progress-text{color:#64748b!important}.driver-overlay .driver-overlay-stage{background:transparent!important;box-shadow:none!important}.driver-active-element{position:relative!important;z-index:100001!important;outline-offset:4px!important;border-radius:8px!important}@media(max-width:768px){.lesson-tour-help-button{bottom:16px;right:16px;width:44px;height:44px}.lesson-tour-help-button .help-icon{font-size:20px}.driver-popover{max-width:calc(100vw - 32px)!important;margin:16px!important}.driver-popover-title{font-size:1.1rem!important}.driver-popover-description{font-size:.9rem!important}}@keyframes pulse-help{0%,to{box-shadow:0 4px 12px #0000004d,0 0 20px #3b82f64d}50%{box-shadow:0 4px 12px #0000004d,0 0 30px #3b82f680}}.lesson-tour-help-button.pulse{animation:pulse-help 2s ease-in-out infinite}.tab-test-page{padding:2rem;max-width:1200px;margin:0 auto}.tab-test-page h1{margin-bottom:1rem;color:var(--color-text-primary, #000)}.tab-test-page p{margin-bottom:2rem;color:var(--color-text-secondary, #666)}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-bg-primary) 0%,var(--color-bg-secondary) 50%,var(--color-bg-tertiary) 100%);padding:20px}.auth-container{background:var(--color-bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid var(--color-border);border-radius:var(--radius-xl);padding:40px;width:100%;max-width:450px;box-shadow:var(--shadow-card)}.auth-header{text-align:center;margin-bottom:30px;display:flex;flex-direction:column;align-items:center;gap:16px}.auth-header .logo-wrapper{max-width:100%;width:100%;display:flex;justify-content:center}.auth-header .logo-icon{max-width:100%;width:auto;height:auto}.auth-header .logo-medium .logo-icon{width:80px;height:96px;max-width:100%}.auth-header p{color:var(--color-text-secondary);font-size:1.1rem;margin:0;font-weight:500;font-family:var(--font-primary);letter-spacing:var(--letter-spacing-normal)}.auth-form{display:flex;flex-direction:column;gap:20px}.form-group label{color:var(--color-accent);font-size:.9rem;font-weight:600;font-family:var(--font-primary);letter-spacing:var(--letter-spacing-normal);text-transform:uppercase}.form-group input{padding:14px 16px;background:var(--color-bg-card);border:2px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:1rem;transition:var(--transition-normal);font-family:var(--font-primary)}.form-group input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-soft),0 0 15px var(--color-glow);background:var(--color-bg-card-hover)}.form-group input::placeholder{color:var(--color-text-muted)}.form-group input:disabled{opacity:.5;cursor:not-allowed}.nickname-input-wrapper{display:flex;gap:8px;align-items:stretch}.nickname-input-wrapper input{flex:1}.random-nickname-button{padding:14px 20px;background:var(--color-bg-card);border:2px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:.9rem;font-weight:600;cursor:pointer;transition:var(--transition-normal);font-family:var(--font-primary);text-transform:uppercase;letter-spacing:var(--letter-spacing-normal);white-space:nowrap;flex-shrink:0}.random-nickname-button:hover:not(:disabled){background:var(--color-bg-card-hover);border-color:var(--color-accent);color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-soft)}.random-nickname-button:active:not(:disabled){transform:scale(.98)}.random-nickname-button:disabled{opacity:.5;cursor:not-allowed}.form-hint{color:var(--color-text-muted);font-size:.75rem;font-family:var(--font-primary);margin-top:-4px;font-style:italic}.auth-button{padding:16px 24px;background:var(--gradient-primary);border:2px solid var(--color-accent);border-radius:var(--radius-md);color:var(--color-bg);font-size:1rem;font-weight:900;cursor:pointer;transition:var(--transition-normal);margin-top:10px;font-family:var(--font-heading);box-shadow:var(--shadow-button);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide)}.auth-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-button-hover);background:var(--gradient-primary)}.auth-button:active:not(:disabled){transform:translateY(0);box-shadow:var(--shadow-md)}.auth-button:disabled{opacity:.6;cursor:not-allowed}.auth-footer{margin-top:24px;text-align:center;color:var(--color-text-secondary);font-family:var(--font-primary);letter-spacing:var(--letter-spacing-tight)}.link-button{background:none;border:none;color:var(--color-accent);cursor:pointer;font-weight:600;text-decoration:underline;font-family:var(--font-primary);transition:var(--transition-normal);letter-spacing:var(--letter-spacing-normal)}.link-button:hover{color:var(--color-accent);text-shadow:0 0 10px var(--color-glow-strong)}.error-message{background:#ff006e26;background:color-mix(in srgb,var(--color-error) 15%,var(--color-bg-card));border:2px solid var(--color-error);border-radius:var(--radius-md);padding:12px 16px;color:var(--color-text-primary);font-size:.9rem;margin-bottom:20px;font-weight:500;font-family:var(--font-primary);box-shadow:0 0 10px #ff006e4d;box-shadow:0 0 10px color-mix(in srgb,var(--color-error) 30%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-shadow:0 1px 2px rgba(0,0,0,.3)}.waitlist-message{background:var(--color-bg-card);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid var(--color-border);border-radius:var(--radius-xl);padding:20px;margin-bottom:20px;text-align:center;font-family:var(--font-primary);box-shadow:var(--shadow-card)}.waitlist-message h3{color:var(--color-accent);font-size:1.2rem;font-weight:700;margin:0 0 12px;font-family:var(--font-heading);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide)}.waitlist-message p{color:var(--color-text-secondary);font-size:.95rem;margin:8px 0;line-height:1.6;letter-spacing:var(--letter-spacing-tight)}.waitlist-message.success{border-color:var(--color-border-active);background:var(--color-accent-soft)}.redirect-message{color:var(--color-accent)!important;font-weight:600;margin-top:12px!important;text-shadow:0 0 10px var(--color-glow-strong)}@media(max-width:768px){.auth-container{padding:30px 20px;max-width:100%}.auth-header .logo-medium .logo-icon{width:60px;height:72px}.auth-header{margin-bottom:20px;gap:12px}}@media(max-width:480px){.auth-container{padding:20px 15px}.auth-header .logo-medium .logo-icon{width:50px;height:60px}}.btn{font-family:var(--font-body);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-normal);border:var(--stroke-width, 1.5px) solid;border-radius:var(--radius-md, 16px);cursor:pointer;transition:all var(--transition-normal);text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);white-space:nowrap;background:transparent}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-sm{padding:8px 16px;font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-tight)}.btn-md{padding:12px 24px;font-size:var(--font-size-base)}.btn-lg{padding:16px 32px;font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-wide)}.btn-primary{background:var(--gradient-primary);border-color:var(--color-accent);color:var(--color-bg);box-shadow:var(--shadow-button)}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-button-hover);background:var(--gradient-primary)}.btn-primary:active:not(:disabled){transform:translateY(0);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--color-bg-card);border-color:var(--color-border-default);color:var(--color-accent);box-shadow:var(--shadow-glow-sm)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-card-hover);border-color:var(--color-border-hover);transform:translateY(-2px);box-shadow:var(--shadow-glow-md)}.btn-secondary:active:not(:disabled){transform:translateY(0)}.btn-ghost{background:transparent;border-color:var(--color-border-muted);color:var(--color-text-secondary)}.btn-ghost:hover:not(:disabled){background:var(--color-bg-card);border-color:var(--color-border-default);color:var(--color-accent)}.btn-ghost:active:not(:disabled){background:var(--color-bg-card-hover)}.theme-hello-kitty .btn{border-width:2.2px;border-radius:20px;border-color:var(--color-border-default);background:var(--color-bg-card);font-family:var(--font-body);box-shadow:var(--shadow-button)}.theme-hello-kitty .btn-primary{background:var(--gradient-primary);border-color:var(--color-accent);color:#fff;box-shadow:var(--shadow-button)}.theme-hello-kitty .btn-primary:hover:not(:disabled){background:var(--gradient-primary);border-width:2.5px;box-shadow:var(--shadow-button-hover);transform:translateY(-2px)}.theme-hello-kitty .btn-secondary{background:var(--color-bg-card);border-color:var(--color-border-default);color:var(--color-accent);box-shadow:var(--shadow-sm)}.theme-hello-kitty .btn-secondary:hover:not(:disabled){background:var(--color-bg-card-hover);border-color:var(--color-border-hover);border-width:2.5px;box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}.theme-hello-kitty .btn-ghost{border-width:2px;background:transparent}.theme-hello-kitty .btn-ghost:hover:not(:disabled){background:var(--color-accent-soft);border-width:2.2px;box-shadow:var(--shadow-sm)}.theme-kuromi .btn{border-width:2px;border-radius:14px;border-color:var(--color-border-default);background:var(--color-surface-alt);color:var(--color-text-primary);font-family:var(--font-body);box-shadow:var(--shadow-button)}.theme-kuromi .btn-primary{background:var(--gradient-primary);border-color:var(--color-accent);color:var(--color-text-primary);box-shadow:var(--shadow-button)}.theme-kuromi .btn-primary:hover:not(:disabled){background:var(--gradient-primary);border-color:var(--color-border-hover);box-shadow:var(--shadow-button-hover);transform:translateY(-2px)}.theme-kuromi .btn-secondary{background:var(--color-surface-alt);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.theme-kuromi .btn-secondary:hover:not(:disabled){background:var(--color-bg-card-hover);border-color:var(--color-border-hover);box-shadow:var(--shadow-glow-sm);transform:translateY(-2px)}.theme-kuromi .btn-ghost{border-width:2px;background:transparent;border-color:var(--color-border-muted)}.theme-kuromi .btn-ghost:hover:not(:disabled){background:var(--color-accent-soft);border-color:var(--color-border-hover);box-shadow:var(--shadow-glow-subtle)}.profile-page-container{min-height:100vh;background:var(--color-bg);padding:0;position:relative;color:var(--color-text-primary)}.profile-page-container:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 20% 0%,var(--color-glow-subtle) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,var(--color-glow-subtle) 0%,transparent 50%);pointer-events:none;z-index:0;opacity:.5}.profile-header{background:var(--color-surface);border-bottom:1px solid var(--color-border-muted);padding:20px 28px;position:relative;z-index:100}.profile-header-inner{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:32px;max-width:1300px;margin:0 auto}.profile-header-left{display:flex;align-items:center;gap:16px}.profile-header-logo{height:44px;width:auto;object-fit:contain;flex-shrink:0;cursor:pointer;transition:all .2s ease;opacity:.9}.profile-header-logo:hover{opacity:1;transform:scale(1.05)}.profile-header-title-section{display:flex;flex-direction:column;gap:4px}.profile-header-eyebrow{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.profile-header-title{font-family:var(--font-heading);font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-text-primary);margin:0;line-height:1.2}.profile-header-center{display:flex}.profile-header-exit-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--color-border-muted);background:var(--color-bg-tertiary);color:var(--color-text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s ease-out;flex-shrink:0;margin-left:auto}.profile-header-exit-btn:hover{border-color:var(--color-border-hover);color:var(--color-text-primary);background:var(--color-bg-card-hover);transform:scale(1.03)}.profile-header-exit-btn:active{transform:scale(.98)}.profile-page-content{max-width:1300px;margin:0 auto;padding:48px 40px 80px;position:relative;z-index:2;display:flex;flex-direction:column;gap:var(--spacing-xl)}.profile-identity-block{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:28px;background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:18px;box-shadow:0 1px 3px #0000001a;margin-bottom:32px}.profile-identity-left{display:flex;align-items:center;gap:20px;flex:1}.profile-avatar-wrapper{flex-shrink:0}.profile-avatar{width:96px;height:96px;border-radius:50%;object-fit:cover;border:2px solid var(--color-border);box-shadow:0 2px 8px #0000001a}.profile-avatar.placeholder{width:96px;height:96px;border-radius:50%;background:var(--color-bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--color-accent);font-size:36px;font-weight:700;font-family:var(--font-heading);border:2px solid var(--color-border)}.profile-identity-info{display:flex;flex-direction:column;gap:6px}.profile-identity-label{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.profile-username{font-family:var(--font-heading);font-size:24px;font-weight:700;letter-spacing:.05em;color:var(--color-text-primary);margin:0;line-height:1.2}.profile-email{font-family:var(--font-body);font-size:14px;font-weight:400;color:var(--color-text-secondary);margin:0;letter-spacing:.1px}.profile-identity-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.profile-action-btn{transition:all .15s ease-out}.profile-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:32px}.profile-stat-card{background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:16px;padding:24px;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 1px 3px #0000001a;transition:all .15s ease-out;min-height:140px}.profile-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026;border-color:var(--color-border)}.profile-stat-icon{font-size:40px;margin-bottom:12px;line-height:1}.profile-stat-label{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:8px}.profile-stat-value{font-family:var(--font-heading);font-size:32px;font-weight:700;color:var(--color-text-primary);line-height:1.2}.profile-progress-card{background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:12px;box-shadow:0 1px 3px #0000001a;transition:all .15s ease-out}.profile-progress-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026;border-color:var(--color-border)}.profile-progress-header{display:flex;align-items:center;justify-content:space-between}.profile-progress-label{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.profile-progress-complete{font-size:16px}.profile-progress-bar-wrapper{display:flex;flex-direction:column;gap:8px}.profile-progress-bar{width:100%;height:6px;background:var(--color-bg-tertiary);border-radius:10px;overflow:hidden;position:relative}.profile-progress-fill{height:100%;background:linear-gradient(180deg,var(--color-accent) 0%,var(--color-accent) 100%);border-radius:10px;transition:width .4s cubic-bezier(.4,0,.2,1);position:relative;opacity:.9}.profile-progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,transparent 100%);border-radius:10px 10px 0 0}.profile-progress-text{font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--color-text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.profile-progress-message{font-family:var(--font-body);font-size:12px;font-weight:400;color:var(--color-text-secondary);line-height:1.5;margin-top:4px}.today-progress-card{padding:var(--spacing-xl)}.card-title{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0 0 var(--spacing-lg) 0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;text-shadow:0 0 15px var(--color-glow-strong)}.progress-complete{margin-top:var(--spacing-md);text-align:center;font-family:var(--font-body);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-accent);letter-spacing:var(--letter-spacing-normal);text-shadow:0 0 8px var(--color-glow)}.profile-section{background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:18px;padding:24px;box-shadow:0 1px 3px #0000001a;margin-bottom:32px}.profile-section-header{margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--color-border-muted)}.profile-section-label{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.profile-settings-section{margin-bottom:32px}.profile-form{display:flex;flex-direction:column;gap:24px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.form-input{padding:12px 16px;background:var(--color-bg-tertiary);border:1px solid var(--color-border-muted);border-radius:12px;color:var(--color-text-primary);font-size:14px;font-family:var(--font-body);transition:all .15s ease-out}.form-input:focus{outline:none;border-color:var(--color-border);background:var(--color-surface);box-shadow:0 0 0 3px var(--color-accent-soft)}.form-input.disabled{opacity:.5;cursor:not-allowed;background:var(--color-bg-secondary)}.form-hint{font-family:var(--font-body);font-size:12px;color:var(--color-text-secondary);font-style:italic;letter-spacing:.1px}.profile-picture-preview{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.profile-picture-preview img{width:120px;height:120px;border-radius:var(--radius-full);object-fit:cover;border:3px solid var(--color-border-active);box-shadow:var(--shadow-glow-md)}.profile-picture-placeholder{width:120px;height:120px;border-radius:var(--radius-full);background:var(--color-bg-card);border:3px solid var(--color-border-default);display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);font-family:var(--font-body);font-size:var(--font-size-sm);margin:0 auto var(--spacing-md)}.form-actions{display:flex;gap:12px;margin-top:8px}.alert{padding:14px 18px;border-radius:12px;font-family:var(--font-body);font-size:14px;font-weight:500;letter-spacing:.1px;margin-bottom:20px}.alert-error{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:var(--color-error)}.alert-success{background:var(--color-accent-soft);border:1px solid var(--color-border);color:var(--color-accent)}.practice-logs-container{display:flex;flex-direction:column;gap:var(--spacing-lg)}.practice-day-card{padding:var(--spacing-lg)}.practice-day-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--spacing-sm) 0}.practice-day-info{display:flex;flex-direction:column;gap:var(--spacing-xs);flex:1}.practice-day-title{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;text-shadow:0 0 10px rgba(0,255,136,.5)}.practice-day-time{font-family:var(--font-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-accent);letter-spacing:var(--letter-spacing-normal);text-shadow:0 0 8px var(--color-glow)}.practice-day-toggle{font-size:var(--font-size-lg);color:var(--color-accent);transition:transform var(--transition-normal);margin-left:var(--spacing-md)}.practice-day-details{margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border-default);display:flex;flex-direction:column;gap:var(--spacing-md)}.practice-log-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border-default);transition:all var(--transition-normal)}.practice-log-item:hover{background:var(--color-bg-card);border-color:var(--color-border-hover);transform:translateY(-2px);box-shadow:var(--shadow-glow-sm)}.log-info{flex:1}.log-lesson-name{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-extrabold);color:var(--color-accent);margin:0 0 var(--spacing-xs) 0;letter-spacing:var(--letter-spacing-normal);text-transform:uppercase;text-shadow:0 0 8px rgba(0,255,136,.3)}.log-artist{font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0;letter-spacing:var(--letter-spacing-tight)}.log-time{display:flex;align-items:center;gap:var(--spacing-sm)}.log-time-icon{font-size:var(--font-size-lg)}.log-time-value{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-extrabold);color:var(--color-accent);text-shadow:0 0 10px var(--color-glow)}.profile-empty-state{text-align:center;padding:60px 40px}.profile-empty-state-icon{font-size:64px;margin-bottom:24px;filter:drop-shadow(0 0 20px var(--color-glow-subtle))}.profile-empty-state h3{font-family:var(--font-heading);font-size:20px;font-weight:700;color:var(--color-text-primary);margin:0 0 12px;letter-spacing:.05em;text-transform:uppercase}.profile-empty-state p{font-family:var(--font-body);font-size:14px;color:var(--color-text-secondary);margin:0 0 24px;line-height:1.6}.profile-loading-inline{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:40px 20px}.profile-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:24px;padding:40px}.profile-loading-spinner{width:48px;height:48px;border:3px solid var(--color-border-muted);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite;box-shadow:0 0 12px var(--color-glow-subtle)}.profile-loading-container p{font-family:var(--font-body);font-size:16px;color:var(--color-text-secondary);margin:0}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-lg);padding:20px}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-border-muted);border-top-color:var(--color-accent);border-radius:var(--radius-full);animation:spin .8s linear infinite;box-shadow:0 0 12px var(--color-glow-subtle)}.loading-container p{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-secondary);letter-spacing:var(--letter-spacing-normal)}.profile-panels{background:var(--color-surface);border:1px solid var(--color-border-muted);border-radius:18px;padding:24px;box-shadow:0 1px 3px #0000001a;margin-bottom:32px}.profile-panels-inner{display:grid;grid-template-columns:1fr auto 1fr;gap:0;max-height:400px;overflow:hidden}.panel{display:flex;flex-direction:column;height:100%;overflow:hidden}.panel-left{padding-right:20px}.panel-right{padding-left:20px;overflow-y:auto;overflow-x:hidden}.panel-header{margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--color-border-muted)}.panel-eyebrow{font-family:var(--font-body);font-size:9px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--color-text-muted);display:block;margin-bottom:4px}.panel-title{font-family:var(--font-heading);font-size:16px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--color-text-primary);margin:0;line-height:1.2}.panel-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;height:100%}.panel-loading p{font-family:var(--font-body);font-size:12px;color:var(--color-text-secondary)}.panel-divider{display:flex;flex-direction:column;align-items:center;justify-content:center;width:1px;margin:0 20px;position:relative;flex-shrink:0}.divider-cap{width:6px;height:6px;border-radius:50%;background:var(--color-accent);opacity:.3;flex-shrink:0}.divider-cap-top{margin-bottom:8px}.divider-cap-bottom{margin-top:8px}.divider-line{flex:1;width:1px;background:linear-gradient(to bottom,transparent 0%,var(--color-accent) 20%,var(--color-accent) 80%,transparent 100%);opacity:.4;min-height:200px}.panel-medals-list{display:flex;flex-direction:column;gap:0}.medal-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--color-border-muted);transition:all .15s ease-out;min-height:48px}.medal-row:last-child{border-bottom:none}.medal-row:hover{background:var(--color-bg-tertiary);margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:8px}.medal-left{display:flex;align-items:center;gap:10px;flex:1}.medal-icon{font-size:20px;line-height:1;flex-shrink:0;filter:drop-shadow(0 0 2px rgba(255,255,255,.2))}.medal-name{font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.medal-right{flex-shrink:0}.medal-count{font-family:var(--font-body);font-size:12px;font-weight:500;color:var(--color-text-secondary)}.panel-activity-scroll{overflow-y:auto;overflow-x:hidden;flex:1;padding-right:4px;margin-right:-4px}.panel-activity-list{display:flex;flex-direction:column;gap:0;padding-bottom:8px}.activity-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 0;border:none;background:transparent;border-bottom:1px solid var(--color-border-muted);cursor:pointer;transition:all .15s ease-out;gap:12px;text-align:left;font-family:inherit}.activity-row:last-child{border-bottom:none}.activity-row:hover{transform:translateY(-1px);background:var(--color-bg-tertiary);margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:8px;box-shadow:0 1px 4px #0000000f}.activity-main{display:flex;flex-direction:column;gap:4px;flex:1}.activity-date-label{font-family:var(--font-body);font-size:12px;font-weight:500;color:var(--color-text-secondary);letter-spacing:.1px}.activity-duration{font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--color-text-primary);letter-spacing:-.01em}.activity-chevron{font-size:11px;color:var(--color-text-muted);transition:transform .15s ease-out;flex-shrink:0;line-height:1}.activity-row:hover .activity-chevron{transform:translate(2px);color:var(--color-text-primary)}.activity-details{margin-top:8px;padding-top:12px;border-top:1px solid var(--color-border-muted);display:flex;flex-direction:column;gap:8px}.activity-detail-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--color-bg-tertiary);border:1px solid var(--color-border-muted);border-radius:10px;gap:12px;transition:all .15s ease-out;cursor:pointer;width:100%;text-align:left;font-family:inherit;font-size:inherit;color:inherit}.activity-detail-item:hover{background:var(--color-surface-alt);border-color:var(--color-border);transform:translateY(-1px);box-shadow:0 2px 6px #0000001a}.activity-detail-item:active{transform:translateY(0)}.activity-detail-info{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}.activity-detail-name{font-family:var(--font-body);font-size:12px;font-weight:600;color:var(--color-text-primary);letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-detail-artist{font-family:var(--font-body);font-size:11px;font-weight:400;color:var(--color-text-secondary);letter-spacing:.1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-detail-time{font-family:var(--font-body);font-size:12px;font-weight:600;color:var(--color-text-primary);letter-spacing:-.01em;flex-shrink:0}.panel-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;height:100%}.panel-empty-icon{font-size:48px;margin-bottom:16px;filter:drop-shadow(0 0 10px var(--color-glow-subtle))}.panel-empty-state h4{font-family:var(--font-heading);font-size:14px;font-weight:700;color:var(--color-text-primary);margin:0 0 8px;letter-spacing:.05em;text-transform:uppercase}.panel-empty-state p{font-family:var(--font-body);font-size:12px;color:var(--color-text-secondary);margin:0 0 16px;line-height:1.5}.panel-right::-webkit-scrollbar{width:6px}.panel-right::-webkit-scrollbar-track{background:transparent}.panel-right::-webkit-scrollbar-thumb{background:var(--color-border-muted);border-radius:3px}.panel-right::-webkit-scrollbar-thumb:hover{background:var(--color-border)}@media(max-width:768px){.profile-header{padding:16px 20px}.profile-header-inner{grid-template-columns:1fr;gap:16px}.profile-header-left{flex-direction:column;align-items:flex-start;gap:12px}.profile-header-logo{height:38px}.profile-header-center{order:3}.profile-header-right{justify-content:flex-end;order:2;margin-left:auto;width:100%}.profile-header-exit-btn{width:34px;height:34px}.profile-page-content{padding:32px 20px 60px}.user-card-content{flex-direction:column;text-align:center}.user-card-actions{width:100%;flex-direction:column}.user-card-actions .btn{width:100%}.stats-grid{grid-template-columns:1fr}.stats-grid-three{grid-template-columns:1fr;gap:var(--spacing-md)}.stat-card-compact .stat-card-icon{font-size:20px}.stat-card-compact .stat-card-value{font-size:var(--font-size-xl)}.stat-card-compact .stat-card-title{font-size:var(--font-size-xs)}.stat-card-compact .stat-card-subtext{font-size:10px}.card-title-compact{font-size:var(--font-size-sm)}.profile-panels{padding:20px}.profile-panels-inner{grid-template-columns:1fr;max-height:none;gap:0}.panel-left{padding-right:0;padding-bottom:20px;border-bottom:1px solid var(--color-border-muted);margin-bottom:20px}.panel-right{padding-left:0;overflow-y:visible;max-height:none}.panel-divider{display:none}.activity-row{padding:14px 0}.medals-list{gap:8px}.medals-practice-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.medals-title,.practice-history-title{font-size:var(--font-size-base)}.practice-log-row{padding:var(--spacing-sm) var(--spacing-md)}.practice-log-date{font-size:13px}.practice-log-time{font-size:12px}}@media(max-width:480px){.profile-page-content{padding:24px 16px 60px}.profile-header-title{font-size:14px}}.theme-light .profile-header{background:linear-gradient(180deg,#fff,#f8fafc);box-shadow:0 1px 3px #0000000f,0 1px #fff inset}.theme-light .profile-header-exit-btn{background:#f5f5f5;border-color:#e0e0e0;color:#666}.theme-light .profile-header-exit-btn:hover{border-color:#ccc;color:#333;background:#ebebeb}.theme-light .profile-identity-block,.theme-light .profile-stat-card,.theme-light .profile-progress-card,.theme-light .profile-section{background:#fff;box-shadow:0 1px 3px #0000000f}.theme-light .profile-progress-bar{background:#00000014}.theme-light .profile-progress-fill{background:var(--color-accent);opacity:.9}.theme-light .profile-medal-row:hover,.theme-light .profile-activity-row:hover,.theme-light .profile-activity-detail-item{background:#f8f9fa}.theme-light .profile-activity-detail-item:hover{background:#f1f3f5}.theme-light .profile-panels{background:#fff;box-shadow:0 1px 3px #0000000f}.theme-light .divider-line{background:linear-gradient(to bottom,transparent 0%,var(--color-accent) 20%,var(--color-accent) 80%,transparent 100%);opacity:.3}.theme-light .divider-cap{background:var(--color-accent);opacity:.25}.theme-light .medal-row:hover,.theme-light .activity-row:hover,.theme-light .activity-detail-item{background:#f8f9fa}.theme-light .activity-detail-item:hover{background:#f1f3f5}.theme-light .panel-right::-webkit-scrollbar-thumb{background:#00000026}.theme-light .panel-right::-webkit-scrollbar-thumb:hover{background:#00000040}.pathway-selection-container{min-height:100vh;background:var(--color-bg);padding:0;position:relative;color:var(--color-text-primary)}.pathway-selection-container:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 20% 0%,var(--color-glow-subtle) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,var(--color-glow-subtle) 0%,transparent 50%);pointer-events:none;z-index:0;opacity:.5}.pathway-header{background:var(--color-surface);border-bottom:1px solid var(--color-border-muted);padding:20px 28px;position:relative;z-index:100}.pathway-header-inner{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:32px;max-width:1300px;margin:0 auto}.pathway-header-left{display:flex;align-items:center;gap:16px}.pathway-header-logo{height:44px;width:auto;object-fit:contain;flex-shrink:0;cursor:pointer;transition:all .2s ease;opacity:.9}.pathway-header-logo:hover{opacity:1;transform:scale(1.05)}.pathway-header-title-section{display:flex;flex-direction:column;gap:4px}.pathway-header-eyebrow{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.pathway-header-title{font-family:var(--font-heading);font-size:16px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-text-primary);margin:0;line-height:1.2}.pathway-header-subtitle{font-family:var(--font-body);font-size:13px;font-weight:400;color:var(--color-text-secondary);margin:0;letter-spacing:.1px}.pathway-header-center{display:flex}.pathway-header-exit-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--color-border-muted);background:var(--color-bg-tertiary);color:var(--color-text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s ease-out;flex-shrink:0;margin-left:auto}.pathway-header-exit-btn:hover{border-color:var(--color-border-hover);color:var(--color-text-primary);background:var(--color-bg-card-hover);transform:scale(1.03)}.pathway-header-exit-btn:active{transform:scale(.98)}.pathway-content{max-width:1300px;margin:0 auto;padding:48px 40px 80px;position:relative;z-index:2}.pathway-grid-section{width:100%}.pathway-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;width:100%}@media(min-width:1024px){.pathway-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:1400px){.pathway-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:768px){.pathway-grid{grid-template-columns:repeat(2,1fr);gap:18px}}@media(max-width:640px){.pathway-grid{grid-template-columns:1fr;gap:16px}}.pathway-card{position:relative;border-radius:18px;overflow:hidden;background:var(--color-surface);border:1px solid var(--color-border-muted);box-shadow:0 1px 3px #0000001a;transition:all .15s ease-out;cursor:pointer;display:flex;flex-direction:column;min-height:320px}.pathway-card:hover{transform:translateY(-3px);box-shadow:0 4px 12px #00000026;border-color:var(--color-border)}.pathway-card-media{position:relative;width:100%;height:180px;overflow:hidden}.pathway-card-image{position:absolute;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;background-repeat:no-repeat;transition:transform .3s ease}.pathway-card:hover .pathway-card-image{transform:scale(1.05)}.pathway-card-image:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#0000001a,#0006);transition:all .3s ease}.pathway-card:hover .pathway-card-image:after{background:linear-gradient(180deg,#0000000d,#00000059)}.pathway-card-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}.pathway-card-eyebrow{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted);margin:0}.pathway-card-title{font-family:var(--font-heading);font-size:18px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--color-text-primary);margin:0;line-height:1.3}.pathway-card-subtitle{font-family:var(--font-body);font-size:13px;font-weight:400;color:var(--color-text-secondary);margin:0;line-height:1.5;flex:1}.pathway-card-footer{padding:0 20px 20px;margin-top:auto}.pathway-card-button{width:100%;padding:12px 24px;border-radius:12px;border:1px solid var(--color-accent);background:var(--color-accent-soft);color:var(--color-accent);font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .15s ease-out;display:flex;align-items:center;justify-content:center}.pathway-card-button:hover{background:var(--color-accent);color:var(--color-bg);box-shadow:0 0 12px var(--color-glow-subtle);transform:translateY(-1px)}.pathway-card-button:active{transform:translateY(0)}.pathway-empty-state{text-align:center;padding:80px 40px;max-width:600px;margin:0 auto}.pathway-empty-state-icon{font-size:64px;margin-bottom:24px;filter:drop-shadow(0 0 20px var(--color-glow-subtle))}.pathway-empty-state h3{font-family:var(--font-heading);font-size:24px;font-weight:700;color:var(--color-text-primary);margin:0 0 12px;letter-spacing:.05em;text-transform:uppercase}.pathway-empty-state p{font-family:var(--font-body);font-size:16px;color:var(--color-text-secondary);margin:0;line-height:1.6}.pathway-loading-container,.pathway-error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:24px;padding:40px}.pathway-loading-spinner{width:48px;height:48px;border:3px solid var(--color-border-muted);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite;box-shadow:0 0 12px var(--color-glow-subtle)}@keyframes spin{to{transform:rotate(360deg)}}.pathway-loading-container p,.pathway-error-container p{font-family:var(--font-body);font-size:16px;color:var(--color-text-secondary);margin:0}.pathway-error-container{color:var(--color-error)}@media(max-width:768px){.pathway-header{padding:16px 20px}.pathway-header-inner{grid-template-columns:1fr;gap:16px}.pathway-header-left{flex-direction:column;align-items:flex-start;gap:12px}.pathway-header-logo{height:38px}.pathway-header-center{order:3}.pathway-header-right{justify-content:flex-end;order:2;margin-left:auto;width:100%}.pathway-header-exit-btn{width:34px;height:34px}.pathway-content{padding:32px 20px 60px}.pathway-card{min-height:300px}.pathway-card-media{height:160px}}@media(max-width:480px){.pathway-content{padding:24px 16px 60px}.pathway-header-title{font-size:14px}.pathway-card-body{padding:18px}.pathway-card-footer{padding:0 18px 18px}}.theme-light .pathway-header{background:linear-gradient(180deg,#fff,#f8fafc);box-shadow:0 1px 3px #0000000f,0 1px #fff inset}.theme-light .pathway-header-exit-btn{background:#f5f5f5;border-color:#e0e0e0;color:#666}.theme-light .pathway-header-exit-btn:hover{border-color:#ccc;color:#333;background:#ebebeb}.theme-light .pathway-card{background:#fff;box-shadow:0 1px 3px #0000000f}.theme-light .pathway-card-button{background:var(--color-accent-soft);border-color:var(--color-border)}.theme-light .pathway-card-button:hover{background:var(--color-accent);color:#fff}.admin-idle-events{min-height:100vh;background:var(--color-bg);color:var(--color-text-primary);padding:24px;max-width:1400px;margin:0 auto}.admin-idle-events__header{display:flex;align-items:center;gap:16px;margin-bottom:32px}.admin-idle-events__back-btn{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-primary);padding:8px 16px;border-radius:8px;cursor:pointer;font-size:14px;transition:all .2s}.admin-idle-events__back-btn:hover{background:var(--color-surface-alt);border-color:var(--color-accent);color:var(--color-accent)}.admin-idle-events__title{font-size:28px;font-weight:700;margin:0;color:var(--color-text-primary)}.admin-idle-events__error{background:#ff00001a;border:1px solid rgba(255,0,0,.3);color:#ff6b6b;padding:12px 16px;border-radius:8px;margin-bottom:24px}.admin-idle-events__loading{text-align:center;padding:48px;color:var(--color-text-secondary)}.admin-idle-events__settings,.admin-idle-events__stats,.admin-idle-events__events{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:24px;margin-bottom:24px}.admin-idle-events__section-title{font-size:20px;font-weight:600;margin:0 0 20px;color:var(--color-text-primary)}.admin-idle-events__threshold-control{display:flex;align-items:center;gap:12px;margin-bottom:12px}.admin-idle-events__threshold-control label{font-size:14px;color:var(--color-text-secondary);white-space:nowrap}.admin-idle-events__threshold-input{background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text-primary);padding:8px 12px;border-radius:6px;font-size:14px;width:100px}.admin-idle-events__threshold-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 2px var(--color-accent-soft)}.admin-idle-events__update-btn{background:var(--color-accent);border:none;color:#fff;padding:8px 20px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.admin-idle-events__update-btn:hover:not(:disabled){background:var(--color-accent-hover);transform:translateY(-1px);box-shadow:0 4px 12px var(--color-glow)}.admin-idle-events__update-btn:disabled{opacity:.6;cursor:not-allowed}.admin-idle-events__threshold-note{font-size:12px;color:var(--color-text-muted);margin:0;line-height:1.5}.admin-idle-events__stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.admin-idle-events__stat-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;padding:20px;text-align:center}.admin-idle-events__stat-label{font-size:12px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.admin-idle-events__stat-value{font-size:32px;font-weight:700;color:var(--color-accent)}.admin-idle-events__table-wrapper{overflow-x:auto;margin-bottom:16px}.admin-idle-events__table{width:100%;border-collapse:collapse;font-size:14px}.admin-idle-events__table thead{background:var(--color-bg);border-bottom:2px solid var(--color-border)}.admin-idle-events__table th{padding:12px;text-align:left;font-weight:600;color:var(--color-text-primary);text-transform:uppercase;font-size:12px;letter-spacing:.5px}.admin-idle-events__table td{padding:12px;border-bottom:1px solid var(--color-border-muted);color:var(--color-text-secondary)}.admin-idle-events__table tbody tr:hover{background:var(--color-surface-alt)}.admin-idle-events__user-info,.admin-idle-events__lesson-info{display:flex;flex-direction:column;gap:4px}.admin-idle-events__user-id,.admin-idle-events__lesson-artist{font-size:11px;color:var(--color-text-muted)}.admin-idle-events__empty{text-align:center;padding:48px;color:var(--color-text-muted)}.admin-idle-events__pagination{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:16px}.admin-idle-events__pagination-btn{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-primary);padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.admin-idle-events__pagination-btn:hover:not(:disabled){background:var(--color-surface-alt);border-color:var(--color-accent);color:var(--color-accent)}.admin-idle-events__pagination-btn:disabled{opacity:.4;cursor:not-allowed}.admin-idle-events__pagination-info{color:var(--color-text-secondary);font-size:14px}@media(max-width:768px){.admin-idle-events{padding:16px}.admin-idle-events__title{font-size:22px}.admin-idle-events__threshold-control{flex-direction:column;align-items:flex-start}.admin-idle-events__threshold-input{width:100%}.admin-idle-events__stats-grid{grid-template-columns:1fr}.admin-idle-events__table{font-size:12px}.admin-idle-events__table th,.admin-idle-events__table td{padding:8px}}:root,.theme-default{--color-bg: #0d0f12;--color-bg-secondary: #14171c;--color-bg-tertiary: #0f1114;--color-surface: #14171c;--color-surface-alt: #1a1e24;--color-surface-elevated: #1f2329;--color-text-primary: #e6eaf3;--color-text-secondary: #9ba3b4;--color-text-muted: #6b7280;--color-accent: #2dfe87;--color-accent-soft: rgba(45, 254, 135, .15);--color-accent-hover: rgba(45, 254, 135, .3);--color-border: rgba(45, 254, 135, .2);--color-border-hover: rgba(45, 254, 135, .35);--color-border-active: rgba(45, 254, 135, .5);--color-glow: rgba(45, 254, 135, .15);--color-glow-strong: rgba(45, 254, 135, .3);--color-glow-subtle: rgba(45, 254, 135, .08);--color-alphatab-bg: rgba(30, 30, 30, .95);--color-alphatab-border: rgba(45, 254, 135, .25);--color-alphatab-text: #ffffff;--color-alphatab-note: #ffffff;--color-alphatab-cursor: rgba(45, 254, 135, .6);--color-icon: #2dfe87;--color-icon-muted: rgba(204, 204, 204, .7);--color-medal-bronze: #CD7F32;--color-medal-silver: #A8B4C4;--color-medal-gold: #F5A623;--color-medal-platinum: #25CED1;--color-medal-diamond: #7C5CFF;--color-medal-master: #9D4EDD;--color-not-trained-bg: rgba(180, 150, 110, .15);--color-not-trained-border: rgba(205, 127, 50, .35);--color-not-trained-text: rgba(160, 120, 70, .85);--color-not-trained-text-dark: rgba(140, 100, 60, .6);--font-primary: "Roboto", sans-serif;--color-primary-50: #e6fff5;--color-primary-100: #b3ffe0;--color-primary-200: #80ffcb;--color-primary-300: #4dffb6;--color-primary-400: #1affa1;--color-primary-500: #00ff88;--color-primary-600: #00cc6a;--color-primary-700: #00994d;--color-primary-800: #006630;--color-primary-900: #003314;--color-accent-500: #00ac90;--color-accent-600: #008a73;--color-neutral-0: #000000;--color-neutral-50: #0a0a0a;--color-neutral-100: #1a1a1a;--color-neutral-200: #2a2a2a;--color-neutral-500: #666666;--color-neutral-700: #999999;--color-neutral-800: #cccccc;--color-neutral-900: #ffffff;--color-success: #00ff88;--color-warning: #ff6b35;--color-error: #ff006e;--color-info: #00ac90;--color-bg-primary: #0a0a0a;--color-bg-secondary: #1a1a1a;--color-bg-tertiary: #0f0f0f;--color-bg-card: rgba(0, 0, 0, .6);--color-bg-card-hover: rgba(0, 0, 0, .8);--color-bg-overlay: rgba(0, 0, 0, .9);--color-border-default: rgba(0, 255, 136, .2);--color-border-hover: rgba(0, 255, 136, .4);--color-border-active: rgba(0, 255, 136, .6);--color-border-muted: rgba(255, 255, 255, .1);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .5);--shadow-md: 0 4px 16px rgba(0, 0, 0, .6);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .7);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .8);--shadow-glow-subtle: 0 0 8px rgba(0, 255, 136, .15);--shadow-glow-sm: 0 0 12px rgba(0, 255, 136, .25);--shadow-glow-md: 0 0 20px rgba(0, 255, 136, .35);--shadow-glow-lg: 0 0 30px rgba(0, 255, 136, .5);--shadow-card: 0 4px 16px rgba(0, 0, 0, .6), 0 0 12px rgba(0, 255, 136, .08);--shadow-card-hover: 0 8px 32px rgba(0, 0, 0, .8), 0 0 24px rgba(0, 255, 136, .2);--shadow-button: 0 4px 12px rgba(0, 0, 0, .4), 0 0 16px rgba(0, 255, 136, .3);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .5), 0 0 24px rgba(0, 255, 136, .5);--gradient-card-soft: linear-gradient( 135deg, rgba(26, 26, 26, .95) 0%, rgba(15, 15, 15, .95) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(10, 10, 10, .98) 0%, rgba(20, 20, 20, .98) 100% );--gradient-primary: linear-gradient(135deg, #00ff88 0%, #00cc6a 100%);--gradient-header: linear-gradient( 180deg, rgba(0, 255, 136, .08) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}.theme-light{--color-bg: #f8f9fa;--color-surface: #ffffff;--color-surface-alt: #fafbfc;--color-surface-elevated: #ffffff;--color-text-primary: #1a1d29;--color-text-secondary: #5a5f7a;--color-text-muted: #8b92b2;--color-accent: #00b87a;--color-accent-soft: rgba(0, 184, 122, .12);--color-accent-hover: rgba(0, 184, 122, .2);--color-border: rgba(0, 0, 0, .08);--color-glow: rgba(0, 184, 122, .12);--color-glow-strong: rgba(0, 184, 122, .2);--color-glow-subtle: rgba(0, 184, 122, .06);--color-alphatab-bg: #ffffff;--color-alphatab-border: rgba(0, 0, 0, .1);--color-alphatab-text: #1a1d29;--color-alphatab-note: #000000;--color-alphatab-cursor: rgba(0, 184, 122, .5);--color-icon: #00b87a;--color-icon-muted: #8b92b2;--color-medal-bronze: #cd7f32;--color-medal-silver: #a8a8a8;--color-medal-gold: #d4af37;--color-medal-diamond: #4fd1c5;--color-not-trained-bg: rgba(139, 146, 178, .1);--color-not-trained-border: rgba(139, 146, 178, .3);--color-not-trained-text: rgba(180, 140, 90, .8);--color-not-trained-text-dark: rgba(160, 120, 70, .55);--font-primary: "Roboto", sans-serif;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--color-primary-50: #e6f5f0;--color-primary-100: #b3e5d1;--color-primary-200: #80d5b2;--color-primary-300: #4dc593;--color-primary-400: #1ab574;--color-primary-500: #00b87a;--color-primary-600: #009362;--color-primary-700: #006e4a;--color-primary-800: #004932;--color-primary-900: #00241a;--color-accent-500: #00b87a;--color-accent-600: #009362;--color-neutral-0: #ffffff;--color-neutral-50: #f8f9fa;--color-neutral-100: #f1f3f5;--color-neutral-200: #e9ecef;--color-neutral-500: #868e96;--color-neutral-700: #5a5f7a;--color-neutral-800: #1a1d29;--color-neutral-900: #000000;--color-success: #00b87a;--color-warning: #ff8c42;--color-error: #ff3366;--color-info: #00b87a;--color-bg-primary: #f8f9fa;--color-bg-secondary: #ffffff;--color-bg-tertiary: #f1f3f5;--color-bg-card: rgba(255, 255, 255, .9);--color-bg-card-hover: rgba(255, 255, 255, 1);--color-bg-overlay: rgba(248, 249, 250, .95);--color-border-default: rgba(0, 0, 0, .08);--color-border-hover: rgba(0, 184, 122, .25);--color-border-active: rgba(0, 184, 122, .4);--color-border-muted: rgba(0, 0, 0, .04);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .08);--shadow-md: 0 4px 16px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .15);--shadow-glow-subtle: 0 0 8px rgba(0, 184, 122, .1);--shadow-glow-sm: 0 0 12px rgba(0, 184, 122, .15);--shadow-glow-md: 0 0 20px rgba(0, 184, 122, .2);--shadow-glow-lg: 0 0 30px rgba(0, 184, 122, .3);--shadow-card: 0 4px 16px rgba(0, 0, 0, .1), 0 0 12px rgba(0, 184, 122, .05);--shadow-card-hover: 0 8px 32px rgba(0, 0, 0, .15), 0 0 24px rgba(0, 184, 122, .1);--shadow-button: 0 4px 12px rgba(0, 0, 0, .1), 0 0 16px rgba(0, 184, 122, .2);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .12), 0 0 24px rgba(0, 184, 122, .3);--gradient-card-soft: linear-gradient( 135deg, rgba(255, 255, 255, .95) 0%, rgba(248, 249, 250, .95) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(255, 255, 255, .98) 0%, rgba(241, 243, 245, .98) 100% );--gradient-primary: linear-gradient(135deg, #00b87a 0%, #009362 100%);--gradient-header: linear-gradient( 180deg, rgba(0, 184, 122, .05) 0%, transparent 100% )}.theme-stealth{--color-bg: #050816;--color-surface: #101528;--color-surface-alt: #141a33;--color-surface-elevated: #1a2140;--color-text-primary: #e4e8ff;--color-text-secondary: #9aa2c3;--color-text-muted: #6b7398;--color-accent: #2dd4bf;--color-accent-soft: rgba(45, 212, 191, .12);--color-accent-hover: rgba(45, 212, 191, .25);--color-border: rgba(45, 212, 191, .15);--color-glow: rgba(45, 212, 191, .12);--color-glow-strong: rgba(45, 212, 191, .25);--color-glow-subtle: rgba(45, 212, 191, .06);--color-alphatab-bg: rgba(20, 25, 40, .95);--color-alphatab-border: rgba(45, 212, 191, .2);--color-alphatab-text: #e4e8ff;--color-alphatab-note: #e4e8ff;--color-alphatab-cursor: rgba(45, 212, 191, .5);--color-icon: #2dd4bf;--color-icon-muted: rgba(154, 162, 195, .6);--color-medal-bronze: #cd7f32;--color-medal-silver: #c0c0c0;--color-medal-gold: #ffd700;--color-medal-diamond: #4fd1c5;--color-not-trained-bg: rgba(107, 115, 152, .12);--color-not-trained-border: rgba(107, 115, 152, .35);--color-not-trained-text: rgba(170, 130, 80, .8);--color-not-trained-text-dark: rgba(150, 110, 60, .55);--font-primary: "Roboto", sans-serif;--color-primary-50: #e6f7f5;--color-primary-100: #b3e8e0;--color-primary-200: #80d9cb;--color-primary-300: #4dcab6;--color-primary-400: #1abb9f;--color-primary-500: #2dd4bf;--color-primary-600: #24a99a;--color-primary-700: #1b7e75;--color-primary-800: #125350;--color-primary-900: #09282b;--color-accent-500: #2dd4bf;--color-accent-600: #24a99a;--color-neutral-0: #000000;--color-neutral-50: #050816;--color-neutral-100: #0b1020;--color-neutral-200: #151a2e;--color-neutral-500: #6b7398;--color-neutral-700: #9aa2c3;--color-neutral-800: #c4c9e0;--color-neutral-900: #e4e8ff;--color-success: #2dd4bf;--color-warning: #ff8c42;--color-error: #ff4d6d;--color-info: #2dd4bf;--color-bg-primary: #050816;--color-bg-secondary: #0b1020;--color-bg-tertiary: #080c18;--color-bg-card: rgba(10, 15, 32, .7);--color-bg-card-hover: rgba(10, 15, 32, .85);--color-bg-overlay: rgba(5, 8, 22, .95);--color-border-default: rgba(45, 212, 191, .15);--color-border-hover: rgba(45, 212, 191, .3);--color-border-active: rgba(45, 212, 191, .45);--color-border-muted: rgba(154, 162, 195, .15);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(5, 8, 22, .6);--shadow-md: 0 4px 16px rgba(5, 8, 22, .7);--shadow-lg: 0 8px 32px rgba(5, 8, 22, .8);--shadow-xl: 0 12px 48px rgba(5, 8, 22, .9);--shadow-glow-subtle: 0 0 8px rgba(45, 212, 191, .1);--shadow-glow-sm: 0 0 12px rgba(45, 212, 191, .15);--shadow-glow-md: 0 0 20px rgba(45, 212, 191, .2);--shadow-glow-lg: 0 0 30px rgba(45, 212, 191, .3);--shadow-card: 0 4px 16px rgba(5, 8, 22, .7), 0 0 12px rgba(45, 212, 191, .06);--shadow-card-hover: 0 8px 32px rgba(5, 8, 22, .85), 0 0 24px rgba(45, 212, 191, .15);--shadow-button: 0 4px 12px rgba(5, 8, 22, .5), 0 0 16px rgba(45, 212, 191, .2);--shadow-button-hover: 0 6px 20px rgba(5, 8, 22, .6), 0 0 24px rgba(45, 212, 191, .35);--gradient-card-soft: linear-gradient( 135deg, rgba(20, 26, 51, .95) 0%, rgba(11, 16, 32, .95) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(5, 8, 22, .98) 0%, rgba(16, 21, 40, .98) 100% );--gradient-primary: linear-gradient(135deg, #2dd4bf 0%, #24a99a 100%);--gradient-header: linear-gradient( 180deg, rgba(45, 212, 191, .06) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}.theme-vintage{--color-bg: #f5eedf;--color-surface: #fffdf7;--color-surface-alt: #f7f1e3;--color-surface-elevated: #ffffff;--color-text-primary: #2e2a25;--color-text-secondary: #5b5248;--color-text-muted: #8c8176;--color-accent: #c96f31;--color-accent-soft: rgba(201, 111, 49, .15);--color-accent-hover: rgba(201, 111, 49, .25);--color-border: rgba(120, 95, 66, .25);--color-glow: rgba(201, 111, 49, .12);--color-glow-strong: rgba(201, 111, 49, .18);--color-glow-subtle: rgba(201, 111, 49, .06);--color-alphatab-bg: #fffdf7;--color-alphatab-border: rgba(120, 95, 66, .2);--color-alphatab-text: #2e2a25;--color-alphatab-note: #000000;--color-alphatab-cursor: rgba(201, 111, 49, .55);--color-icon: #c96f31;--color-icon-muted: rgba(100, 80, 60, .6);--color-medal-bronze: #cd7f32;--color-medal-silver: #c0c0c0;--color-medal-gold: #ffd700;--color-medal-diamond: #4fd1c5;--color-not-trained-bg: rgba(120, 95, 66, .1);--color-not-trained-border: rgba(120, 95, 66, .25);--color-not-trained-text: rgba(120, 95, 66, .7);--color-not-trained-text-dark: rgba(120, 95, 66, .5);--font-primary: "Roboto", sans-serif;--color-primary-50: #fef5ed;--color-primary-100: #fce4d1;--color-primary-200: #f9d3b5;--color-primary-300: #f6c299;--color-primary-400: #f3b17d;--color-primary-500: #c96f31;--color-primary-600: #a15a28;--color-primary-700: #79451f;--color-primary-800: #513016;--color-primary-900: #291b0d;--color-accent-500: #c96f31;--color-accent-600: #a15a28;--color-neutral-0: #ffffff;--color-neutral-50: #fffdf7;--color-neutral-100: #fbf7ed;--color-neutral-200: #f5eedf;--color-neutral-500: #8c8176;--color-neutral-700: #5b5248;--color-neutral-800: #3d362f;--color-neutral-900: #2e2a25;--color-success: #8b6f47;--color-warning: #c96f31;--color-error: #7a2e2e;--color-info: #c96f31;--color-bg-primary: #f5eedf;--color-bg-secondary: #fbf7ed;--color-bg-tertiary: #efe7d7;--color-bg-card: rgba(255, 253, 247, .9);--color-bg-card-hover: rgba(255, 255, 255, .95);--color-bg-overlay: rgba(245, 238, 223, .95);--color-border-default: rgba(120, 95, 66, .25);--color-border-hover: rgba(201, 111, 49, .35);--color-border-active: rgba(201, 111, 49, .5);--color-border-muted: rgba(60, 45, 25, .08);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(120, 95, 66, .15);--shadow-md: 0 4px 16px rgba(120, 95, 66, .2);--shadow-lg: 0 8px 32px rgba(120, 95, 66, .25);--shadow-xl: 0 12px 48px rgba(120, 95, 66, .3);--shadow-glow-subtle: 0 0 8px rgba(201, 111, 49, .08);--shadow-glow-sm: 0 0 12px rgba(201, 111, 49, .12);--shadow-glow-md: 0 0 20px rgba(201, 111, 49, .15);--shadow-glow-lg: 0 0 30px rgba(201, 111, 49, .2);--shadow-card: 0 4px 16px rgba(120, 95, 66, .15), 0 0 12px rgba(201, 111, 49, .05);--shadow-card-hover: 0 8px 32px rgba(120, 95, 66, .2), 0 0 24px rgba(201, 111, 49, .1);--shadow-button: 0 4px 12px rgba(120, 95, 66, .2), 0 0 16px rgba(201, 111, 49, .15);--shadow-button-hover: 0 6px 20px rgba(120, 95, 66, .25), 0 0 24px rgba(201, 111, 49, .2);--gradient-card-soft: linear-gradient( 135deg, rgba(255, 253, 247, .95) 0%, rgba(251, 247, 237, .95) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(255, 255, 255, .98) 0%, rgba(245, 238, 223, .98) 100% );--gradient-primary: linear-gradient(135deg, #c96f31 0%, #a15a28 100%);--gradient-header: linear-gradient( 180deg, rgba(201, 111, 49, .05) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}.title-xl{font-family:var(--font-heading);font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-wide);line-height:var(--line-height-tight);text-transform:uppercase}.title-l{font-family:var(--font-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-wide);line-height:var(--line-height-tight);text-transform:uppercase}.title-m{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);letter-spacing:var(--letter-spacing-normal);line-height:var(--line-height-tight);text-transform:uppercase}.body-m{font-family:var(--font-body);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-tight);line-height:var(--line-height-normal)}.body-s{font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-normal);letter-spacing:var(--letter-spacing-tight);line-height:var(--line-height-normal)}.theme-hello-kitty{--color-bg: #fff5f7;--color-surface: #ffffff;--color-surface-alt: #ffe6ef;--color-surface-elevated: #fff5f7;--color-text-primary: #1a1a1a;--color-text-secondary: #5a5a5a;--color-text-muted: #a8a8a8;--color-accent: #ff2d55;--color-accent-soft: rgba(255, 45, 85, .15);--color-accent-hover: rgba(255, 45, 85, .25);--color-border: rgba(0, 0, 0, .08);--color-glow: rgba(255, 183, 213, .35);--color-glow-strong: rgba(255, 45, 85, .4);--color-glow-subtle: rgba(255, 183, 213, .2);--color-alphatab-bg: #fff5f7;--color-alphatab-border: rgba(255, 45, 85, .35);--color-alphatab-text: #1a1a1a;--color-alphatab-note: #ff2d55;--color-alphatab-cursor: rgba(255, 45, 85, .5);--color-icon: #ff2d55;--color-icon-muted: rgba(168, 168, 168, .6);--color-medal-bronze: #d59a72;--color-medal-silver: #e5e5e5;--color-medal-gold: #ffcc4d;--color-medal-diamond: #b5e4ff;--color-not-trained-bg: rgba(168, 168, 168, .1);--color-not-trained-border: rgba(168, 168, 168, .25);--color-not-trained-text: rgba(160, 120, 70, .75);--color-not-trained-text-dark: rgba(140, 100, 50, .5);--font-primary: "Roboto", sans-serif;--color-primary-50: #fff5f7;--color-primary-100: #ffdde3;--color-primary-200: #ffb7d5;--color-primary-300: #ff91c7;--color-primary-400: #ff6bb9;--color-primary-500: #ff2d55;--color-primary-600: #e0244a;--color-primary-700: #c01b3f;--color-primary-800: #a01234;--color-primary-900: #800929;--color-accent-500: #ff2d55;--color-accent-600: #e0244a;--color-neutral-0: #ffffff;--color-neutral-50: #f8f8f8;--color-neutral-100: #f0f0f0;--color-neutral-200: #e0e0e0;--color-neutral-500: #a8a8a8;--color-neutral-700: #5a5a5a;--color-neutral-800: #3a3a3a;--color-neutral-900: #1a1a1a;--color-success: #b5e4ff;--color-warning: #ffcc4d;--color-error: #ff2d55;--color-info: #e7c6ff;--color-bg-primary: #fff5f7;--color-bg-secondary: #ffdde3;--color-bg-tertiary: #ffb7d5;--color-bg-card: #ffffff;--color-bg-card-hover: #ffe5ee;--color-bg-overlay: rgba(255, 183, 213, .35);--color-border-default: rgba(0, 0, 0, .08);--color-border-hover: rgba(255, 45, 85, .35);--color-border-active: rgba(255, 45, 85, .5);--color-border-muted: rgba(0, 0, 0, .04);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 12px;--radius-md: 16px;--radius-lg: 20px;--radius-xl: 24px;--radius-2xl: 28px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: .5px;--letter-spacing-wide: 1px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(255, 45, 85, .1);--shadow-md: 0 4px 16px rgba(255, 45, 85, .15);--shadow-lg: 0 8px 24px rgba(255, 45, 85, .2);--shadow-xl: 0 12px 32px rgba(255, 45, 85, .25);--shadow-glow-subtle: 0 0 12px rgba(255, 183, 213, .35);--shadow-glow-sm: 0 0 16px rgba(255, 183, 213, .4);--shadow-glow-md: 0 0 24px rgba(255, 45, 85, .3);--shadow-glow-lg: 0 0 32px rgba(255, 45, 85, .4);--shadow-card: 0 4px 16px rgba(255, 45, 85, .1), 0 0 12px rgba(255, 183, 213, .2);--shadow-card-hover: 0 8px 24px rgba(255, 45, 85, .15), 0 0 20px rgba(255, 183, 213, .3);--shadow-button: 0 4px 12px rgba(255, 45, 85, .2), 0 0 16px rgba(255, 183, 213, .3);--shadow-button-hover: 0 6px 20px rgba(255, 45, 85, .25), 0 0 24px rgba(255, 183, 213, .4);--gradient-card-soft: linear-gradient(135deg, #ffffff 0%, #fff5f7 100%);--gradient-card-hard: linear-gradient(135deg, #ffffff 0%, #ffe6ef 100%);--gradient-primary: linear-gradient(135deg, #ff2d55 0%, #ff6bb9 100%);--gradient-header: linear-gradient( 180deg, rgba(255, 183, 213, .2) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg);--stroke-width: 2.2px;--stroke-width-icon: 2px;--cute-border-radius: 20px}.theme-kuromi{--color-bg: #050308;--color-surface: #151320;--color-surface-alt: #1f1c2b;--color-surface-elevated: #2b2738;--color-text-primary: #f5f3fa;--color-text-secondary: #c9c2e3;--color-text-muted: #9188b2;--color-accent: #7e4cca;--color-accent-soft: rgba(126, 76, 202, .18);--color-accent-hover: rgba(126, 76, 202, .3);--color-border: rgba(126, 76, 202, .35);--color-glow: rgba(126, 76, 202, .25);--color-glow-strong: rgba(255, 79, 154, .35);--color-glow-subtle: rgba(126, 76, 202, .14);--color-alphatab-bg: #151320;--color-alphatab-border: rgba(126, 76, 202, .35);--color-alphatab-text: #f5f3fa;--color-alphatab-note: #ffffff;--color-alphatab-cursor: rgba(255, 79, 154, .65);--color-icon: #ff4f9a;--color-icon-muted: #9188b2;--color-medal-bronze: #b2794b;--color-medal-silver: #d8d8e8;--color-medal-gold: #f5d26b;--color-medal-diamond: #b8e4ff;--color-not-trained-bg: rgba(145, 136, 178, .1);--color-not-trained-border: rgba(145, 136, 178, .35);--color-not-trained-text: rgba(190, 150, 100, .8);--color-not-trained-text-dark: rgba(170, 130, 80, .6);--font-primary: "Roboto", sans-serif;--color-primary-50: #f5f3fa;--color-primary-100: #e7dff5;--color-primary-200: #d4c5eb;--color-primary-300: #bca5dd;--color-primary-400: #9f7fca;--color-primary-500: #7e4cca;--color-primary-600: #6a3fb0;--color-primary-700: #563496;--color-primary-800: #3a264f;--color-primary-900: #1f1c2b;--color-accent-500: #ff4f9a;--color-accent-600: #e03d7a;--color-neutral-0: #050308;--color-neutral-50: #151320;--color-neutral-100: #1f1c2b;--color-neutral-200: #2b2738;--color-neutral-500: #9188b2;--color-neutral-700: #c9c2e3;--color-neutral-800: #e7dff5;--color-neutral-900: #f5f3fa;--color-success: #7ede9e;--color-warning: #ffb24a;--color-error: #ff4f9a;--color-info: #7e4cca;--color-bg-primary: #151320;--color-bg-secondary: #151320;--color-bg-tertiary: #1f1c2b;--color-bg-card: rgba(21, 19, 32, .96);--color-bg-card-hover: rgba(31, 28, 43, .98);--color-bg-overlay: rgba(5, 3, 8, .9);--color-border-default: rgba(126, 76, 202, .35);--color-border-hover: rgba(255, 79, 154, .45);--color-border-active: rgba(255, 79, 154, .65);--color-border-muted: rgba(245, 243, 250, .08);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--radius-xl: 22px;--radius-2xl: 26px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .6);--shadow-md: 0 4px 16px rgba(0, 0, 0, .7);--shadow-lg: 0 8px 28px rgba(0, 0, 0, .85);--shadow-xl: 0 12px 40px rgba(0, 0, 0, .9);--shadow-glow-subtle: 0 0 10px rgba(126, 76, 202, .35);--shadow-glow-sm: 0 0 16px rgba(126, 76, 202, .45);--shadow-glow-md: 0 0 22px rgba(255, 79, 154, .45);--shadow-glow-lg: 0 0 32px rgba(255, 79, 154, .55);--shadow-card: 0 4px 16px rgba(0, 0, 0, .7), 0 0 12px rgba(126, 76, 202, .25);--shadow-card-hover: 0 8px 28px rgba(0, 0, 0, .85), 0 0 20px rgba(255, 79, 154, .35);--shadow-button: 0 4px 12px rgba(0, 0, 0, .6), 0 0 16px rgba(126, 76, 202, .35);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .7), 0 0 24px rgba(255, 79, 154, .45);--gradient-card-soft: linear-gradient( 135deg, rgba(21, 19, 32, .96) 0%, rgba(31, 28, 43, .96) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(5, 3, 8, .98) 0%, rgba(21, 19, 32, .98) 100% );--gradient-primary: linear-gradient(135deg, #7e4cca 0%, #ff4f9a 100%);--gradient-header: linear-gradient( 180deg, rgba(126, 76, 202, .15) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg);--stroke-width: 2px;--stroke-width-icon: 2px;--stroke-width-fine: 1.5px}.theme-monochrome{--color-bg: #ffffff;--color-surface: #ffffff;--color-surface-alt: #f2f2f2;--color-surface-elevated: #e5e5e5;--color-text-primary: #000000;--color-text-secondary: #555555;--color-text-muted: #aaaaaa;--color-accent: #000000;--color-accent-soft: rgba(0, 0, 0, .1);--color-accent-hover: rgba(0, 0, 0, .2);--color-border: rgba(0, 0, 0, .15);--color-glow: rgba(0, 0, 0, .08);--color-glow-strong: rgba(0, 0, 0, .15);--color-glow-subtle: rgba(0, 0, 0, .05);--color-alphatab-bg: #ffffff;--color-alphatab-border: rgba(0, 0, 0, .15);--color-alphatab-text: #000000;--color-alphatab-note: #000000;--color-alphatab-cursor: rgba(0, 0, 0, .4);--color-icon: #000000;--color-icon-muted: #555555;--color-medal-bronze: #cd7f32;--color-medal-silver: #c0c0c0;--color-medal-gold: #ffd700;--color-medal-diamond: #4fd1c5;--color-not-trained-bg: rgba(0, 0, 0, .05);--color-not-trained-border: rgba(0, 0, 0, .15);--color-not-trained-text: rgba(140, 100, 50, .7);--color-not-trained-text-dark: rgba(120, 80, 40, .5);--font-primary: "Roboto", sans-serif;--color-primary-50: #f2f2f2;--color-primary-100: #e5e5e5;--color-primary-200: #d9d9d9;--color-primary-300: #cccccc;--color-primary-400: #aaaaaa;--color-primary-500: #555555;--color-primary-600: #333333;--color-primary-700: #1a1a1a;--color-primary-800: #0d0d0d;--color-primary-900: #000000;--color-accent-500: #000000;--color-accent-600: #000000;--color-neutral-0: #000000;--color-neutral-50: #0d0d0d;--color-neutral-100: #1a1a1a;--color-neutral-200: #333333;--color-neutral-500: #555555;--color-neutral-700: #aaaaaa;--color-neutral-800: #d9d9d9;--color-neutral-900: #ffffff;--color-success: #555555;--color-warning: #8c8c8c;--color-error: #000000;--color-info: #555555;--color-bg-primary: #ffffff;--color-bg-secondary: #f2f2f2;--color-bg-tertiary: #e5e5e5;--color-bg-card: #ffffff;--color-bg-card-hover: #f2f2f2;--color-bg-overlay: rgba(255, 255, 255, .95);--color-border-default: rgba(0, 0, 0, .15);--color-border-hover: rgba(0, 0, 0, .25);--color-border-active: rgba(0, 0, 0, .4);--color-border-muted: rgba(0, 0, 0, .08);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .1);--shadow-md: 0 4px 16px rgba(0, 0, 0, .15);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .2);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .25);--shadow-glow-subtle: 0 0 8px rgba(0, 0, 0, .08);--shadow-glow-sm: 0 0 12px rgba(0, 0, 0, .12);--shadow-glow-md: 0 0 20px rgba(0, 0, 0, .18);--shadow-glow-lg: 0 0 30px rgba(0, 0, 0, .25);--shadow-card: 0 4px 16px rgba(0, 0, 0, .1), 0 0 8px rgba(0, 0, 0, .05);--shadow-card-hover: 0 8px 32px rgba(0, 0, 0, .15), 0 0 16px rgba(0, 0, 0, .1);--shadow-button: 0 4px 12px rgba(0, 0, 0, .15), 0 0 8px rgba(0, 0, 0, .1);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .2), 0 0 12px rgba(0, 0, 0, .15);--gradient-card-soft: linear-gradient(135deg, #ffffff 0%, #f2f2f2 100%);--gradient-card-hard: linear-gradient(135deg, #ffffff 0%, #e5e5e5 100%);--gradient-primary: linear-gradient(135deg, #000000 0%, #555555 100%);--gradient-header: linear-gradient( 180deg, rgba(0, 0, 0, .05) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}.theme-sunburst{--color-bg: #120a05;--color-surface: #2f1807;--color-surface-alt: #3b1c08;--color-surface-elevated: #4a220b;--color-text-primary: #f9eedc;--color-text-secondary: #d1bfa5;--color-text-muted: #a38662;--color-accent: #f08a24;--color-accent-soft: rgba(240, 138, 36, .18);--color-accent-hover: rgba(240, 138, 36, .28);--color-border: rgba(240, 138, 36, .35);--color-glow: rgba(240, 138, 36, .15);--color-glow-strong: rgba(240, 138, 36, .25);--color-glow-subtle: rgba(240, 138, 36, .08);--color-alphatab-bg: #f5e4c3;--color-alphatab-border: rgba(64, 38, 16, .35);--color-alphatab-text: #2b190c;--color-alphatab-note: #1a0e06;--color-alphatab-cursor: rgba(240, 138, 36, .7);--color-icon: #f08a24;--color-icon-muted: #b89264;--color-medal-bronze: #c27a3a;--color-medal-silver: #d8d8d8;--color-medal-gold: #f2c94c;--color-medal-diamond: #f9f4e5;--color-not-trained-bg: rgba(178, 140, 96, .16);--color-not-trained-border: rgba(178, 140, 96, .35);--color-not-trained-text: rgba(230, 206, 177, .8);--color-not-trained-text-dark: rgba(178, 140, 96, .6);--font-primary: "Roboto", sans-serif;--color-primary-50: #fff5e6;--color-primary-100: #ffe0b3;--color-primary-200: #ffcc80;--color-primary-300: #ffb84d;--color-primary-400: #ffa41a;--color-primary-500: #f08a24;--color-primary-600: #cc6f1e;--color-primary-700: #995418;--color-primary-800: #663912;--color-primary-900: #331d0c;--color-accent-500: #f08a24;--color-accent-600: #cc6f1e;--color-neutral-0: #000000;--color-neutral-50: #120a05;--color-neutral-100: #1e1107;--color-neutral-200: #2a1507;--color-neutral-500: #a38662;--color-neutral-700: #d1bfa5;--color-neutral-800: #e5d4c0;--color-neutral-900: #f9eedc;--color-success: #8b9a5b;--color-warning: #f08a24;--color-error: #c27a3a;--color-info: #f08a24;--color-bg-primary: #120a05;--color-bg-secondary: #1e1107;--color-bg-tertiary: #2a1507;--color-bg-card: rgba(31, 24, 7, .96);--color-bg-card-hover: rgba(47, 24, 7, .98);--color-bg-overlay: rgba(18, 10, 5, .95);--color-border-default: rgba(240, 138, 36, .35);--color-border-hover: rgba(240, 138, 36, .5);--color-border-active: rgba(240, 138, 36, .7);--color-border-muted: rgba(249, 238, 220, .12);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .5);--shadow-md: 0 4px 16px rgba(0, 0, 0, .6);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .7);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .8);--shadow-glow-subtle: 0 0 8px rgba(240, 138, 36, .15);--shadow-glow-sm: 0 0 12px rgba(240, 138, 36, .2);--shadow-glow-md: 0 0 20px rgba(240, 138, 36, .25);--shadow-glow-lg: 0 0 30px rgba(240, 138, 36, .3);--shadow-card: 0 4px 16px rgba(0, 0, 0, .6), 0 0 12px rgba(240, 138, 36, .1);--shadow-card-hover: 0 8px 32px rgba(0, 0, 0, .8), 0 0 24px rgba(240, 138, 36, .2);--shadow-button: 0 4px 12px rgba(0, 0, 0, .4), 0 0 16px rgba(240, 138, 36, .25);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .5), 0 0 24px rgba(240, 138, 36, .35);--gradient-card-soft: linear-gradient( 135deg, rgba(47, 24, 7, .95) 0%, rgba(30, 17, 7, .95) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(18, 10, 5, .98) 0%, rgba(42, 21, 7, .98) 100% );--gradient-primary: linear-gradient(135deg, #f08a24 0%, #cc6f1e 100%);--gradient-header: linear-gradient( 180deg, rgba(240, 138, 36, .1) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}.theme-enhanced-forest{--color-bg: #071010;--color-surface: #0f2627;--color-surface-alt: #133033;--color-surface-elevated: #16393d;--color-text-primary: #e8fdfc;--color-text-secondary: #a8cfcb;--color-text-muted: #6b8e8b;--color-accent: #2cc7a5;--color-accent-soft: rgba(44, 199, 165, .15);--color-accent-hover: rgba(44, 199, 165, .28);--color-border: rgba(44, 199, 165, .25);--color-glow: rgba(44, 199, 165, .15);--color-glow-strong: rgba(44, 199, 165, .25);--color-glow-subtle: rgba(44, 199, 165, .07);--color-alphatab-bg: #f2fffc;--color-alphatab-border: rgba(15, 40, 38, .25);--color-alphatab-text: #0b1716;--color-alphatab-note: #000000;--color-alphatab-cursor: rgba(44, 199, 165, .55);--color-icon: #2cc7a5;--color-icon-muted: #6b8e8b;--color-medal-bronze: #8a6a4a;--color-medal-silver: #dde3e4;--color-medal-gold: #f1d38b;--color-medal-diamond: #c8fff4;--color-not-trained-bg: rgba(107, 142, 139, .15);--color-not-trained-border: rgba(107, 142, 139, .35);--color-not-trained-text: rgba(210, 170, 120, .85);--color-not-trained-text-dark: rgba(180, 140, 90, .6);--font-primary: "Roboto", sans-serif;--color-primary-50: #e8fdfc;--color-primary-100: #c8fff4;--color-primary-200: #a8f5e8;--color-primary-300: #88ebdc;--color-primary-400: #68e1d0;--color-primary-500: #2cc7a5;--color-primary-600: #24a084;--color-primary-700: #1c7963;--color-primary-800: #145242;--color-primary-900: #0c2b21;--color-accent-500: #2cc7a5;--color-accent-600: #24a084;--color-neutral-0: #000000;--color-neutral-50: #071010;--color-neutral-100: #0b1a1a;--color-neutral-200: #0f2223;--color-neutral-500: #6b8e8b;--color-neutral-700: #a8cfcb;--color-neutral-800: #c8e5e2;--color-neutral-900: #e8fdfc;--color-success: #2cc7a5;--color-warning: #f1d38b;--color-error: #c27a3a;--color-info: #2cc7a5;--color-bg-primary: #071010;--color-bg-secondary: #0b1a1a;--color-bg-tertiary: #0f2223;--color-bg-card: rgba(15, 38, 39, .96);--color-bg-card-hover: rgba(19, 48, 51, .98);--color-bg-overlay: rgba(7, 16, 16, .95);--color-border-default: rgba(44, 199, 165, .25);--color-border-hover: rgba(44, 199, 165, .4);--color-border-active: rgba(44, 199, 165, .6);--color-border-muted: rgba(255, 255, 255, .08);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .5);--shadow-md: 0 4px 16px rgba(0, 0, 0, .6);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .7);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .8);--shadow-glow-subtle: 0 0 8px rgba(44, 199, 165, .15);--shadow-glow-sm: 0 0 12px rgba(44, 199, 165, .2);--shadow-glow-md: 0 0 20px rgba(44, 199, 165, .25);--shadow-glow-lg: 0 0 30px rgba(44, 199, 165, .3);--shadow-card: 0 4px 16px rgba(0, 0, 0, .6), 0 0 12px rgba(44, 199, 165, .1);--shadow-card-hover: 0 8px 32px rgba(0, 0, 0, .8), 0 0 24px rgba(44, 199, 165, .2);--shadow-button: 0 4px 12px rgba(0, 0, 0, .4), 0 0 16px rgba(44, 199, 165, .25);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .5), 0 0 24px rgba(44, 199, 165, .35);--gradient-card-soft: linear-gradient( 135deg, rgba(26, 26, 26, .95) 0%, rgba(15, 15, 15, .95) 100% );--gradient-card-hard: linear-gradient( 135deg, rgba(10, 10, 10, .98) 0%, rgba(20, 20, 20, .98) 100% );--gradient-primary: linear-gradient(135deg, #00ff88 0%, #00cc6a 100%);--gradient-header: linear-gradient( 180deg, rgba(0, 255, 136, .08) 0%, transparent 100% );--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}.theme-gold{--color-bg: #0a0a0a;--color-bg-secondary: #111111;--color-bg-tertiary: #181818;--color-surface: #1a1a1a;--color-surface-alt: #202020;--color-surface-elevated: #262626;--color-text-primary: #f5f5f5;--color-text-secondary: #cfcfcf;--color-text-muted: #9a9a9a;--color-accent: #d4af37;--color-accent-soft: rgba(212, 175, 55, .15);--color-accent-hover: rgba(212, 175, 55, .25);--color-border: rgba(212, 175, 55, .2);--color-border-hover: rgba(212, 175, 55, .35);--color-border-active: rgba(212, 175, 55, .5);--color-border-muted: rgba(255, 255, 255, .08);--color-glow: rgba(212, 175, 55, .2);--color-glow-strong: rgba(212, 175, 55, .45);--color-glow-subtle: rgba(212, 175, 55, .1);--color-alphatab-bg: #0f0f0f;--color-alphatab-border: rgba(212, 175, 55, .2);--color-alphatab-text: #e8e8e8;--color-alphatab-note: #ffffff;--color-alphatab-cursor: rgba(230, 199, 102, .6);--color-icon: #d4af37;--color-icon-muted: #777777;--color-medal-bronze: #cd7f32;--color-medal-silver: #c0c0c0;--color-medal-gold: #ffd700;--color-medal-diamond: #7df9ff;--color-not-trained-bg: rgba(154, 154, 154, .1);--color-not-trained-border: rgba(154, 154, 154, .25);--color-not-trained-text: rgba(160, 120, 70, .75);--color-not-trained-text-dark: rgba(140, 100, 50, .5);--font-primary: "Roboto", sans-serif;--font-heading: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--color-primary-50: #fff8db;--color-primary-100: #f8eab3;--color-primary-200: #f1dc8a;--color-primary-300: #eac062;--color-primary-400: #e0b34d;--color-primary-500: #d4af37;--color-primary-600: #c0992d;--color-primary-700: #a88924;--color-primary-800: #6f5c15;--color-primary-900: #3a3008;--color-accent-500: #d4af37;--color-accent-600: #b8922d;--color-neutral-0: #000000;--color-neutral-50: #0a0a0a;--color-neutral-100: #111111;--color-neutral-200: #1a1a1a;--color-neutral-500: #777777;--color-neutral-700: #cfcfcf;--color-neutral-800: #e8e8e8;--color-neutral-900: #ffffff;--color-success: #4caf50;--color-warning: #ffb300;--color-error: #e53935;--color-info: #29b6f6;--color-bg-primary: #0a0a0a;--color-bg-card: rgba(26, 26, 26, .9);--color-bg-card-hover: rgba(32, 32, 32, .95);--color-bg-overlay: rgba(0, 0, 0, .85);--color-border-default: rgba(212, 175, 55, .2);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .5);--shadow-md: 0 4px 16px rgba(0, 0, 0, .6);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .7);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .8);--shadow-glow-subtle: 0 0 8px rgba(212, 175, 55, .15);--shadow-glow-sm: 0 0 12px rgba(212, 175, 55, .2);--shadow-glow-md: 0 0 20px rgba(212, 175, 55, .25);--shadow-glow-lg: 0 0 30px rgba(212, 175, 55, .3);--shadow-card: 0 4px 16px rgba(0, 0, 0, .6), 0 0 12px rgba(212, 175, 55, .1);--shadow-card-hover: 0 8px 32px rgba(0, 0, 0, .8), 0 0 24px rgba(212, 175, 55, .2);--shadow-button: 0 4px 12px rgba(0, 0, 0, .4), 0 0 16px rgba(212, 175, 55, .25);--shadow-button-hover: 0 6px 20px rgba(0, 0, 0, .5), 0 0 24px rgba(212, 175, 55, .35);--gradient-card-soft: linear-gradient(135deg, rgba(26, 26, 26, .95) 0%, rgba(17, 17, 17, .95) 100%);--gradient-card-hard: linear-gradient(135deg, rgba(10, 10, 10, .98) 0%, rgba(26, 26, 26, .98) 100%);--gradient-primary: linear-gradient(135deg, #e6c766 0%, #d4af37 100%);--gradient-header: linear-gradient(180deg, rgba(212, 175, 55, .08) 0%, transparent 100%);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 20px;--radius-full: 9999px;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-size-5xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 900;--letter-spacing-tight: .5px;--letter-spacing-normal: 1px;--letter-spacing-wide: 2px;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-tooltip: 500;--page-max-width: 1400px;--page-padding: var(--spacing-lg)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--color-bg);color:var(--color-text-primary);overflow-x:hidden;transition:background-color .3s ease,color .3s ease}#root{min-height:100vh}.grecaptcha-badge{visibility:hidden!important;opacity:0!important;pointer-events:none!important}body.show-recaptcha-badge .grecaptcha-badge{visibility:visible!important;opacity:1!important;pointer-events:auto!important}