.theme-toggle{position:relative;background:#fff3;border:2px solid rgba(255,255,255,.3);border-radius:var(--radius-full);padding:0;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base);width:70px;height:36px}.theme-toggle:hover{background:#ffffff4d;transform:scale(1.05)}.theme-toggle-track{position:relative;width:100%;height:100%;border-radius:var(--radius-full)}.theme-toggle-thumb{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all var(--transition-medium);box-shadow:0 2px 8px #0003;left:4px}[data-theme=dark] .theme-toggle-thumb{left:calc(100% - 32px)}[data-theme=dark] .theme-toggle{background:#ffffff26;border-color:#ffffff40}[data-theme=dark] .theme-toggle:hover{background:#ffffff40}.theme-toggle:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.app-showcase-overlay{position:fixed;inset:0;background-color:#0f172ab3;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-lg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:fadeIn .3s ease-out}.app-showcase-content{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);max-width:700px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-2xl);animation:modalSlideUp .4s cubic-bezier(.34,1.56,.64,1);position:relative}.app-showcase-close{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:40px;height:40px;border-radius:50%;background:var(--color-bg-tertiary);border:none;font-size:var(--font-size-xl);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;z-index:10}.app-showcase-close:hover{background:var(--color-error);color:#fff;transform:rotate(90deg)}.app-showcase-header{text-align:center;margin-bottom:var(--spacing-2xl)}.app-showcase-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);background:var(--gradient-purple-blue);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 var(--spacing-sm) 0}.app-showcase-subtitle{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0}.platforms-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-2xl);margin-bottom:var(--spacing-2xl);max-width:600px;margin-left:auto;margin-right:auto}.platform-card{background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg) 100%);border:2px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--spacing-lg);text-align:center;text-decoration:none;transition:all var(--transition-medium);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);position:relative;overflow:hidden}.platform-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,color-mix(in srgb,var(--color-primary) 5%,transparent) 100%);opacity:0;transition:opacity var(--transition-medium)}.platform-card:hover{transform:translateY(-8px);border-color:var(--color-primary);box-shadow:var(--shadow-xl),0 0 30px color-mix(in srgb,var(--color-primary) 20%,transparent)}.platform-card:hover:before{opacity:1}.platform-name{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;position:relative;z-index:1}.qr-code-wrapper{position:relative;z-index:1;background:#fff;border-radius:var(--radius-lg);box-shadow:0 4px 12px #0000001a;transition:all var(--transition-medium)}.qr-code-image{display:block;width:220px;height:220px;border-radius:var(--radius-md)}.platform-card:hover .qr-code-wrapper{transform:scale(1.05);box-shadow:0 8px 24px color-mix(in srgb,var(--color-primary) 30%,transparent)}.platform-description{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0;position:relative;z-index:1;line-height:var(--line-height-relaxed)}.app-features{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-accent-purple) 5%,transparent));border-radius:var(--radius-xl);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.features-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0;text-align:center}.features-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-md)}.feature-item{display:flex;align-items:flex-start;gap:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);animation:fadeInUp .5s ease-out both}.feature-item:nth-child(1){animation-delay:.1s}.feature-item:nth-child(2){animation-delay:.15s}.feature-item:nth-child(3){animation-delay:.2s}.feature-item:nth-child(4){animation-delay:.25s}.feature-item:nth-child(5){animation-delay:.3s}.feature-item:nth-child(6){animation-delay:.35s}.feature-check{flex-shrink:0;width:20px;height:20px;border-radius:50%;background:var(--gradient-success);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.feature-text{flex:1;line-height:var(--line-height-relaxed)}.app-showcase-footer{text-align:center;padding-top:var(--spacing-lg);border-top:2px solid var(--color-border)}.footer-text{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0;font-weight:var(--font-weight-medium)}[data-theme=dark] .app-showcase-content{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .app-showcase-close{background:var(--color-bg-tertiary)}[data-theme=dark] .platform-card{background:var(--color-bg-tertiary);border-color:var(--color-border)}[data-theme=dark] .platform-card:hover{background:var(--color-bg);border-color:var(--color-primary)}[data-theme=dark] .qr-code-wrapper{background:#fff}[data-theme=dark] .app-features{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 10%,transparent),color-mix(in srgb,var(--color-accent-purple) 10%,transparent))}@media(max-width:768px){.app-showcase-content{padding:var(--spacing-lg);margin:var(--spacing-md)}.app-showcase-title{font-size:var(--font-size-2xl)}.platforms-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.qr-code-image{width:180px;height:180px}.features-list{grid-template-columns:1fr}}@media(max-width:480px){.app-showcase-content{padding:var(--spacing-lg)}.app-showcase-title{font-size:var(--font-size-xl)}.platform-card{padding:var(--spacing-lg)}.qr-code-image{width:160px;height:160px}}.copyable-email{color:var(--color-primary);text-decoration:none;font-weight:500;cursor:pointer;transition:all .2s ease}.copyable-email:hover{text-decoration:underline}.copyable-email:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:2px}.gradient-selector{display:flex;flex-direction:column;gap:.75rem;padding:1rem;border-top:1px solid var(--color-border)}.gradient-selector-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;text-align:center}.gradient-selector-options{display:flex;gap:.5rem}.gradient-swatch{flex:1;height:32px;border-radius:8px;border:3px solid transparent;cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;padding:0;position:relative;box-shadow:var(--shadow-sm)}.gradient-swatch:hover{transform:scale(1.1);box-shadow:var(--shadow-md)}.gradient-swatch:active{transform:scale(.95)}.gradient-swatch.selected{border-color:var(--color-text);box-shadow:var(--shadow-lg)}.gradient-swatch:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.gradient-check{color:#fff;font-size:14px;font-weight:var(--font-weight-bold);text-shadow:0 1px 2px rgba(0,0,0,.5)}[data-theme=dark] .gradient-selector{border-top-color:var(--color-border)}[data-theme=dark] .gradient-swatch.selected{border-color:var(--color-text)}@media(max-width:480px){.gradient-swatch{height:28px}.gradient-check{font-size:12px}}.hamburger-menu-container{position:fixed;top:20px;left:20px;z-index:1000;transition:top .3s cubic-bezier(.4,0,.2,1),left .3s cubic-bezier(.4,0,.2,1)}.hamburger-menu-container.in-corner{top:0;left:0}.hamburger-menu-container.in-corner .hamburger-button{width:50px;height:50px;border-radius:0 0 100%;padding:10px 14px 14px 10px;justify-content:space-around;align-items:flex-start}.hamburger-menu-container.in-corner .hamburger-line{width:22px}.hamburger-menu-container.in-corner .hamburger-button.open .hamburger-line:nth-child(1){transform:rotate(45deg) translate(4px,4px)}.hamburger-menu-container.in-corner .hamburger-button.open .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}.hamburger-button{display:flex;flex-direction:column;justify-content:space-around;width:50px;height:50px;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid color-mix(in srgb,var(--color-primary) 50%,transparent);border-radius:12px;padding:12px 10px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0000001a}:not([data-theme=dark]) .hamburger-button:hover{background:var(--color-primary-light);-webkit-backdrop-filter:none;backdrop-filter:none;border-color:#fff;transform:scale(1.05);box-shadow:0 6px 20px color-mix(in srgb,var(--color-primary-light) 50%,transparent)}:not([data-theme=dark]) .hamburger-button:hover .hamburger-line{background:#fff}.hamburger-button:active{transform:scale(.95)}.hamburger-line{width:100%;height:3px;background:var(--color-primary-dark);border-radius:3px;transition:all .3s cubic-bezier(.4,0,.2,1);display:block}.hamburger-button.open .hamburger-line:nth-child(1){transform:rotate(45deg) translate(6px,6px)}.hamburger-button.open .hamburger-line:nth-child(2){opacity:0}.hamburger-button.open .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.hamburger-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999;animation:fadeIn .3s ease}.hamburger-menu{position:fixed;top:0;left:0;width:320px;max-width:85vw;height:100vh;background:var(--color-bg-secondary);border-right:1px solid var(--color-border);box-shadow:4px 0 20px #00000026;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1001;display:flex;flex-direction:column;overflow-y:auto}.hamburger-menu.open{transform:translate(0)}.hamburger-menu-header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid var(--color-border)}.hamburger-menu-logo{display:flex;align-items:center;gap:10px}.hamburger-logo-icon-wrapper{width:28px;height:28px;border-radius:6px;overflow:hidden;cursor:pointer;transition:transform .3s ease}.hamburger-logo-icon-wrapper:hover{transform:scale(1.1) rotate(5deg)}.hamburger-logo-icon-wrapper.bounce-spin{animation:bounceSpin .6s ease-in-out}@keyframes bounceSpin{0%{transform:translateY(0) rotate(0) scale(1)}25%{transform:translateY(-12px) rotate(90deg) scale(1.15)}50%{transform:translateY(0) rotate(180deg) scale(1)}75%{transform:translateY(-6px) rotate(270deg) scale(1.1)}to{transform:translateY(0) rotate(360deg) scale(1)}}.hamburger-logo-icon{width:100%;height:100%;object-fit:contain;display:block}.hamburger-logo-text{font-size:1.125rem;font-weight:700;color:var(--color-text);display:inline-flex}.hamburger-logo-text span{display:inline-block}.hamburger-logo-text.wave-animate span{animation:letterWave .6s ease-in-out}@keyframes letterWave{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.hamburger-close{background:transparent;border:none;font-size:1.75rem;color:var(--color-text-secondary);cursor:pointer;padding:5px;line-height:1;transition:all .2s ease}.hamburger-close:hover{color:#fff;transform:rotate(90deg)}.hamburger-menu-nav{flex:1;padding:10px 0;overflow-y:auto}.hamburger-menu-section{padding:20px;border-bottom:1px solid var(--color-border)}.hamburger-menu-section:last-child{border-bottom:none}.hamburger-section-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-secondary);margin:0 0 12px}.hamburger-menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px 15px;background:transparent;border:none;border-radius:8px;color:var(--color-text);font-size:.95rem;font-weight:600;text-align:left;text-decoration:none;cursor:pointer;transition:background .2s ease,transform .2s ease;font-family:inherit;margin-bottom:4px}button.hamburger-menu-item,a.hamburger-menu-item{pointer-events:auto!important}a.hamburger-menu-item{display:flex}.hamburger-menu-item:hover,a.hamburger-menu-item:hover{background:var(--color-primary);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary);transition:background .2s ease,transform .2s ease,box-shadow .2s ease,color 0s}.hamburger-menu-item:active,a.hamburger-menu-item:active{transform:translate(2px)}.hamburger-menu-icon{font-size:1.25rem;flex-shrink:0;pointer-events:none!important}.hamburger-menu-item *,.hamburger-menu-item *:before,.hamburger-menu-item *:after{pointer-events:none!important}.hamburger-menu-footer{padding:20px;text-align:center;font-size:.875rem;color:var(--color-text-secondary);border-top:1px solid var(--color-border)}.hamburger-menu-footer p{margin:4px 0}[data-theme=dark] .hamburger-button{background:color-mix(in srgb,var(--color-primary) 15%,transparent);border-color:color-mix(in srgb,var(--color-primary) 40%,transparent)}[data-theme=dark] .hamburger-button:hover{background:color-mix(in srgb,var(--color-primary) 25%,transparent);border-color:var(--color-primary);box-shadow:0 6px 16px color-mix(in srgb,var(--color-primary) 40%,transparent)}[data-theme=dark] .hamburger-line{background:var(--color-primary)}[data-theme=dark] .hamburger-button:hover .hamburger-line{background:var(--color-primary-light)}[data-theme=dark] .hamburger-menu{background:#0f172afa;border-right-color:#ffffff1a}[data-theme=dark] .hamburger-menu-section{border-bottom-color:#ffffff0d}[data-theme=dark] .hamburger-menu-item:hover{background:#ffffff0d}@media(max-width:480px){.hamburger-menu-container{top:15px;left:15px}.hamburger-menu-container.in-corner{top:0;left:0}.hamburger-button{width:40px;height:40px}.hamburger-menu-container.in-corner .hamburger-button{width:40px;height:40px;padding:8px 12px 12px 8px}.hamburger-menu-container.in-corner .hamburger-line{width:18px}.hamburger-menu{width:280px}.hamburger-menu-header,.hamburger-menu-section{padding:15px}.hamburger-menu-item{padding:10px 12px;font-size:.9rem}}@media(prefers-reduced-motion:reduce){.hamburger-menu-container,.hamburger-button,.hamburger-line,.hamburger-menu,.hamburger-menu-item{transition:none}}html body .app-footer{width:100%;margin-top:4rem;padding:3rem 2rem 2rem;position:relative;box-sizing:border-box;background:var(--gradient-primary)!important;border-top:1px solid rgba(255,255,255,.3)!important;box-shadow:0 -10px 30px var(--shadow-primary-color, rgba(102, 126, 234, .3))!important}html[data-theme=dark] body .app-footer{border-top-color:#fff3!important;box-shadow:0 -10px 30px #00000080!important}html body .app-footer .footer-content{max-width:1200px;margin:0 auto 2.5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:2.5rem;align-items:flex-start;box-sizing:border-box}html body .app-footer .footer-section{display:flex;flex-direction:column;gap:1rem;align-items:flex-start;box-sizing:border-box}html body .app-footer .footer-logo{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem}html body .app-footer .footer-logo-icon{font-size:1.75rem;line-height:1}html body .app-footer .footer-logo-text{font-size:1.25rem;font-weight:800;line-height:1;color:#fff!important;text-shadow:0 2px 4px rgba(0,0,0,.2)}html body .app-footer .footer-tagline{font-size:.9375rem;font-weight:600;line-height:1.5;color:#fffffff2!important;margin:0}html body .app-footer .footer-description{font-size:.875rem;line-height:1.5;color:#ffffffd9!important;margin:0}html body .app-footer .footer-section-title{font-size:.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff!important;margin:0 0 .75rem;line-height:1.3;opacity:.95}html body .app-footer .footer-links{display:flex;flex-direction:column;gap:.6rem;align-items:flex-start;box-sizing:border-box}html body .app-footer .footer-link,html body .app-footer .footer-links button.footer-link,html body .app-footer .footer-links a.footer-link{display:inline-block!important;width:auto!important;box-sizing:border-box!important;position:relative!important;margin:0!important;padding:.3rem 0!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important;font-size:.9375rem!important;font-weight:400!important;line-height:1.6!important;text-align:left!important;text-decoration:none!important;color:#ffffffe6!important;background:none!important;background-color:transparent!important;background-image:none!important;border:none!important;border-radius:0!important;outline:none!important;box-shadow:none!important;transform:none!important;transition:color .2s ease,transform .2s ease!important;cursor:pointer!important;overflow:visible!important;-webkit-appearance:none!important;appearance:none!important}html body .app-footer .footer-link:before,html body .app-footer .footer-links button.footer-link:before,html body .app-footer .footer-links a.footer-link:before{content:none!important;display:none!important}html body .app-footer .footer-link:after,html body .app-footer .footer-links button.footer-link:after,html body .app-footer .footer-links a.footer-link:after{content:""!important;position:absolute!important;left:0!important;bottom:0!important;width:0!important;height:2px!important;background:#ffffffe6!important;transition:width .3s ease!important}html body .app-footer .footer-link:hover,html body .app-footer .footer-links button.footer-link:hover,html body .app-footer .footer-links a.footer-link:hover{color:#fff!important;transform:scale(1.02)!important;background:none!important;background-color:transparent!important;box-shadow:none!important}html body .app-footer .footer-link:hover:after,html body .app-footer .footer-links button.footer-link:hover:after,html body .app-footer .footer-links a.footer-link:hover:after{width:100%!important}html body .app-footer .footer-link:active,html body .app-footer .footer-links button.footer-link:active,html body .app-footer .footer-links a.footer-link:active{transform:scale(.98)!important;background:none!important}html body .app-footer .footer-bottom{max-width:1200px;margin:0 auto;padding-top:2rem;border-top:1px solid rgba(255,255,255,.2);text-align:center;box-sizing:border-box}html body .app-footer .footer-copyright-text,html body .app-footer .footer-made-with{margin:0;line-height:1.6}html body .app-footer .footer-copyright-text{font-size:.875rem;font-weight:500;color:#fffffff2!important;margin-bottom:.5rem}html body .app-footer .footer-made-with{font-size:.8125rem;color:#fffc!important}@media(max-width:1024px){html body .app-footer{padding:2.5rem 1.5rem 1.5rem}html body .app-footer .footer-content{grid-template-columns:repeat(2,1fr);gap:2.5rem 2rem}}@media(max-width:768px){html body .app-footer{padding:2rem 1.25rem 1.25rem!important;margin-top:3rem!important}html body .app-footer .footer-content{grid-template-columns:1fr!important;gap:2rem!important;text-align:center!important}html body .app-footer .footer-section{align-items:center!important}html body .app-footer .footer-section:first-child{padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.2);margin-bottom:.5rem}html body .app-footer .footer-section:nth-child(4){max-width:100%!important}html body .app-footer .footer-logo{justify-content:center!important}html body .app-footer .footer-section-title{text-align:center!important}html body .app-footer .footer-links{align-items:center!important}html body .app-footer .footer-link,html body .app-footer .footer-links button.footer-link,html body .app-footer .footer-links a.footer-link{text-align:center!important}html body .app-footer .footer-link:hover,html body .app-footer .footer-links button.footer-link:hover,html body .app-footer .footer-links a.footer-link:hover{transform:scale(1.05)!important}html body .app-footer .footer-bottom{padding-top:1.5rem!important}}@media(max-width:480px){html body .app-footer{padding:1.75rem 1rem 1rem!important}html body .app-footer .footer-content{gap:1.75rem!important}html body .app-footer .footer-logo-text{font-size:1.125rem!important}html body .app-footer .footer-tagline{font-size:.875rem!important}html body .app-footer .footer-description{font-size:.8125rem!important}html body .app-footer .footer-section-title{font-size:.75rem!important}html body .app-footer .footer-link,html body .app-footer .footer-links button.footer-link,html body .app-footer .footer-links a.footer-link{font-size:.875rem!important}html body .app-footer .footer-copyright-text{font-size:.8125rem!important}html body .app-footer .footer-made-with{font-size:.75rem!important}}.mode-selection-screen{min-height:100vh;background:var(--gradient-primary);display:flex;flex-direction:column;position:relative;overflow-x:hidden}.mode-selection-screen:before{content:"";position:fixed;inset:0;background-image:radial-gradient(circle at 20% 80%,color-mix(in srgb,var(--color-primary) 3%,transparent) 0%,transparent 50%),radial-gradient(circle at 80% 20%,color-mix(in srgb,var(--color-accent-purple) 3%,transparent) 0%,transparent 50%);pointer-events:none;z-index:0}.mode-selection-header{padding:var(--spacing-3xl) var(--spacing-lg) var(--spacing-2xl);position:relative;z-index:10;animation:fadeInDown .6s ease-out}.mode-selection-header-top{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width-lg);margin:0 auto;gap:var(--spacing-md)}.mode-selection-title-wrapper{text-align:center;flex:1}.mode-selection-title{font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);margin:0 0 var(--spacing-sm) 0;text-shadow:0 4px 12px rgba(0,0,0,.15);letter-spacing:-.02em;color:#fff;line-height:1.2}.mode-selection-subtitle{font-size:var(--font-size-lg);color:#ffffffe6;font-weight:var(--font-weight-medium);text-shadow:0 2px 4px rgba(0,0,0,.1)}.dev-name{font-weight:var(--font-weight-extrabold);background:linear-gradient(135deg,#fbbf24,#f59e0b,#ea580c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;display:inline-block;filter:drop-shadow(0 0 8px rgba(245,158,11,.5));text-decoration:none;cursor:pointer;transition:transform .2s ease}.dev-name:hover{transform:translateY(-2px)}.mode-selection-main{flex:1;padding:var(--spacing-lg);max-width:var(--max-width-lg);margin:0 auto;width:100%;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-2xl)}.mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--spacing-2xl);width:100%;padding:0}.mode-card{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);cursor:pointer;transition:all var(--transition-medium);box-shadow:var(--shadow-xl);border:2px solid transparent;position:relative;overflow:hidden;animation:fadeInUp .6s ease-out both}.mode-card:nth-child(1){animation-delay:.1s}.mode-card:nth-child(2){animation-delay:.2s}.mode-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,color-mix(in srgb,var(--color-primary) 5%,transparent) 100%);opacity:0;transition:opacity var(--transition-medium);pointer-events:none}.mode-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:var(--shadow-2xl);border-color:var(--color-primary)}.mode-card:hover:before{opacity:1}.mode-card:active{transform:translateY(-4px) scale(1)}.mode-card-icon{font-size:5rem;margin-bottom:var(--spacing-lg);display:flex;align-items:center;justify-content:center;transition:transform var(--transition-medium);line-height:1}.mode-card:hover .mode-card-icon{transform:scale(1.05) translateY(-4px)}.mode-card-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0;text-align:center}.mode-card-description{font-size:var(--font-size-base);color:var(--color-text-secondary);margin-bottom:var(--spacing-lg);text-align:center;font-weight:var(--font-weight-medium)}.mode-card-features{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.mode-feature-item{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-lg);font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:var(--font-weight-semibold);text-align:center;border:1px solid var(--color-border);transition:all var(--transition-base)}.mode-card:hover .mode-feature-item{background:var(--color-bg-tertiary);border-color:var(--color-primary-ultra-light)}.mode-card-cta{padding:var(--spacing-md) var(--spacing-lg);background:var(--gradient-purple-blue);border-radius:var(--radius-xl);color:#fff;font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);text-align:center;box-shadow:var(--shadow-md);transition:all var(--transition-base);position:relative;overflow:hidden}.mode-card-cta:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.mode-card:hover .mode-card-cta{transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.mode-card:hover .mode-card-cta:before{left:100%}.app-promotion-card{width:100%;max-width:100%;margin:0;background:linear-gradient(135deg,#fffffff2,#ffffffe6);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:2px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:var(--radius-2xl);padding:var(--spacing-2xl) var(--spacing-3xl);cursor:pointer;transition:all var(--transition-medium);box-shadow:var(--shadow-xl);position:relative;overflow:hidden;animation:fadeInUp .6s ease-out .3s both}.app-promotion-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-accent-purple) 5%,transparent));opacity:0;transition:opacity var(--transition-medium)}.app-promotion-arrow{display:none}@media(max-width:768px){.app-promotion-card{padding:var(--spacing-lg)}.app-promotion-content{grid-template-columns:1fr;gap:var(--spacing-md);text-align:center}.app-promotion-text{text-align:center}.app-promotion-icons{justify-content:center}.app-promotion-arrow{display:none}.app-icon{width:50px;height:50px}.star,.rating-number{font-size:var(--font-size-base)}}@media(max-width:480px){.app-promotion-title{font-size:var(--font-size-lg)}.app-promotion-subtitle{font-size:var(--font-size-xs)}.app-icon{width:40px;height:40px;font-size:var(--font-size-lg)}.app-promotion-icons{gap:var(--spacing-sm)}.star,.rating-number{font-size:var(--font-size-sm)}}.mode-selection-note{color:#ffffffe6;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);text-shadow:0 2px 4px rgba(0,0,0,.1);text-align:center;padding:var(--spacing-md) var(--spacing-lg);background:#ffffff1a;border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);animation:fadeIn .6s ease-out .4s both}.mode-selection-footer{position:relative;z-index:10;margin-top:var(--spacing-3xl);padding:var(--spacing-2xl) var(--spacing-lg);background:#ffffff1a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.2);animation:fadeInUp .6s ease-out .5s both}.mode-selection-footer .footer-content{max-width:var(--max-width-lg);margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--spacing-2xl)}.mode-selection-footer .footer-brand{text-align:left}.mode-selection-footer .footer-logo{display:inline-flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-xs)}.mode-selection-footer .footer-logo-icon{font-size:var(--font-size-2xl);line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.mode-selection-footer .footer-logo-text{font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.15)}.mode-selection-footer .footer-tagline{color:#ffffffbf;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);margin:0;text-shadow:0 1px 2px rgba(0,0,0,.1)}.mode-selection-footer .footer-links{display:flex;flex-direction:column;gap:var(--spacing-xs);align-items:center}.mode-selection-footer .footer-link{color:#ffffffe6;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);text-decoration:none;padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-lg);background:#ffffff1a;border:1px solid rgba(255,255,255,.2);transition:all var(--transition-base);display:inline-flex;align-items:center;gap:var(--spacing-xs);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-shadow:0 1px 2px rgba(0,0,0,.1);white-space:nowrap}.mode-selection-footer .footer-link:hover{background:#fff3;border-color:#fff6;transform:translateY(-2px);box-shadow:0 4px 12px #00000026;color:#fff}.mode-selection-footer .footer-link:active{transform:translateY(0)}.mode-selection-footer .footer-copyright{text-align:right}.mode-selection-footer .footer-copyright-text{color:#ffffffb3;font-size:var(--font-size-xs);margin:0 0 var(--spacing-xs) 0;font-weight:var(--font-weight-medium)}.mode-selection-footer .footer-made-with{color:#fff9;font-size:var(--font-size-xs);margin:0;font-weight:var(--font-weight-medium)}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.mode-selection-title{font-size:var(--font-size-3xl)}.mode-selection-subtitle{font-size:var(--font-size-base)}.mode-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.mode-card-icon{font-size:4rem}.mode-card-title{font-size:var(--font-size-2xl)}.mode-card-features{grid-template-columns:1fr}.mode-card:hover{transform:translateY(-4px) scale(1.01)}.mode-card:hover .mode-card-icon{transform:scale(1.03) translateY(-2px)}.mode-selection-footer{padding:var(--spacing-lg) var(--spacing-md)}.footer-content{grid-template-columns:1fr;gap:var(--spacing-lg);text-align:center}.footer-brand{text-align:center}.footer-links{align-items:center}.footer-copyright{text-align:center}}@media(max-width:480px){.mode-selection-title{font-size:var(--font-size-2xl)}.mode-card{padding:var(--spacing-lg)}.mode-card-icon{font-size:3.5rem}.footer-logo-text,.footer-logo-icon{font-size:var(--font-size-xl)}.footer-link{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm)}}[data-theme=dark] .mode-card{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .mode-card:before{background:linear-gradient(135deg,transparent 0%,color-mix(in srgb,var(--color-primary) 10%,transparent) 100%)}[data-theme=dark] .mode-card:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary)}[data-theme=dark] .mode-card-title{color:var(--color-text)}[data-theme=dark] .mode-card-description{color:var(--color-text-secondary)}[data-theme=dark] .mode-feature-item{background:var(--color-bg-secondary);border-color:var(--color-border);color:var(--color-text-secondary)}[data-theme=dark] .mode-card:hover .mode-feature-item{background:var(--color-bg-tertiary);border-color:var(--color-primary)}[data-theme=dark] .mode-selection-title{background:linear-gradient(135deg,#fff,#e0e7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=dark] .mode-selection-note{background:#ffffff0d;border-color:#ffffff1a;color:var(--color-text-secondary)}[data-theme=dark] .footer-divider{background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.2) 50%,transparent 100%)}[data-theme=dark] .mode-selection-footer{background:#0003;border-top-color:#ffffff1a}[data-theme=dark] .footer-link{background:#ffffff0d;border-color:#ffffff1a;color:#fffc}[data-theme=dark] .footer-link:hover{background:#ffffff1a;border-color:color-mix(in srgb,var(--color-primary) 50%,transparent);color:#fff}.mode-card:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;transform:translateY(-4px)}.footer-link:focus-visible{outline:2px solid white;outline-offset:2px}@media(prefers-reduced-motion:reduce){.mode-card,.mode-card-icon,.mode-card-cta,.footer-link{animation:none;transition:none}.mode-card:hover,.mode-card:hover .mode-card-icon,.mode-card:hover .mode-card-cta,.footer-link:hover{transform:none}}.footer-link:focus-visible{outline:2px solid white;outline-offset:2px;box-shadow:0 0 0 4px #fff3}.feature-card{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-xl);transition:all var(--transition-medium);cursor:pointer;border:none;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);position:relative;overflow:hidden;isolation:isolate;background-color:#fff;opacity:1}.feature-card:before{content:none}.feature-card:hover{transform:translateY(-8px) scale(1.01);box-shadow:var(--shadow-2xl);background-color:#fff!important}.feature-card:active{transform:translateY(-4px) scale(.99);transition:transform var(--transition-fast);background-color:#fff!important}.feature-icon{font-size:5rem;line-height:1;filter:drop-shadow(0 8px 16px rgba(0,0,0,.1));transition:transform var(--transition-medium),filter var(--transition-medium);position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center}.feature-card:hover .feature-icon{will-change:transform,filter;transform:scale(1.05) translateY(-4px);filter:drop-shadow(0 12px 24px rgba(0,0,0,.15))}.feature-card:active .feature-icon{transform:scale(1.02) translateY(-2px)}.feature-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;transition:color var(--transition-base);letter-spacing:-.01em;position:relative;z-index:1}.feature-card:hover .feature-title{color:var(--color-primary)}[data-theme=dark] .feature-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));opacity:0;transition:opacity var(--transition-medium);z-index:-1}[data-theme=dark] .feature-card:hover:before{opacity:1}[data-theme=dark] .feature-card:hover{background:var(--color-bg-tertiary)!important;border-color:var(--color-primary);box-shadow:var(--shadow-2xl),0 0 0 1px color-mix(in srgb,var(--color-primary) 10%,transparent),0 30px 60px -15px color-mix(in srgb,var(--color-primary) 30%,transparent)}[data-theme=dark] .feature-card:active{background-color:var(--color-bg-tertiary)!important}[data-theme=dark] .feature-icon{filter:drop-shadow(0 8px 16px color-mix(in srgb,var(--color-primary) 20%,transparent))}[data-theme=dark] .feature-card:hover .feature-icon{will-change:transform,filter;filter:drop-shadow(0 12px 24px color-mix(in srgb,var(--color-primary) 40%,transparent))}@media(max-width:768px){.feature-card{padding:var(--spacing-lg);gap:var(--spacing-md)}.feature-icon{font-size:4rem}.feature-title{font-size:var(--font-size-lg)}.feature-card:hover{transform:translateY(-4px) scale(1.005)}.feature-card:hover .feature-icon{transform:scale(1.03) translateY(-2px)}.stats-content{padding:.5rem .75rem;gap:.375rem}.stats-item{gap:.25rem}.stats-icon,.stats-value{font-size:.75rem}.stats-time .stats-value{font-size:.6875rem}.stats-divider{height:.875rem}.stats-reset-btn{width:1.75rem;height:1.75rem;font-size:.95rem}}@media(max-width:480px){.feature-card{padding:var(--spacing-lg)}.feature-icon{font-size:3.5rem}.feature-title{font-size:var(--font-size-base)}}.feature-stats-overlay{position:absolute;top:0;left:0;right:0;opacity:0;visibility:hidden;transform:translateY(-8px);transition:all var(--transition-medium);z-index:10;pointer-events:none}.feature-card:hover .feature-stats-overlay,.feature-card:focus-visible .feature-stats-overlay{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.feature-card[role=button]:hover .feature-stats-overlay,.feature-card[role=button]:focus-visible .feature-stats-overlay{pointer-events:auto!important}.stats-content{display:flex;align-items:center;justify-content:space-between;gap:.5rem;background:#fffffffa;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;padding:.625rem 1rem;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d;border-bottom:1px solid rgba(0,0,0,.08)}.stats-item{display:flex;align-items:center;gap:.375rem;flex-shrink:0}.stats-item.stats-time{flex-shrink:1;min-width:0}.stats-icon{font-size:.875rem;line-height:1}.stats-value{font-weight:700;color:#111827;font-size:.8125rem;white-space:nowrap}.stats-time .stats-value{font-weight:600;color:#6b7280;font-size:.75rem;overflow:hidden;text-overflow:ellipsis}.stats-divider{width:1px;height:1rem;background:#0000001a;flex-shrink:0}.stats-reset-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;background:linear-gradient(135deg,var(--color-primary-light) 0%,var(--color-primary) 100%);color:#fff;border:none;border-radius:var(--radius-md);font-size:1.1rem;cursor:pointer;transition:all var(--transition-base);box-shadow:0 1px 3px #0000001a;flex-shrink:0}.feature-card[role=button] .stats-reset-btn,.feature-card[role=button] .stats-content,.feature-card[role=button] .stats-content *{pointer-events:auto!important}.stats-reset-btn:hover{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);box-shadow:0 2px 4px #00000026;transform:scale(1.05)}.stats-reset-btn:active{transform:scale(.95);box-shadow:0 1px 2px #0000001a}[data-theme=dark] .stats-content{background:#1f2937fa;border-bottom-color:#ffffff1a;box-shadow:0 2px 8px #0006,0 0 0 1px #ffffff0d}[data-theme=dark] .stats-value{color:#f9fafb}[data-theme=dark] .stats-time .stats-value{color:#9ca3af}[data-theme=dark] .stats-divider{background:#ffffff26}[data-theme=dark] .stats-reset-btn{background:linear-gradient(135deg,var(--color-primary-dark) 0%,var(--color-primary) 100%);box-shadow:0 1px 3px #0000004d}[data-theme=dark] .stats-reset-btn:hover{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-light) 100%);box-shadow:0 2px 4px #0006}.feature-card:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;transform:translateY(-4px)}@media(prefers-reduced-motion:reduce){.feature-card,.feature-icon,.feature-title,.feature-stats-overlay{transition:none;animation:none}.feature-card:hover,.feature-card:hover .feature-icon,.feature-card:hover .feature-stats-overlay{transform:none}}.dialog-overlay{position:fixed;inset:0;background-color:#0f172a99;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-lg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn var(--transition-medium)}.dialog-content{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);max-width:500px;width:100%;box-shadow:var(--shadow-2xl);animation:dialogSlideUp var(--transition-medium) cubic-bezier(.34,1.56,.64,1);max-height:90vh;overflow-y:auto;border:1px solid color-mix(in srgb,var(--color-primary) 10%,transparent)}@keyframes dialogSlideUp{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0;letter-spacing:-.01em;background:var(--gradient-purple-blue);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.dialog-message{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-lg)}.dialog-actions{display:flex;gap:var(--spacing-md);justify-content:flex-end}.dialog-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);border-radius:var(--radius-xl);min-width:120px;transition:all var(--transition-base);box-shadow:var(--shadow-sm);border:2px solid transparent}.dialog-button-cancel{background:linear-gradient(135deg,var(--color-bg-tertiary) 0%,var(--color-bg-secondary) 100%);color:var(--color-text);border-color:var(--color-border)}.dialog-button-cancel:hover{background:linear-gradient(135deg,var(--color-border-medium) 0%,var(--color-bg-tertiary) 100%);border-color:var(--color-border-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.dialog-button-confirm,.dialog-button-primary{background:var(--gradient-purple-blue);color:#fff}.dialog-button-confirm:hover,.dialog-button-primary:hover{background:linear-gradient(135deg,var(--color-primary-light) 0%,var(--color-primary-dark) 100%);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.hint-content{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));border-left:4px solid var(--color-primary);padding:var(--spacing-lg);border-radius:var(--radius-xl);margin-bottom:var(--spacing-lg);box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.hint-content:before{position:absolute;top:var(--spacing-md);right:var(--spacing-md);font-size:var(--font-size-3xl);opacity:.1;animation:pulse 2s ease-in-out infinite}.hint-text{font-size:var(--font-size-base);color:var(--color-text);line-height:var(--line-height-relaxed);margin:0;font-weight:var(--font-weight-medium);white-space:pre-line}@media(max-width:768px){.dialog-overlay{padding:var(--spacing-md)}.dialog-content{padding:var(--spacing-lg);border-radius:var(--radius-xl)}.dialog-title{font-size:var(--font-size-xl)}.dialog-actions{flex-direction:column-reverse;gap:var(--spacing-sm)}.dialog-button{width:100%;min-width:unset}.hint-content{padding:var(--spacing-lg)}}@media(max-width:480px){.dialog-content{padding:var(--spacing-lg)}.dialog-title{font-size:var(--font-size-lg)}.dialog-message{font-size:var(--font-size-sm)}}.dialog-content::-webkit-scrollbar{width:6px}.dialog-content::-webkit-scrollbar-track{background:var(--color-bg-secondary);border-radius:var(--radius-full);transition:none!important}.dialog-content::-webkit-scrollbar-thumb{background:var(--color-primary-light);border-radius:var(--radius-full);transition:none!important}.dialog-content::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.home-screen{min-height:100vh;background:var(--gradient-primary);display:flex;flex-direction:column;position:relative;overflow-x:hidden}.home-header{padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-md);position:relative;z-index:10;animation:fadeInDown .6s ease-out}.home-header-top{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width-lg);margin:0 auto var(--spacing-md);gap:var(--spacing-md)}.change-mode-button{width:70px;height:36px;background:#fff3;border:2px solid rgba(255,255,255,.3);border-radius:var(--radius-full);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base);font-size:1.25rem;display:flex;align-items:center;justify-content:center;gap:2px;flex-shrink:0}.home-screen{min-height:100vh;display:flex;flex-direction:column;background:var(--gradient-primary);position:relative;overflow:hidden}.home-screen:before{content:"";position:absolute;top:-50%;right:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%);border-radius:50%;animation:float 20s ease-in-out infinite}.home-screen:after{content:"";position:absolute;bottom:-30%;left:-10%;width:500px;height:500px;background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 70%);border-radius:50%;animation:float 25s ease-in-out infinite reverse}.home-header{padding:var(--spacing-3xl) var(--spacing-lg) var(--spacing-2xl);text-align:center;color:#fff;position:relative;z-index:2;animation:fadeInUp .8s ease-out}.home-header-top{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width-lg);margin:0 auto var(--spacing-lg);gap:var(--spacing-md)}.change-mode-button{width:70px;height:36px;background:#fff3;border:2px solid rgba(255,255,255,.3);border-radius:var(--radius-full);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base);font-size:1.25rem;display:flex;align-items:center;justify-content:center;gap:2px;flex-shrink:0;color:#fff}.change-mode-button:hover{background:#ffffff4d;transform:scale(1.05);box-shadow:0 4px 12px #00000026}.change-mode-button:active{transform:scale(.98)}.home-title{font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);margin:0;text-shadow:0 4px 12px rgba(0,0,0,.15);letter-spacing:-.02em;color:#fff;line-height:1.4;flex:1;text-align:center}.mode-info-badge{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-full);color:#fff;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);max-width:var(--max-width-lg);margin:0 auto;box-shadow:0 4px 12px #0000001a;animation:fadeIn .6s ease-out .2s both}.mode-info-badge span{white-space:nowrap}[data-theme=dark] .home-title{background:linear-gradient(135deg,#fff,#e0e7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@media(max-width:1024px){.feature-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg)}}@media(max-width:768px){.home-screen:before,.home-screen:after{width:400px;height:400px}.home-header{padding:var(--spacing-2xl) var(--spacing-md) var(--spacing-lg)}.home-header-top{margin-bottom:var(--spacing-md)}.home-title{font-size:var(--font-size-4xl)}.home-main{padding:var(--spacing-md)}.feature-grid{grid-template-columns:1fr;gap:var(--spacing-md);padding:0}.mode-info-badge{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-md);gap:var(--spacing-xs)}.change-mode-button{width:60px;height:32px;font-size:1rem}}@media(max-width:480px){.home-header-top{gap:var(--spacing-sm)}.home-title{font-size:var(--font-size-3xl)}.feature-grid{gap:var(--spacing-sm)}.change-mode-button{width:50px;height:30px;font-size:.875rem}}.home-main{flex:1;padding:var(--spacing-lg);max-width:var(--max-width-lg);margin:0 auto;width:100%;position:relative;z-index:2}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-lg);padding:var(--spacing-md)}.feature-grid>*:nth-child(1){animation:fadeInUp .6s ease-out .1s both}.feature-grid>*:nth-child(2){animation:fadeInUp .6s ease-out .2s both}.feature-grid>*:nth-child(3){animation:fadeInUp .6s ease-out .3s both}.feature-grid>*:nth-child(4){animation:fadeInUp .6s ease-out .4s both}.feature-grid>*:nth-child(5){animation:fadeInUp .6s ease-out .5s both}.feature-grid>*:nth-child(6){animation:fadeInUp .6s ease-out .6s both}.feature-grid>*:nth-child(7){animation:fadeInUp .6s ease-out .7s both}.feature-grid>*:nth-child(8){animation:fadeInUp .6s ease-out .8s both}.feature-grid>*:nth-child(9){animation:fadeInUp .6s ease-out .9s both}.feature-grid>*:nth-child(10){animation:fadeInUp .6s ease-out 1s both}.feature-grid>*:nth-child(11){animation:fadeInUp .6s ease-out 1.1s both}.feature-grid>*:nth-child(12){animation:fadeInUp .6s ease-out 1.2s both}.feature-grid>*:nth-child(13){animation:fadeInUp .6s ease-out 1.3s both}.feature-grid>*:nth-child(14){animation:fadeInUp .6s ease-out 1.4s both}@media(max-width:768px){.home-title{font-size:var(--font-size-3xl)}.feature-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.mode-info-badge{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-md);gap:var(--spacing-xs)}.change-mode-button{width:60px;height:32px;font-size:1rem}}@media(max-width:480px){.home-header-top{gap:var(--spacing-sm)}.home-title{font-size:var(--font-size-2xl)}}[data-theme=dark] .change-mode-button{background:#ffffff26;border-color:#ffffff40}[data-theme=dark] .change-mode-button:hover{background:#ffffff40}[data-theme=dark] .mode-info-badge{background:#ffffff1a;border-color:#fff3}.progress-bar-container{background-color:#fff3;height:8px;border-radius:var(--radius-full);overflow:hidden;margin-top:var(--spacing-md);position:relative;box-shadow:inset 0 2px 4px #0000001a}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#10b981,#34d399,#6ee7b7);background-size:200% 100%;transition:width .8s cubic-bezier(.4,0,.2,1);border-radius:var(--radius-full);position:relative;animation:shimmerProgress 4s linear infinite;box-shadow:0 0 10px #10b98180}@keyframes shimmerProgress{0%{background-position:200% 0}to{background-position:-200% 0}}.progress-bar-fill:after{content:"";position:absolute;top:0;right:0;width:20px;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.8));filter:blur(4px)}.progress-bar-fill[style*="width: 9"],.progress-bar-fill[style*="width: 100"]{animation:shimmerProgress 4s linear infinite,pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 10px #10b98180}50%{box-shadow:0 0 20px #10b981cc}}.pagination-container{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-sm);box-shadow:var(--shadow-lg);animation:fadeInScale .5s ease-out}.pagination-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-xs)}.pagination-item{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);border-radius:var(--radius-lg);transition:all var(--transition-base);background-color:var(--color-bg-tertiary);color:var(--color-text);border:2px solid transparent;cursor:pointer;padding:0;min-height:44px;max-height:50px;position:relative;overflow:hidden;transform:translateZ(0);backface-visibility:hidden;-webkit-font-smoothing:antialiased;contain:layout paint}.crucial-indicator{position:absolute;top:2px;right:2px;font-size:.7em;line-height:1;z-index:2;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));animation:starPulse 2s ease-in-out infinite;transform:translateZ(0);will-change:transform}.pagination-item:hover .crucial-indicator{animation-play-state:paused;transform:scale(1) translateZ(0);filter:none}@keyframes starPulse{0%,to{transform:scale(1) translateZ(0);opacity:1}50%{transform:scale(1.15) translateZ(0);opacity:.9}}.question-number{position:relative;z-index:1;display:inline-block;transform:translateZ(0);backface-visibility:hidden;-webkit-font-smoothing:antialiased}.pagination-item:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);transition:width .6s,height .6s}.pagination-item:active:before{width:100px;height:100px}.pagination-item:hover:not(.current){background-color:var(--color-primary-light);color:#fff;transform:scale(1.1) translateY(-2px) translateZ(0);box-shadow:var(--shadow-md)}.pagination-item:active{transform:scale(.95) translateZ(0)}.pagination-item.answered-pending{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;border-color:#f59e0b;box-shadow:0 4px 12px #fbbf244d}.pagination-item.answered-pending:hover{transform:scale(1.08) translateY(-2px) translateZ(0);box-shadow:0 6px 16px #fbbf2466}.pagination-item.answered{background:var(--gradient-success);color:#fff;border-color:var(--color-success);box-shadow:0 4px 12px #10b9814d}.pagination-item.answered:hover{transform:scale(1.08) translateY(-2px) translateZ(0);box-shadow:0 6px 16px #10b98166}.pagination-item.current{background:var(--gradient-purple-blue);color:#fff;border-color:var(--color-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 20%,transparent),var(--shadow-md);animation:pulseRing 2s ease-in-out infinite;transform:scale(1.05) translateZ(0)}@keyframes pulseRing{0%,to{box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 20%,transparent),var(--shadow-md)}50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--color-primary) 10%,transparent),var(--shadow-lg)}}.pagination-item.current:hover{transform:scale(1.08) translateZ(0)}.pagination-item.incorrect{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-color:var(--color-error);box-shadow:0 4px 12px #ef44444d}.pagination-item.incorrect:hover{transform:scale(1.08) translateY(-2px) translateZ(0);box-shadow:0 6px 16px #ef444466}@media(min-width:1201px){.pagination-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:1200px)and (min-width:901px){.pagination-container{padding:var(--spacing-lg)}.pagination-grid{grid-template-columns:repeat(auto-fill,minmax(60px,65px));gap:var(--spacing-sm);justify-content:start}.pagination-item{min-height:60px;max-height:65px;width:100%}}@media(max-width:900px)and (min-width:769px){.pagination-grid{grid-template-columns:repeat(auto-fill,minmax(55px,60px));gap:var(--spacing-sm);justify-content:start}.pagination-item{min-height:55px;max-height:60px;font-size:var(--font-size-xs)}.crucial-indicator{font-size:.65em;top:1px;right:1px}}@media(max-width:768px){.pagination-container{padding:var(--spacing-md)}.pagination-grid{grid-template-columns:repeat(auto-fill,minmax(48px,52px));gap:var(--spacing-xs);justify-content:start}.pagination-item{min-height:48px;max-height:52px;font-size:var(--font-size-xs)}.crucial-indicator{font-size:.6em}}@media(max-width:480px){.pagination-container{padding:var(--spacing-sm)}.pagination-grid{grid-template-columns:repeat(auto-fill,minmax(42px,46px));gap:6px}.pagination-item{min-height:42px;max-height:46px;font-size:.75rem;border-radius:var(--radius-md)}.crucial-indicator{font-size:.55em;top:1px;right:1px}}@media(max-width:360px){.pagination-grid{grid-template-columns:repeat(auto-fill,minmax(38px,42px));gap:4px}.pagination-item{min-height:38px;max-height:42px;font-size:.7rem}.crucial-indicator{font-size:.5em}}.pagination-item:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}.quiz-statistics{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:color-mix(in srgb,var(--color-primary) 10%,transparent);border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:8px}.stat-box{flex:1;min-width:0;padding:.4rem .5rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:6px;cursor:pointer;transition:all .2s ease;font-size:1rem;font-weight:700;text-align:center;color:var(--color-text-secondary)}.stat-box:hover{transform:translateY(-1px);box-shadow:0 2px 6px #0000001a}.stat-box.active{transform:translateY(-2px);box-shadow:0 3px 8px #00000026}.stat-unanswered{color:#6b7280;border-color:#9ca3af}.stat-unanswered:hover{background:#9ca3af1a;border-color:#6b7280}.stat-unanswered.active{background:#6b728033;border-color:#6b7280;color:#5e6570}.stat-correct{color:#10b981;border-color:#34d399}.stat-correct:hover{background:#10b9811a;border-color:#10b981}.stat-correct.active{background:#10b98133;border-color:#10b981;color:#059669}.stat-incorrect{color:#ef4444;border-color:#f87171}.stat-incorrect:hover{background:#ef44441a;border-color:#ef4444}.stat-incorrect.active{background:#ef444433;border-color:#ef4444;color:#dc2626}.stat-clear-btn{flex-shrink:0;width:2rem;height:2rem;padding:0;background:#ef4444;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;font-size:1rem;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center}.stat-clear-btn:hover{background:#dc2626;transform:scale(1.1)}.stat-clear-btn:active{transform:scale(1)}[data-theme=dark] .quiz-statistics{background:color-mix(in srgb,var(--color-primary) 15%,transparent);border-color:color-mix(in srgb,var(--color-primary) 30%,transparent)}@media(max-width:768px){.quiz-statistics{padding:.4rem;gap:.4rem}.stat-box{padding:.35rem .4rem;font-size:.9rem}.stat-clear-btn{width:1.75rem;height:1.75rem;font-size:.9rem}}@media(max-width:480px){.quiz-statistics{padding:.35rem;gap:.35rem}.stat-box{padding:.3rem .35rem;font-size:.85rem}.stat-clear-btn{width:1.5rem;height:1.5rem;font-size:.85rem}}.lightbox-overlay{position:fixed;inset:0;width:100vw;height:100vh;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 15%,transparent),color-mix(in srgb,var(--color-secondary) 15%,transparent)),#000000f2;backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);display:flex;align-items:center;justify-content:center;z-index:999999;animation:lightbox-fade-in .25s cubic-bezier(.4,0,.2,1);opacity:0}.lightbox-overlay.loaded{opacity:1}@keyframes lightbox-fade-in{0%{opacity:0;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px)}to{opacity:1;backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px)}}.lightbox-close-button{position:fixed;top:20px;right:20px;width:40px;height:40px;border-radius:var(--radius-lg, 12px);background:color-mix(in srgb,var(--color-primary) 90%,transparent);border:none;color:#fff;font-size:20px;font-weight:400;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1000002;transition:all .2s ease;box-shadow:0 2px 8px #0003}.lightbox-close-button:hover{background:color-mix(in srgb,var(--color-primary-dark) 95%,transparent);transform:scale(1.05)}.lightbox-close-button:active{transform:scale(.98)}.lightbox-controls{position:fixed;left:50%;top:20px;transform:translate(-50%);display:flex;gap:8px;z-index:1000002;opacity:0;animation:fade-in .3s ease .1s forwards}@keyframes fade-in{to{opacity:1}}.lightbox-control-btn{width:40px;height:40px;border-radius:var(--radius-lg, 10px);background:color-mix(in srgb,var(--color-primary) 90%,transparent);border:none;color:#fff;font-size:20px;font-weight:400;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0003;line-height:1}.lightbox-control-btn:hover:not(:disabled){background:color-mix(in srgb,var(--color-primary-dark) 95%,transparent);transform:scale(1.05)}.lightbox-control-btn:active:not(:disabled){transform:scale(.98)}.lightbox-control-btn:disabled{opacity:.3;cursor:not-allowed}.lightbox-content{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:100px 60px 140px}.lightbox-image{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;-webkit-user-select:none;user-select:none;transition:opacity .3s ease-out;transform-origin:center center;display:block;border-radius:var(--radius-lg, 12px);box-shadow:0 8px 32px #00000080,0 16px 64px #0000004d}.lightbox-image:not(.dragging){transition:transform .15s cubic-bezier(.4,0,.2,1),opacity .3s ease-out}.lightbox-image.dragging{transition:opacity .3s ease-out}.lightbox-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.loading-spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.1);border-top-color:color-mix(in srgb,var(--color-primary) 80%,transparent);border-radius:50%;animation:spinner-rotate .8s linear infinite}@keyframes spinner-rotate{to{transform:rotate(360deg)}}.lightbox-zoom-indicator{position:fixed;bottom:24px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;background:color-mix(in srgb,var(--color-primary) 90%,transparent);color:#fff;padding:10px 18px;border-radius:var(--radius-lg, 12px);z-index:1000002;box-shadow:0 2px 8px #0003;border:none;pointer-events:none;opacity:0;animation:fade-in .3s ease .15s forwards}.zoom-percentage{font-size:16px;font-weight:600;letter-spacing:.3px}.zoom-hint{font-size:11px;font-weight:400;opacity:.85;letter-spacing:.2px}@media(max-width:768px){.lightbox-close-button{top:16px;right:16px;width:44px;height:44px;font-size:22px}.lightbox-controls{top:16px;gap:8px}.lightbox-control-btn{width:42px;height:42px;font-size:20px}.lightbox-content{padding:80px 20px 120px}.lightbox-zoom-indicator{bottom:24px;padding:12px 20px}.zoom-percentage{font-size:16px}.zoom-hint{font-size:11px}}@media(max-width:480px){.lightbox-close-button{width:40px;height:40px;font-size:20px}.lightbox-control-btn{width:38px;height:38px;font-size:18px}.lightbox-content{padding:70px 16px 100px}.lightbox-zoom-indicator{bottom:20px;padding:10px 16px;gap:4px}.zoom-percentage{font-size:14px}.zoom-hint{font-size:10px}}@media(prefers-reduced-motion:reduce){.lightbox-overlay,.lightbox-close-button,.lightbox-control-btn,.lightbox-image,.lightbox-controls,.lightbox-zoom-indicator{animation:none;transition:none}}.question-item{display:flex;flex-direction:column;gap:var(--spacing-lg);animation:fadeIn .5s ease-out}.question-text-container{margin-bottom:var(--spacing-sm)}.question-text{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);line-height:var(--line-height-relaxed);cursor:pointer;padding:var(--spacing-lg);border-radius:var(--radius-xl);transition:all var(--transition-base);background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);border:2px solid transparent}.question-text:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));border-color:var(--color-primary-ultra-light);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.question-text.crucial-question{background:linear-gradient(135deg,#ffc10714,#ff98000d);border:2px solid rgba(255,193,7,.25);border-left:4px solid #ffc107}.question-text.crucial-question:hover{background:linear-gradient(135deg,#ffc1071f,#ff980014);border-color:#ffc10766;border-left-color:#ffa000}@keyframes crucialPulse{0%,to{transform:scale(1);box-shadow:0 2px 8px #ff98004d}50%{transform:scale(1.02);box-shadow:0 3px 12px #ff980066}}.question-image-container{margin:0 0 var(--spacing-sm) 0;border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-xl);position:relative;animation:fadeInScale .6s ease-out .2s both}.question-image-container:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.05) 100%);z-index:1;pointer-events:none}.question-image{width:100%;max-height:min(40vh,400px);object-fit:contain;display:block;transition:transform var(--transition-slow);background:var(--color-bg-secondary)}@media(max-width:1200px){.question-image{max-height:min(38vh,350px)}}@media(max-width:900px){.question-image{max-height:min(35vh,300px)}}@media(max-width:600px){.question-image{max-height:min(40vh,280px)}}.question-image-container:hover .question-image{transform:scale(1.02)}.image-zoom-button{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:var(--radius-lg, 10px);background:color-mix(in srgb,var(--color-primary) 90%,transparent);border:none;color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:all .2s ease;opacity:0;box-shadow:0 2px 6px #00000026}.question-image-container:hover .image-zoom-button{opacity:1}.image-zoom-button:hover{background:color-mix(in srgb,var(--color-primary-dark) 95%,transparent);transform:scale(1.05)}.image-zoom-button:active{transform:scale(.98)}@media(max-width:768px){.image-zoom-button{width:42px;height:42px;font-size:18px}}.choices-container{display:flex;flex-direction:column;gap:var(--spacing-md)}.choice-button{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg) var(--spacing-lg);background-color:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-xl);text-align:left;font-size:var(--font-size-base);color:var(--color-text);cursor:pointer;transition:all var(--transition-base);width:100%;position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}.choice-button:before{content:"";position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,color-mix(in srgb,var(--color-primary) 10%,transparent) 0%,transparent 100%);transition:width var(--transition-medium);z-index:0}.choice-button:hover:not(:disabled):before{width:100%}.choice-button:hover:not(:disabled){border-color:var(--color-primary);transform:translate(8px);box-shadow:var(--shadow-md);background-color:var(--color-bg)}.choice-button:disabled{cursor:default;opacity:1}.choice-button.selected{border-color:var(--color-primary);background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 8%,transparent),color-mix(in srgb,var(--color-primary) 12%,transparent));box-shadow:var(--shadow-md),0 0 0 3px color-mix(in srgb,var(--color-primary) 10%,transparent)}.choice-button.correct{border-color:var(--color-success);background:linear-gradient(135deg,#10b98114,#10b9811f);box-shadow:var(--shadow-md),0 0 0 3px #10b9811a;animation:successPulse .6s ease-out}.choice-button.incorrect{border-color:var(--color-error);background:linear-gradient(135deg,#ef444414,#ef44441f);box-shadow:var(--shadow-md),0 0 0 3px #ef44441a;animation:shake .5s ease-out}.choice-radio{flex-shrink:0;width:28px;height:28px;border:3px solid var(--color-border);border-radius:50%;position:relative;transition:all var(--transition-base);z-index:1;background:#fff}.choice-button:hover:not(:disabled) .choice-radio{border-color:var(--color-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 10%,transparent)}.choice-button.selected .choice-radio{border-color:var(--color-primary);background:var(--gradient-purple-blue);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 15%,transparent)}.choice-button.correct .choice-radio{border-color:var(--color-success);background:var(--gradient-success);box-shadow:0 0 0 4px #10b98126}.choice-button.incorrect .choice-radio{border-color:var(--color-error);background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 0 0 4px #ef444426}.choice-radio-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:10px;height:10px;background-color:#fff;border-radius:50%;transition:transform var(--transition-bounce)}.choice-button.selected .choice-radio-inner,.choice-button.correct .choice-radio-inner,.choice-button.incorrect .choice-radio-inner{transform:translate(-50%,-50%) scale(1)}.choice-text{flex:1;line-height:var(--line-height-relaxed);z-index:1;font-weight:var(--font-weight-medium)}.choice-indicator{flex-shrink:0;font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);z-index:1;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);background:#ffffffe6}.choices-container>*:nth-child(1){animation:slideInRight .4s ease-out .1s both}.choices-container>*:nth-child(2){animation:slideInRight .4s ease-out .2s both}.choices-container>*:nth-child(3){animation:slideInRight .4s ease-out .3s both}.choices-container>*:nth-child(4){animation:slideInRight .4s ease-out .4s both}@media(max-width:768px){.question-text{font-size:var(--font-size-lg);padding:var(--spacing-md)}.crucial-badge{font-size:.65rem;padding:3px 8px;margin-bottom:1px}.crucial-badge:after{font-size:.8em}.choice-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-sm)}.choice-button:hover:not(:disabled){transform:translate(4px)}.choice-radio{width:24px;height:24px;border-width:2px}.choice-radio-inner{width:8px;height:8px}}@media(max-width:480px){.question-text{font-size:var(--font-size-base)}.crucial-badge{font-size:.6rem;padding:2px 6px;margin-right:4px;margin-bottom:1px}.crucial-badge:after{font-size:.75em}.choice-button{padding:var(--spacing-sm) var(--spacing-md);gap:var(--spacing-sm)}}[data-theme=dark] .question-text.crucial-question{background:linear-gradient(135deg,#ffc1071a,#ff98000f);border-color:#ffc10733;border-left-color:#ff9800}.quiz-content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.question-area{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-lg);box-shadow:var(--shadow-xl);border:1px solid color-mix(in srgb,var(--color-primary) 10%,transparent);transition:all var(--transition-base);animation:fadeInScale .5s ease-out .1s both}.question-area:hover{box-shadow:var(--shadow-2xl)}.navigation-buttons{display:flex;flex-direction:column;gap:var(--spacing-md);animation:fadeInUp .6s ease-out .3s both}.nav-button-group{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md)}.nav-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);border-radius:var(--radius-xl);transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.nav-button-previous{background:linear-gradient(135deg,var(--color-bg-tertiary) 0%,var(--color-bg-secondary) 100%);color:var(--color-text);border:2px solid var(--color-border)}.nav-button-previous:hover:not(:disabled){background:linear-gradient(135deg,var(--color-border-medium) 0%,var(--color-bg-tertiary) 100%);border-color:var(--color-border-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.nav-button-next{background:var(--gradient-purple-blue);color:#fff;border:2px solid transparent}.nav-button-next:hover:not(:disabled){background:linear-gradient(135deg,var(--color-primary-light) 0%,var(--color-primary-dark) 100%);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.nav-button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.home-button{background:#fff;color:var(--color-text);border:2px solid var(--color-border);font-weight:var(--font-weight-bold);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:all var(--transition-base)}.home-button:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.home-button:active{transform:translateY(0) scale(.98)}@media(max-width:768px){.question-area{padding:var(--spacing-lg);border-radius:var(--radius-xl)}.nav-button-group{grid-template-columns:1fr;gap:var(--spacing-sm)}.nav-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-sm)}.home-button{padding:var(--spacing-md) var(--spacing-lg)}}@media(max-width:480px){.question-area{padding:var(--spacing-lg)}.navigation-buttons{gap:var(--spacing-sm)}.nav-button{padding:var(--spacing-sm) var(--spacing-md)}.home-button{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}}.recommendations-trigger{min-height:100px;margin-top:var(--spacing-2xl)}.nav-button:focus-visible,.home-button:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}.quiz-sidebar{width:100%;max-width:350px;display:flex;flex-direction:column;animation:slideInRight .6s ease-out}.sidebar-section{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-sm);box-shadow:var(--shadow-lg);transition:all var(--transition-base)}.sidebar-section:hover{box-shadow:var(--shadow-xl)}.video-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);background:var(--color-bg-secondary)}.video-iframe{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:var(--radius-lg)}.video-thumbnail{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer;transition:all var(--transition-base)}.video-thumbnail:hover{transform:scale(1.02)}.video-thumbnail-image{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-lg)}.video-thumbnail-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg) 100%);border-radius:var(--radius-lg);gap:var(--spacing-sm)}.placeholder-icon{font-size:3rem;opacity:.5}.placeholder-text{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-align:center;padding:0 var(--spacing-md)}.video-play-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0000004d,#00000080);transition:all var(--transition-base);border-radius:var(--radius-lg)}.video-thumbnail:hover .video-play-overlay{background:linear-gradient(135deg,#0006,#0009)}.video-play-button{width:40px;height:40px;background:#fffffff2;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:var(--color-primary);box-shadow:0 4px 20px #0000004d;transition:all var(--transition-base);padding-left:6px}.video-thumbnail:hover .video-play-button{transform:scale(1.1);background:#fff;box-shadow:0 6px 30px #0006}.video-play-button:active{transform:scale(.95)}.video-thumbnail-title{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,transparent 100%);color:#fff;padding:var(--spacing-md);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-align:center;border-radius:0 0 var(--radius-lg) var(--radius-lg)}@media(max-width:1200px){.quiz-sidebar{max-width:100%;width:100%;animation:fadeInUp .6s ease-out}}@media(max-width:768px){.quiz-sidebar{display:flex;flex-direction:column}.sidebar-section{padding:var(--spacing-lg)}.video-play-button{width:60px;height:60px;font-size:1.5rem}}@media(max-width:480px){.sidebar-section{padding:var(--spacing-md);border-radius:var(--radius-xl)}.video-play-button{width:50px;height:50px;font-size:1.25rem}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}.quiz-recommendations{margin-top:0;padding:var(--spacing-lg) 0;display:flex;flex-direction:column;gap:var(--spacing-2xl)}[data-theme=dark] .rec-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));opacity:0;transition:opacity var(--transition-medium);z-index:-1}[data-theme=dark] .exam-cards .rec-card:before{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 8%,transparent),color-mix(in srgb,var(--color-secondary) 8%,transparent))}@media(max-width:1024px){.recommendation-cards{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.rec-card{min-height:120px;padding:var(--spacing-xl)}.rec-card-icon{font-size:2.5rem}}@media(max-width:768px){.quiz-recommendations{padding:var(--spacing-lg) 0;gap:var(--spacing-xl)}.recommendation-title{font-size:var(--font-size-lg)}.recommendation-cards{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.rec-card{min-height:110px;padding:var(--spacing-lg);gap:var(--spacing-md)}.rec-card-icon{font-size:2.25rem}.rec-card-title{font-size:var(--font-size-base)}.rec-card:hover{transform:translateY(-4px) scale(1.005)}.rec-card:hover .rec-card-icon{transform:scale(1.03) translateY(-2px)}}@media(max-width:480px){.recommendation-title{font-size:var(--font-size-base)}.recommendation-cards{grid-template-columns:1fr;gap:var(--spacing-sm)}.rec-card{min-height:100px;padding:var(--spacing-lg)}.rec-card-icon{font-size:2rem}.rec-card-title{font-size:var(--font-size-sm)}}.rec-card:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;transform:translateY(-4px)}@media(prefers-reduced-motion:reduce){.rec-card,.rec-card-icon,.rec-card-title{transition:none;animation:none}.rec-card:hover,.rec-card:hover .rec-card-icon{transform:none}}.quiz-container{min-height:100vh;background:linear-gradient(180deg,#f8fafc,#e2e8f0);display:flex;flex-direction:column;animation:fadeIn .5s ease-out}.quiz-header{background:var(--gradient-primary);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);position:sticky;top:0;z-index:var(--z-sticky);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideInLeft .5s ease-out}.quiz-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:0 auto;width:100%;gap:var(--spacing-md)}.quiz-header-left,.quiz-header-right{display:flex;align-items:center;gap:var(--spacing-sm)}.quiz-header-button{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.25);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:90px;transition:all var(--transition-base);box-shadow:0 4px 12px #0000001a}.quiz-header-button:hover:not(:disabled){background:#ffffff40;transform:translateY(-2px);box-shadow:0 6px 16px #00000026;border-color:#fff6}.quiz-header-button:active:not(:disabled){transform:translateY(0) scale(.97)}.quiz-reset-button{background:#10b98133;border-color:#10b98166}.quiz-reset-button:hover:not(:disabled){background:#10b9814d;border-color:#10b98199}.quiz-title{color:#fff;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0;text-align:center;flex:1;text-shadow:0 2px 8px rgba(0,0,0,.15);letter-spacing:-.01em}.quiz-main{flex:1;max-width:1600px;margin:0 auto;width:100%;padding:var(--spacing-lg);animation:fadeInUp .6s ease-out .2s both}@media(min-width:1200px){.quiz-layout{display:grid;grid-template-columns:240px 1fr;gap:var(--spacing-lg);align-items:start}}.quiz-layout-left{display:flex;flex-direction:column;gap:var(--spacing-md);animation:slideInLeft .6s ease-out .1s both;min-height:0}.left-scrollable-content{display:flex;flex-direction:column;gap:var(--spacing-md);max-height:calc(100vh - 180px);min-height:0}.left-scrollable-content .pagination-container{flex:1 1 auto;min-height:200px;max-height:calc(100vh - 500px);overflow-y:auto}.left-scrollable-content .quiz-sidebar{flex:0 0 auto;position:sticky;top:calc(var(--spacing-lg) + 100px)}.left-scrollable-content .pagination-container::-webkit-scrollbar{width:2px}.left-scrollable-content .pagination-container::-webkit-scrollbar-track{background:transparent;transition:none!important}.left-scrollable-content .pagination-container::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}.left-scrollable-content .pagination-container::-webkit-scrollbar-thumb:hover{background:var(--color-border-dark)}.quiz-layout-center{animation:fadeInScale .6s ease-out .2s both}.recommendations-full-width{width:100%;min-height:200px;margin-top:var(--spacing-3xl);padding-top:var(--spacing-3xl);animation:fadeInUp .6s ease-out .4s both;position:relative}.recommendations-full-width:before{content:"";position:absolute;top:var(--spacing-2xl);left:50%;transform:translate(-50%);width:60%;height:1px;background:linear-gradient(90deg,transparent 0%,var(--color-border-medium) 50%,transparent 100%)}@media(min-width:768px)and (max-width:1199px){.quiz-layout{display:grid;grid-template-columns:1fr;gap:var(--spacing-lg)}.quiz-layout-center{order:1}.quiz-layout-left{order:2;flex-direction:column;gap:var(--spacing-lg)}.left-scrollable-content{max-height:none;flex-direction:column;gap:var(--spacing-lg)}.left-scrollable-content .pagination-container{max-height:250px;overflow-y:auto}.left-scrollable-content .pagination-container::-webkit-scrollbar{width:4px}.left-scrollable-content .pagination-container::-webkit-scrollbar-track{background:var(--color-border-light);border-radius:var(--radius-full);transition:none!important}.left-scrollable-content .pagination-container::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}.left-scrollable-content .quiz-sidebar{position:static}}@media(max-width:767px){.quiz-header{padding:var(--spacing-md)}.quiz-title{font-size:var(--font-size-lg)}.quiz-header-button{min-width:70px;padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-xs)}.quiz-header-left,.quiz-header-right{gap:var(--spacing-xs)}.quiz-main{padding:var(--spacing-md)}.quiz-layout{display:grid;grid-template-columns:1fr;gap:var(--spacing-md)}.quiz-layout-center{order:1}.quiz-layout-left{order:2;flex-direction:column;gap:var(--spacing-md)}.left-scrollable-content{max-height:none;flex-direction:column;gap:var(--spacing-md)}.left-scrollable-content .pagination-container{max-height:250px;overflow-y:auto}.left-scrollable-content .pagination-container::-webkit-scrollbar{width:4px}.left-scrollable-content .pagination-container::-webkit-scrollbar-track{background:var(--color-border-light);border-radius:var(--radius-full);transition:none!important}.left-scrollable-content .pagination-container::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}.left-scrollable-content .quiz-sidebar{position:static}}@media(max-width:480px){.quiz-header-content{gap:var(--spacing-sm);flex-wrap:wrap}.quiz-title{font-size:var(--font-size-base);flex:0 0 100%;order:-1;margin-bottom:var(--spacing-xs)}.quiz-header-button{min-width:60px;padding:var(--spacing-xs) var(--spacing-sm)}.quiz-main{padding:var(--spacing-sm)}.quiz-layout,.quiz-layout-left{gap:var(--spacing-sm)}}[data-theme=dark] .quiz-reset-button{background:#10b98126;border-color:#10b9814d}[data-theme=dark] .quiz-reset-button:hover:not(:disabled){background:#10b98140;border-color:#10b98180}.exam-structure-modal-overlay{position:fixed;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .2s ease-out}.exam-structure-modal-content{background:var(--color-bg);border-radius:12px;max-width:800px;width:100%;max-height:90vh;overflow-y:auto;position:relative;animation:slideUp .3s ease-out;box-shadow:0 20px 60px #0000004d}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.exam-structure-modal-close{position:absolute;top:20px;right:20px;background:var(--color-error);color:#fff;border:none;border-radius:8px;width:36px;height:36px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:1}.exam-structure-modal-close:hover{transform:scale(1.1);background:#dc2626}.exam-structure-modal-header{padding:32px 32px 24px;border-bottom:2px solid var(--color-border);background:var(--color-bg-secondary)}.exam-structure-modal-header h2{margin:0 0 8px;font-size:28px;color:var(--color-text);font-weight:700;line-height:1.3}.exam-structure-modal-subtitle{margin:0 0 12px;font-size:18px;color:var(--color-primary);font-weight:600}.exam-structure-meta{display:flex;gap:24px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--color-border)}.exam-structure-meta span{font-size:14px;color:var(--color-text-secondary)}.exam-structure-meta strong{color:var(--color-text);font-weight:600}.exam-structure-modal-body{padding:32px}.exam-structure-section{margin-bottom:32px}.exam-structure-section:last-child{margin-bottom:0}.exam-structure-section h3{margin:0 0 16px;font-size:20px;color:var(--color-text);font-weight:700;padding-bottom:8px;border-bottom:2px solid var(--color-primary)}.exam-structure-list{margin:0;padding-left:20px;list-style-type:disc}.exam-structure-list li{margin:8px 0;font-size:15px;line-height:1.6;color:var(--color-text)}.exam-structure-list strong{font-weight:600;color:var(--color-text)}.exam-structure-table-wrapper{overflow-x:auto;margin-top:16px;border-radius:8px;border:1px solid var(--color-border)}.exam-structure-table{width:100%;border-collapse:collapse;font-size:15px}.exam-structure-table thead{background:var(--color-bg-tertiary)}.exam-structure-table th{padding:12px 16px;text-align:left;font-weight:600;color:var(--color-text);border-bottom:2px solid var(--color-border)}.exam-structure-table td{padding:12px 16px;color:var(--color-text);border-bottom:1px solid var(--color-border)}.exam-structure-table tbody tr:last-child td{border-bottom:none}.exam-structure-table tbody tr:hover{background:var(--color-bg-secondary)}.exam-structure-table .text-center{text-align:center}.exam-structure-table .crucial-row{background:var(--color-warning-light)}.exam-structure-table .crucial-row:hover{background:var(--color-warning-light);opacity:.9}.exam-structure-table .crucial-row td{font-weight:600;color:var(--color-warning)}.exam-structure-table .total-row{background:var(--color-primary);color:#fff}.exam-structure-table .total-row td{color:#fff;border-bottom:none;font-weight:700}.exam-structure-table .total-row:hover{background:var(--color-primary-dark)}.exam-structure-warning{background:var(--color-error-light);border-left:4px solid var(--color-error);border-radius:8px;padding:16px;margin-top:12px}.exam-structure-warning .exam-structure-list{margin:0}.exam-structure-warning li{color:var(--color-text)}.exam-structure-warning strong{color:var(--color-error)}.exam-structure-note{background:var(--color-info-light);border-left:4px solid var(--color-info);border-radius:8px;padding:16px;font-size:14px;line-height:1.6;color:var(--color-text)}.exam-structure-note strong{color:var(--color-info);font-weight:600}@media(max-width:768px){.exam-structure-modal-overlay{padding:12px}.exam-structure-modal-content{max-height:95vh;border-radius:10px}.exam-structure-modal-header{padding:24px 24px 20px}.exam-structure-modal-header h2{font-size:24px;padding-right:40px}.exam-structure-modal-subtitle{font-size:16px}.exam-structure-meta{flex-direction:column;gap:8px}.exam-structure-meta span{font-size:13px}.exam-structure-modal-body{padding:24px 20px}.exam-structure-section{margin-bottom:24px}.exam-structure-section h3{font-size:18px}.exam-structure-list li,.exam-structure-table{font-size:14px}.exam-structure-table th,.exam-structure-table td{padding:10px 12px}.exam-structure-modal-close{width:32px;height:32px;font-size:18px;top:16px;right:16px}}@media(max-width:480px){.exam-structure-modal-header h2{font-size:20px}.exam-structure-section h3{font-size:16px}.exam-structure-table{font-size:13px}.exam-structure-table th,.exam-structure-table td{padding:8px 10px}.exam-structure-table-wrapper{font-size:12px}}.exam-structure-modal-content::-webkit-scrollbar{width:8px}.exam-structure-modal-content::-webkit-scrollbar-track{background:var(--color-bg-tertiary);border-radius:0 12px 12px 0;transition:none!important}.exam-structure-modal-content::-webkit-scrollbar-thumb{background:var(--color-text-secondary);border-radius:4px;transition:none!important}.exam-structure-modal-content::-webkit-scrollbar-thumb:hover{background:var(--color-text)}[data-theme=dark] .exam-structure-modal-content{background:var(--color-bg-dark)}[data-theme=dark] .exam-structure-modal-header{background:#ffffff05;border-bottom-color:var(--color-border-dark)}[data-theme=dark] .exam-structure-meta{border-top-color:var(--color-border-dark)}[data-theme=dark] .exam-structure-table-wrapper{border-color:var(--color-border-dark)}[data-theme=dark] .exam-structure-table thead{background:#ffffff0d}[data-theme=dark] .exam-structure-table th{border-bottom-color:var(--color-border-dark)}[data-theme=dark] .exam-structure-table td{border-bottom-color:#ffffff1a}[data-theme=dark] .exam-structure-table tbody tr:hover{background:#ffffff0d}[data-theme=dark] .exam-structure-table .crucial-row{background:#fbbf2426}[data-theme=dark] .exam-structure-table .crucial-row:hover{background:#fbbf2433}[data-theme=dark] .exam-structure-table .crucial-row td{color:#fbbf24}[data-theme=dark] .exam-structure-table .total-row{background:var(--color-primary-dark)}[data-theme=dark] .exam-structure-table .total-row:hover{background:var(--color-primary)}[data-theme=dark] .exam-structure-warning{background:#ef444426;border-left-color:#ef4444}[data-theme=dark] .exam-structure-warning li{color:var(--color-text)}[data-theme=dark] .exam-structure-warning strong{color:#fca5a5}[data-theme=dark] .exam-structure-note{background:#3b82f626;border-left-color:#3b82f6}[data-theme=dark] .exam-structure-note{color:var(--color-text)}[data-theme=dark] .exam-structure-note strong{color:#93c5fd}.exam-list-screen{min-height:100vh;display:flex;flex-direction:column;background:var(--gradient-primary);position:relative;overflow:hidden}.exam-list-screen:before{content:"";position:absolute;top:-50%;right:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%);border-radius:50%;animation:float 20s ease-in-out infinite}.exam-list-screen:after{content:"";position:absolute;bottom:-30%;left:-10%;width:500px;height:500px;background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 70%);border-radius:50%;animation:float 25s ease-in-out infinite reverse}@keyframes float{0%,to{transform:translate(0) rotate(0)}33%{transform:translate(30px,-50px) rotate(120deg)}66%{transform:translate(-20px,20px) rotate(240deg)}}.exam-list-header{padding:var(--spacing-3xl) var(--spacing-lg) var(--spacing-2xl);text-align:center;color:#fff;position:relative;z-index:2;animation:fadeInUp .8s ease-out}.exam-list-header-top{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width-lg);margin:0 auto var(--spacing-lg);gap:var(--spacing-md)}.exam-list-back-button{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.25);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base);box-shadow:0 4px 12px #0000001a}.exam-list-back-button:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 6px 16px #00000026;border-color:#fff6}.exam-list-title{font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);margin:0;text-shadow:0 4px 12px rgba(0,0,0,.15);letter-spacing:-.02em;color:#fff;position:relative;display:inline-block;line-height:1.4;padding-right:36px}.exam-structure-info-button{background:#ffffff4d;color:#fff;border:2px solid rgba(255,255,255,.5);border-radius:50%;width:32px;height:32px;font-size:18px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all var(--transition-medium);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 3px 10px #0003;position:absolute;top:-2px;right:0;padding:0;flex-shrink:0;z-index:10;pointer-events:auto;opacity:0;visibility:hidden;transform:scale(.8);background-clip:border-box!important;-webkit-background-clip:border-box!important;-webkit-text-fill-color:white!important;font-style:normal;font-weight:400;font-family:inherit}.exam-list-title:hover .exam-structure-info-button{opacity:1;visibility:visible;transform:scale(1);pointer-events:auto}.exam-structure-info-button:hover{background:#fff6;transform:scale(1.2)!important;box-shadow:0 6px 16px #00000040;border-color:#ffffffb3}.exam-structure-info-button:active{transform:scale(1.15)!important}.exam-list-subtitle{font-size:var(--font-size-lg);color:#ffffffe6;margin:var(--spacing-sm) 0 0 0}.exam-list-info{display:flex;justify-content:center;align-items:center;gap:var(--spacing-lg);flex-wrap:wrap;max-width:var(--max-width-lg);margin:var(--spacing-lg) auto 0;animation:fadeIn .6s ease-out .3s both}.exam-info-card{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);background:#ffffff26;border:1px solid rgba(255,255,255,.25);border-radius:var(--radius-full);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base)}.exam-info-card:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.exam-info-icon{font-size:var(--font-size-lg);line-height:1}.exam-info-text{color:#fff;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);white-space:nowrap}.exam-type-selection{margin:1.5rem auto;padding:0;max-width:1024px;width:100%;box-sizing:border-box}.exam-type-title{font-size:1.1rem;font-weight:600;margin-bottom:1rem;color:#fffffff2;text-align:center}.exam-type-buttons{display:flex!important;gap:1rem;width:100%!important;flex-wrap:nowrap;box-sizing:border-box;padding:0 1rem}.exam-type-button{flex:1 1 0%!important;width:auto;min-width:0!important;max-width:none!important;display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:16px;cursor:pointer;transition:all .3s ease;text-align:left;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-sizing:border-box;white-space:normal;overflow:visible}.exam-type-button:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0003;border-color:#fff6;background:#ffffff26}.exam-type-button.active{background:linear-gradient(135deg,#3b82f6e6,#2563ebe6);border-color:#ffffff80;color:#fff;box-shadow:0 8px 24px #3b82f666}.exam-type-button.active .exam-type-desc{color:#fffffff2}.exam-type-button.active .exam-type-icon{filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.exam-type-icon{font-size:2.5rem;flex-shrink:0;line-height:1}.exam-type-info{flex:1;min-width:0}.exam-type-name{font-size:1.125rem;font-weight:700;margin-bottom:.375rem;color:#fff}.exam-type-desc{font-size:.875rem;opacity:.9;line-height:1.4;color:#ffffffd9}.exam-type-button{animation:fadeInUp .4s ease-out backwards}.exam-type-button:nth-child(1){animation-delay:.1s}.exam-type-button:nth-child(2){animation-delay:.2s}.exam-type-button:nth-child(3){animation-delay:.3s}.exam-list-main{flex:1;padding:var(--spacing-lg);max-width:var(--max-width-lg);margin:0 auto;width:100%;position:relative;z-index:2}.exam-card-random{background:linear-gradient(135deg,#3b82f6,#10b981);border-radius:var(--radius-2xl);padding:var(--spacing-2xl);margin-bottom:var(--spacing-2xl);box-shadow:var(--shadow-xl);cursor:pointer;transition:all var(--transition-medium);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--spacing-lg);text-align:left;border:none;animation:fadeInUp .6s ease-out .1s both}.exam-card-random:hover{transform:translateY(-8px);box-shadow:var(--shadow-2xl),var(--shadow-success)}.exam-card-random:active{transform:translateY(-4px) scale(.99)}.exam-card-icon{font-size:5rem;line-height:1;filter:drop-shadow(0 8px 16px rgba(0,0,0,.2));transition:transform var(--transition-medium)}.exam-card-random:hover .exam-card-icon{transform:scale(1.1) rotate(-5deg)}.exam-card-content{display:flex;flex-direction:column;gap:var(--spacing-xs)}.exam-card-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:#fff;margin:0}.exam-card-description{font-size:var(--font-size-base);color:#ffffffe6;margin:0}.exam-card-arrow{font-size:var(--font-size-4xl);color:#fff;transition:transform var(--transition-base)}.exam-card-random:hover .exam-card-arrow{transform:translate(8px)}.exam-card-badge{display:inline-block;padding:.25rem .75rem;background:#fff3;border-radius:20px;font-size:.75rem;font-weight:600;margin-top:.5rem}.exam-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--spacing-lg);padding:var(--spacing-md)}.exam-item{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-lg);box-shadow:var(--shadow-xl);transition:all var(--transition-medium);cursor:pointer;border:none;text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);position:relative;overflow:hidden;isolation:isolate;background-color:#fff}.exam-item:before{content:none}.exam-item:hover:not(:disabled){transform:translateY(-12px) scale(1.02);box-shadow:var(--shadow-2xl);background-color:#fff!important}.exam-item:active:not(:disabled){transform:translateY(-8px) scale(1);transition:transform var(--transition-fast);background-color:#fff!important}.exam-item-number{width:80px;height:80px;border-radius:50%;background:var(--gradient-purple-blue);color:#fff;font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);transition:all var(--transition-medium);position:relative;z-index:1}.exam-item:hover .exam-item-number{transform:scale(1.1) rotate(5deg);box-shadow:var(--shadow-lg),var(--shadow-primary)}.exam-item-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;transition:color var(--transition-base);position:relative;z-index:1}.exam-item:hover .exam-item-title{color:var(--color-primary)}.exam-item-badge{position:absolute;top:.5rem;right:.5rem;padding:.25rem .5rem;background:var(--color-primary);color:#fff;border-radius:12px;font-size:.7rem;font-weight:600}.exam-card-random{animation:fadeInUp .6s ease-out .1s both}.exam-grid>*:nth-child(1){animation:fadeInUp .6s ease-out .2s both}.exam-grid>*:nth-child(2){animation:fadeInUp .6s ease-out .25s both}.exam-grid>*:nth-child(3){animation:fadeInUp .6s ease-out .3s both}.exam-grid>*:nth-child(4){animation:fadeInUp .6s ease-out .35s both}.exam-grid>*:nth-child(5){animation:fadeInUp .6s ease-out .4s both}.exam-grid>*:nth-child(6){animation:fadeInUp .6s ease-out .45s both}.exam-grid>*:nth-child(7){animation:fadeInUp .6s ease-out .5s both}.exam-grid>*:nth-child(8){animation:fadeInUp .6s ease-out .55s both}.exam-grid>*:nth-child(9){animation:fadeInUp .6s ease-out .6s both}.exam-grid>*:nth-child(10){animation:fadeInUp .6s ease-out .65s both}.exam-grid>*:nth-child(11){animation:fadeInUp .6s ease-out .7s both}.exam-grid>*:nth-child(12){animation:fadeInUp .6s ease-out .75s both}.exam-grid>*:nth-child(13){animation:fadeInUp .6s ease-out .8s both}.exam-grid>*:nth-child(14){animation:fadeInUp .6s ease-out .85s both}.exam-grid>*:nth-child(15){animation:fadeInUp .6s ease-out .9s both}.exam-grid>*:nth-child(16){animation:fadeInUp .6s ease-out .95s both}.exam-grid>*:nth-child(17){animation:fadeInUp .6s ease-out 1s both}.exam-grid>*:nth-child(18){animation:fadeInUp .6s ease-out 1.05s both}[data-theme=dark] .exam-list-screen{background:var(--gradient-primary)}[data-theme=dark] .exam-list-title{background:linear-gradient(135deg,#fff,#e0e7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=dark] .exam-info-card{background:#ffffff1a;border-color:#fff3}[data-theme=dark] .exam-type-button{background:var(--color-bg-tertiary);border-color:var(--color-border-dark)}[data-theme=dark] .exam-type-button:hover{border-color:var(--color-primary)}[data-theme=dark] .exam-type-button.active{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark))}[data-theme=dark] .exam-item{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .exam-item:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));opacity:0;transition:opacity var(--transition-medium);z-index:-1}[data-theme=dark] .exam-item:hover:before{opacity:1}[data-theme=dark] .exam-item:hover:not(:disabled){background:var(--color-bg-tertiary)!important;border-color:var(--color-primary);box-shadow:var(--shadow-2xl),0 0 0 1px color-mix(in srgb,var(--color-primary) 10%,transparent),0 30px 60px -15px color-mix(in srgb,var(--color-primary) 30%,transparent)}[data-theme=dark] .exam-item:active:not(:disabled){background-color:var(--color-bg-tertiary)!important}[data-theme=dark] .exam-item-title{color:var(--color-text)}[data-theme=dark] .exam-item:hover .exam-item-title{color:var(--color-primary-light)}[data-theme=dark] .exam-item-badge{background:var(--color-bg-tertiary);color:var(--color-text-secondary)}@media(max-width:768px){.exam-list-screen:before,.exam-list-screen:after{width:400px;height:400px}.exam-list-header{padding:var(--spacing-2xl) var(--spacing-md) var(--spacing-lg)}.exam-list-title{font-size:var(--font-size-4xl);padding-right:32px}.exam-structure-info-button{width:28px;height:28px;font-size:14px;border-width:1.5px}.exam-list-subtitle{font-size:var(--font-size-base)}.exam-list-info{gap:var(--spacing-sm)}.exam-info-card{padding:var(--spacing-xs) var(--spacing-md)}.exam-info-text{font-size:var(--font-size-xs)}.exam-type-buttons{flex-direction:column}.exam-type-button{flex:1 1 auto;max-width:100%;min-width:100%}.exam-list-main{padding:var(--spacing-md)}.exam-card-random{grid-template-columns:1fr;text-align:center;gap:var(--spacing-md);padding:var(--spacing-lg)}.exam-card-icon{font-size:4rem}.exam-card-arrow{display:none}.exam-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--spacing-md);padding:0}.exam-item{padding:var(--spacing-lg);gap:var(--spacing-sm)}.exam-item-number{width:60px;height:60px;font-size:var(--font-size-2xl)}.exam-item-title{font-size:var(--font-size-base)}.exam-item:hover{transform:translateY(-6px) scale(1.01)}.exam-item:hover .exam-item-number{transform:scale(1.05) rotate(3deg)}}@media(min-width:769px){.exam-type-button{flex:1 1 0;min-width:300px;max-width:none}.exam-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}@media(max-width:480px){.exam-list-title{font-size:var(--font-size-3xl);padding-right:28px}.exam-structure-info-button{width:24px;height:24px;font-size:12px;border-width:1.5px}.exam-list-info{flex-direction:column;gap:var(--spacing-xs)}.exam-info-card{width:100%;justify-content:center}.exam-card-icon{font-size:3.5rem}.exam-card-title{font-size:var(--font-size-xl)}.exam-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--spacing-sm)}.exam-item{padding:var(--spacing-md)}.exam-item-number{width:50px;height:50px;font-size:var(--font-size-xl)}.exam-item-title{font-size:var(--font-size-sm)}}.exam-card-random:focus-visible,.exam-item:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;transform:translateY(-6px)}.exam-question-item{display:flex;flex-direction:column;gap:var(--spacing-lg);animation:fadeIn .5s ease-out}.exam-question-text-container{margin-bottom:var(--spacing-sm)}.exam-question-text{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);line-height:var(--line-height-relaxed);padding:var(--spacing-lg);border-radius:var(--radius-xl);background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);border:2px solid transparent}.question-text-wrapper{display:flex;flex-direction:column;gap:var(--spacing-sm);align-items:flex-start}.question-main-text{width:100%;line-height:var(--line-height-relaxed)}.exam-question-text.crucial-question{background:linear-gradient(135deg,#ffc10714,#ff98000d);border:2px solid rgba(255,193,7,.25);border-left:4px solid #ffc107}.crucial-badge{display:inline-flex;align-items:center;gap:4px;background:linear-gradient(135deg,#ff9800,#ffc107);color:#fff;font-weight:var(--font-weight-bold);padding:4px 10px;border-radius:var(--radius-md);margin-right:var(--spacing-sm);margin-bottom:2px;font-size:.75rem;box-shadow:0 2px 8px #ff98004d;position:relative;letter-spacing:.3px;text-transform:uppercase;overflow:hidden;isolation:isolate;vertical-align:middle;line-height:1}.crucial-badge:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:shimmer 3s infinite;pointer-events:none}@keyframes shimmer{0%{left:-100%;opacity:0}20%{opacity:1}80%{opacity:1}to{left:100%;opacity:0}}@keyframes starTwinkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.exam-question-image-container{margin:0 0 var(--spacing-sm) 0;border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-xl);position:relative;animation:fadeInScale .6s ease-out .2s both}.exam-question-image-container:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.05) 100%);z-index:1;pointer-events:none}.exam-question-image{width:100%;max-height:min(40vh,400px);object-fit:contain;display:block;transition:transform var(--transition-slow);background:var(--color-bg-secondary)}.exam-question-image-container:hover .exam-question-image{transform:scale(1.02)}.exam-image-zoom-button{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:var(--radius-lg, 10px);background:color-mix(in srgb,var(--color-primary) 90%,transparent);border:none;color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:all .2s ease;opacity:0;box-shadow:0 2px 6px #00000026}.exam-question-image-container:hover .exam-image-zoom-button{opacity:1}.exam-image-zoom-button:hover{background:color-mix(in srgb,var(--color-primary-dark) 95%,transparent);transform:scale(1.05)}.exam-image-zoom-button:active{transform:scale(.98)}@media(max-width:768px){.exam-image-zoom-button{width:42px;height:42px;font-size:18px}}.exam-choices-container{display:flex;flex-direction:column;gap:var(--spacing-md)}.exam-choice-button{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background-color:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-xl);text-align:left;font-size:var(--font-size-base);color:var(--color-text);cursor:pointer;transition:all var(--transition-base);width:100%;position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}.exam-choice-button:before{content:"";position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,color-mix(in srgb,var(--color-primary) 10%,transparent) 0%,transparent 100%);transition:width var(--transition-medium);z-index:0}.exam-choice-button:hover:not(:disabled):before{width:100%}.exam-choice-button:hover:not(:disabled){border-color:var(--color-primary);transform:translate(8px);box-shadow:var(--shadow-md);background-color:var(--color-bg)}.exam-choice-button:disabled{cursor:default;opacity:1}.exam-choice-button.selected{border-color:var(--color-primary);background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 8%,transparent),color-mix(in srgb,var(--color-primary) 12%,transparent));box-shadow:var(--shadow-md),0 0 0 3px color-mix(in srgb,var(--color-primary) 10%,transparent)}.exam-choice-button.correct{border-color:var(--color-success);background:linear-gradient(135deg,#10b98114,#10b9811f);box-shadow:var(--shadow-md),0 0 0 3px #10b9811a;animation:successPulse .6s ease-out}@keyframes successPulse{0%{transform:scale(1)}50%{transform:scale(1.02);box-shadow:var(--shadow-lg),0 0 0 6px #10b98133}to{transform:scale(1)}}.exam-choice-button.incorrect{border-color:var(--color-error);background:linear-gradient(135deg,#ef444414,#ef44441f);box-shadow:var(--shadow-md),0 0 0 3px #ef44441a;animation:shake .5s ease-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.exam-choice-radio{flex-shrink:0;width:28px;height:28px;border:3px solid var(--color-border);border-radius:50%;position:relative;transition:all var(--transition-base);z-index:1;background:#fff}.exam-choice-button:hover:not(:disabled) .exam-choice-radio{border-color:var(--color-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 10%,transparent)}.exam-choice-button.selected .exam-choice-radio{border-color:var(--color-primary);background:var(--gradient-purple-blue);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 15%,transparent)}.exam-choice-button.correct .exam-choice-radio{border-color:var(--color-success);background:var(--gradient-success);box-shadow:0 0 0 4px #10b98126}.exam-choice-button.incorrect .exam-choice-radio{border-color:var(--color-error);background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 0 0 4px #ef444426}.exam-choice-radio-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:10px;height:10px;background-color:#fff;border-radius:50%;transition:transform var(--transition-bounce)}.exam-choice-button.selected .exam-choice-radio-inner,.exam-choice-button.correct .exam-choice-radio-inner,.exam-choice-button.incorrect .exam-choice-radio-inner{transform:translate(-50%,-50%) scale(1)}.exam-choice-text{flex:1;line-height:var(--line-height-relaxed);font-weight:var(--font-weight-medium);z-index:1}.exam-choice-indicator{flex-shrink:0;font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);background:#ffffffe6;z-index:1}.exam-choices-container>*:nth-child(1){animation:slideInRight .4s ease-out .1s both}.exam-choices-container>*:nth-child(2){animation:slideInRight .4s ease-out .2s both}.exam-choices-container>*:nth-child(3){animation:slideInRight .4s ease-out .3s both}.exam-choices-container>*:nth-child(4){animation:slideInRight .4s ease-out .4s both}.exam-change-hint{margin-top:var(--spacing-lg);padding:var(--spacing-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 8%,transparent),color-mix(in srgb,var(--color-secondary) 8%,transparent));border-left:4px solid var(--color-primary);border-radius:var(--radius-xl);animation:fadeInUp .5s ease-out}.exam-change-hint strong{color:var(--color-primary);font-weight:var(--font-weight-bold);margin-right:var(--spacing-xs)}[data-theme=dark] .exam-question-text{color:var(--color-text);background:var(--color-bg-tertiary)}[data-theme=dark] .exam-question-text.crucial-question{background:linear-gradient(135deg,#ffc1071a,#ff98000f);border-color:#ffc10733;border-left-color:#ff9800}[data-theme=dark] .crucial-badge{background:linear-gradient(135deg,#f57c00,#ffa726);box-shadow:0 2px 8px #f57c0066}[data-theme=dark] .exam-choice-button{background-color:var(--color-bg);border-color:var(--color-border);color:var(--color-text)}[data-theme=dark] .exam-choice-radio{background:var(--color-bg-tertiary);border-color:var(--color-border-medium)}[data-theme=dark] .exam-choice-indicator{background:#0000004d}[data-theme=dark] .exam-change-hint{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 15%,transparent),color-mix(in srgb,var(--color-secondary) 15%,transparent));border-color:var(--color-primary-light)}[data-theme=dark] .exam-change-hint strong{color:var(--color-primary-light)}@media(max-width:1200px){.exam-question-image{max-height:min(38vh,350px)}}@media(max-width:900px){.exam-question-image{max-height:min(35vh,300px)}}@media(max-width:768px){.exam-question-text{font-size:var(--font-size-lg);padding:var(--spacing-md)}.exam-question-image{max-height:min(32vh,280px)}.crucial-badge{font-size:.65rem;padding:3px 8px;margin-bottom:1px}.crucial-badge:after{font-size:.8em}.exam-choice-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-sm)}.exam-choice-button:hover:not(:disabled){transform:translate(4px)}.exam-choice-radio{width:24px;height:24px;border-width:2px}.exam-choice-radio-inner{width:8px;height:8px}.exam-change-hint{padding:var(--spacing-md);font-size:var(--font-size-sm)}}@media(max-width:480px){.exam-question-text{font-size:var(--font-size-base)}.crucial-badge{font-size:.6rem;padding:2px 6px;margin-right:4px;margin-bottom:1px}.crucial-badge:after{font-size:.75em}.exam-choice-button{padding:var(--spacing-sm) var(--spacing-md);gap:var(--spacing-sm)}.exam-change-hint{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-xs)}}@keyframes slideInRight{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}.exam-content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.exam-question-area{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-xl);border:1px solid color-mix(in srgb,var(--color-primary) 10%,transparent);transition:all var(--transition-base);animation:fadeInScale .5s ease-out .1s both}.exam-question-area:hover{box-shadow:var(--shadow-2xl)}.exam-navigation-buttons{display:flex;flex-direction:column;gap:var(--spacing-md);animation:fadeInUp .6s ease-out .3s both}.exam-nav-button-group{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md)}.exam-nav-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);border-radius:var(--radius-xl);transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.exam-nav-button-previous{background:linear-gradient(135deg,var(--color-bg-tertiary) 0%,var(--color-bg-secondary) 100%);color:var(--color-text);border:2px solid var(--color-border)}.exam-nav-button-previous:hover:not(:disabled){background:linear-gradient(135deg,var(--color-border-medium) 0%,var(--color-bg-tertiary) 100%);border-color:var(--color-border-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.exam-nav-button-next{background:var(--gradient-purple-blue);color:#fff;border:2px solid transparent}.exam-nav-button-next:hover:not(:disabled){background:linear-gradient(135deg,var(--color-primary-light) 0%,var(--color-primary-dark) 100%);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.exam-nav-button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.exam-home-button{background:#fff;color:var(--color-text);border:2px solid var(--color-border);font-weight:var(--font-weight-bold);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:all var(--transition-base)}.exam-home-button:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.exam-home-button:active{transform:translateY(0) scale(.98)}[data-theme=dark] .exam-question-area{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .exam-nav-button-previous{background:var(--color-bg-tertiary);color:var(--color-text);border-color:var(--color-border)}[data-theme=dark] .exam-nav-button-previous:hover:not(:disabled){background:var(--color-bg);border-color:var(--color-border-medium)}[data-theme=dark] .exam-home-button{background:var(--color-bg);color:var(--color-text);border-color:var(--color-border)}[data-theme=dark] .exam-home-button:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary);color:var(--color-primary-light)}@media(max-width:768px){.exam-question-area{padding:var(--spacing-lg);border-radius:var(--radius-xl)}.exam-nav-button-group{grid-template-columns:1fr;gap:var(--spacing-sm)}.exam-nav-button{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-sm)}.exam-home-button{padding:var(--spacing-md) var(--spacing-lg)}}@media(max-width:480px){.exam-question-area{padding:var(--spacing-lg)}.exam-navigation-buttons{gap:var(--spacing-sm)}.exam-nav-button{padding:var(--spacing-sm) var(--spacing-md)}.exam-home-button{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}}.exam-nav-button:focus-visible,.exam-home-button:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}.exam-statistics{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:color-mix(in srgb,var(--color-primary) 10%,transparent);border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:8px}.exam-stat-box{flex:1;min-width:0;padding:.4rem .5rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:6px;cursor:pointer;transition:all .2s ease;font-size:1rem;font-weight:700;text-align:center}.exam-stat-box:hover{transform:translateY(-1px);box-shadow:0 2px 6px #0000001a}.exam-stat-box.active{transform:translateY(-2px);box-shadow:0 3px 8px #00000026}.exam-stat-unanswered{color:#6b7280;border-color:#9ca3af!important}.exam-stat-unanswered:hover{background:#9ca3af1a;border-color:#6b7280!important}.exam-stat-unanswered.active{background:#6b728033;border-color:#6b7280!important;color:#5e6570}.exam-stat-done{color:#3b82f6;border-color:#60a5fa!important}.exam-stat-done:hover{background:#3b82f61a;border-color:#3b82f6!important}.exam-stat-done.active{background:#3b82f633;border-color:#3b82f6!important;color:#2563eb}.exam-stat-correct{color:#10b981;border-color:#34d399!important}.exam-stat-correct:hover{background:#10b9811a;border-color:#10b981!important}.exam-stat-correct.active{background:#10b98133;border-color:#10b981!important;color:#059669}.exam-stat-incorrect{color:#ef4444;border-color:#f87171!important}.exam-stat-incorrect:hover{background:#ef44441a;border-color:#ef4444!important}.exam-stat-incorrect.active{background:#ef444433;border-color:#ef4444!important;color:#dc2626}.exam-stat-not-correct{color:#ef4444;border-color:#f87171!important}.exam-stat-not-correct:hover{background:#ef44441a;border-color:#ef4444!important}.exam-stat-not-correct.active{background:#ef444433;border-color:#ef4444!important;color:#dc2626}[data-theme=dark] .exam-statistics{background:color-mix(in srgb,var(--color-primary) 15%,transparent);border-color:color-mix(in srgb,var(--color-primary) 30%,transparent)}[data-theme=dark] .exam-stat-box{background:var(--color-bg-tertiary);border-color:var(--color-border)}@media(max-width:768px){.exam-statistics{padding:.4rem;gap:.4rem}.exam-stat-box{padding:.35rem .4rem;font-size:.9rem}}@media(max-width:480px){.exam-statistics{padding:.35rem;gap:.35rem}.exam-stat-box{padding:.3rem .35rem;font-size:.85rem}}.exam-result-overlay{position:fixed;inset:0;background-color:#0f172ab3;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-lg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:fadeIn .3s ease-out}.exam-result-content{background:#fff;border-radius:var(--radius-2xl);padding:0;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-2xl);animation:modalSlideUp .4s cubic-bezier(.34,1.56,.64,1);position:relative}.exam-result-close{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:40px;height:40px;border-radius:50%;background:#ffffffe6;border:none;font-size:var(--font-size-xl);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;z-index:10}.exam-result-close:hover{background:var(--color-error);color:#fff;transform:rotate(90deg)}.exam-result-header{padding:var(--spacing-3xl) var(--spacing-2xl);text-align:center;border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;position:relative;overflow:hidden}.exam-result-header.passed{background:linear-gradient(135deg,#10b981,#34d399);color:#fff}.exam-result-header.failed{background:linear-gradient(135deg,#ef4444,#f87171);color:#fff}.exam-result-header:before{content:"";position:absolute;top:-50%;right:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%);animation:float 20s ease-in-out infinite}.result-icon{font-size:5rem;line-height:1;margin-bottom:var(--spacing-md);animation:bounce 1s ease-in-out infinite}.result-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);margin:0;text-shadow:0 2px 8px rgba(0,0,0,.1);position:relative;z-index:1}.exam-result-body{padding:var(--spacing-2xl)}.result-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.stat-item{background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);padding:var(--spacing-lg);border-radius:var(--radius-xl);text-align:center;border:2px solid var(--color-border);transition:all var(--transition-base)}.stat-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.stat-item.crucial-error{background:linear-gradient(135deg,#ef44440d,#ef44441a);border-color:var(--color-error);grid-column:1 / -1}.stat-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs);font-weight:var(--font-weight-medium)}.stat-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.stat-value.success{color:var(--color-success)}.stat-value.error{color:var(--color-error)}.failure-reason{background:linear-gradient(135deg,#ef44440d,#ef44441a);border-left:4px solid var(--color-error);padding:var(--spacing-lg);border-radius:var(--radius-xl);margin-bottom:var(--spacing-lg)}.failure-reason h3{font-size:var(--font-size-lg);color:var(--color-error);margin:0 0 var(--spacing-sm) 0}.failure-reason p{margin:var(--spacing-sm) 0;color:var(--color-text);line-height:var(--line-height-relaxed)}.crucial-warning{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-style:italic;margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--color-border)}.success-message{background:linear-gradient(135deg,#10b9810d,#10b9811a);border-left:4px solid var(--color-success);padding:var(--spacing-lg);border-radius:var(--radius-xl);text-align:center}.success-message p{margin:var(--spacing-sm) 0;color:var(--color-text);line-height:var(--line-height-relaxed)}.exam-result-actions{display:flex;gap:var(--spacing-md);padding:0 var(--spacing-2xl) var(--spacing-2xl)}.result-button{flex:1;padding:var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);border-radius:var(--radius-xl);transition:all var(--transition-base);box-shadow:var(--shadow-sm);border:2px solid transparent}.result-button-review{background:var(--gradient-purple-blue);color:#fff}.result-button-review:hover{background:linear-gradient(135deg,var(--color-primary-light) 0%,var(--color-primary-dark) 100%);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.result-button-back{background:linear-gradient(135deg,var(--color-bg-tertiary) 0%,var(--color-bg-secondary) 100%);color:var(--color-text);border-color:var(--color-border)}.result-button-back:hover{background:linear-gradient(135deg,var(--color-border-medium) 0%,var(--color-bg-tertiary) 100%);border-color:var(--color-border-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}[data-theme=dark] .exam-result-content{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .exam-result-close{background:var(--color-bg-tertiary)}[data-theme=dark] .stat-item{background:var(--color-bg-tertiary);border-color:var(--color-border)}[data-theme=dark] .failure-reason,[data-theme=dark] .success-message{background:color-mix(in srgb,var(--color-primary) 10%,transparent)}@media(max-width:768px){.exam-result-content{margin:var(--spacing-md)}.exam-result-header{padding:var(--spacing-2xl) var(--spacing-lg)}.result-icon{font-size:4rem}.result-title{font-size:var(--font-size-2xl)}.exam-result-body{padding:var(--spacing-lg)}.result-stats{grid-template-columns:1fr;gap:var(--spacing-md)}.exam-result-actions{flex-direction:column;padding:0 var(--spacing-lg) var(--spacing-lg)}.result-button{width:100%}}@media(max-width:480px){.result-icon{font-size:3rem}.result-title,.stat-value{font-size:var(--font-size-xl)}}.exam-container{min-height:100vh;background:linear-gradient(180deg,#f8fafc,#e2e8f0);display:flex;flex-direction:column;animation:fadeIn .5s ease-out}.exam-header{background:var(--gradient-primary);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);position:sticky;top:0;z-index:var(--z-sticky);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideInLeft .5s ease-out}.exam-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:0 auto;width:100%;gap:var(--spacing-md)}.exam-left-group,.exam-right-group{display:flex;align-items:center;gap:var(--spacing-sm);min-width:fit-content}.exam-back-button{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.25);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:90px;height:42px;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base);box-shadow:0 4px 12px #0000001a}.exam-back-button:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.exam-back-button:active{transform:translateY(0) scale(.97)}.exam-title{color:#fff;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0;text-align:center;flex:1;text-shadow:0 2px 8px rgba(0,0,0,.15);letter-spacing:-.01em}.exam-title-group{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);flex:1}.exam-type-badge{background:#fff3;color:#fff;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border:1px solid rgba(255,255,255,.3)}.exam-timer{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.25);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;gap:var(--spacing-xs);min-width:120px;height:42px;justify-content:center;box-shadow:0 4px 12px #0000001a}.timer-icon{font-size:var(--font-size-lg)}.timer-text{font-size:var(--font-size-base);letter-spacing:.5px}.timer-warning{background:#ef444433;border-color:#ef444466;animation:pulse 1s ease-in-out infinite}.timer-stopped{background:#6b728033;border-color:#6b728066;opacity:.7}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}@keyframes subtlePulse{0%,to{box-shadow:0 4px 16px #10b98166}50%{box-shadow:0 4px 20px #10b98199}}.exam-submit-button{background:#10b981e6;color:#fff;border:2px solid rgba(16,185,129,1);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:100px;height:42px;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base);box-shadow:0 4px 16px #10b98166;animation:subtlePulse 2s ease-in-out infinite}.exam-submit-button:hover:not(:disabled){background:#10b981;border-color:#059669;transform:translateY(-2px);box-shadow:0 6px 20px #10b98199}.exam-submit-button:disabled{opacity:.5;cursor:not-allowed}.exam-main{flex:1;max-width:1600px;margin:0 auto;width:100%;padding:var(--spacing-lg);padding-bottom:var(--spacing-3xl);animation:fadeInUp .6s ease-out .2s both}@media(min-width:1200px){.exam-layout{display:grid;grid-template-columns:240px 1fr;gap:var(--spacing-lg);align-items:start;min-height:calc(100vh - 250px)}}.exam-layout-left{display:flex;flex-direction:column;animation:slideInLeft .6s ease-out .1s both}.exam-layout-left .left-scrollable-content{display:flex;flex-direction:column;gap:var(--spacing-md);max-height:calc(100vh - 180px);overflow-y:auto;padding-right:var(--spacing-xs)}.exam-layout-left .left-scrollable-content .pagination-container{max-height:calc(100vh - 220px);overflow-y:auto}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar{width:4px}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-track{background:var(--color-border-light);border-radius:var(--radius-full)}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full)}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-thumb:hover{background:var(--color-border-dark)}.exam-layout-left .left-scrollable-content::-webkit-scrollbar{width:6px}.exam-layout-left .left-scrollable-content::-webkit-scrollbar-track{background:transparent;transition:none!important}.exam-layout-left .left-scrollable-content::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}.exam-layout-left .left-scrollable-content::-webkit-scrollbar-thumb:hover{background:var(--color-border-dark)}.exam-layout-center{animation:fadeInScale .6s ease-out .2s both}@media(min-width:768px)and (max-width:1199px){.exam-layout{display:grid;grid-template-columns:1fr;gap:var(--spacing-lg);min-height:calc(100vh - 240px)}.exam-layout-center{order:1}.exam-layout-left{order:2}.exam-layout-left .left-scrollable-content{max-height:none;overflow-y:visible}.exam-layout-left .left-scrollable-content .pagination-container{max-height:250px;overflow-y:auto}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar{width:4px}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-track{background:var(--color-border-light);border-radius:var(--radius-full);transition:none!important}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}}@media(max-width:767px){.exam-header{padding:var(--spacing-md)}.exam-header-content{gap:var(--spacing-sm);flex-wrap:wrap}.exam-title{font-size:var(--font-size-lg);flex:0 0 100%;order:-1;margin-bottom:var(--spacing-xs)}.exam-back-button,.exam-submit-button{min-width:70px;padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-xs);height:36px}.exam-timer{padding:var(--spacing-xs) var(--spacing-md);min-width:100px;height:36px}.timer-text{font-size:var(--font-size-sm)}.exam-main{padding:var(--spacing-md)}.exam-layout{display:grid;grid-template-columns:1fr;gap:var(--spacing-md);min-height:calc(100vh - 220px)}.exam-layout-center{order:1}.exam-layout-left{order:2}.exam-layout-left .left-scrollable-content{max-height:none;overflow-y:visible}.exam-layout-left .left-scrollable-content .pagination-container{max-height:250px;overflow-y:auto}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar{width:4px}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-track{background:var(--color-border-light);border-radius:var(--radius-full);transition:none!important}.exam-layout-left .left-scrollable-content .pagination-container::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}}@media(max-width:480px){.exam-header-content{justify-content:space-between}.exam-title{font-size:var(--font-size-base)}.exam-type-badge{font-size:.65rem;padding:2px var(--spacing-xs)}.exam-main{padding:var(--spacing-sm)}.exam-layout{gap:var(--spacing-sm);min-height:calc(100vh - 200px)}.recommendation-cards{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.rec-card{min-height:110px;padding:var(--spacing-lg);gap:var(--spacing-md)}.rec-card-icon{font-size:2.25rem}.rec-card-title{font-size:var(--font-size-base)}.rec-card:hover{transform:translateY(-4px) scale(1.005)}.rec-card:hover .rec-card-icon{transform:scale(1.03) translateY(-2px)}}@media(max-width:480px){.recommendation-cards{grid-template-columns:1fr;gap:var(--spacing-sm)}.rec-card{min-height:100px;padding:var(--spacing-lg)}.rec-card-icon{font-size:2rem}.rec-card-title{font-size:var(--font-size-sm)}}.exam-recommendations-full-width{width:100%;min-height:200px;margin-top:var(--spacing-3xl);padding-top:var(--spacing-3xl);margin-bottom:var(--spacing-3xl);position:relative}.exam-recommendations-full-width:before{content:"";position:absolute;top:var(--spacing-2xl);left:50%;transform:translate(-50%);width:60%;height:1px;background:linear-gradient(90deg,transparent 0%,var(--color-border-medium) 50%,transparent 100%)}.exam-recommendations{padding:var(--spacing-lg) 0;display:flex;flex-direction:column;gap:var(--spacing-2xl)}.recommendation-section{display:flex;flex-direction:column;gap:var(--spacing-lg)}.recommendation-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;text-align:left;letter-spacing:-.01em;padding-left:var(--spacing-xs)}.recommendation-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-lg)}.rec-card{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-xl);transition:all var(--transition-medium);cursor:pointer;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-lg);position:relative;overflow:hidden;isolation:isolate;background-color:#fff;min-height:140px}.rec-card:before{content:none}.rec-card:hover{transform:translateY(-8px) scale(1.01);box-shadow:var(--shadow-2xl);background-color:#fff!important}.rec-card:active{transform:translateY(-4px) scale(.99);transition:transform var(--transition-fast);background-color:#fff!important}.rec-card-icon{font-size:3rem;line-height:1;filter:drop-shadow(0 8px 16px rgba(0,0,0,.1));transition:all var(--transition-medium);position:relative;z-index:1}.rec-card:hover .rec-card-icon{transform:scale(1.05) translateY(-4px);filter:drop-shadow(0 12px 24px rgba(0,0,0,.15))}.rec-card:active .rec-card-icon{transform:scale(1.02) translateY(-2px)}.rec-card-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;transition:color var(--transition-base);letter-spacing:-.01em;text-align:center;line-height:var(--line-height-normal);position:relative;z-index:1}.rec-card:hover .rec-card-title{color:var(--color-primary)}[data-theme=dark] .exam-container{background:linear-gradient(180deg,#0f172a,#1e293b)}[data-theme=dark] .rec-card{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .rec-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 8%,transparent),color-mix(in srgb,var(--color-secondary) 8%,transparent));opacity:0;transition:opacity var(--transition-medium);z-index:-1}[data-theme=dark] .rec-card:hover:before{opacity:1}[data-theme=dark] .rec-card:hover{background:var(--color-bg-tertiary)!important;border-color:var(--color-primary);box-shadow:var(--shadow-2xl),0 0 0 1px color-mix(in srgb,var(--color-primary) 10%,transparent),0 30px 60px -15px color-mix(in srgb,var(--color-primary) 30%,transparent)}[data-theme=dark] .rec-card:active{background-color:var(--color-bg-tertiary)!important}[data-theme=dark] .rec-card:hover .rec-card-icon{filter:drop-shadow(0 12px 24px color-mix(in srgb,var(--color-primary) 40%,transparent))}[data-theme=dark] .rec-card-title{color:var(--color-text)}[data-theme=dark] .rec-card:hover .rec-card-title{color:var(--color-primary-light)}.keyboard-shortcuts-guide{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:10px 12px;border:1px solid var(--color-border-light)}.shortcuts-text{display:flex;flex-direction:column;gap:8px}.shortcuts-row{display:grid;grid-template-columns:20px auto auto 1fr;gap:8px;align-items:center}.shortcuts-row>span:first-child{font-size:14px;line-height:1}.shortcuts-row .key-group{display:flex;gap:4px}.shortcuts-row .shortcut-label{color:var(--color-text-secondary);font-size:.75rem;white-space:nowrap;text-align:right;justify-self:end}.shortcuts-text kbd{display:inline-flex;align-items:center;justify-content:center;padding:4px;min-width:24px;height:24px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,monospace;font-size:11px;font-weight:600;line-height:1;color:var(--color-text);background:#fff;border:1px solid var(--color-border);border-radius:4px;box-shadow:0 1px #0000001a,inset 0 0 0 1px #ffffff1a}.shortcuts-row-2 kbd.arrow-key{min-width:52px}[data-theme=dark] .keyboard-shortcuts-guide{background:var(--color-bg-tertiary);border-color:var(--color-border)}[data-theme=dark] .shortcuts-text kbd{background:var(--color-bg);border-color:var(--color-border);box-shadow:0 1px 2px #0003,inset 0 -1px #ffffff0d}@media(max-width:1199px){.keyboard-shortcuts-guide{display:flex;justify-content:center}.shortcuts-text{flex-direction:row;align-items:center;gap:12px;justify-content:center}.shortcuts-row{display:flex;gap:4px;align-items:center}.shortcuts-row>span:first-child{font-size:12px}.shortcuts-row .shortcut-label{display:none}.shortcuts-text kbd{padding:3px;min-width:20px;height:20px;font-size:10px}.shortcuts-row-2 kbd.arrow-key{min-width:44px}}@media(max-width:640px){.shortcuts-text{gap:8px}.shortcuts-row{gap:3px}.shortcuts-row>span:first-child{font-size:11px}.shortcuts-text kbd{padding:2px;min-width:18px;height:18px;font-size:9px}.shortcuts-row-2 kbd.arrow-key{min-width:40px}}.tips-container{min-height:100vh;background:linear-gradient(180deg,#f8fafc,#e2e8f0);display:flex;flex-direction:column;animation:fadeIn .5s ease-out;position:relative}.tips-container:before{content:"";position:fixed;inset:0;background-image:radial-gradient(circle at 20% 80%,color-mix(in srgb,var(--color-primary) 3%,transparent) 0%,transparent 50%),radial-gradient(circle at 80% 20%,color-mix(in srgb,var(--color-secondary) 3%,transparent) 0%,transparent 50%);pointer-events:none;z-index:0}.tips-header{background:var(--gradient-primary);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);position:sticky;top:0;z-index:var(--z-sticky);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideInLeft .5s ease-out}.tips-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:0 auto;width:100%;gap:var(--spacing-md)}.tips-back-button{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.25);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:90px;transition:all var(--transition-base);box-shadow:0 4px 12px #0000001a;cursor:pointer}.tips-back-button:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 6px 16px #00000026;border-color:#fff6}.tips-back-button:active{transform:translateY(0) scale(.97)}.tips-title{color:#fff;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0;text-align:center;flex:1;text-shadow:0 2px 8px rgba(0,0,0,.15);letter-spacing:-.01em}.tips-main{flex:1;max-width:var(--max-width-xl);margin:0 auto;width:100%;padding:var(--spacing-2xl) var(--spacing-lg);animation:fadeInUp .6s ease-out .2s both;position:relative;z-index:1}.tips-mode-section{margin-bottom:var(--spacing-4xl);padding-top:4rem;padding-bottom:var(--spacing-3xl);border-bottom:2px solid var(--color-border);animation:fadeInUp .5s ease-out}.tips-mode-section:first-of-type{padding-top:0}.tips-mode-section:last-of-type{border-bottom:none}.tips-mode-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-md) 0;padding:0 var(--spacing-lg);text-align:center;line-height:1.3}.tips-mode-desc{font-size:var(--font-size-lg);color:var(--color-text-secondary);text-align:center;margin:0 0 var(--spacing-3xl) 0;padding:0 var(--spacing-lg)}.tips-category-section{margin-bottom:var(--spacing-3xl);animation:fadeInUp .5s ease-out}.tips-category-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0;padding-left:var(--spacing-md);border-left:4px solid var(--color-primary)}.tips-ad-banner{margin:var(--spacing-3xl) 0;animation:fadeInScale .5s ease-out}.tips-banner-ad{width:100%;max-width:100%}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-lg)}.tip-card{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-lg);transition:all var(--transition-medium);cursor:pointer;position:relative;overflow:visible;border:2px solid transparent;animation:fadeInScale .4s ease-out;display:flex;flex-direction:column;min-height:280px}.tip-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-2xl);border-color:color-mix(in srgb,var(--color-primary) 20%,transparent)}.tip-card:active{transform:translateY(-4px) scale(.98)}.tip-card.tip-crucial{border-color:#fbbf2499;background:#fff;box-shadow:0 4px 20px #fbbf241f,var(--shadow-lg)}.tip-card.tip-crucial:hover{border-color:#fbbf24cc;box-shadow:0 8px 32px #fbbf2433,var(--shadow-2xl)}.tip-crucial-badge{position:absolute;top:var(--spacing-md);right:var(--spacing-md);background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);box-shadow:var(--shadow-sm);animation:pulse 2s ease-in-out infinite;z-index:2}.tip-icon{font-size:3rem;margin-bottom:var(--spacing-md);display:flex;align-items:center;justify-content:center;width:70px;height:70px;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 10%,transparent),color-mix(in srgb,var(--color-secondary) 10%,transparent));border-radius:var(--radius-xl);transition:all var(--transition-medium);flex-shrink:0}.tip-card:hover .tip-icon{transform:scale(1.1) rotate(5deg)}.tip-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0;line-height:var(--line-height-snug);flex-shrink:0}.tip-description{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0 0 auto;line-height:var(--line-height-relaxed);flex-grow:1}.tip-read-more{display:inline-flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-primary);transition:all var(--transition-base);margin-top:var(--spacing-md);flex-shrink:0}.tip-card:hover .tip-read-more{gap:var(--spacing-sm)}.tip-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-lg);animation:fadeIn .3s ease-out}.tip-modal-content{background:#fff;border-radius:var(--radius-2xl);max-width:800px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:var(--shadow-2xl);position:relative;animation:modalSlideUp .4s cubic-bezier(.34,1.56,.64,1)}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.tip-modal-close{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:40px;height:40px;border-radius:var(--radius-full);background:var(--color-bg-tertiary);border:none;font-size:var(--font-size-xl);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;z-index:10}.tip-modal-close:hover{background:var(--color-error);color:#fff;transform:rotate(90deg)}.tip-modal-header{padding:var(--spacing-2xl);padding-bottom:var(--spacing-lg);border-bottom:2px solid var(--color-border);display:flex;align-items:flex-start;gap:var(--spacing-lg)}.tip-modal-icon{font-size:4rem;width:90px;height:90px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 10%,transparent),color-mix(in srgb,var(--color-secondary) 10%,transparent));border-radius:var(--radius-xl);flex-shrink:0}.tip-modal-category{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-primary);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:.05em}.tip-modal-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;line-height:var(--line-height-snug)}.tip-modal-body{padding:var(--spacing-2xl);color:var(--color-text);line-height:var(--line-height-relaxed)}.tip-modal-body h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text);margin:var(--spacing-lg) 0 var(--spacing-md) 0}.tip-modal-body h3:first-child{margin-top:0}.tip-modal-body ul,.tip-modal-body ol{margin:var(--spacing-md) 0;padding-left:var(--spacing-lg)}.tip-modal-body li{margin:var(--spacing-sm) 0;line-height:var(--line-height-relaxed)}.tip-modal-body strong{color:var(--color-primary);font-weight:var(--font-weight-bold)}.tip-modal-body p{margin:var(--spacing-md) 0}[data-theme=dark] .tips-container{background:linear-gradient(180deg,#0f172a,#1e293b)}[data-theme=dark] .tip-card{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .tip-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-xl)}[data-theme=dark] .tip-card.tip-crucial{border-color:#fbbf2480;background:var(--color-bg);box-shadow:0 4px 20px #fbbf241a,var(--shadow-lg)}[data-theme=dark] .tip-card.tip-crucial:hover{border-color:#fbbf24b3;box-shadow:0 8px 32px #fbbf242e,var(--shadow-xl)}[data-theme=dark] .tip-title{color:var(--color-text)}[data-theme=dark] .tip-description{color:var(--color-text-secondary)}[data-theme=dark] .tip-modal-content{background:var(--color-bg)}[data-theme=dark] .tip-modal-header{border-color:var(--color-border)}[data-theme=dark] .tip-modal-title,[data-theme=dark] .tip-modal-body,[data-theme=dark] .tip-modal-body h3{color:var(--color-text)}[data-theme=dark] .tip-modal-close{background:var(--color-bg-tertiary);color:var(--color-text-secondary)}[data-theme=dark] .tip-modal-close:hover{background:var(--color-error);color:#fff}[data-theme=dark] .tips-category-title{color:var(--color-text)}@media(max-width:1024px){.tips-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-md)}.tip-modal-content{max-width:90%}}@media(max-width:768px){.tips-header{padding:var(--spacing-md)}.tips-header-content{gap:var(--spacing-sm)}.tips-title{font-size:var(--font-size-lg)}.tips-back-button{min-width:70px;padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-xs)}.tips-main{padding:var(--spacing-lg) var(--spacing-md)}.tips-category-section{margin-bottom:var(--spacing-2xl)}.tips-ad-banner{margin:var(--spacing-2xl) 0}.tips-category-title{font-size:var(--font-size-xl)}.tips-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.tip-card{padding:var(--spacing-lg);min-height:260px}.tip-icon{width:60px;height:60px;font-size:2.5rem}.tip-modal-header{flex-direction:column;text-align:center;padding:var(--spacing-lg);align-items:center}.tip-modal-icon{width:80px;height:80px;font-size:3rem}.tip-modal-title{font-size:var(--font-size-xl)}.tip-modal-body{padding:var(--spacing-lg)}.tip-modal-close{top:var(--spacing-sm);right:var(--spacing-sm);width:36px;height:36px}}@media(max-width:480px){.tips-category-title{font-size:var(--font-size-lg);padding-left:var(--spacing-sm)}.tip-modal-overlay{padding:var(--spacing-md)}.tip-modal-content{max-height:90vh}.tip-card{padding:var(--spacing-lg);min-height:240px}.tip-icon{width:50px;height:50px;font-size:2rem}.tip-title{font-size:var(--font-size-base)}.tip-description{font-size:var(--font-size-xs)}}.tip-card:focus-visible,.tips-back-button:focus-visible,.tip-modal-close:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}.tip-modal-content{scroll-behavior:smooth}.tip-modal-content::-webkit-scrollbar{width:8px}.tip-modal-content::-webkit-scrollbar-track{background:var(--color-bg-tertiary);border-radius:var(--radius-lg);transition:none!important}.tip-modal-content::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-lg);transition:none!important}.tip-modal-content::-webkit-scrollbar-thumb:hover{background:var(--color-border-dark)}.tips-grid>.tip-card:nth-child(1){animation-delay:.1s}.tips-grid>.tip-card:nth-child(2){animation-delay:.15s}.tips-grid>.tip-card:nth-child(3){animation-delay:.2s}.tips-grid>.tip-card:nth-child(4){animation-delay:.25s}.tips-grid>.tip-card:nth-child(5){animation-delay:.3s}.tips-grid>.tip-card:nth-child(6){animation-delay:.35s}.tips-grid>.tip-card:nth-child(7){animation-delay:.4s}.tips-grid>.tip-card:nth-child(8){animation-delay:.45s}.bien-bao-modal-overlay{position:fixed;inset:0;background-color:#0f172acc;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-lg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:bienBaoFadeIn .3s ease-out}.bien-bao-modal-content{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-2xl);animation:bienBaoModalSlideUp .4s cubic-bezier(.34,1.56,.64,1);position:relative}@keyframes bienBaoFadeIn{0%{opacity:0}to{opacity:1}}@keyframes bienBaoModalSlideUp{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.bien-bao-modal-close{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:40px;height:40px;border-radius:50%;background:var(--color-bg-tertiary);border:none;font-size:var(--font-size-xl);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;z-index:10}.bien-bao-modal-close:hover{background:var(--color-error);color:#fff;transform:rotate(90deg)}.bien-bao-modal-body{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-2xl);margin-bottom:var(--spacing-xl)}.bien-bao-modal-image-container{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md)}.bien-bao-modal-image{width:280px;height:280px;object-fit:contain;border-radius:var(--radius-lg);background:var(--color-bg-secondary);padding:var(--spacing-md)}.bien-bao-modal-image-clickable{cursor:zoom-in;transition:transform var(--transition-base),box-shadow var(--transition-base)}.bien-bao-modal-image-clickable:hover{transform:scale(1.05);box-shadow:var(--shadow-xl)}.bien-bao-modal-image-clickable:active{transform:scale(1.02)}.bien-bao-modal-code{display:inline-block;padding:var(--spacing-xs) var(--spacing-md);background:var(--gradient-purple-blue);color:#fff;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);border-radius:var(--radius-full)}.bien-bao-modal-info{text-align:center;width:100%}.bien-bao-modal-name{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-md) 0;line-height:var(--line-height-tight)}.bien-bao-modal-meaning{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0;line-height:var(--line-height-relaxed)}.bien-bao-modal-navigation{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);margin-top:var(--spacing-2xl);padding-top:var(--spacing-lg);border-top:2px solid var(--color-border)}.bien-bao-modal-nav-button{padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text);cursor:pointer;transition:all var(--transition-base);min-width:100px}.bien-bao-modal-nav-button:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:#fff;transform:translateY(-2px)}.bien-bao-modal-nav-button:disabled{opacity:.4;cursor:not-allowed}.bien-bao-modal-counter{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:var(--font-weight-medium)}[data-theme=dark] .bien-bao-modal-content{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .bien-bao-modal-close,[data-theme=dark] .bien-bao-modal-image{background:var(--color-bg-tertiary)}[data-theme=dark] .bien-bao-modal-nav-button{background:var(--color-bg-tertiary);border-color:var(--color-border)}[data-theme=dark] .bien-bao-modal-nav-button:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary)}@media(max-width:768px){.bien-bao-modal-content{padding:var(--spacing-lg);margin:var(--spacing-md)}.bien-bao-modal-image{width:220px;height:220px}.bien-bao-modal-name{font-size:var(--font-size-xl)}.bien-bao-modal-meaning{font-size:var(--font-size-sm)}.bien-bao-modal-nav-button{padding:var(--spacing-xs) var(--spacing-md);min-width:80px;font-size:var(--font-size-xs)}}@media(max-width:480px){.bien-bao-modal-content{padding:var(--spacing-md)}.bien-bao-modal-image{width:180px;height:180px}.bien-bao-modal-name{font-size:var(--font-size-lg)}.bien-bao-modal-navigation{flex-wrap:wrap;justify-content:center}.bien-bao-modal-counter{order:-1;width:100%;text-align:center;margin-bottom:var(--spacing-sm)}}.bien-bao-container{min-height:100vh;background:linear-gradient(180deg,#f8fafc,#e2e8f0);display:flex;flex-direction:column;animation:fadeIn .5s ease-out;position:relative}.bien-bao-container:before{content:"";position:fixed;inset:0;background-image:radial-gradient(circle at 20% 80%,color-mix(in srgb,var(--color-primary) 3%,transparent) 0%,transparent 50%),radial-gradient(circle at 80% 20%,color-mix(in srgb,var(--color-secondary) 3%,transparent) 0%,transparent 50%);pointer-events:none;z-index:0}.bien-bao-header{background:var(--gradient-primary);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);position:sticky;top:0;z-index:var(--z-sticky);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideInLeft .5s ease-out}.bien-bao-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:0 auto;width:100%;gap:var(--spacing-md)}.bien-bao-back-button{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.25);padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:90px;transition:all var(--transition-base);box-shadow:0 4px 12px #0000001a;cursor:pointer}.bien-bao-back-button:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 6px 16px #00000026;border-color:#fff6}.bien-bao-back-button:active{transform:translateY(0) scale(.97)}.bien-bao-title{color:#fff;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0;text-align:center;flex:1;text-shadow:0 2px 8px rgba(0,0,0,.15);letter-spacing:-.01em}.bien-bao-main{flex:1;max-width:var(--max-width-xl);margin:0 auto;width:100%;padding:var(--spacing-2xl) var(--spacing-lg);animation:fadeInUp .6s ease-out .2s both;position:relative;z-index:1}.category-filter{margin-bottom:var(--spacing-2xl);padding:var(--spacing-md);background:var(--color-bg);border-radius:var(--radius-2xl);box-shadow:var(--shadow-md);animation:fadeInScale .5s ease-out .3s both;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--color-primary) 50%,transparent) rgba(0,0,0,.05);transition:none!important}.category-filter::-webkit-scrollbar{height:6px}.category-filter::-webkit-scrollbar-track{background:#0000000d;border-radius:10px;margin:0 8px;transition:none!important}.category-filter::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--color-primary) 50%,transparent);border-radius:10px;transition:none!important}.category-filter::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--color-primary) 80%,transparent)}.category-filter-inner{display:flex;gap:10px;min-width:min-content;padding:4px}.category-button{flex-shrink:0;padding:10px 16px;font-size:14px;font-weight:var(--font-weight-semibold);border-radius:var(--radius-lg);border:2px solid var(--color-border);background:var(--color-bg);color:var(--color-text);cursor:pointer;transition:transform var(--transition-base),box-shadow var(--transition-base);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}.category-button:hover{background:var(--gradient-purple-blue);border-color:var(--color-primary);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-sm)}.category-button.active{background:var(--gradient-purple-blue);color:#fff;border-color:transparent;box-shadow:var(--shadow-md),var(--shadow-primary)}.category-button.active:hover{background:var(--gradient-purple-blue);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.bien-bao-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-lg);animation:fadeInUp .5s ease-out .4s both}.sign-card{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);transition:all var(--transition-medium);cursor:pointer;position:relative;overflow:visible;border:2px solid transparent;display:flex;flex-direction:column;min-height:280px}.sign-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-2xl);border-color:color-mix(in srgb,var(--color-primary) 20%,transparent)}.sign-card:active{transform:translateY(-4px) scale(.98)}.sign-image-container{position:relative;width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:var(--spacing-md);padding:var(--spacing-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 10%,transparent),color-mix(in srgb,var(--color-secondary) 10%,transparent));border-radius:var(--radius-xl);min-height:130px;max-height:160px;transition:all var(--transition-medium)}.sign-card:hover .sign-image-container{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 15%,transparent),color-mix(in srgb,var(--color-secondary) 15%,transparent))}.sign-image{width:100%;max-width:100%;max-height:130px;height:auto;object-fit:contain;transition:transform var(--transition-medium);border-radius:var(--radius-lg)}.sign-card:hover .sign-image{transform:scale(1.08) rotate(2deg)}.sign-code{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);background:var(--gradient-purple-blue);color:#fff;padding:4px var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);box-shadow:var(--shadow-md);z-index:2}.sign-content{display:flex;flex-direction:column;gap:var(--spacing-xs);flex-grow:1}.sign-name{font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;line-height:var(--line-height-snug)}.sign-brief{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0;line-height:var(--line-height-relaxed);flex-grow:1}.no-results{text-align:center;padding:var(--spacing-3xl);color:var(--color-text-secondary);font-size:var(--font-size-lg)}[data-theme=dark] .bien-bao-container{background:linear-gradient(180deg,#0f172a,#1e293b)}[data-theme=dark] .category-filter{scrollbar-color:color-mix(in srgb,var(--color-primary) 60%,transparent) rgba(255,255,255,.1)}[data-theme=dark] .category-filter::-webkit-scrollbar-track{background:#ffffff0d;transition:none!important}[data-theme=dark] .category-filter::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--color-primary) 60%,transparent);transition:none!important}[data-theme=dark] .category-filter::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--color-primary) 80%,transparent)}[data-theme=dark] .sign-card{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .sign-card:hover{border-color:var(--color-primary)}[data-theme=dark] .sign-name{color:var(--color-text)}[data-theme=dark] .sign-brief{color:var(--color-text-secondary)}@media(max-width:1024px){.bien-bao-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--spacing-md)}}@media(max-width:768px){.bien-bao-header{padding:var(--spacing-md)}.bien-bao-title{font-size:var(--font-size-lg)}.bien-bao-back-button{min-width:70px;padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-xs)}.bien-bao-main{padding:var(--spacing-lg) var(--spacing-md)}.category-filter{padding:12px}.category-filter-inner{gap:8px}.category-button{font-size:13px;padding:8px 14px}.bien-bao-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--spacing-md)}.sign-card{padding:var(--spacing-md);min-height:240px}.sign-image-container{min-height:110px;max-height:140px;padding:var(--spacing-sm)}.sign-image{max-height:110px}}@media(max-width:480px){.bien-bao-grid{grid-template-columns:1fr}.sign-card{padding:var(--spacing-md);min-height:220px}.sign-image-container{min-height:100px;max-height:130px}.sign-image{max-height:100px}}.sign-card:focus-visible,.bien-bao-back-button:focus-visible,.category-button:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}.practical-guide-container{min-height:100vh;background:linear-gradient(180deg,#f8fafc,#f1f5f9);display:flex;flex-direction:column}.practical-guide-header{background:var(--gradient-primary);padding:var(--spacing-2xl) var(--spacing-lg) var(--spacing-lg);color:#fff;box-shadow:var(--shadow-xl);animation:fadeIn .6s ease-out}.practical-guide-header,.practical-guide-header *,.practical-guide-main-title,.practical-guide-description,.practical-guide-back-button{color:#fff!important}.practical-guide-header-content{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width-lg);margin:0 auto var(--spacing-lg);gap:var(--spacing-md)}.practical-guide-back-button{padding:var(--spacing-sm) var(--spacing-lg);background:#ffffff26;border:1px solid rgba(255,255,255,.25);border-radius:var(--radius-lg);color:#fff;font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-base);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:var(--font-size-sm);min-width:90px;height:42px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000001a}.practical-guide-back-button:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.practical-guide-back-button:active{transform:translateY(0) scale(.97)}.practical-guide-main-title{font-size:var(--font-size-4xl);font-weight:var(--font-weight-extrabold);margin:0;text-align:center;flex:1;line-height:1.2;text-shadow:0 2px 8px rgba(0,0,0,.2);background:linear-gradient(135deg,#fff,#e0f2fe,#ddd6fe);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.practical-guide-description{max-width:var(--max-width-lg);margin:0 auto;text-align:center;font-size:var(--font-size-lg);line-height:var(--line-height-relaxed);opacity:.95}.practical-guide-main{flex:1;max-width:900px;margin:0 auto;width:100%;padding:var(--spacing-2xl) var(--spacing-lg)}.guide-intro-card{background:#fff;border-radius:var(--radius-2xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-xl);margin-bottom:var(--spacing-2xl);display:flex;gap:var(--spacing-lg);align-items:flex-start;animation:fadeInUp .6s ease-out;border:2px solid var(--color-primary-ultra-light)}.guide-intro-icon{font-size:4rem;line-height:1;flex-shrink:0}.guide-intro-content{flex:1}.guide-intro-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-md) 0}.guide-intro-text{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);margin:0 0 var(--spacing-lg) 0}.guide-intro-text strong{color:var(--color-primary);font-weight:var(--font-weight-bold)}.guide-intro-stats{display:flex;gap:var(--spacing-lg);flex-wrap:wrap}.guide-stat{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.guide-stat-icon{font-size:var(--font-size-lg)}.guide-steps-container{display:flex;flex-direction:column;gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.guide-step-card{background:#fff;border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);overflow:hidden;transition:all var(--transition-medium);border:2px solid transparent;animation:fadeInUp .6s ease-out both}.guide-step-card:nth-child(1){animation-delay:.1s}.guide-step-card:nth-child(2){animation-delay:.15s}.guide-step-card:nth-child(3){animation-delay:.2s}.guide-step-card:nth-child(4){animation-delay:.25s}.guide-step-card:nth-child(5){animation-delay:.3s}.guide-step-card:nth-child(6){animation-delay:.35s}.guide-step-card:nth-child(7){animation-delay:.4s}.guide-step-card:nth-child(8){animation-delay:.45s}.guide-step-card:hover{box-shadow:var(--shadow-2xl);transform:translateY(-2px)}.guide-step-card.expanded{border-color:var(--color-primary);box-shadow:var(--shadow-2xl),0 0 0 1px var(--color-primary-ultra-light)}.guide-step-header{display:flex;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-lg);cursor:pointer;transition:all var(--transition-base)}.guide-step-header:hover{background:var(--color-bg-secondary)}.guide-step-number{width:60px;height:60px;border-radius:50%;background:var(--gradient-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);flex-shrink:0;box-shadow:var(--shadow-lg)}.guide-step-header-content{flex:1}.guide-step-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-xs) 0;line-height:1.3}.guide-step-description{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0;line-height:var(--line-height-relaxed)}.guide-step-toggle{font-size:var(--font-size-xl);color:var(--color-primary);transition:transform var(--transition-base);flex-shrink:0}.guide-step-toggle.rotated{transform:rotate(180deg)}.guide-step-content{padding:0 var(--spacing-lg) var(--spacing-lg);animation:fadeInUp .4s ease-out}.guide-step-intro{margin-bottom:var(--spacing-lg)}.guide-step-paragraph{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);margin:0 0 var(--spacing-md) 0}.guide-step-paragraph:last-child{margin-bottom:0}.guide-step-media{margin-bottom:var(--spacing-lg);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg)}.guide-media-image-container{position:relative;width:100%;background:var(--color-bg-secondary)}.guide-media-image{width:100%;height:auto;display:block;max-height:500px;object-fit:contain}.guide-media-video-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;background:var(--color-bg-secondary)}.guide-media-video{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.guide-step-keypoints{background:transparent;border-left:4px solid var(--color-primary);border-radius:0;padding:var(--spacing-md) 0 var(--spacing-md) var(--spacing-lg);margin-bottom:var(--spacing-lg)}.guide-keypoints-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-primary);margin:0 0 var(--spacing-md) 0}.guide-keypoints-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--spacing-sm)}.guide-keypoint-item{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text);padding-left:0;position:relative;display:flex;align-items:flex-start;gap:var(--spacing-sm);transition:all var(--transition-base);padding:var(--spacing-xs) 0;border-radius:0}.guide-keypoint-item:hover{background:transparent;transform:none}.step-number-emoji{font-size:var(--font-size-lg);line-height:1;flex-shrink:0;display:inline-block}.guide-keypoint-item:hover .step-number-emoji{transform:none}.step-text{flex:1}.guide-keypoint-item:before{display:none}.guide-step-tips{background:transparent;border-left:4px solid #ffa000;border-radius:0;padding:var(--spacing-md) 0 var(--spacing-md) var(--spacing-lg);margin-bottom:var(--spacing-lg)}.guide-tips-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:#f57c00;margin:0 0 var(--spacing-md) 0}.guide-tips-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.guide-tip-item{font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);padding:0;background:transparent;border-radius:0;position:relative;padding-left:var(--spacing-lg)}.guide-tip-item:before{content:"•";position:absolute;left:0;color:#f57c00;font-weight:var(--font-weight-bold)}.guide-next-step-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);background:var(--gradient-primary);color:#fff;border:none;border-radius:var(--radius-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-md)}.guide-next-step-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}.guide-next-step-button:active{transform:translateY(0)}.guide-sections-container{display:flex;flex-direction:column;gap:var(--spacing-3xl);margin-bottom:var(--spacing-2xl)}.guide-section-card{display:flex;flex-direction:column;gap:var(--spacing-lg)}.guide-section-header{background:transparent;padding:0;border-radius:0;box-shadow:none;animation:fadeInUp .6s ease-out;margin-bottom:var(--spacing-lg);border-bottom:3px solid var(--color-primary);padding-bottom:var(--spacing-md)}.guide-section-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-primary-dark)!important;margin:0 0 var(--spacing-sm) 0;line-height:1.3;text-transform:none;letter-spacing:normal}.guide-section-description{font-size:var(--font-size-sm);color:var(--color-text-secondary)!important;margin:0;line-height:var(--line-height-relaxed)}.guide-section-card>.guide-step-media{margin-bottom:var(--spacing-lg)}.guide-section-card>.guide-step-tips{margin-bottom:var(--spacing-lg)}.guide-section-card>.guide-steps-container{display:flex;flex-direction:column;gap:var(--spacing-lg)}.guide-content-text{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);margin:0;padding:var(--spacing-sm) 0}[data-theme=dark] .guide-section-header{background:transparent;border-bottom-color:var(--color-primary)}[data-theme=dark] .guide-section-title{color:var(--color-primary)!important}[data-theme=dark] .guide-section-description{color:var(--color-text-secondary)!important}.guide-bottom-cta{background:var(--gradient-primary);border-radius:var(--radius-2xl);padding:var(--spacing-2xl);text-align:center;box-shadow:var(--shadow-xl);animation:fadeInUp .6s ease-out}.guide-cta-content{max-width:600px;margin:0 auto}.guide-cta-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:#fff;margin:0 0 var(--spacing-md) 0}.guide-cta-text{font-size:var(--font-size-lg);color:#fffffff2;line-height:var(--line-height-relaxed);margin:0 0 var(--spacing-lg) 0}.guide-cta-button{padding:var(--spacing-md) var(--spacing-2xl);background:#fff;color:var(--color-primary-dark);border:none;border-radius:var(--radius-full);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-lg)}.guide-cta-button:hover{background:#fff!important;color:var(--color-primary-dark);transform:translateY(-4px) scale(1.05);box-shadow:var(--shadow-2xl)}.guide-cta-button:active{background:#fff!important;color:var(--color-primary-dark);transform:translateY(-2px) scale(1.02)}[data-theme=dark] .practical-guide-container{background:linear-gradient(180deg,#0f172a,#1e293b)}[data-theme=dark] .guide-intro-card,[data-theme=dark] .guide-step-card{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .guide-step-header:hover{background:var(--color-bg-tertiary)}[data-theme=dark] .guide-intro-title,[data-theme=dark] .guide-step-title{color:var(--color-text)}[data-theme=dark] .guide-stat{background:var(--color-bg-tertiary)}@media(max-width:768px){.practical-guide-main-title{font-size:var(--font-size-2xl)}.practical-guide-description{font-size:var(--font-size-base)}.guide-intro-card{flex-direction:column;padding:var(--spacing-lg)}.guide-intro-icon{font-size:3rem;align-self:center}.guide-section-header{padding:0;padding-bottom:var(--spacing-sm)}.guide-section-title{font-size:var(--font-size-xl)}.guide-sections-container{gap:var(--spacing-2xl)}.guide-step-header{padding:var(--spacing-lg);gap:var(--spacing-md)}.guide-step-number{width:50px;height:50px;font-size:var(--font-size-xl)}.guide-step-title{font-size:var(--font-size-lg)}.guide-step-content{padding:0 var(--spacing-lg) var(--spacing-lg)}.guide-cta-title{font-size:var(--font-size-2xl)}}@media(max-width:480px){.practical-guide-header{padding:var(--spacing-lg)}.practical-guide-main{padding:var(--spacing-lg) var(--spacing-sm)}.guide-intro-stats{gap:var(--spacing-sm)}.guide-section-header{padding:var(--spacing-md)}.guide-section-title{font-size:var(--font-size-lg)}.guide-sections-container{gap:var(--spacing-xl)}.guide-step-header{flex-wrap:wrap}.guide-step-toggle{order:-1;width:100%;text-align:right}.guide-bottom-cta{padding:var(--spacing-lg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3) rotate(-20deg)}50%{opacity:1;transform:scale(1.1) rotate(5deg)}70%{transform:scale(.9) rotate(-2deg)}to{opacity:1;transform:scale(1) rotate(0)}}.content-page-container{min-height:100vh;background:var(--color-bg-secondary);display:flex;flex-direction:column}.content-page-header{position:sticky;top:0;background:var(--gradient-primary);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.content-page-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:0 auto;width:100%;gap:var(--spacing-md)}.content-page-header h1{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:#fff;margin:0;flex:1;text-align:center;text-shadow:0 2px 8px rgba(0,0,0,.15);letter-spacing:-.01em}.back-button-content{background:#ffffff26;border:1px solid rgba(255,255,255,.25);color:#fff;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);transition:all var(--transition-base);white-space:nowrap;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000001a;min-width:90px}.back-button-content:hover{background:#ffffff40;color:#fff;border-color:#fff6;transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.back-button-content:active{transform:translateY(0) scale(.97)}.content-page-content{flex:1;max-width:900px;width:100%;margin:0 auto;padding:30px 20px 60px}.content-article{background:var(--color-bg);border-radius:12px;padding:40px;box-shadow:0 2px 12px #00000014;line-height:1.7}.content-section{margin-bottom:40px;animation:contentSectionAppear .5s ease-out backwards}.content-section:last-child{margin-bottom:0}@keyframes contentSectionAppear{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.content-section:nth-child(1){animation-delay:0s}.content-section:nth-child(2){animation-delay:.1s}.content-section:nth-child(3){animation-delay:.2s}.content-section:nth-child(4){animation-delay:.3s}.content-section:nth-child(5){animation-delay:.4s}.content-section:nth-child(6){animation-delay:.5s}.content-section:nth-child(7){animation-delay:.6s}.content-section:nth-child(8){animation-delay:.7s}.content-section:nth-child(9){animation-delay:.8s}.content-section:nth-child(10){animation-delay:.9s}.content-section:nth-child(n+11){animation-delay:1s}.content-section h2{font-size:1.75rem;font-weight:700;color:var(--color-primary);margin-bottom:20px;padding-bottom:10px;border-bottom:3px solid var(--color-primary)}.content-section h3{font-size:1.3rem;font-weight:600;color:var(--color-text);margin-top:25px;margin-bottom:15px}.content-section p{color:var(--color-text);margin-bottom:15px;font-size:1rem}.content-section ul,.content-section ol{margin:15px 0 15px 25px;color:var(--color-text)}.content-section li{margin-bottom:10px;line-height:1.6}.content-section strong{color:var(--color-text);font-weight:600}.content-section a{color:var(--color-primary);text-decoration:none;font-weight:500}.content-section a:hover{text-decoration:underline}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin:25px 0}.stat-item{text-align:center;padding:25px 15px;background:var(--color-bg);border-radius:12px;border:2px solid var(--color-border);transition:transform .2s ease;animation:statItemAppear .5s ease-out backwards}.stat-item:nth-child(1){animation-delay:.1s}.stat-item:nth-child(2){animation-delay:.2s}.stat-item:nth-child(3){animation-delay:.3s}.stat-item:nth-child(4){animation-delay:.4s}@keyframes statItemAppear{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.stat-item:hover{transform:translateY(-5px);border-color:var(--color-primary)}.stat-number{font-size:2.5rem;font-weight:700;color:var(--color-primary);margin-bottom:5px}.stat-label{font-size:.9rem;color:var(--color-text-secondary)}.highlight-section{background:linear-gradient(135deg,#3b82f61a,#10b9811a);padding:30px;border-radius:12px;border-left:4px solid var(--color-primary)}.signature{text-align:right;margin-top:20px;font-style:italic}.info-box{background:#e3f2fd;border-left:4px solid #2196f3;padding:20px;margin:20px 0;border-radius:8px;color:#0d47a1}.info-box *{color:#0d47a1!important}.warning-box{background:#fff3cd;border-left:4px solid #ffc107;padding:20px;margin:20px 0;border-radius:8px;color:#856404}.warning-box *{color:#856404!important}.success-box{background:#d4edda;border-left:4px solid #28a745;padding:20px;margin:20px 0;border-radius:8px;color:#155724}.success-box *{color:#155724!important}[data-theme=dark] .info-box{background:#3b82f626;border-left-color:#60a5fa;color:#bfdbfe}[data-theme=dark] .info-box *{color:#bfdbfe!important}[data-theme=dark] .warning-box{background:#fbbf2426;border-left-color:#fbbf24;color:#fde68a}[data-theme=dark] .warning-box *{color:#fde68a!important}[data-theme=dark] .success-box{background:#34d39926;border-left-color:#34d399;color:#a7f3d0}[data-theme=dark] .success-box *{color:#a7f3d0!important}.content-table{width:100%;border-collapse:collapse;margin:20px 0;background:var(--color-bg);border-radius:8px;overflow:hidden}.content-table th,.content-table td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--color-border)}.content-table th{background:var(--color-primary);color:#fff;font-weight:600}.content-table tr:last-child td{border-bottom:none}.content-table tr:hover{background:#3b82f60d}.contact-info{display:flex;flex-direction:column;gap:15px;margin-top:20px}.contact-item{display:flex;align-items:center;gap:15px;padding:15px;background:var(--color-bg);border-radius:8px;border:1px solid var(--color-border);animation:contactItemAppear .4s ease-out backwards}.contact-item:nth-child(1){animation-delay:.1s}.contact-item:nth-child(2){animation-delay:.2s}.contact-item:nth-child(3){animation-delay:.3s}.contact-item:nth-child(4){animation-delay:.4s}@keyframes contactItemAppear{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.contact-icon{font-size:1.5rem}.contact-label{font-weight:600;color:var(--color-text);margin-bottom:3px}.contact-value{color:var(--color-text-secondary);font-size:.95rem}@media(max-width:768px){.content-page-header h1{font-size:1.2rem}.content-article{padding:25px 20px}.content-section h2{font-size:1.4rem}.content-section h3{font-size:1.15rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-number{font-size:2rem}}@media(max-width:480px){.content-page-content{padding:20px 10px}.content-article{padding:20px 15px}.back-button-content{padding:6px 12px;font-size:.9rem}.stats-grid{grid-template-columns:1fr}}.not-found-screen{min-height:100vh;display:flex;flex-direction:column;background:var(--color-bg-secondary);position:relative;overflow-x:hidden}.not-found-screen:before{content:"";position:absolute;top:0;left:0;right:0;height:400px;background:var(--gradient-purple-blue);opacity:.05;pointer-events:none;z-index:0}.not-found-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg) var(--spacing-2xl);position:relative;z-index:1}.not-found-logo{display:flex;align-items:center}.logo-text{font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);background:var(--gradient-purple-blue);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.not-found-container{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-2xl);position:relative;z-index:1}.not-found-content{max-width:700px;width:100%;text-align:center}.not-found-illustration{position:relative;margin:0 auto var(--spacing-2xl);width:180px;height:180px}.road-sign{width:100%;height:100%;animation:float 3s ease-in-out infinite}.sign-svg{width:100%;height:100%;filter:drop-shadow(0 10px 30px color-mix(in srgb,var(--color-primary) 30%,transparent))}.sign-triangle{stroke:var(--color-primary);transition:all var(--transition-base)}.sign-text{animation:pulse 2s ease-in-out infinite}.floating-element{position:absolute;border-radius:var(--radius-full);background:var(--gradient-primary);opacity:.1;animation:floatAround 4s ease-in-out infinite}.element-1{width:60px;height:60px;top:-20px;left:-30px;animation-delay:0s}.element-2{width:40px;height:40px;top:50px;right:-20px;animation-delay:1s}.element-3{width:50px;height:50px;bottom:-10px;left:50%;animation-delay:2s}.error-code-wrapper{position:relative;margin-bottom:var(--spacing-2xl)}.error-code{font-size:10rem;font-weight:var(--font-weight-extrabold);line-height:1;background:var(--gradient-purple-blue);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.05em;position:relative;z-index:2;margin:0;animation:glowPulse 3s ease-in-out infinite}.error-code-shadow{position:absolute;top:10px;left:50%;transform:translate(-50%);font-size:10rem;font-weight:var(--font-weight-extrabold);color:var(--color-primary);opacity:.05;z-index:1;line-height:1;letter-spacing:-.05em;-webkit-user-select:none;user-select:none;pointer-events:none}.not-found-card{background:var(--color-bg);border-radius:var(--radius-2xl);padding:var(--spacing-2xl);box-shadow:var(--shadow-xl);border:1px solid var(--color-border);transition:all var(--transition-base)}.not-found-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-md) 0;line-height:var(--line-height-tight)}.not-found-message{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin:0 0 var(--spacing-2xl) 0;line-height:var(--line-height-relaxed)}.not-found-actions{margin-bottom:var(--spacing-2xl)}.not-found-home-button{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-2xl);background:var(--gradient-primary);color:#fff;border:none;border-radius:var(--radius-xl);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-lg),var(--shadow-primary);position:relative;overflow:hidden}.not-found-home-button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}.not-found-home-button:active:before{width:300px;height:300px}.not-found-home-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-xl),var(--shadow-primary)}.not-found-home-button:active:not(:disabled){transform:translateY(0) scale(.98)}.not-found-home-button svg{flex-shrink:0}.not-found-app-promotion{padding-top:var(--spacing-lg);margin-top:var(--spacing-lg)}.promotion-divider{position:relative;text-align:center;margin-bottom:var(--spacing-lg)}.promotion-divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:var(--color-border)}.divider-text{position:relative;display:inline-block;padding:0 var(--spacing-md);background:var(--color-bg);color:var(--color-text-tertiary);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.1em}.app-promotion-card{width:100%;background:linear-gradient(135deg,#fffffff2,#ffffffe6);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:2px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:var(--radius-2xl);padding:var(--spacing-2xl);cursor:pointer;transition:all var(--transition-medium);box-shadow:var(--shadow-xl);position:relative;overflow:hidden}.app-promotion-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 5%,transparent),color-mix(in srgb,var(--color-secondary) 5%,transparent));opacity:0;transition:opacity var(--transition-medium)}.app-promotion-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-2xl),0 0 50px color-mix(in srgb,var(--color-primary) 40%,transparent);border-color:var(--color-primary)}.app-promotion-card:hover:before{opacity:1}.app-promotion-card:active{transform:translateY(-4px)}.app-promotion-content{display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--spacing-3xl);position:relative;z-index:1}.app-promotion-text{text-align:left}.app-promotion-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);background:var(--gradient-purple-blue);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 var(--spacing-xs) 0;line-height:1.2}.app-promotion-subtitle{font-size:var(--font-size-base);color:var(--color-text-secondary);font-weight:var(--font-weight-medium);margin:0}.download-count{font-weight:var(--font-weight-extrabold);background:linear-gradient(135deg,#fbbf24,#f59e0b,#ea580c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;display:inline-block;filter:drop-shadow(0 0 8px rgba(245,158,11,.6))}.app-promotion-icons{display:flex;align-items:flex-start;gap:var(--spacing-lg)}.app-icon-wrapper{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.app-icon{width:72px;height:72px;border-radius:var(--radius-xl);background:#fff;border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;padding:0;transition:all var(--transition-base);cursor:pointer;box-shadow:var(--shadow-md);overflow:hidden}.app-icon-img{width:100%;height:100%;object-fit:contain}.app-promotion-card:hover .app-icon{transform:translateY(-8px) scale(1.15);border-color:var(--color-primary);box-shadow:var(--shadow-xl)}.app-icon-wrapper:nth-child(1) .app-icon{transition-delay:.05s}.app-icon-wrapper:nth-child(2) .app-icon{transition-delay:.1s}.app-icon-wrapper:nth-child(3) .app-icon{transition-delay:.15s}.app-icon-wrapper:nth-child(4) .app-icon{transition-delay:.2s}.app-rating{display:flex;align-items:center;gap:4px}.star{font-size:var(--font-size-lg);font-weight:var(--font-weight-extrabold);background:linear-gradient(135deg,#fbbf24,#f59e0b,#ea580c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;display:inline-block;filter:drop-shadow(0 0 8px rgba(245,158,11,.6));line-height:1}.rating-number{font-size:var(--font-size-lg);font-weight:var(--font-weight-extrabold);background:linear-gradient(135deg,#fbbf24,#f59e0b,#ea580c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;display:inline-block;filter:drop-shadow(0 0 8px rgba(245,158,11,.6))}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(5deg)}}@keyframes floatAround{0%,to{transform:translate(0) scale(1)}33%{transform:translate(10px,-10px) scale(1.1)}66%{transform:translate(-10px,10px) scale(.9)}}@keyframes glowPulse{0%,to{filter:drop-shadow(0 0 20px color-mix(in srgb,var(--color-primary) 30%,transparent))}50%{filter:drop-shadow(0 0 40px color-mix(in srgb,var(--color-primary) 50%,transparent))}}[data-theme=dark] .not-found-screen:before{opacity:.1}[data-theme=dark] .not-found-card{background:var(--color-bg);border-color:var(--color-border);box-shadow:var(--shadow-xl),0 0 40px color-mix(in srgb,var(--color-primary) 15%,transparent)}[data-theme=dark] .sign-svg{filter:drop-shadow(0 10px 30px color-mix(in srgb,var(--color-primary) 50%,transparent))}[data-theme=dark] .error-code-shadow{opacity:.08}[data-theme=dark] .not-found-home-button{background:var(--gradient-purple-blue);box-shadow:var(--shadow-lg),0 10px 40px -10px color-mix(in srgb,var(--color-primary) 60%,transparent)}[data-theme=dark] .not-found-home-button:hover:not(:disabled){box-shadow:var(--shadow-xl),0 10px 40px -10px color-mix(in srgb,var(--color-primary) 80%,transparent)}[data-theme=dark] .floating-element{opacity:.15}[data-theme=dark] .app-promotion-card{background:linear-gradient(135deg,#1e293bf2,#0f172ae6);border-color:color-mix(in srgb,var(--color-primary) 30%,transparent)}[data-theme=dark] .app-icon{background:var(--color-bg-tertiary);border-color:var(--color-border)}[data-theme=dark] .app-promotion-subtitle{color:var(--color-text-tertiary)}[data-theme=dark] .app-icon-img{filter:brightness(.9)}@media(max-width:768px){.not-found-header{padding:var(--spacing-md) var(--spacing-lg)}.logo-text{font-size:var(--font-size-xl)}.not-found-container{padding:var(--spacing-lg)}.not-found-illustration{width:140px;height:140px;margin-bottom:var(--spacing-lg)}.error-code,.error-code-shadow{font-size:7rem}.not-found-card{padding:var(--spacing-lg)}.not-found-title{font-size:var(--font-size-2xl)}.not-found-message{font-size:var(--font-size-base)}.element-1{width:40px;height:40px}.element-2{width:30px;height:30px}.element-3{width:35px;height:35px}.app-promotion-card{padding:var(--spacing-lg)}.app-promotion-content{grid-template-columns:1fr;gap:var(--spacing-md);text-align:center}.app-promotion-text{text-align:center}.app-promotion-icons{justify-content:center}.app-icon{width:50px;height:50px}.star,.rating-number{font-size:var(--font-size-base)}}@media(max-width:480px){.not-found-container{padding:var(--spacing-md)}.not-found-illustration{width:120px;height:120px}.error-code,.error-code-shadow{font-size:5rem}.not-found-card{padding:var(--spacing-md)}.not-found-title{font-size:var(--font-size-xl)}.not-found-message{font-size:var(--font-size-sm);margin-bottom:var(--spacing-lg)}.not-found-home-button{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base);width:100%;justify-content:center}.tips-links{flex-direction:column}.app-promotion-title{font-size:var(--font-size-lg)}.app-promotion-subtitle{font-size:var(--font-size-xs)}.app-icon{width:40px;height:40px}.app-promotion-icons{gap:var(--spacing-sm)}.star,.rating-number{font-size:var(--font-size-sm)}}.app-container{min-height:100vh;background:linear-gradient(180deg,#f8fafc,#e2e8f0);position:relative}.app-container:before{content:"";position:fixed;inset:0;background-image:radial-gradient(circle at 20% 80%,color-mix(in srgb,var(--color-primary) 3%,transparent) 0%,transparent 50%),radial-gradient(circle at 80% 20%,color-mix(in srgb,var(--color-accent-purple) 3%,transparent) 0%,transparent 50%);pointer-events:none;z-index:0}[data-theme=dark] .app-container:before{display:none}*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #6366f1;--color-primary-dark: #4f46e5;--color-primary-light: #818cf8;--color-primary-ultra-light: #c7d2fe;--color-secondary: #14b8a6;--color-secondary-dark: #0f766e;--color-secondary-light: #5eead4;--color-accent-purple: #a855f7;--color-accent-pink: #ec4899;--color-accent-orange: #f97316;--color-success: #10b981;--color-success-light: #d1fae5;--color-error: #ef4444;--color-error-light: #fee2e2;--color-warning: #f59e0b;--color-warning-light: #fef3c7;--color-info: #3b82f6;--color-info-light: #dbeafe;--color-text: #0f172a;--color-text-secondary: #475569;--color-text-tertiary: #94a3b8;--color-text-light: #cbd5e1;--color-bg: #ffffff;--color-bg-secondary: #f8fafc;--color-bg-tertiary: #f1f5f9;--color-bg-dark: #1e293b;--color-border: #e2e8f0;--color-border-medium: #cbd5e1;--color-border-dark: #94a3b8;--gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--gradient-success: linear-gradient(135deg, #4ade80 0%, #22c55e 100%);--gradient-purple-blue: linear-gradient(135deg, #a855f7 0%, #6366f1 100%);--gradient-teal-blue: linear-gradient(135deg, #14b8a6 0%, #06b6d4 100%);--gradient-warm: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);--gradient-cool: linear-gradient(135deg, #22d3ee 0%, #3b82f6 100%);--gradient-bg-purple: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-bg-blue: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%);--gradient-bg-orange: linear-gradient(135deg, #fb923c 0%, #ea580c 100%);--gradient-bg-pink: linear-gradient(135deg, #f472b6 0%, #db2777 100%);--spacing-xs: .375rem;--spacing-sm: .625rem;--spacing-md: .875rem;--spacing-lg: 1.25rem;--spacing-2xl: 2.5rem;--spacing-3xl: 3.25rem;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Inter", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-size-xs: .6875rem;--font-size-sm: .8125rem;--font-size-base: .9375rem;--font-size-lg: 1.0625rem;--font-size-xl: 1.125rem;--font-size-2xl: 1.375rem;--font-size-3xl: 1.625rem;--font-size-4xl: 2rem;--font-size-5xl: 2.5rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-snug: 1.375;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--line-height-loose: 2;--radius-sm: .3125rem;--radius-md: .4375rem;--radius-lg: .625rem;--radius-xl: .875rem;--radius-2xl: 1.25rem;--radius-full: 9999px;--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, .05);--shadow-primary: 0 10px 40px -10px rgba(99, 102, 241, .4);--shadow-success: 0 10px 40px -10px rgba(16, 185, 129, .4);--shadow-error: 0 10px 40px -10px rgba(239, 68, 68, .4);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-medium: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--transition-bounce: .4s cubic-bezier(.68, -.55, .265, 1.55);--max-width-sm: 640px;--max-width-md: 768px;--max-width-lg: 1024px;--max-width-xl: 1280px;--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-modal: 1000;--z-popover: 1100;--z-tooltip: 1200}html{font-size:15px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;scrollbar-gutter:stable}body{font-family:var(--font-family),serif;font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg-secondary);min-height:100vh;overflow-x:hidden;overflow-y:scroll;user-select:none;-webkit-user-select:none;-ms-user-select:none}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text);margin:0}h1{font-size:var(--font-size-4xl);font-weight:var(--font-weight-extrabold);letter-spacing:-.02em}h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:-.01em}h3{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold)}h4{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold)}p{margin:0;line-height:var(--line-height-relaxed)}button{font-family:inherit;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);background-color:var(--color-primary);color:#fff;position:relative;overflow:hidden;outline:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}button:active:before{width:300px;height:300px}button:hover:not(:disabled){background-color:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-primary)}button:active:not(:disabled){transform:translateY(0) scale(.98)}button:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button *,button *:before,button *:after,button:before,button:after,a *,a *:before,a *:after,[role=button] *,[role=button] *:before,[role=button] *:after{pointer-events:none!important}button,a,[role=button]{pointer-events:auto!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(.98)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.fade-in{animation:fadeIn var(--transition-medium) ease-out}.fade-in-up{animation:fadeInUp var(--transition-medium) ease-out}.fade-in-scale{animation:fadeInScale var(--transition-medium) ease-out}.slide-in-right{animation:slideInRight var(--transition-medium) ease-out}.slide-in-left{animation:slideInLeft var(--transition-medium) ease-out}.stagger-1{animation-delay:.1s}.stagger-2{animation-delay:.2s}.stagger-3{animation-delay:.3s}.stagger-4{animation-delay:.4s}.stagger-5{animation-delay:.5s}.glass{background:#ffffff1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.card-elevated{background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);transition:all var(--transition-base)}.card-elevated:hover{transform:translateY(-4px);box-shadow:var(--shadow-2xl)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-tertiary);transition:none!important}::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:var(--radius-full);transition:none!important}::-webkit-scrollbar-thumb:hover{background:var(--color-border-dark)}::selection{background-color:var(--color-primary-ultra-light);color:var(--color-primary-dark)}::-moz-selection{background-color:var(--color-primary-ultra-light);color:var(--color-primary-dark)}*:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}@media(max-width:768px){:root{--font-size-4xl: 1.75rem;--font-size-3xl: 1.5rem;--font-size-2xl: 1.25rem;--font-size-xl: 1.0625rem}}@media(max-width:480px){:root{--font-size-4xl: 1.5rem;--font-size-3xl: 1.375rem}html{font-size:14px}}[data-theme=dark]{--color-primary: #818cf8;--color-primary-dark: #6366f1;--color-primary-light: #a5b4fc;--color-primary-ultra-light: #4f46e5;--color-secondary: #2dd4bf;--color-secondary-dark: #14b8a6;--color-secondary-light: #5eead4;--color-success: #34d399;--color-success-light: #064e3b;--color-error: #f87171;--color-error-light: #7f1d1d;--color-warning: #fbbf24;--color-warning-light: #78350f;--color-text: #f1f5f9;--color-text-secondary: #cbd5e1;--color-text-tertiary: #94a3b8;--color-text-light: #64748b;--color-bg: #1e293b;--color-bg-secondary: #0f172a;--color-bg-tertiary: #334155;--color-bg-dark: #020617;--color-border: #334155;--color-border-medium: #475569;--color-border-dark: #64748b;--gradient-primary: linear-gradient(135deg, #4338ca 0%, #6b21a8 100%);--gradient-secondary: linear-gradient(135deg, #be185d 0%, #e11d48 100%);--gradient-success: linear-gradient(135deg, #059669 0%, #047857 100%);--gradient-purple-blue: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%);--gradient-teal-blue: linear-gradient(135deg, #0d9488 0%, #0891b2 100%);--gradient-bg-purple: linear-gradient(135deg, #4338ca 0%, #6b21a8 100%);--gradient-bg-blue: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);--gradient-bg-orange: linear-gradient(135deg, #f97316 0%, #c2410c 100%);--gradient-bg-pink: linear-gradient(135deg, #ec4899 0%, #be185d 100%);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .5), 0 10px 10px -5px rgba(0, 0, 0, .3);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .6);--shadow-primary: 0 10px 40px -10px rgba(99, 102, 241, .5);--shadow-success: 0 10px 40px -10px rgba(16, 185, 129, .5);--shadow-error: 0 10px 40px -10px rgba(239, 68, 68, .5)}body,button,.app-container,.feature-card,.question-area,.choice-button,.nav-button,.home-button,.dialog-content,.sidebar-section,.pagination-container,.pagination-item{transition:background-color var(--transition-base),color var(--transition-base),border-color var(--transition-base)}.no-transition,.no-transition *{transition:none!important}[data-theme=dark] body{background-color:var(--color-bg-secondary);color:var(--color-text)}[data-theme=dark] .app-container{background:linear-gradient(180deg,#0f172a,#1e293b)}[data-theme=dark] .home-screen{background:var(--gradient-primary)}[data-theme=dark] .quiz-container{background:linear-gradient(180deg,#0f172a,#1e293b)}[data-theme=dark] .question-area{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .question-text{color:var(--color-text);background:var(--color-bg-tertiary)}[data-theme=dark] .question-text:hover{background:var(--color-bg);border-color:var(--color-primary)}[data-theme=dark] .choice-button{background-color:var(--color-bg);border-color:var(--color-border);color:var(--color-text)}[data-theme=dark] .choice-button:hover:not(:disabled){border-color:var(--color-primary);background-color:var(--color-bg-tertiary)}[data-theme=dark] .choice-button:before{background:linear-gradient(90deg,color-mix(in srgb,var(--color-primary) 15%,transparent) 0%,transparent 100%)}[data-theme=dark] .choice-button.selected{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 20%,transparent),color-mix(in srgb,var(--color-primary) 30%,transparent));border-color:var(--color-primary);color:var(--color-text)}[data-theme=dark] .choice-button.correct{background:linear-gradient(135deg,#10b98133,#10b9814d);border-color:var(--color-success);color:var(--color-text)}[data-theme=dark] .choice-button.incorrect{background:linear-gradient(135deg,#ef444433,#ef44444d);border-color:var(--color-error);color:var(--color-text)}[data-theme=dark] .choice-text{color:var(--color-text)}[data-theme=dark] .choice-radio{background:var(--color-bg-tertiary);border-color:var(--color-border-medium)}[data-theme=dark] .nav-button-previous{background:var(--color-bg-tertiary);color:var(--color-text);border-color:var(--color-border)}[data-theme=dark] .nav-button-previous:hover:not(:disabled){background:var(--color-bg);border-color:var(--color-border-medium)}[data-theme=dark] .home-button{background:var(--color-bg);color:var(--color-text);border-color:var(--color-border)}[data-theme=dark] .home-button:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary);color:var(--color-primary-light)}[data-theme=dark] .pagination-container{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .pagination-item{background-color:var(--color-bg-tertiary);color:var(--color-text)}[data-theme=dark] .dialog-content{background:var(--color-bg);border-color:var(--color-border)}[data-theme=dark] .dialog-title{color:var(--color-text);background:var(--gradient-purple-blue);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=dark] .dialog-message{color:var(--color-text-secondary)}[data-theme=dark] .hint-content{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 15%,transparent),color-mix(in srgb,var(--color-accent-purple) 15%,transparent));border-color:var(--color-primary)}[data-theme=dark] .hint-text{color:var(--color-text)}[data-theme=dark] .sidebar-section{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .sidebar-tips{background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 10%,transparent),color-mix(in srgb,var(--color-accent-purple) 10%,transparent));border-color:var(--color-primary)}[data-theme=dark] .tips-list li{color:var(--color-text-secondary)}[data-theme=dark] .feature-card{background:var(--color-bg);border:1px solid var(--color-border)}[data-theme=dark] .feature-card:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary)}[data-theme=dark] .feature-title{color:var(--color-text)}[data-theme=dark] .feature-card:hover .feature-title{color:var(--color-primary-light)}[data-theme=dark] .glass{background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}[data-theme=dark] .dialog-overlay{background-color:#000c}[data-theme=dark] img{opacity:.9}[data-theme=dark] .banner-overlay{background:linear-gradient(0deg,rgba(0,0,0,.9) 0%,transparent 100%)}[data-theme=dark] .banner-cta{color:#fff}[data-theme=dark] .choice-indicator{background:#0000004d}:root,[data-gradient=purple]{--gradient-primary: var(--gradient-bg-purple)}[data-gradient=blue]{--gradient-primary: var(--gradient-bg-blue);--gradient-purple-blue: linear-gradient(135deg, #3b82f6 0%, #0ea5e9 100%);--color-primary: #3b82f6;--color-primary-dark: #2563eb;--color-primary-light: #60a5fa;--color-primary-ultra-light: #dbeafe;--color-secondary: #06b6d4;--color-secondary-dark: #0891b2;--color-secondary-light: #22d3ee;--color-accent-purple: #6366f1;--shadow-primary: 0 10px 40px -10px rgba(59, 130, 246, .4)}[data-gradient=orange]{--gradient-primary: var(--gradient-bg-orange);--gradient-purple-blue: linear-gradient(135deg, #f97316 0%, #eab308 100%);--color-primary: #f97316;--color-primary-dark: #ea580c;--color-primary-light: #fb923c;--color-primary-ultra-light: #ffedd5;--color-secondary: #eab308;--color-secondary-dark: #ca8a04;--color-secondary-light: #facc15;--color-accent-purple: #f59e0b;--shadow-primary: 0 10px 40px -10px rgba(249, 115, 22, .4)}[data-gradient=pink]{--gradient-primary: var(--gradient-bg-pink);--gradient-purple-blue: linear-gradient(135deg, #ec4899 0%, #a855f7 100%);--color-primary: #ec4899;--color-primary-dark: #db2777;--color-primary-light: #f472b6;--color-primary-ultra-light: #fce7f3;--color-secondary: #a855f7;--color-secondary-dark: #9333ea;--color-secondary-light: #c084fc;--color-accent-purple: #d946ef;--shadow-primary: 0 10px 40px -10px rgba(236, 72, 153, .4)}[data-theme=dark][data-gradient=purple],[data-theme=dark]:not([data-gradient]){--gradient-primary: var(--gradient-bg-purple)}[data-theme=dark][data-gradient=blue]{--gradient-primary: var(--gradient-bg-blue);--gradient-purple-blue: linear-gradient(135deg, #60a5fa 0%, #22d3ee 100%);--color-primary: #60a5fa;--color-primary-dark: #3b82f6;--color-primary-light: #93c5fd;--color-primary-ultra-light: #1e40af;--color-secondary: #22d3ee;--color-secondary-dark: #06b6d4;--color-secondary-light: #67e8f9;--shadow-primary: 0 10px 40px -10px rgba(59, 130, 246, .5)}[data-theme=dark][data-gradient=orange]{--gradient-primary: var(--gradient-bg-orange);--gradient-purple-blue: linear-gradient(135deg, #fb923c 0%, #facc15 100%);--color-primary: #fb923c;--color-primary-dark: #f97316;--color-primary-light: #fdba74;--color-primary-ultra-light: #9a3412;--color-secondary: #facc15;--color-secondary-dark: #eab308;--color-secondary-light: #fde047;--shadow-primary: 0 10px 40px -10px rgba(249, 115, 22, .5)}[data-theme=dark][data-gradient=pink]{--gradient-primary: var(--gradient-bg-pink);--gradient-purple-blue: linear-gradient(135deg, #f472b6 0%, #c084fc 100%);--color-primary: #f472b6;--color-primary-dark: #ec4899;--color-primary-light: #f9a8d4;--color-primary-ultra-light: #9d174d;--color-secondary: #c084fc;--color-secondary-dark: #a855f7;--color-secondary-light: #d8b4fe;--shadow-primary: 0 10px 40px -10px rgba(236, 72, 153, .5)}.scroll-to-top{position:fixed;bottom:2rem;right:2rem;width:48px;height:48px;border-radius:var(--radius-full);background:var(--gradient-primary);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg),var(--shadow-primary);opacity:0;visibility:hidden;transform:translateY(20px) scale(.8);transition:all var(--transition-medium);z-index:var(--z-sticky);padding:0}.scroll-to-top.visible{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.scroll-to-top:hover:not(:disabled){transform:translateY(-4px) scale(1.05);box-shadow:var(--shadow-xl),var(--shadow-primary)}.scroll-to-top:active:not(:disabled){transform:translateY(-2px) scale(1)}.scroll-to-top svg{width:24px;height:24px;stroke-width:2.5}[data-theme=dark] .scroll-to-top{background:var(--gradient-purple-blue);box-shadow:var(--shadow-lg),0 10px 40px -10px color-mix(in srgb,var(--color-primary) 60%,transparent)}@media(max-width:768px){.scroll-to-top{bottom:1.5rem;right:1.5rem;width:44px;height:44px}.scroll-to-top svg{width:22px;height:22px}}@media(max-width:480px){.scroll-to-top{bottom:1rem;right:1rem;width:40px;height:40px}.scroll-to-top svg{width:20px;height:20px}}