:root{--color-white:#fff;--color-black:#000;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--color-blue-50:#eff6ff;--color-blue-100:#dbeafe;--color-blue-200:#bfdbfe;--color-blue-300:#93c5fd;--color-blue-400:#60a5fa;--color-blue-500:#3b82f6;--color-blue-600:#2563eb;--color-blue-700:#1d4ed8;--color-blue-800:#1e40af;--color-blue-900:#1e3a8a;--color-blue-950:#172554;--color-primary:#2563eb;--color-primary-hover:#1d4ed8;--color-primary-light:#dbeafe;--color-primary-active:#1e40af;--color-primary-lighter:#60a5fa;--color-primary-dark:#1e40af;--color-primary-darker:#1e3a8a;--color-secondary:#64748b;--color-secondary-hover:#475569;--color-secondary-active:#334155;--color-secondary-light:#f1f5f9;--color-secondary-dark:#1e293b;--color-accent:#f59e0b;--color-accent-hover:#d97706;--color-accent-active:#b45309;--color-accent-light:#fef3c7;--color-accent-dark:#78350f;--color-success:#10b981;--color-success-hover:#059669;--color-success-active:#047857;--color-success-light:#d1fae5;--color-success-dark:#064e3b;--color-warning:#f59e0b;--color-warning-hover:#d97706;--color-warning-active:#b45309;--color-warning-light:#fef3c7;--color-warning-dark:#78350f;--color-error:#ef4444;--color-error-hover:#dc2626;--color-error-active:#b91c1c;--color-error-light:#fee2e2;--color-error-dark:#7f1d1d;--color-info:#3b82f6;--color-info-hover:#2563eb;--color-info-active:#1d4ed8;--color-info-light:#dbeafe;--color-info-dark:#1e3a8a;--color-surface:#fff;--color-surface-alt:#f8fafc;--color-surface-raised:#fff;--color-surface-overlay:hsla(0,0%,100%,.95);--color-surface-elevated:#fff;--color-surface-floating:#fff;--color-surface-glass:hsla(0,0%,100%,.8);--color-surface-card:#fff;--color-surface-hover:#f9fafb;--color-background:var(--color-surface);--color-background-alt:var(--color-surface-alt);--color-background-hover:var(--color-surface-hover);--color-background-muted:var(--color-gray-50);--color-border:#e5e7eb;--color-border-muted:#f3f4f6;--color-border-strong:#d1d5db;--color-border-focus:var(--color-primary);--color-border-error:var(--color-error);--color-border-success:var(--color-success);--color-border-warning:var(--color-warning);--color-border-primary:var(--color-primary-light);--color-border-hover:var(--color-primary-lighter);--color-text:#1f2937;--color-text-body:#374151;--color-text-heading:#111827;--color-text-muted:#6b7280;--color-text-subtle:#6b7280;--color-text-inverse:#fff;--color-text-disabled:#d1d5db;--color-text-placeholder:#6b7280;--color-link:var(--color-primary);--color-link-hover:var(--color-primary-hover);--color-link-visited:var(--color-primary-active);--color-link-focus:var(--color-primary);--color-input:var(--color-surface);--color-input-border:var(--color-border);--color-input-border-focus:var(--color-primary);--color-input-border-error:var(--color-error);--color-input-border-success:var(--color-success);--color-input-placeholder:var(--color-text-subtle);--color-input-disabled:var(--color-gray-100);--color-input-disabled-text:var(--color-text-disabled);--color-button-primary:var(--color-primary);--color-button-primary-hover:var(--color-primary-hover);--color-button-primary-active:var(--color-primary-active);--color-button-primary-text:var(--color-white);--color-button-primary-border:var(--color-primary);--color-button-secondary:var(--color-secondary);--color-button-secondary-hover:var(--color-secondary-hover);--color-button-secondary-active:var(--color-secondary-active);--color-button-secondary-text:var(--color-white);--color-button-secondary-border:var(--color-secondary);--color-button-outline:transparent;--color-button-outline-hover:var(--color-primary-light);--color-button-outline-active:var(--color-blue-200);--color-button-outline-text:var(--color-primary);--color-button-outline-text-hover:var(--color-primary-hover);--color-button-outline-border:var(--color-primary);--color-button-outline-border-hover:var(--color-primary-hover);--color-button-ghost:transparent;--color-button-ghost-hover:var(--color-surface-hover);--color-button-ghost-active:var(--color-gray-100);--color-button-ghost-text:var(--color-text-body);--color-button-ghost-text-hover:var(--color-text-heading);--color-button-ghost-border:transparent;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-serif:Georgia,Cambria,"Times New Roman",Times,serif;--font-mono:"Fira Code","Monaco","Cascadia Code","Segoe UI Mono","Roboto Mono","Oxygen Mono","Ubuntu Monospace","Source Code Pro","Fira Mono","Droid Sans Mono","Courier New",monospace;--font-weight-thin:100;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-size-6xl:3.75rem;--font-size-7xl:4.5rem;--font-size-8xl:6rem;--font-size-9xl:8rem;--line-height-none:1;--line-height-tight:1.25;--line-height-snug:1.375;--line-height-normal:1.5;--line-height-relaxed:1.625;--line-height-loose:2;--letter-spacing-tighter:-.05em;--letter-spacing-tight:-.025em;--letter-spacing-normal:0em;--letter-spacing-wide:.025em;--letter-spacing-wider:.05em;--letter-spacing-widest:.1em;--space-0:0;--space-px:1px;--space-0_5:.125rem;--space-1:.25rem;--space-1_5:.375rem;--space-2:.5rem;--space-2_5:.625rem;--space-3:.75rem;--space-3_5:.875rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-7:1.75rem;--space-8:2rem;--space-9:2.25rem;--space-10:2.5rem;--space-11:2.75rem;--space-12:3rem;--space-12_5:3.125rem;--space-14:3.5rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-28:7rem;--space-32:8rem;--space-36:9rem;--space-40:10rem;--space-44:11rem;--space-48:12rem;--space-52:13rem;--space-56:14rem;--space-60:15rem;--space-64:16rem;--space-72:18rem;--space-80:20rem;--space-96:24rem;--radius-none:0;--radius-sm:.125rem;--radius-base:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--border-width-0:0;--border-width-1:1px;--border-width-2:2px;--border-width-4:4px;--border-width-8:8px;--opacity-0:0;--opacity-5:.05;--opacity-10:.1;--opacity-20:.2;--opacity-25:.25;--opacity-30:.3;--opacity-40:.4;--opacity-50:.5;--opacity-60:.6;--opacity-70:.7;--opacity-75:.75;--opacity-80:.8;--opacity-90:.9;--opacity-95:.95;--opacity-100:1;--container-max-width:1200px;--container-padding-x:2rem;--breakpoint-sm:640px;--breakpoint-md:768px;--breakpoint-lg:1024px;--breakpoint-xl:1280px;--breakpoint-2xl:1536px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1440px;--transition-fast:.15s ease;--transition-normal:.2s ease;--transition-slow:.3s ease;--transition-slower:.5s ease;--ease-linear:linear;--ease-in:cubic-bezier(.4,0,1,1);--ease-out:cubic-bezier(0,0,.2,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--ease-bounce:cubic-bezier(.68,-.55,.265,1.55);--ease-elastic:cubic-bezier(.175,.885,.32,1.275);--focus-ring-color:var(--color-primary);--focus-ring-color-light:var(--color-primary-light);--focus-ring-width:2px;--focus-ring-width-strong:3px;--focus-ring-offset:2px;--focus-ring:0 0 0 var(--focus-ring-width) var(--focus-ring-color);--focus-ring-inset:inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color);--focus-ring-strong:0 0 0 var(--focus-ring-width-strong) var(--focus-ring-color-light);--z-auto:auto;--z-0:0;--z-10:10;--z-20:20;--z-30:30;--z-40:40;--z-50:50;--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal-backdrop:1040;--z-modal:1050;--z-popover:1060;--z-tooltip:1070;--z-toast:1080;--sidebar-width:280px;--sidebar-collapsed-width:64px;--header-height:72px;--dashboard-padding:var(--space-6);--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 0 rgba(0,0,0,.06);--shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,.25);--shadow-inner:inset 0 2px 4px 0 rgba(0,0,0,.06);--shadow-focus:0 0 0 3px var(--color-primary-light);--shadow-focus-strong:0 0 0 4px var(--color-primary-light);--shadow-error:0 0 0 3px var(--color-error-light);--shadow-success:0 0 0 3px var(--color-success-light);--shadow-warning:0 0 0 3px var(--color-warning-light);--shadow-header:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);--shadow-dropdown:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--shadow-card:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);--shadow-card-hover:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--gradient-primary:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);--gradient-primary-soft:linear-gradient(135deg,var(--color-primary-light) 0%,var(--color-primary) 100%);--gradient-secondary:linear-gradient(135deg,var(--color-secondary) 0%,var(--color-secondary-hover) 100%);--gradient-surface:linear-gradient(135deg,var(--color-white) 0%,var(--color-surface-alt) 100%);--gradient-hero:linear-gradient(135deg,#fff,#f8fafc 50%,#f1f5f9);--gradient-card:linear-gradient(135deg,var(--color-white) 0%,var(--color-surface-alt) 100%);--gradient-glass:linear-gradient(135deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,.05));--gradient-overlay:linear-gradient(135deg,rgba(0,0,0,.1),rgba(0,0,0,.05));--gradient-logo:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-active) 100%);--gradient-header:linear-gradient(135deg,var(--color-surface-overlay) 0%,var(--color-surface-glass) 100%);--gradient-button:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);--gradient-button-hover:linear-gradient(135deg,var(--color-primary-hover) 0%,var(--color-primary-active) 100%);--gradient-brand-text:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);--color-category-blue:var(--color-primary);--color-category-blue-light:var(--color-primary-light);--color-category-purple:#8b5cf6;--color-category-purple-light:#a78bfa;--color-category-green:var(--color-success);--color-category-green-light:var(--color-success-light);--color-category-orange:var(--color-warning);--color-category-orange-light:var(--color-warning-light);--color-category-red:var(--color-error);--color-category-red-light:var(--color-error-light);--color-category-teal:#14b8a6;--color-category-teal-light:#5eead4;--gradient-category-blue:linear-gradient(135deg,var(--color-category-blue),var(--color-category-blue-light));--gradient-category-purple:linear-gradient(135deg,var(--color-category-purple),var(--color-category-purple-light));--gradient-category-green:linear-gradient(135deg,var(--color-category-green),var(--color-category-green-light));--gradient-category-orange:linear-gradient(135deg,var(--color-category-orange),var(--color-category-orange-light));--gradient-category-red:linear-gradient(135deg,var(--color-category-red),var(--color-category-red-light));--gradient-category-teal:linear-gradient(135deg,var(--color-category-teal),var(--color-category-teal-light));--color-google:#db4437;--color-google-hover:#c23321;--color-google-light:#f8d7da;--color-facebook:#1877f2;--color-facebook-hover:#166fe5;--color-facebook-light:#e3f2fd;--color-microsoft:#00a4ef;--color-microsoft-hover:#0091d9;--color-microsoft-light:#e1f5fe}@media (prefers-reduced-motion:reduce){:root{--transition-fast:.01s;--transition-normal:.01s;--transition-slow:.01s;--transition-slower:.01s}}@media print{:root{--color-background:#fff;--color-text:#000;--color-border:#000;--shadow-sm:none;--shadow-md:none;--shadow-lg:none;--shadow-xl:none;--shadow-2xl:none}}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body,html{line-height:var(--line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none;-webkit-overflow-scrolling:touch;background-color:var(--color-surface)}body{color:var(--color-text-body);font-family:var(--font-sans);font-feature-settings:"kern" 1,"liga" 1,"calt" 1;font-size:var(--font-size-base);font-weight:var(--font-weight-normal);overflow-x:hidden;text-rendering:optimizeLegibility}::selection{background:var(--color-primary);color:var(--color-text-inverse)}::-moz-selection{background:var(--color-primary);color:var(--color-text-inverse)}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}#root{background-color:var(--color-surface);min-height:100vh;overscroll-behavior:none;position:relative;-webkit-overflow-scrolling:touch}body.loading{overflow:hidden}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}button{background:none;border:none;color:inherit;cursor:pointer}button:disabled,input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;opacity:var(--opacity-60)}input,select,textarea{background:var(--color-input);border:var(--border-width-1) solid var(--color-input-border);border-radius:var(--radius-md);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input::-moz-placeholder,textarea::-moz-placeholder{color:var(--color-input-placeholder)}input::placeholder,textarea::placeholder{color:var(--color-input-placeholder)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.form-input{background:var(--color-input);border:var(--border-width-1) solid var(--color-input-border);border-radius:var(--radius-md);color:var(--color-text);font-size:var(--font-size-base);padding:var(--space-3) var(--space-4);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);width:100%}.form-input:focus{border-color:var(--color-input-border-focus);box-shadow:var(--focus-ring);outline:none}.form-input:disabled{background:var(--color-background-muted);color:var(--color-text-subtle);cursor:not-allowed}.form-input:invalid{border-color:var(--color-error)}.form-input:invalid:focus{box-shadow:0 0 0 var(--focus-ring-width) var(--color-error)}.form-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right var(--space-3) center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:var(--space-10)}img{display:block;height:auto;max-width:100%}a{color:var(--color-link);transition:color var(--transition-fast)}a:hover{color:var(--color-link-hover);text-decoration:none}ul{list-style:none}table{background:var(--color-surface);border-collapse:collapse;border-radius:var(--radius-lg);border-spacing:0;box-shadow:var(--shadow-sm);overflow:hidden;width:100%}[role=button]:focus-visible,[tabindex]:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.btn:focus-visible,.card:focus-visible,.form-input:focus-visible{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}h1,h2,h3,h4,h5,h6{letter-spacing:var(--letter-spacing-tight);margin:0}p{line-height:var(--line-height-relaxed)}strong{color:var(--color-text);font-weight:var(--font-weight-semibold)}code{background:var(--color-background-muted);border-radius:var(--radius-sm);color:var(--color-text);font-family:var(--font-mono);font-size:.95em;font-size:.875em;padding:var(--space-1) var(--space-2)}@media (max-width:var(--breakpoint-md )){.form-input,.form-select,.form-textarea{font-size:var(--font-size-sm);padding:var(--space-2_5) var(--space-3)}.form-group{margin-bottom:var(--space-3)}}@media (max-width:var(--breakpoint-sm )){.form-input,.form-select,.form-textarea{font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3)}.form-group{margin-bottom:var(--space-2)}}@media (prefers-contrast:high){:root{--color-border:var(--color-gray-400);--color-border-strong:var(--color-gray-600);--color-text-muted:var(--color-gray-700);--color-text-subtle:var(--color-gray-600)}}@supports (-webkit-touch-callout:none){#root,body,html{overscroll-behavior:none;-webkit-overflow-scrolling:touch;background-color:var(--color-surface)!important}body{height:100%;overflow:hidden;position:fixed;width:100%}#root{height:100vh;overflow-y:auto;-webkit-overflow-scrolling:touch}}@media print{*{background:transparent!important;box-shadow:none!important;color:#000!important;text-shadow:none!important}a,a:visited{text-decoration:none}a[href]:after{content:" (" attr(href) ")"}img{page-break-inside:avoid;max-width:100%!important}h2,h3,p{orphans:3;widows:3}h2,h3{page-break-after:avoid}}h1,h2,h3,h4,h5,h6{color:var(--color-text-heading);font-family:var(--font-sans);letter-spacing:-.01em;line-height:var(--line-height-tight);margin-bottom:var(--space-4);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold)}h1{font-size:var(--font-size-4xl);letter-spacing:-.02em;line-height:1.2;margin-bottom:var(--space-6)}h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:-.015em;line-height:1.25;margin-bottom:var(--space-5)}h3{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;line-height:1.3;margin-bottom:var(--space-4)}h4{font-size:var(--font-size-xl);letter-spacing:-.005em;line-height:1.35}h4,h5{font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}h5{font-size:var(--font-size-lg)}h5,h6{line-height:var(--line-height-normal)}h6{margin-bottom:var(--space-2)}h6,p{font-size:var(--font-size-base)}p{color:var(--color-text-body);font-weight:var(--font-weight-normal);line-height:1.6;margin-bottom:var(--space-4);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--color-text-link);font-weight:var(--font-weight-medium);position:relative;text-decoration:none;transition:color .2s cubic-bezier(.4,0,.2,1)}a:hover{color:var(--color-text-link-hover);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px}a:focus{border-radius:2px;outline:2px solid var(--color-primary);outline-offset:2px}a:focus-visible{border-radius:var(--radius-sm);box-shadow:var(--focus-ring);outline:none}a:visited{color:var(--color-link-visited)}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}@media (max-width:1024px){h1{font-size:var(--font-size-4xl)}h2{font-size:var(--font-size-3xl)}h3{font-size:var(--font-size-2xl)}h4{font-size:var(--font-size-xl)}h5{font-size:var(--font-size-lg)}h6{font-size:var(--font-size-base)}}@media (max-width:768px){h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5{font-size:var(--font-size-base)}h6,p{font-size:var(--font-size-sm)}p{line-height:var(--line-height-normal)}}@media (max-width:480px){h1{font-size:var(--font-size-2xl)}h2{font-size:var(--font-size-xl)}h3{font-size:var(--font-size-lg)}h4{font-size:var(--font-size-base)}h5{font-size:var(--font-size-sm)}h6,p{font-size:var(--font-size-xs)}p{line-height:var(--line-height-normal)}}@media print{h1,h2,h3,h4,h5,h6{page-break-after:avoid}h1,h2,h3,h4,h5,h6,p{color:#000!important}p{orphans:3;widows:3}a{color:#000!important;text-decoration:underline}}.container{box-sizing:border-box;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);position:relative;transition:padding var(--transition-fast);width:100%}.section{padding:var(--space-12) 0}.dashboard-header{background:var(--color-surface);border-bottom:var(--border-width-1) solid var(--color-border);box-shadow:var(--shadow-sm);grid-area:header;padding:0 var(--space-6);position:sticky;top:0;z-index:var(--z-sticky)}.grid{gap:var(--space-4)}@media (max-width:1280px){.container{box-sizing:border-box;padding:0 var(--space-6)}.section{padding:var(--space-10) 0}}@media (max-width:1024px){.container{padding:0 var(--space-4)}.section{padding:var(--space-8) 0}}@media (max-width:768px){.container{padding:0 var(--space-3)}.section{padding:var(--space-6) 0}.dashboard-header{padding:0 var(--space-4)}}@media (max-width:640px){.container{padding:0 var(--space-2)}.section{padding:var(--space-4) 0}.dashboard-header{padding:0 var(--space-3)}}.flex{display:flex}.grid{display:grid}.hidden{display:none}.items-center{align-items:center}.justify-center{justify-content:center}.min-h-screen{min-height:100vh}.rounded-full{border-radius:9999px}.page{background:var(--color-surface);min-height:100vh;transition:background-color var(--transition-fast),transform var(--transition-fast)}.btn{align-items:center;background:var(--color-button-primary);border:1px solid transparent;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:var(--color-button-primary-text);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);overflow:hidden;padding:var(--space-3) var(--space-6);position:relative;text-decoration:none;text-rendering:optimizeLegibility;transition:all var(--transition-smooth);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.btn:hover:not(.btn--disabled){background:var(--color-button-primary-hover);border-color:var(--color-button-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn:focus-visible{border-color:var(--color-primary);box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.btn:active:not(.btn--disabled){background:var(--color-button-primary-active);box-shadow:var(--shadow-sm);transform:translateY(0)}.btn--secondary{background:var(--color-button-secondary);color:var(--color-button-secondary-text)}.btn--secondary:hover:not(.btn--disabled){background:var(--color-button-secondary-hover);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn--secondary:active:not(.btn--disabled){background:var(--color-button-secondary-active)}.btn--sm{font-size:var(--font-size-xs);min-height:32px;padding:var(--space-2) var(--space-4)}.btn--lg{font-size:var(--font-size-base);min-height:48px;padding:var(--space-4) var(--space-8)}.btn--full-width{width:100%}.btn--loading{cursor:not-allowed;pointer-events:none}.btn--disabled{cursor:not-allowed;opacity:var(--opacity-60)}.btn--disabled,.btn--disabled:hover{box-shadow:none!important;transform:none!important}.btn__content{align-items:center;display:flex;gap:var(--space-2)}.btn__spinner{height:16px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:16px}.btn__spinner-icon{animation:spin 1s linear infinite;height:100%;width:100%}.btn__spinner-circle{animation:dash 1.5s ease-in-out infinite}.card{background:var(--color-card);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;padding:var(--space-6);position:relative;transition:background-color var(--transition-fast),transform var(--transition-fast)}.card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-1px)}.card:focus-within{border-color:var(--color-primary);box-shadow:var(--shadow-focus)}.card--hover:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.spinner{animation:spin 1s ease-in-out infinite;border:2px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);display:inline-block;height:20px;width:20px}.form-group{margin-bottom:var(--space-4)}.form-input,.form-select,.form-textarea{background:var(--color-input);border:var(--border-width-1) solid var(--color-input-border);border-radius:var(--radius-md);box-sizing:border-box;min-height:44px;transition:all var(--transition-smooth)}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--color-input-border-focus);box-shadow:var(--focus-ring)}.form-input:focus-visible,.form-select:focus-visible,.form-textarea:focus-visible{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.form-input:invalid,.form-select:invalid,.form-textarea:invalid{border-color:var(--color-error)}.form-input:invalid:focus,.form-select:invalid:focus,.form-textarea:invalid:focus{box-shadow:0 0 0 var(--focus-ring-width) var(--color-error)}.form-textarea{min-height:100px}.modal{align-items:center;background:#00000080;display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;opacity:0;padding:var(--space-4);position:fixed;transition:background-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast);visibility:hidden;z-index:var(--z-modal)}.modal__content{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);max-height:90vh;max-width:500px;overflow-y:auto;transform:scale(.95);transition:transform var(--transition-fast);width:100%}.modal__header{align-items:center;border-bottom:var(--border-width-1) solid var(--color-border);display:flex;justify-content:space-between;padding:var(--space-6)}.modal__title{color:var(--color-text);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.modal__close{align-items:center;background:none;border:none;border-radius:var(--radius-sm);color:var(--color-text-muted);cursor:pointer;display:flex;justify-content:center;min-height:44px;min-width:44px;padding:var(--space-2);transition:background-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast)}.modal__close:hover{background:var(--color-surface-hover);color:var(--color-text)}.modal__close:focus{outline:2px solid var(--color-primary);outline-offset:2px}.modal__close:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.alert{align-items:flex-start;border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);display:flex;gap:var(--space-3);margin-bottom:var(--space-4);padding:var(--space-4)}.avatar{align-items:center;background:var(--gradient-primary);border-radius:50%;color:var(--color-text-inverse);display:inline-flex;font-weight:var(--font-weight-semibold);justify-content:center;overflow:hidden;transition:background-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast)}.avatar img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.avatar:hover{box-shadow:var(--shadow-md);transform:scale(1.05)}.loading{opacity:.6;pointer-events:none;position:relative}.loading:after{animation:spin 1s linear infinite;border:2px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);content:"";height:20px;left:50%;margin:-10px 0 0 -10px;position:absolute;top:50%;width:20px}.error{background-color:var(--color-error-light)!important;border-color:var(--color-error)!important}.success{background-color:var(--color-success-light)!important;border-color:var(--color-success)!important}.warning{background-color:var(--color-warning-light)!important;border-color:var(--color-warning)!important}.info{background-color:var(--color-info-light)!important;border-color:var(--color-info)!important}@media (max-width:var(--breakpoint-lg )){.btn{font-size:var(--font-size-sm);padding:var(--space-2_5) var(--space-5)}.btn--lg{font-size:var(--font-size-base);padding:var(--space-3_5) var(--space-7)}.card{padding:var(--space-5)}}@media (max-width:var(--breakpoint-md )){.modal{padding:var(--space-2)}.card,.modal__header{padding:var(--space-4)}.btn{padding:var(--space-2) var(--space-4)}.btn,.btn--lg{font-size:var(--font-size-sm)}.btn--lg{padding:var(--space-3) var(--space-6)}.btn--sm{font-size:var(--font-size-xs);padding:var(--space-1_5) var(--space-3)}}@media (max-width:var(--breakpoint-sm )){.btn{font-size:var(--font-size-xs);padding:var(--space-2) var(--space-3)}.btn--lg{font-size:var(--font-size-sm);padding:var(--space-2_5) var(--space-5)}.alert,.card,.modal__header{padding:var(--space-3)}.alert{font-size:var(--font-size-sm)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-down{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-right{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-left{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes bounce{0%,20%,53%,80%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translateZ(0)}40%,43%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-30px,0)}70%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-15px,0)}90%{transform:translate3d(0,-4px,0)}}@keyframes shake{0%,to{transform:translateZ(0)}10%,30%,50%,70%,90%{transform:translate3d(-10px,0,0)}20%,40%,60%,80%{transform:translate3d(10px,0,0)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes wiggle{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes slide-up-down{0%,to{transform:translateY(0)}25%{transform:translateY(-15px)}75%{transform:translateY(15px)}}@keyframes glow{0%{box-shadow:0 0 5px var(--color-primary)}to{box-shadow:0 0 20px var(--color-primary),0 0 30px var(--color-primary)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.animate-spin{animation:spin 1s linear infinite}.animate-fade-in{animation:fade-in var(--transition-normal) ease-out forwards}.animate-fade-out{animation:fade-out var(--transition-normal) ease-out forwards}.animate-scale-in{animation:scale-in var(--transition-normal) ease-out forwards}.animate-scale-out{animation:scale-out var(--transition-normal) ease-out forwards}.animate-slide-in-up{animation:slide-in-up var(--transition-normal) ease-out forwards}.animate-slide-in-down{animation:slide-in-down var(--transition-normal) ease-out forwards}.animate-slide-in-right{animation:slide-in-right var(--transition-normal) ease-out forwards}.animate-slide-in-left{animation:slide-in-left var(--transition-normal) ease-out forwards}.animate-bounce{animation:bounce 1s infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-shake{animation:shake .82s cubic-bezier(.36,.07,.19,.97) both}.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}.animate-wiggle{animation:wiggle 1s ease-in-out infinite}.animate-float{animation:float 3s ease-in-out infinite}.animate-slide-up-down{animation:slide-up-down 8s ease-in-out infinite}.animate-glow{animation:glow 2s ease-in-out infinite alternate}.animate-duration-fast{animation-duration:var(--transition-fast)}.animate-duration-normal{animation-duration:var(--transition-normal)}.animate-duration-slow{animation-duration:var(--transition-slow)}.animate-duration-slower{animation-duration:var(--transition-slower)}.animate-delay-1{animation-delay:.1s}.animate-delay-2{animation-delay:.2s}.animate-delay-3{animation-delay:.3s}.animate-delay-4{animation-delay:.4s}.animate-delay-5{animation-delay:.5s}.animate-fill-forwards{animation-fill-mode:forwards}.animate-fill-backwards{animation-fill-mode:backwards}.animate-fill-both{animation-fill-mode:both}.animate-paused{animation-play-state:paused}.animate-running{animation-play-state:running}.transition{transition-duration:var(--transition-fast);transition-property:all;transition-timing-function:var(--ease-in-out)}.animate-bounce:not(.animating),.animate-fade-in:not(.animating),.animate-fade-out:not(.animating),.animate-glow:not(.animating),.animate-pulse:not(.animating),.animate-spin:not(.animating){will-change:auto}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.animate-bounce,.animate-float,.animate-glow,.animate-ping,.animate-pulse,.animate-shake,.animate-slide-up-down,.animate-spin,.animate-wiggle{animation:none!important}.animate-duration-normal,.animate-duration-slow,.animate-duration-slower{animation-duration:.01ms!important}}.animate-fade-in,.animate-fade-out,.animate-scale-in,.animate-scale-out,.animate-slide-in-down,.animate-slide-in-left,.animate-slide-in-right,.animate-slide-in-up{animation-fill-mode:both}.animate-none{animation:none}@media (max-width:1024px){.animate-duration-normal{animation-duration:var(--transition-fast)}.animate-duration-slow{animation-duration:var(--transition-normal)}.animate-pulse{animation-duration:1.5s}}@media (max-width:768px){.animate-duration-normal,.animate-duration-slow{animation-duration:var(--transition-fast)}.animate-bounce{animation-duration:.8s}.animate-shake{animation-duration:.6s}.animate-pulse{animation-duration:1s}}@media (max-width:480px){.animate-bounce{animation-duration:.6s}.animate-shake{animation-duration:.4s}.animate-pulse,.animate-spin{animation-duration:.8s}}@media print{.animate-bounce,.animate-fade-in,.animate-fade-out,.animate-float,.animate-glow,.animate-ping,.animate-pulse,.animate-scale-in,.animate-scale-out,.animate-shake,.animate-slide-in-down,.animate-slide-in-left,.animate-slide-in-right,.animate-slide-in-up,.animate-slide-up-down,.animate-spin,.animate-wiggle{animation:none!important}}@media (prefers-contrast:high){:root{--color-border:var(--color-gray-400);--color-border-strong:var(--color-gray-600);--color-text-muted:var(--color-gray-700);--color-text-subtle:var(--color-gray-600)}[data-theme=dark]{--color-border:var(--color-gray-500);--color-border-strong:var(--color-gray-300);--color-text-muted:var(--color-gray-200);--color-text-subtle:var(--color-gray-300)}[role=button],a,button,input,select,textarea{border:1px solid}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}html{scroll-behavior:auto}.animate-bounce,.animate-fade-in,.animate-float,.animate-ping,.animate-pulse,.animate-slide-in,.animate-spin{animation:none!important}}[aria-live=polite]{height:1px;left:-10000px;overflow:hidden;position:absolute;width:1px}@media (pointer:coarse){[role=button],a,button,input[type=button],input[type=reset],input[type=submit]{min-height:44px;min-width:44px}}.status-success:before{border-color:var(--color-success)}.status-warning:before{border-color:var(--color-warning)}.status-error:before{border-color:var(--color-error)}.status-info:before{border-color:var(--color-info)}@media (prefers-contrast:high){[role=button],a,button,input,select,textarea{border:1px solid}}@media print{a[href]:after{color:#000;content:" (" attr(href) ")";font-size:.8em}.sr-only{display:none!important}*{background:#fff!important;color:#000!important}}.alert,.avatar,.btn,.card,.form-input,.form-select,.form-textarea,.header-wrapper,.modal{contain:layout style}.flex,.grid,.header-actions,.header-nav{contain:layout}.btn:not(.btn--disabled):hover{transform:translateY(-1px)}.card:hover{transform:translateY(-2px)}.form-input:focus,.form-select:focus,.form-textarea:focus{transform:translateY(-1px)}.grid,.header,.navigation{contain:layout style}@media (max-width:var(--breakpoint-md )){.animate-bounce,.animate-pulse,.animate-spin{animation-duration:.8s}.animate-float,.animate-glow,.animate-wiggle{animation:none}.btn,.card,.form-input{transition-duration:var(--transition-fast)}.btn:hover,.card:hover,.form-input:focus{transform:none}.animate-bounce,.animate-pulse,.animate-spin{will-change:auto}}@media (prefers-reduced-motion:reduce){.animate-bounce,.animate-float,.animate-glow,.animate-ping,.animate-pulse,.animate-shake,.animate-spin,.animate-wiggle{animation:none!important}.transition{transition:none!important}.btn:hover,.card:hover{transform:none!important}}@media print{.animate-bounce,.animate-float,.animate-glow,.animate-ping,.animate-pulse,.animate-shake,.animate-spin,.animate-wiggle{animation:none!important}.transition{transition:none!important}.alert,.card,.modal{contain:none}}img{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}img[loading=lazy]{opacity:0;transition:opacity var(--transition-normal)}@media print{*{box-shadow:none!important;text-shadow:none!important}*,:after,:before{background:transparent!important;color:#000!important}body,html{font-size:12pt;line-height:1.4}body{background:#fff;color:#000}h1,h2,h3,h4,h5,h6{color:#000!important;page-break-after:avoid;font-weight:700}h1{font-size:18pt;margin-bottom:12pt}h2{font-size:16pt;margin-bottom:10pt}h3{font-size:14pt;margin-bottom:8pt}h4,h5,h6{font-size:12pt;margin-bottom:6pt}p{margin-bottom:8pt;orphans:3;widows:3}a,a:visited,p{color:#000!important}a,a:visited{text-decoration:underline}a[href]:after,a[href^=http]:after{color:var(--color-text-muted);content:" (" attr(href) ")";font-size:.8em}img{height:auto!important;max-width:100%!important}img,table{page-break-inside:avoid}table{border-collapse:collapse!important;width:100%!important}.btn,button,input[type=button],input[type=reset],input[type=submit]{display:none!important}input[type=email],input[type=password],input[type=text],select,textarea{background:#fff!important;border:1px solid var(--color-black)!important;color:#000!important;padding:2pt!important}input[type=checkbox]:checked:before{content:"✓ "}input[type=radio]:checked:before{content:"● "}.header-auth,.header-menu-btn,.header-nav,.header-user-btn,.modal,.nav,.navigation,.pagination,nav{display:none!important}.alert,.card{background:#fff!important;border:1px solid var(--color-black)!important;page-break-inside:avoid;margin-bottom:8pt;padding:8pt!important}.grid,.grid>*{display:block!important}.grid>*{margin-bottom:8pt;width:100%!important}.flex,.flex>*{display:block!important}.flex>*{margin-bottom:4pt}.container{max-width:none!important;width:100%!important}.container,.sr-only{margin:0!important;padding:0!important}.sr-only{height:auto!important;overflow:visible!important;position:static!important;width:auto!important;clip:auto!important;border:0!important;white-space:normal!important}*,:after,:before{animation:none!important;transform:none!important;transition:none!important}}@media print{@page{margin:1in;size:A4}}@media print{@page{@bottom-center{color:#666;content:"Page " counter(page) " of " counter(pages);font-size:10pt}}}.header-brand,.header-dropdown-item,.header-menu-btn,.header-nav-link,.header-user-btn,.header-wrapper{will-change:transform,opacity,background-color}.alert,.avatar,.btn,.card,.form-input,.modal{transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}:root{color-scheme:light}.alert,.avatar,.btn,.card,.dashboard-header,.form-input,.header-wrapper,.modal{transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.disabled{cursor:not-allowed;opacity:.6;pointer-events:none}@media (prefers-contrast:high){:root{--color-border:var(--color-gray-400);--color-border-strong:var(--color-gray-600);--color-text-muted:var(--color-gray-600);--color-text-subtle:var(--color-gray-500)}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.header-mobile-overlay{background:#00000080;bottom:0;left:0;opacity:1;position:fixed;right:0;top:0;transition:all var(--transition-normal);visibility:visible;z-index:calc(var(--z-modal-backdrop) - 1)}@media (min-width:calc(var(--breakpoint-lg ) + 1px)){.header-mobile-overlay{display:none}}.header-wrapper{border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-header);contain:layout style paint;position:sticky;top:0;transform:translateY(0);transition:all var(--transition-normal);will-change:transform,opacity,background-color,box-shadow;z-index:var(--z-sticky)}.header-wrapper,.header-wrapper.scrolled{background:var(--color-surface)!important}.header-wrapper.scrolled{border-bottom-color:var(--color-border-primary);border-bottom-width:1px;box-shadow:var(--shadow-lg)}.header-bar{background:var(--color-surface);box-sizing:border-box;gap:var(--space-6);justify-content:space-between;margin:0 auto;max-width:1400px;min-height:var(--header-height);padding:var(--space-4) var(--space-12)}.header-bar,.header-brand{align-items:center;display:flex;position:relative}.header-brand{border-radius:var(--radius-lg);color:var(--color-text-body);gap:var(--space-3);overflow:hidden;padding:var(--space-2) var(--space-3)}.header-brand,.header-brand:hover{text-decoration:none}.header-logo-gradient{align-items:center;background:var(--gradient-logo);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);display:flex;height:44px;justify-content:center;overflow:hidden;padding:var(--space-2);position:relative;width:44px}.header-logo-gradient:before{background:linear-gradient(45deg,transparent 30%,var(--color-white) 50%,transparent 70%);bottom:0;content:"";left:0;opacity:.2;position:absolute;right:0;top:0;transform:translate(-100%)}.header-logo{filter:brightness(0) invert(1);height:28px;-o-object-fit:contain;object-fit:contain;position:relative;width:28px;z-index:1}.header-brand-text-gradient{background:var(--gradient-brand-text);-webkit-background-clip:text;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:var(--letter-spacing-tight);position:relative;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.header-nav{gap:var(--space-2);list-style:none;margin:0;padding:0}.header-nav,.header-nav-link{align-items:center;display:flex}.header-nav-link{box-sizing:border-box;color:var(--color-text-body)!important;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);min-height:44px;min-width:44px;overflow:hidden;padding:var(--space-3) var(--space-4);position:relative;text-decoration:none;white-space:nowrap}.header-nav-link:hover{color:var(--color-primary-hover)!important;text-decoration:none!important}.header-nav-link:focus{color:var(--color-primary)!important;outline:none;text-decoration:none!important}.header-nav-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.header-nav-link.active{color:var(--color-primary-hover)!important;font-weight:var(--font-weight-semibold);position:relative}.header-nav-link.active:after{background:var(--color-primary);border-radius:var(--radius-full);bottom:-2px;content:"";height:2px;left:50%;position:absolute;transform:translate(-50%);width:20px}.header-actions{align-items:center;display:flex;gap:var(--space-2);margin-left:var(--space-4)}.header-user-section{align-items:center;display:flex;gap:var(--space-4)}.header-welcome{color:var(--color-text-muted);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-username{color:var(--color-text);font-weight:var(--font-weight-semibold)}.header-user-menu{position:relative}.header-user-btn{align-items:center;background:var(--color-primary);border:none;border-radius:50%;box-shadow:var(--shadow-sm);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);height:44px;justify-content:center;min-height:44px;min-width:44px;transition:all var(--transition-normal);width:44px}.header-user-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);text-decoration:none!important;transform:scale(1.05)}.header-user-btn:focus{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.header-user-avatar{border-radius:50%;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.header-user-dropdown{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-dropdown);contain:layout style paint;min-width:260px;opacity:0;overflow:hidden;padding:var(--space-4);position:absolute;right:0;top:calc(100% + var(--space-2));transform:translateY(-10px) scale(.95);transition:all var(--transition-normal);visibility:hidden;will-change:transform,opacity,visibility;z-index:var(--z-dropdown)}.header-user-dropdown.open{opacity:1;transform:translateY(0) scale(1);visibility:visible}.header-dropdown-item{align-items:center;background:none;border:none;border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text-body);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-3);min-height:44px;outline:none;padding:var(--space-3) var(--space-4);position:relative;text-align:left;text-decoration:none!important;transition:all var(--transition-fast);width:100%}.header-dropdown-item:hover{background:var(--color-primary-light);color:var(--color-primary-hover);text-decoration:none!important;transform:translate(4px)}.header-dropdown-item:focus{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.header-dropdown-item svg{flex-shrink:0;transition:transform var(--transition-fast)}.header-dropdown-item:hover svg{transform:scale(1.1)}.header-dropdown-header{color:var(--color-text-muted)!important;font-size:var(--font-size-xs)!important;font-weight:var(--font-weight-semibold)!important;letter-spacing:var(--letter-spacing-wide);margin-top:var(--space-2);padding:var(--space-2) var(--space-4) var(--space-1) var(--space-4)!important;text-transform:uppercase}.header-dropdown-header:hover{background:none!important;color:var(--color-text-muted)!important;transform:none!important}.header-dropdown-subitem{color:var(--color-text-subtle)!important;font-size:var(--font-size-xs)!important;padding-left:var(--space-8)!important}.header-dropdown-subitem:hover{color:var(--color-primary)!important}.header-dropdown-divider{background:var(--color-border);height:1px;margin:var(--space-2) 0}.header-dropdown-logout{color:var(--color-error)!important;margin-top:var(--space-2)}.header-dropdown-logout:hover{background:var(--color-error-light)!important;color:var(--color-error)!important}.header-auth{align-items:center;display:flex;gap:var(--space-2);margin-right:0}.header-signin{border:1px solid var(--color-border);border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-text-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);min-height:44px;min-width:44px;overflow:hidden;padding:var(--space-3) var(--space-5);position:relative;text-decoration:none!important;transition:all var(--transition-normal)}.header-signin:before{background:linear-gradient(90deg,transparent,var(--color-primary-light),transparent);content:"";height:100%;left:-100%;opacity:.1;position:absolute;top:0;transition:left var(--transition-slow);width:100%}.header-signin:hover{background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white);text-decoration:none!important;transform:translateY(-1px)}.header-signin:hover:before{left:100%}.header-signin:focus{background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--focus-ring);color:var(--color-white);outline:none;text-decoration:none!important}.header-signin:focus-visible{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.header-getstarted{background:var(--gradient-button);border:1px solid var(--color-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);box-sizing:border-box;color:var(--color-white)!important;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);min-height:44px;min-width:44px;overflow:hidden;padding:var(--space-3) var(--space-6);position:relative;text-decoration:none!important;transition:all var(--transition-normal)}.header-getstarted:before{background:linear-gradient(90deg,transparent,var(--color-white),transparent);content:"";height:100%;left:-100%;opacity:.2;position:absolute;top:0;transition:left var(--transition-slow);width:100%}.header-getstarted:hover{background:var(--gradient-button-hover);border-color:var(--color-primary-hover);box-shadow:var(--shadow-lg);color:var(--color-white);text-decoration:none!important;transform:translateY(-2px)}.header-getstarted:hover:before{left:100%}.header-getstarted:focus{background:var(--gradient-button-hover);border-color:var(--color-primary-hover);box-shadow:var(--focus-ring);color:var(--color-white);outline:none;text-decoration:none!important}.header-getstarted:focus-visible{box-shadow:var(--focus-ring);outline:2px solid var(--color-white);outline-offset:2px}.header-getstarted:active{background:var(--color-primary-active);box-shadow:var(--shadow-md);text-decoration:none!important;transform:translateY(-1px)}.header-menu-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:var(--color-white);cursor:pointer;display:none;height:44px;justify-content:center;min-height:44px;min-width:44px;overflow:hidden;position:relative;transition:all var(--transition-normal);width:44px}.header-menu-btn:before{background:linear-gradient(90deg,transparent,var(--color-white),transparent);content:"";height:100%;left:-100%;opacity:.2;position:absolute;top:0;transition:left var(--transition-slow);width:100%}.header-menu-btn:hover:before{left:100%}.header-menu-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);text-decoration:none!important;transform:scale(1.05)}.header-menu-btn:focus{box-shadow:var(--focus-ring);outline:2px solid var(--color-primary);outline-offset:2px}.test-login-link{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:var(--color-white)!important;font-weight:var(--font-weight-semibold);padding:var(--space-2) var(--space-3);transition:all var(--transition-normal)}.test-login-link:hover{background:linear-gradient(135deg,var(--color-primary-hover) 0,var(--color-primary) 100%);box-shadow:var(--shadow-md);transform:translateY(-2px)}.test-login-link .link-icon{height:16px;margin-right:var(--space-1);width:16px}@media (max-width:var(--breakpoint-xl )){.header-bar{gap:var(--space-4);padding:var(--space-3) var(--space-8)}}@media (max-width:var(--breakpoint-lg )){.header-bar{gap:var(--space-4);padding:var(--space-3) var(--space-4)}.header-brand-text-gradient{font-size:var(--font-size-lg)}.header-nav{display:none}.header-menu-btn{display:flex}.header-welcome{font-size:var(--font-size-xs);max-width:150px}}@media (max-width:var(--breakpoint-md )){.header-bar{gap:var(--space-3);padding:var(--space-3) var(--space-6)}.header-nav{display:none}.header-menu-btn,.header-nav{display:flex}.header-nav{background:var(--color-surface);border-top:1px solid var(--color-border);bottom:0;box-shadow:var(--shadow-xl);flex-direction:column;gap:var(--space-2);left:0;opacity:0;overflow-y:auto;padding:var(--space-8) var(--space-4) var(--space-4);position:fixed;right:0;top:var(--header-height);transform:translate(-100%);transition:all var(--transition-normal);visibility:hidden;z-index:calc(var(--z-modal-backdrop) + 1)}.header-nav.open{opacity:1;transform:translate(0);visibility:visible}.header-nav .header-nav-link{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);justify-content:flex-start;margin-bottom:var(--space-2);min-height:56px;padding:var(--space-4) var(--space-6);width:100%}.header-nav .header-nav-link.active{text-decoration:underline!important;text-decoration-color:var(--color-primary);text-decoration-thickness:2px;text-underline-offset:4px}.header-welcome{display:none}.header-user-section{gap:var(--space-2)}.header-user-btn{min-height:44px;min-width:44px;padding:var(--space-2)}.header-auth{gap:var(--space-2)}.header-signin{border:1px solid var(--color-border);padding:var(--space-3) var(--space-3)}.header-getstarted,.header-signin{font-size:var(--font-size-xs);min-height:44px;min-width:44px}.header-getstarted{border:1px solid var(--color-primary);padding:var(--space-3) var(--space-4)}}@media (max-width:var(--breakpoint-sm )){.header-bar{gap:var(--space-2);padding:var(--space-2) var(--space-4)}.header-brand{flex-shrink:1;gap:var(--space-2);min-width:0}.header-logo-gradient{flex-shrink:0;height:32px;width:32px}.header-logo{height:20px;width:20px}.header-brand-text-gradient{font-size:var(--font-size-sm);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-actions{flex-shrink:0;gap:var(--space-2)}.header-getstarted{border:1px solid var(--color-primary);font-size:var(--font-size-sm);min-height:44px;padding:var(--space-3) var(--space-4)}.header-menu-btn,.header-user-btn{height:40px;min-height:40px;min-width:40px;width:40px}.header-user-dropdown{min-width:200px;padding:var(--space-3);right:-10px}}@media (prefers-reduced-motion:reduce){.header-brand,.header-dropdown-item,.header-getstarted,.header-menu-btn,.header-nav,.header-nav-link,.header-signin,.header-user-btn,.header-user-dropdown,.header-wrapper{animation:none;transition:none}.header-brand:hover,.header-dropdown-item:hover,.header-getstarted:hover,.header-menu-btn:hover,.header-nav-link:hover,.header-signin:hover,.header-user-btn:hover{transform:none}.header-brand:before,.header-getstarted:before,.header-logo-gradient:before,.header-menu-btn:before,.header-nav-link:before,.header-signin:before{display:none}.header-user-dropdown{transform:none!important}}@media (prefers-contrast:high){.header-wrapper{border-bottom-width:2px}.header-nav-link.active:after{height:3px}.header-menu-btn,.header-user-btn{border:2px solid var(--color-primary-dark)}}.header-wrapper:focus-within{box-shadow:var(--shadow-lg)}.header-dropdown-item:focus-visible,.header-getstarted:focus-visible,.header-menu-btn:focus-visible,.header-nav-link:focus-visible,.header-signin:focus-visible,.header-user-btn:focus-visible{border-radius:var(--radius-md);outline:2px solid var(--color-primary);outline-offset:2px}.header-nav:focus-within{outline:none}.header-brand:focus-visible{border-radius:var(--radius-lg);outline:2px solid var(--color-primary);outline-offset:2px}@media (prefers-contrast:high){.header-wrapper{border-bottom-color:var(--color-text);border-bottom-width:2px}.header-menu-btn:focus-visible,.header-nav-link:focus-visible,.header-user-btn:focus-visible{outline-color:var(--color-text);outline-width:3px}.header-dropdown-item:focus-visible{outline-color:var(--color-text);outline-width:3px}}.header-wrapper.loading{opacity:.8;pointer-events:none}.header-wrapper.loading .header-menu-btn,.header-wrapper.loading .header-user-btn{animation:pulse 2s infinite}@supports (-webkit-backdrop-filter:blur(1px)){.header-wrapper,.header-wrapper.scrolled{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.header-bar,.header-wrapper,.header-wrapper.scrolled{background:var(--color-surface)!important}}.header-wrapper{backface-visibility:hidden;transform:translateZ(0)}@media print{.header-wrapper{border-bottom:1px solid var(--color-border);box-shadow:none;position:static}.header-auth,.header-menu-btn,.header-user-dropdown{display:none}.header-nav{background:transparent;border:none;box-shadow:none;flex-direction:row;opacity:1;position:static;transform:none;visibility:visible}}.learning-home{background:var(--color-surface);min-height:100vh;position:relative}.learning-container{margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);width:100%}.learning-section-header{margin-bottom:var(--space-12);text-align:center}.learning-section-title{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.02em;margin-bottom:var(--space-4)}.learning-section-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0 auto;max-width:600px}.learning-hero{align-items:center;background:var(--color-surface);background-image:var(--gradient-hero);contain:layout style paint;display:flex;justify-content:center;min-height:80vh;overflow:hidden;padding:var(--space-20) 0 var(--space-16) 0;position:relative;will-change:transform,opacity}.learning-hero:before{background:radial-gradient(circle at 25% 25%,hsla(0,0%,100%,.05) 1px,transparent 0),radial-gradient(circle at 75% 75%,hsla(0,0%,100%,.05) 1px,transparent 0);background-size:50px 50px;bottom:0;content:"";left:0;opacity:.6;pointer-events:none;position:absolute;right:0;top:0;will-change:opacity}.learning-hero-content{align-items:center;display:grid;gap:var(--space-16);grid-template-columns:1.2fr .8fr;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--space-8);width:100%}@media (max-width:768px){.learning-hero{min-height:70vh;padding:var(--space-16) 0 var(--space-12) 0}.learning-hero-content{gap:var(--space-10);grid-template-columns:1fr;padding:0 var(--space-6);text-align:center}}.learning-hero-text{animation:fadeInLeft 1s ease-out;display:flex;flex-direction:column;gap:var(--space-6);position:relative;will-change:transform,opacity;z-index:2}.learning-hero-badge{align-items:center;animation:fadeInUp 1s ease-out .2s both;background:var(--color-surface-glass);border:1px solid var(--color-border-primary);border-radius:var(--radius-full);color:var(--color-text-heading);display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);margin-bottom:var(--space-1);padding:var(--space-2) var(--space-4);width:-moz-fit-content;width:fit-content}.learning-hero-badge-icon{height:16px;width:16px}.learning-hero-title{color:var(--color-text-heading);font-size:var(--font-size-5xl);font-weight:var(--font-weight-bold);letter-spacing:-.02em;line-height:1.1;margin-bottom:var(--space-2)}.learning-hero-highlight{color:var(--color-primary)}.learning-hero-subtitle{color:var(--color-text-body);font-size:var(--font-size-xl);line-height:1.6;margin-bottom:var(--space-2)}.learning-hero-buttons{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-bottom:var(--space-2)}.learning-hero-features{display:flex;flex-wrap:wrap;gap:var(--space-5)}.learning-hero-feature{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-2)}.learning-hero-feature-icon{color:var(--color-success);height:16px;width:16px}.learning-hero-visual{flex-direction:column;gap:var(--space-6)}.learning-hero-logo,.learning-hero-visual{align-items:center;display:flex;justify-content:center}.learning-hero-logo{animation:slideUpDown 3s ease-in-out infinite;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);height:120px;transition:all var(--transition-normal);width:120px}.learning-hero-logo:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-xl);transform:translateY(-4px) scale(1.02)}.learning-hero-logo:focus{outline:2px solid var(--color-primary);outline-offset:2px}.learning-hero-logo img{height:80px;-o-object-fit:contain;object-fit:contain;width:80px}.learning-hero-stats{display:grid;gap:var(--space-4);grid-template-columns:repeat(2,1fr);width:100%}.learning-stat{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;gap:var(--space-3);padding:var(--space-4);transition:all var(--transition-normal)}.learning-stat:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.learning-stat:focus{outline:2px solid var(--color-primary);outline-offset:2px}.learning-stat-icon{color:var(--color-primary);height:24px;width:24px}.learning-stat-content{display:flex;flex-direction:column}.learning-stat-number{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.learning-stat-label{color:var(--color-text-muted);font-size:var(--font-size-sm)}.learning-hero-shapes{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.learning-shape{background:var(--color-primary-light);border-radius:50%;opacity:.1;position:absolute}.learning-shape-1{animation:float 6s ease-in-out infinite;height:200px;right:10%;top:10%;width:200px}.learning-shape-2{animation:float 8s ease-in-out infinite reverse;bottom:20%;height:150px;left:5%;width:150px}.learning-shape-3{animation:float 10s ease-in-out infinite;height:100px;left:10%;top:50%;width:100px}.learning-featured{background:var(--color-background);padding:var(--space-12) 0}.learning-featured-grid{display:grid;gap:var(--space-8);grid-template-columns:repeat(3,1fr);margin:0 auto;max-width:1400px}.learning-featured-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);box-sizing:border-box;min-height:44px;min-width:44px;overflow:hidden;position:relative;transition:all var(--transition-smooth)}.learning-featured-card-link{color:inherit;display:block}.learning-featured-card-link,.learning-featured-card-link *{text-decoration:none!important}.learning-featured-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-xl);transform:translateY(-8px) scale(1.02)}.learning-featured-card:hover .learning-course-visual{transform:scale(1.05)}.learning-course-visual{align-items:center;border-radius:var(--radius-xl) var(--radius-xl) 0 0;display:flex;height:200px;justify-content:center;overflow:hidden;position:relative;transition:transform var(--transition-smooth)}.learning-course-visual-icon{color:var(--color-white);font-size:var(--font-size-5xl);font-weight:var(--font-weight-bold);letter-spacing:1px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.learning-course-badge{align-items:center;border-radius:var(--radius-full);box-shadow:0 2px 8px #00000026;color:var(--color-white);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);gap:var(--space-1);letter-spacing:.5px;padding:var(--space-2) var(--space-3);position:absolute;right:var(--space-3);text-transform:uppercase;top:var(--space-3)}.learning-course-badge.new{background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-hover) 100%);color:var(--color-white)}.learning-course-badge-icon{height:12px;width:12px}.learning-course-content{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6)}.learning-course-category{color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;margin:0;text-decoration:none!important;text-transform:uppercase}.learning-course-title{color:var(--color-text-heading);display:-webkit-box;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);-webkit-line-clamp:2;line-clamp:2;line-height:1.3;margin:0;-webkit-box-orient:vertical;overflow:hidden;text-decoration:none!important}.learning-course-meta{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--space-4);justify-content:space-between;margin-top:auto}.learning-course-rating{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-2);text-decoration:none!important}.learning-course-rating-icon{color:var(--color-warning);height:16px;width:16px}.learning-course-reviews{color:var(--color-text-subtle);text-decoration:none!important}.learning-course-badges{display:flex;flex-wrap:wrap;gap:var(--space-2)}.learning-course-duration,.learning-course-level{background:var(--color-background-muted);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);padding:var(--space-2) var(--space-3);text-decoration:none!important;text-transform:capitalize;white-space:nowrap}.learning-categories{background:var(--color-background-alt);padding:var(--space-12) 0}.learning-categories-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:0 auto;max-width:1400px}.learning-category-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);box-sizing:border-box;gap:var(--space-3);min-height:44px;min-width:44px;padding:var(--space-6);position:relative;transition:all var(--transition-smooth)}.learning-category-card,.learning-category-card-link{align-items:center;display:flex;flex-direction:column;justify-content:center;text-align:center}.learning-category-card-link{color:inherit;height:100%;width:100%}.learning-category-card-link,.learning-category-card-link *{text-decoration:none!important}.learning-category-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-xl);transform:translateY(-8px) scale(1.02)}.learning-category-card:hover .learning-category-icon{transform:scale(1.1)}.learning-category-icon{align-items:center;background:var(--gradient-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-2xl);height:60px;justify-content:center;margin:0 auto;transition:all var(--transition-smooth);width:60px}.learning-category-icon:hover{box-shadow:var(--shadow-md);transform:scale(1.05)}.learning-category-content{align-items:center;display:flex;flex-direction:column;justify-content:center;text-align:center;width:100%}.learning-category-content h4{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);line-height:1.3;margin:0;text-align:center;text-decoration:none!important;width:100%}.topic-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-6);text-align:center;transition:all var(--transition-normal)}.topic-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.learning-testimonials{background:var(--color-background);padding:var(--space-12) 0}.learning-testimonials-carousel{margin:0 auto;max-width:1400px;position:relative}.learning-testimonials-grid{display:grid;gap:var(--space-8);grid-template-columns:repeat(3,1fr);transition:all var(--transition-smooth)}.learning-testimonials-nav{align-items:center;background:var(--color-surface);border:none;border-radius:50%;box-shadow:var(--shadow-md);color:var(--color-text-heading);cursor:pointer;display:flex;font-size:var(--font-size-lg);height:48px;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);transition:all var(--transition-smooth);width:48px;z-index:2}.learning-testimonials-nav:hover{background:var(--color-primary);box-shadow:var(--shadow-lg);color:var(--color-white);transform:translateY(-50%) scale(1.1)}.learning-testimonials-nav:focus{outline:2px solid var(--color-primary);outline-offset:2px}.learning-testimonials-nav-prev{left:-24px}.learning-testimonials-nav-next{right:-24px}.learning-testimonials-dots{display:flex;gap:var(--space-2);justify-content:center;margin-top:var(--space-8)}.learning-testimonials-dot{background:var(--color-border);border:none;border-radius:50%;cursor:pointer;height:12px;transition:all var(--transition-smooth);width:12px}.learning-testimonials-dot:hover{background:var(--color-primary-light);transform:scale(1.2)}.learning-testimonials-dot.active{background:var(--color-primary);transform:scale(1.3)}.learning-testimonials-dot:focus{outline:2px solid var(--color-primary);outline-offset:2px}.learning-testimonial-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);box-sizing:border-box;display:flex;flex-direction:column;gap:var(--space-6);min-height:44px;min-width:44px;padding:var(--space-8);position:relative;transition:all var(--transition-smooth)}.learning-testimonial-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.learning-testimonial-content{flex:1}.learning-testimonial-rating{display:flex;gap:var(--space-1);margin-bottom:var(--space-3)}.learning-testimonial-star{color:var(--color-warning);height:16px;width:16px}.learning-testimonial-content p{color:var(--color-text-body);font-size:var(--font-size-base);font-style:italic;line-height:1.7;margin:0;text-decoration:none!important}.learning-testimonial-author{align-items:center;display:flex;gap:var(--space-4)}.learning-testimonial-avatar{align-items:center;border-radius:50%;box-shadow:var(--shadow-sm);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);height:56px;justify-content:center;width:56px}.learning-testimonial-author-info{display:flex;flex:1;flex-direction:column;gap:var(--space-1)}.learning-testimonial-author-info h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0;text-decoration:none!important}.learning-testimonial-author-info span{color:var(--color-text-muted);font-size:var(--font-size-sm);text-decoration:none!important}.learning-cta{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 50%,var(--color-secondary) 100%);color:var(--color-white);overflow:hidden;padding:var(--space-20) 0;position:relative;text-align:center}.learning-cta-background{bottom:0;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1}.learning-cta-shape{animation:float 8s ease-in-out infinite;background:#ffffff1a;border-radius:50%;position:absolute}.learning-cta-shape-1{animation-delay:0s;height:120px;left:10%;top:20%;width:120px}.learning-cta-shape-2{animation-delay:-3s;height:80px;right:15%;top:60%;width:80px}.learning-cta-shape-3{animation-delay:-6s;bottom:20%;height:60px;left:20%;width:60px}.learning-cta-content{display:flex;flex-direction:column;gap:var(--space-8);margin:0 auto;max-width:800px;position:relative;z-index:2}.learning-cta-content h2{color:var(--color-white);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.02em;line-height:1.2;margin:0}.learning-cta-description{color:#ffffffe6;font-size:var(--font-size-xl);line-height:1.6;margin:0 auto;max-width:600px}.learning-cta-buttons{display:flex;flex-wrap:wrap;gap:var(--space-6);justify-content:center;margin-top:var(--space-4)}.learning-cta-guarantee{align-items:center;color:#fffc;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);justify-content:center;margin-top:var(--space-2)}.learning-cta-guarantee-icon{flex-shrink:0;height:16px;width:16px}.learning-btn{align-items:center;border:none;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);contain:layout style paint;cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);justify-content:center;min-height:48px;overflow:hidden;padding:var(--space-3) var(--space-6);position:relative;text-decoration:none!important;transition:all var(--transition-smooth);white-space:nowrap;will-change:transform,box-shadow,background-color}.learning-btn:before{background:linear-gradient(90deg,transparent,var(--color-white),transparent);content:"";height:100%;left:-100%;opacity:.2;position:absolute;top:0;transition:left var(--transition-slow);width:100%;will-change:left}.learning-btn:hover:before{left:100%}.learning-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.learning-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.learning-btn.primary{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%);border:1px solid var(--color-primary);box-shadow:var(--shadow-lg);color:var(--color-white)}.learning-btn.primary:hover{background:linear-gradient(135deg,var(--color-primary-hover) 0,var(--color-primary-active) 100%);border-color:var(--color-primary-hover);box-shadow:var(--shadow-xl);text-decoration:none!important;transform:translateY(-2px)}.learning-btn.primary:active{box-shadow:var(--shadow-lg);transform:translateY(0)}.learning-btn.secondary{background:var(--color-surface-glass);border:2px solid var(--color-primary);box-shadow:var(--shadow-md);color:var(--color-primary)}.learning-btn.secondary:hover{background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--shadow-xl);color:var(--color-white);text-decoration:none!important;transform:translateY(-2px)}.learning-btn.secondary:active{transform:translateY(0)}.learning-btn.large{border-radius:var(--radius-xl);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);letter-spacing:0;min-height:56px;padding:var(--space-4) var(--space-10);text-transform:none}.learning-btn.ghost{background:transparent;border:1px solid transparent;box-shadow:none;color:var(--color-primary)}.learning-btn.ghost:focus{outline:2px solid var(--color-primary);outline-offset:2px}.learning-btn.ghost:hover{background:var(--color-surface-hover);border-color:var(--color-primary-light);text-decoration:none!important;transform:translateY(-1px)}.learning-btn-icon{height:16px;width:16px}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUpDown{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}@media (max-width:1280px){.learning-container,.learning-hero-content{padding:0 var(--space-4)}}@media (max-width:1024px){.learning-hero-title{font-size:var(--font-size-4xl)}.learning-hero-subtitle{font-size:var(--font-size-lg)}.learning-featured-grid{gap:var(--space-6);grid-template-columns:repeat(2,1fr)}.learning-categories-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.learning-testimonials-grid{gap:var(--space-6);grid-template-columns:repeat(2,1fr)}.learning-testimonials-nav{font-size:var(--font-size-base);height:40px;width:40px}.learning-testimonials-nav-prev{left:-20px}.learning-testimonials-nav-next{right:-20px}}@media (max-width:768px){.topic-card{padding:var(--space-4)}.learning-hero{min-height:65vh;padding:var(--space-14) 0 var(--space-10) 0}.learning-hero-content{gap:var(--space-8);grid-template-columns:1fr;padding:0 var(--space-4)}.learning-hero-title{font-size:var(--font-size-3xl)}.learning-hero-subtitle{font-size:var(--font-size-base)}.learning-hero-buttons{align-items:center;flex-direction:column;gap:var(--space-3);text-decoration:none}.learning-hero-features{justify-content:center}.learning-hero-stats{gap:var(--space-3);grid-template-columns:1fr}.learning-hero-logo{height:100px;width:100px}.learning-hero-logo img{height:60px;width:60px}.learning-categories,.learning-featured,.learning-testimonials{padding:var(--space-10) 0}.learning-cta{padding:var(--space-14) 0}.learning-featured-grid{gap:var(--space-4);grid-template-columns:1fr}.learning-categories-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.learning-testimonials-grid{gap:var(--space-4);grid-template-columns:1fr}.learning-cta{padding:var(--space-16) 0}.learning-cta-content{gap:var(--space-6)}.learning-cta-content h2{font-size:var(--font-size-3xl)}.learning-cta-description{font-size:var(--font-size-lg)}.learning-cta-buttons{align-items:center;flex-direction:column;gap:var(--space-3)}.learning-btn{justify-content:center;max-width:300px;width:100%}}@media (max-width:480px){.learning-hero{min-height:60vh;padding:var(--space-12) 0 var(--space-8) 0}.learning-container,.learning-hero-content{padding:0 var(--space-3)}.learning-hero-title,.learning-section-title{font-size:var(--font-size-2xl)}.learning-categories,.learning-featured,.learning-testimonials{padding:var(--space-8) 0}.learning-cta{padding:var(--space-10) 0}.learning-cta-content{gap:var(--space-4)}.learning-cta-content h2{font-size:var(--font-size-2xl);line-height:1.3}.learning-cta-description{font-size:var(--font-size-base)}.learning-cta-buttons{gap:var(--space-3)}.learning-btn.large{font-size:var(--font-size-base);min-height:48px;padding:var(--space-3) var(--space-6)}.learning-featured-card{padding:var(--space-4)}.learning-testimonial-card{padding:var(--space-6)}.learning-category-card{padding:var(--space-4)}.learning-hero-logo{height:80px;width:80px}.learning-hero-logo img{height:50px;width:50px}.learning-hero-stats{gap:var(--space-2)}.learning-stat{padding:var(--space-3)}}@media (prefers-reduced-motion:reduce){.learning-btn:hover,.learning-category-card:hover,.learning-featured-card:hover,.learning-hero-logo:hover,.learning-stat:hover,.topic-card:hover{transform:none}.learning-btn,.learning-category-card,.learning-featured-card,.learning-hero-logo,.learning-stat,.topic-card{transition:none}.learning-cta-shape-1,.learning-cta-shape-2,.learning-cta-shape-3,.learning-shape-1,.learning-shape-2,.learning-shape-3{animation:none}}@media (prefers-contrast:high){.learning-category-card,.learning-featured-card,.learning-testimonial-card,.topic-card{border:2px solid var(--color-border-strong)}.learning-btn.secondary{border-width:3px}}@media print{.learning-hero{background:#fff;color:#000;min-height:auto}.learning-hero-subtitle,.learning-hero-title{color:#000}.learning-category-card,.learning-featured-card,.learning-testimonial-card{background:#fff;border:1px solid var(--color-black);color:#000;page-break-inside:avoid}.learning-cta{background:#fff;color:#000}.learning-section-title{color:#000}}@media (prefers-reduced-motion:reduce){.learning-category-card,.learning-featured-card,.learning-hero,.learning-hero-badge,.learning-hero-logo,.learning-hero-text,.learning-shape,.learning-shape-1,.learning-shape-2,.learning-shape-3,.learning-stat,.learning-testimonial-card,.topic-card{animation:none!important;transition:none!important}.learning-hero-badge:before,.learning-hero-logo:before,.learning-hero:before{display:none}.learning-category-card:hover,.learning-featured-card:hover,.learning-hero-logo:hover,.learning-stat:hover,.topic-card:hover{transform:none!important}}.footer{background:linear-gradient(135deg,var(--color-surface-alt) 0,var(--color-surface) 100%);border-top:1px solid var(--color-border);margin-top:auto;overflow:hidden;padding:var(--space-20) 0 var(--space-8) 0;position:relative}.footer:before{background:linear-gradient(90deg,var(--color-primary) 0,var(--color-secondary) 50%,var(--color-primary) 100%);height:2px;opacity:.8}.footer:after,.footer:before{content:"";left:0;position:absolute;right:0;top:0}.footer:after{background:radial-gradient(circle at 20% 80%,rgba(var(--color-primary-rgb),.03) 0,transparent 50%),radial-gradient(circle at 80% 20%,rgba(var(--color-secondary-rgb),.03) 0,transparent 50%);bottom:0;pointer-events:none;z-index:1}.footer-content{align-items:start;display:grid;gap:var(--space-10);grid-template-columns:2fr 1fr 1fr 1fr;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);position:relative;z-index:2}.footer-section{display:flex;flex-direction:column;gap:var(--space-5)}.footer-section--brand{max-width:450px}.footer-section-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}.footer-brand{align-items:center;display:flex;gap:var(--space-4);margin-bottom:var(--space-5)}.footer-brand-logo{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);display:flex;height:48px;justify-content:center;overflow:hidden;transition:all var(--transition-smooth);width:48px}.footer-brand-logo:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.footer-logo-img{border-radius:var(--radius-lg);filter:brightness(1) contrast(1);height:100%;-o-object-fit:contain;object-fit:contain;width:100%}.footer-brand-text{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-secondary) 100%);-webkit-background-clip:text;color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.01em}.footer-description{color:var(--color-text-body);font-size:var(--font-size-base);line-height:1.7;margin-bottom:var(--space-6);max-width:400px}.footer-links{display:flex;flex-direction:column;gap:var(--space-3)}.footer-link{align-items:center;border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text-body);display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);min-height:44px;padding:var(--space-2) 0;position:relative;text-decoration:none!important;transition:all var(--transition-smooth)}.footer-link:before{background:linear-gradient(90deg,var(--color-primary) 0,var(--color-secondary) 100%);border-radius:1px;content:"";height:2px;left:-var(--space-2);position:absolute;top:50%;transform:translateY(-50%);transition:width var(--transition-smooth);width:0}.footer-link:hover{color:var(--color-primary);padding-left:var(--space-2);text-decoration:none!important;transform:translate(6px)}.footer-link:hover:before{width:4px}.footer-link:focus{background:var(--color-primary-light);border-radius:var(--radius-sm);color:var(--color-primary);opacity:.1;outline:none}.footer-link:focus-visible{color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px}.footer-bottom{align-items:center;border-top:1px solid var(--color-border);display:flex;flex-wrap:wrap;gap:var(--space-6);justify-content:space-between;margin:var(--space-10) auto 0;max-width:var(--container-max-width);padding:var(--space-8) var(--container-padding-x) 0;position:relative;z-index:2}.footer-copyright{color:var(--color-text-muted);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);margin:0}.footer-bottom-links{display:flex;flex-wrap:wrap;gap:var(--space-8)}.footer-bottom-link{color:var(--color-text-muted);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);padding:var(--space-1) 0;text-decoration:none!important;transition:color var(--transition-smooth)}.footer-bottom-link:hover{color:var(--color-primary);text-decoration:none!important}.footer-social{display:flex;gap:var(--space-4);margin-top:var(--space-6)}.footer-social-link{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);color:var(--color-text-body);display:flex;font-size:var(--font-size-lg);height:48px;justify-content:center;min-height:48px;min-width:48px;overflow:hidden;position:relative;text-decoration:none!important;transition:all var(--transition-smooth);width:48px}.footer-social-link:before{background:linear-gradient(90deg,transparent,var(--color-primary-light),transparent);content:"";height:100%;left:-100%;opacity:.1;position:absolute;top:0;transition:left var(--transition-slow);width:100%}.footer-social-link:hover:before{left:100%}.footer-social-link:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);color:var(--color-primary);transform:translateY(-2px)}.footer-social-link:focus{background:var(--color-primary-light);border-radius:var(--radius-sm);color:var(--color-primary);opacity:.1;outline:none}.footer-social-link:focus-visible{color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px}@media (max-width:1024px){.footer{padding:var(--space-16) 0 var(--space-6) 0}.footer-content{gap:var(--space-8);grid-template-columns:1fr 1fr}.footer-section--brand{grid-column:1/-1;margin-bottom:var(--space-8);max-width:none}.footer-social{gap:var(--space-3)}.footer-social-link{height:44px;min-height:44px;min-width:44px;width:44px}}@media (max-width:768px){.footer{padding:var(--space-12) 0 var(--space-6) 0}.footer-content{gap:var(--space-8);grid-template-columns:1fr;padding:0 var(--space-4)}.footer-section--brand{grid-column:1;margin-bottom:var(--space-4)}.footer-brand-text{font-size:var(--font-size-xl)}.footer-description{font-size:var(--font-size-sm);max-width:none}.footer-section-title{font-size:var(--font-size-base)}.footer-link{font-size:var(--font-size-sm)}.footer-bottom{align-items:flex-start;flex-direction:column;gap:var(--space-4);padding:var(--space-6) var(--space-4) 0;text-align:left}.footer-bottom-links{gap:var(--space-6)}.footer-bottom-link{font-size:var(--font-size-sm)}}@media (max-width:480px){.footer{padding:var(--space-10) 0 var(--space-4) 0}.footer-content{gap:var(--space-6);padding:0 var(--space-3)}.footer-brand{gap:var(--space-3);margin-bottom:var(--space-4)}.footer-brand-logo{font-size:var(--font-size-base);height:40px;width:40px}.footer-brand-text{font-size:var(--font-size-lg)}.footer-description{font-size:var(--font-size-xs);margin-bottom:var(--space-4)}.footer-social{gap:var(--space-3);margin-top:var(--space-4)}.footer-social-link{font-size:var(--font-size-base);height:40px;min-height:40px;min-width:40px;width:40px}.footer-section{gap:var(--space-3)}.footer-section-title{font-size:var(--font-size-sm);margin-bottom:var(--space-2)}.footer-links{gap:var(--space-2)}.footer-link{font-size:var(--font-size-xs);min-height:36px;padding:var(--space-1) 0}.footer-bottom{gap:var(--space-3);padding:var(--space-4) var(--space-3) 0}.footer-copyright{font-size:var(--font-size-sm)}.footer-bottom-links{gap:var(--space-4)}.footer-bottom-link{font-size:var(--font-size-xs)}}.footer,.footer-content,.footer-link,.footer-social-link{will-change:transform,opacity,box-shadow}.footer-link:before,.footer-social-link:before,.footer:before{will-change:left,width}@media (prefers-reduced-motion:reduce){.footer,.footer-content,.footer-link,.footer-link:before,.footer-social-link,.footer-social-link:before{animation:none!important;transition:none!important}.footer-link:hover,.footer-social-link:hover{transform:none!important}.footer-link:before,.footer-social-link:before{display:none}}@media (prefers-contrast:high){.footer{border-top-color:var(--color-text);border-top-width:2px}.footer-link:focus-visible,.footer-social-link:focus-visible{outline-color:var(--color-text);outline-width:3px}.footer-social-link{border-color:var(--color-text);border-width:2px}}.paths-page{background:var(--color-surface);min-height:100vh}.paths-page-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-8) 0 var(--space-6);position:relative;text-align:left;will-change:transform,opacity}.paths-page-header-content{margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);position:relative;z-index:2}.paths-page-header:before{background:radial-gradient(circle at 20% 20%,hsla(0,0%,100%,.1) 0,transparent 50%),radial-gradient(circle at 80% 80%,hsla(0,0%,100%,.05) 0,transparent 50%),radial-gradient(circle at 40% 60%,hsla(0,0%,100%,.03) 0,transparent 50%);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;will-change:opacity}.paths-page-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);position:relative;z-index:2}.paths-page-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.5;margin:0;max-width:900px;position:relative;z-index:2}.paths-section{background:var(--color-surface);padding:var(--space-8) 0;position:relative}.paths-section:not(:first-child){padding-top:var(--space-4)}.paths-section-header{margin-bottom:var(--space-8);max-width:800px;position:relative;text-align:left}.paths-section-title{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);line-height:1.4;margin-bottom:var(--space-3);position:relative}.paths-section-title:after{display:none}.paths-section-description{color:var(--color-text-body);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:1.5;margin:0;max-width:800px}.paths-grid{box-sizing:border-box;display:grid;gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:0 auto;max-width:1400px;padding:0 var(--container-padding-x)}.paths-card{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);box-sizing:border-box;contain:layout style paint;cursor:pointer;display:flex;flex-direction:column;height:100%;min-height:44px;min-height:280px;min-width:44px;overflow:hidden;padding:var(--space-6);position:relative;text-align:center;transition:all var(--transition-smooth);will-change:transform,box-shadow,border-color}.paths-card-link{color:inherit}.paths-card-link,.paths-card-link:hover{text-decoration:none!important}.paths-card:before{background:var(--gradient-primary);content:"";height:4px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-normal);will-change:opacity}.paths-card:after{background:linear-gradient(90deg,transparent,var(--color-primary-light),transparent);content:"";height:100%;left:-100%;opacity:.05;position:absolute;top:0;transition:left var(--transition-slow);width:100%;will-change:left}.paths-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-2xl);transform:translateY(-8px)}.paths-card:hover .paths-card-icon{box-shadow:var(--shadow-xl);transform:scale(1.15)}.paths-card:hover .paths-card-duration{background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--shadow-md);color:var(--color-white);transform:scale(1.08)}.paths-card:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.paths-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.paths-card-icon{align-items:center;background:var(--gradient-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-2xl);height:64px;justify-content:center;margin-bottom:var(--space-4);overflow:hidden;position:relative;transition:all var(--transition-normal);width:64px}.paths-card-icon:before{background:linear-gradient(90deg,transparent,var(--color-white),transparent);content:"";height:100%;left:-100%;opacity:.2;position:absolute;top:0;transition:left var(--transition-slow);width:100%}.paths-card:hover .paths-card-icon{box-shadow:var(--shadow-md);transform:scale(1.05)}.paths-card:hover .paths-card-icon:before{left:100%}.topic-icon{font-size:var(--font-size-2xl);height:64px;width:64px}.topic-icon-text{color:var(--color-white);font-size:var(--font-size-sm)}.paths-card-title,.topic-icon-text{font-weight:var(--font-weight-bold)}.paths-card-title{color:var(--color-text-heading);font-size:var(--font-size-xl);line-height:1.2;margin:0 0 var(--space-3) 0;text-decoration:none!important;word-wrap:break-word;overflow-wrap:break-word}.paths-card-content{display:flex;flex:1;flex-direction:column;gap:var(--space-3);justify-content:space-between;width:100%}.paths-card-description{color:var(--color-text-body);font-size:var(--font-size-base);line-height:1.6;margin:0 0 var(--space-4) 0;word-wrap:break-word;flex:1;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}.paths-card-duration{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-weight:var(--font-weight-semibold);justify-content:center;margin-top:auto;padding:var(--space-3) var(--space-4);transition:all var(--transition-smooth)}.paths-card-duration,.paths-duration-icon{color:var(--color-primary)}.paths-duration-text{font-weight:var(--font-weight-semibold)}.paths-card-duration{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-2)}.paths-duration-icon{flex-shrink:0;height:16px;width:16px}.paths-badge{align-items:center;border-radius:var(--radius-full);box-shadow:var(--shadow-sm);color:var(--color-white);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);gap:var(--space-1);letter-spacing:.5px;padding:var(--space-2) var(--space-3);position:absolute;right:var(--space-4);text-transform:uppercase;top:var(--space-4);z-index:2}.paths-new-badge{background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-hover) 100%)}.paths-popular-badge{background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-hover) 100%)}.paths-badge-icon{height:12px;width:12px}.topic-card{border-left:4px solid var(--color-primary)}.topic-card:hover{border-left-color:var(--color-primary-hover)}@media (max-width:1280px){.paths-grid,.paths-page-header-content{padding:0 var(--space-6)}}@media (max-width:1024px){.paths-page-header{padding:var(--space-6) 0 var(--space-4)}.paths-page-title{font-size:var(--font-size-2xl)}.paths-page-subtitle{font-size:var(--font-size-base)}.paths-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.paths-section{padding:var(--space-6) 0}.paths-section:not(:first-child){padding-top:var(--space-3)}.paths-section-title{font-size:var(--font-size-xl)}.paths-grid,.paths-page-header-content{padding:0 var(--space-4)}.paths-card{min-height:180px;padding:var(--space-3)}}@media (max-width:768px){.paths-page-header{padding:var(--space-5) 0 var(--space-4)}.paths-page-title{font-size:var(--font-size-xl)}.paths-page-subtitle{font-size:var(--font-size-base)}.paths-section{padding:var(--space-5) 0}.paths-section:not(:first-child){padding-top:var(--space-3)}.paths-section-title{font-size:var(--font-size-lg)}.paths-section-description{font-size:var(--font-size-sm)}.paths-grid{gap:var(--space-4);grid-template-columns:1fr;padding:0 var(--space-4)}.paths-card{min-height:200px;padding:var(--space-4)}.paths-card-icon{font-size:var(--font-size-base);height:36px;width:36px}.topic-icon{font-size:var(--font-size-lg);height:48px;width:48px}.paths-card-title{font-size:var(--font-size-base)}.paths-page-header-content{padding:0 var(--space-4)}}@media (max-width:480px){.paths-page-header{padding:var(--space-8) 0 var(--space-6)}.paths-page-title{font-size:var(--font-size-2xl)}.paths-page-subtitle{font-size:var(--font-size-sm)}.paths-section{padding:var(--space-8) 0}.paths-section-title{font-size:var(--font-size-xl)}.paths-section-description{font-size:var(--font-size-sm)}.paths-grid{padding:0 var(--space-3)}.paths-card{min-height:160px;padding:var(--space-3)}.paths-card-icon{font-size:var(--font-size-base);height:36px;width:36px}.topic-icon{font-size:var(--font-size-lg);height:48px;width:48px}.paths-card-title{font-size:var(--font-size-base)}.paths-page-header-content{padding:0 var(--space-3)}}@media (prefers-reduced-motion:reduce){.paths-card,.paths-card-icon,.paths-card-icon:before,.paths-card:after,.paths-card:before,.paths-page-header{animation:none!important;transition:none!important}.paths-card:hover,.paths-card:hover .paths-card-icon{transform:none!important}.paths-card-icon:before,.paths-card:after,.paths-card:before{display:none}}@media (prefers-contrast:high){.paths-card{border-color:var(--color-text);border-width:2px}.paths-card:hover{border-color:var(--color-primary)}.paths-card:focus-visible{outline-color:var(--color-text);outline-width:3px}.paths-card-icon{border:2px solid var(--color-text)}}.courses-page{background:var(--color-surface);min-height:100vh}.courses-container{margin:0 auto;max-width:var(--container-max-width);padding:0 var(--space-4)}.courses-page-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-8) 0 var(--space-6);position:relative;text-align:left;will-change:transform,opacity}.courses-page-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);position:relative;z-index:2}.courses-page-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.5;margin:0;max-width:900px;position:relative;z-index:2}.courses-main-layout{display:grid;gap:var(--space-6);grid-template-columns:300px 1fr;margin:0 auto;max-width:1400px;min-height:calc(100vh - 200px);padding:var(--space-6) var(--space-4)}.courses-sidebar{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);height:-moz-fit-content;height:fit-content;max-height:calc(100vh - var(--space-8));overflow-y:auto;padding:var(--space-5);position:sticky;top:var(--space-6)}.sidebar-filters{gap:var(--space-4)}.courses-content{display:flex;flex-direction:column;gap:var(--space-6)}.results-header{border-bottom:1px solid var(--color-border);padding:var(--space-4) 0}.sort-section{align-items:center;display:flex;gap:var(--space-2)}.sort-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.sort-label,.sort-select{color:var(--color-text-body)}.active-filters-section{background:var(--color-surface-alt);margin-bottom:var(--space-6)}.active-filters-header{align-items:center;display:flex;justify-content:space-between}.active-filters-title{font-size:var(--font-size-lg)}.active-filter-chip{background:var(--chip-color,var(--color-primary));box-shadow:var(--shadow-sm);color:var(--color-white)}.active-filter-chip:hover{box-shadow:var(--shadow-md)}.active-chip-text{white-space:nowrap}.active-chip-remove{background:#fff3;color:var(--color-white);height:18px;width:18px}.active-chip-remove:hover{background:#ffffff4d}.filter-section-header{margin-bottom:var(--space-2)}.filter-section-title{letter-spacing:.5px;text-transform:uppercase}.filter-count{background:var(--color-surface-alt);font-weight:var(--font-weight-medium)}.filter-options{display:grid;grid-template-columns:1fr}.courses-sidebar::-webkit-scrollbar{width:6px}.courses-sidebar::-webkit-scrollbar-track{background:var(--color-surface-alt);border-radius:3px}.courses-sidebar::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}.courses-sidebar::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.clear-filters-btn{background:var(--color-surface-alt);padding:var(--space-2) var(--space-3)}.clear-filters-btn.has-filters,.clear-filters-btn:hover:not(:disabled){background:var(--color-error-light);border-color:var(--color-error);color:var(--color-error)}.clear-filters-btn.has-filters:hover{background:var(--color-error);box-shadow:var(--shadow-md);color:var(--color-white);transform:translateY(-1px)}.category-toggle{border-top:1px solid var(--color-border);margin-top:var(--space-3);padding-top:var(--space-3)}.show-more-btn{align-items:center;background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-body);display:flex;gap:var(--space-2);justify-content:center;padding:var(--space-3) var(--space-4);transition:all var(--transition-normal);width:100%}.show-more-btn:hover{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.filter-option{gap:var(--space-2);min-height:44px;transition:all var(--transition-smooth)}.filter-option:hover{background:var(--color-primary-light);transform:translate(2px)}.filter-option.selected{transform:translate(4px)}.filter-option:before{background:var(--category-color,var(--color-primary));border-radius:0 2px 2px 0;bottom:0;content:"";left:0;position:absolute;top:0;transform:scaleY(0);transition:transform var(--transition-smooth);width:3px}.filter-option.selected:before,.filter-option:hover:before{transform:scaleY(1)}.filter-checkbox{opacity:0;pointer-events:none;position:absolute}.checkbox-custom{transition:all var(--transition-smooth)}.filter-checkbox:checked+.checkbox-custom{background:var(--category-color,var(--color-primary));border-color:var(--category-color,var(--color-primary))}.filter-checkbox:checked+.checkbox-custom:after{color:var(--color-white);content:"✓";font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.filter-option:hover .checkbox-custom{border-color:var(--color-primary);transform:scale(1.05)}.option-name{color:var(--color-text-body);text-align:left}.pagination{border-top:1px solid var(--color-border);margin-top:var(--space-6);padding:var(--space-6) 0}.pagination-btn{align-items:center;color:var(--color-text-body);display:flex;gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.pagination-btn:hover:not(:disabled){background:var(--color-primary);color:var(--color-white)}.pagination-btn:disabled{background:var(--color-surface-alt);color:var(--color-text-muted)}.pagination-info{align-items:center;background:var(--color-surface-alt);border-radius:var(--radius-md);display:flex;padding:var(--space-2) var(--space-4)}.pagination-text{color:var(--color-text-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.search-input{box-sizing:border-box;min-height:44px;will-change:border-color,box-shadow}.search-input::-moz-placeholder{color:var(--color-text-muted)}.search-input::placeholder{color:var(--color-text-muted)}.filter-count{background:var(--color-primary);border-radius:var(--radius-full);color:var(--color-white);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);min-width:18px;padding:var(--space-0_5) var(--space-1_5);text-align:center}.filter-section-title,.show-more-btn{font-size:var(--font-size-sm)}.show-more-btn{background:none;border:none;border-radius:var(--radius-sm);color:var(--color-primary);cursor:pointer;font-weight:var(--font-weight-medium);padding:var(--space-2);transition:all var(--transition-fast)}.show-more-btn:hover{background:var(--color-primary-light);opacity:.1}.show-more-btn:focus{box-shadow:var(--shadow-focus);outline:none}.sort-select{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3);transition:all var(--transition-normal)}.sort-select:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.courses-grid{align-items:stretch;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));margin:0 auto;max-width:var(--container-max-width);padding:0 var(--space-4)}.courses-grid.single-result{grid-template-columns:1fr;justify-items:center;margin:0 auto;max-width:500px}.courses-grid.single-result .course-card{max-width:450px;width:100%}.course-card-link{color:inherit;display:block;height:100%}.course-card-link,.course-card-link:active,.course-card-link:focus,.course-card-link:hover,.course-card-link:visited{text-decoration:none!important}.course-card{box-sizing:border-box;contain:layout style paint;cursor:pointer;display:flex;flex-direction:column;height:100%;min-height:44px;min-width:44px;position:relative;will-change:transform,box-shadow,border-color}.course-card,.course-card *{text-decoration:none}.course-card:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.course-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.course-visual{height:160px;overflow:hidden;position:relative}.course-visual-bg{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%}.course-visual-icon{color:var(--color-white);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);text-shadow:0 2px 4px rgba(0,0,0,.3)}.course-badge{align-items:center;border-radius:var(--radius-full);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);gap:var(--space-1);padding:var(--space-1) var(--space-2);position:absolute;right:var(--space-3);top:var(--space-3);z-index:2}.course-badge.new{background:var(--color-success);color:var(--color-white)}.course-badge.premium{background:var(--color-warning);color:var(--color-white)}.course-content{display:flex;flex:1;flex-direction:column;justify-content:space-between;min-height:0;padding:var(--space-4)}.course-category{flex-shrink:0;margin-bottom:var(--space-2)}.course-content-main{display:flex;flex:1;flex-direction:column;min-height:0}.course-title{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;line-height:1.4;margin:0 0 var(--space-3) 0;-webkit-box-orient:vertical;flex-shrink:0;min-height:2.8em;overflow:hidden}.course-meta{align-items:center;border-top:1px solid var(--color-border);color:var(--color-text-muted);flex-shrink:0;font-size:var(--font-size-sm);gap:var(--space-3);margin-top:auto;padding-top:var(--space-3)}.course-rating{align-items:center;display:flex;gap:var(--space-1)}.course-rating svg{color:var(--color-warning);height:14px;width:14px}.course-reviews{color:var(--color-text-muted)}.course-level{background:var(--color-background-hover);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--space-1) var(--space-2);text-transform:capitalize}.course-duration{align-items:center;display:flex;gap:var(--space-1)}.course-duration:before{content:"⏱️";font-size:var(--font-size-xs)}.load-more-btn{background:var(--color-primary);border:none;color:var(--color-white);will-change:transform,box-shadow,background-color}.load-more-btn:hover:not(:disabled){background:var(--color-primary-hover)}.load-more-btn:focus{box-shadow:var(--shadow-focus-strong)}.courses-loading{align-items:center;display:flex;justify-content:center;padding:var(--space-16) 0}.courses-loading-spinner{animation:spin 1s linear infinite;border-top:3px solid var(--color-border);border:3px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:40px;width:40px}.no-results-section{padding:var(--space-16) var(--space-4)}.no-results-content{max-width:600px;width:100%}.no-results-icon{align-items:center;background:var(--color-surface-alt);border-radius:50%;display:flex;height:80px;justify-content:center;margin:0 auto var(--space-4);width:80px}.no-results-title{margin:0 0 var(--space-3)}.no-results-description{margin:0 0 var(--space-6)}.search-suggestions{margin-bottom:var(--space-6)}.suggestions-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-4)}.suggestions-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:center}.suggestion-tag{background:var(--color-primary-light);border:1px solid var(--color-primary);border-radius:var(--radius-full);color:var(--color-primary);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--space-2) var(--space-4);transition:all var(--transition-normal)}.suggestion-tag:hover{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white);transform:translateY(-1px)}.no-results-actions{margin-top:var(--space-4)}.clear-filters-suggestion-btn{background:var(--color-error-light);border:1px solid var(--color-error);border-radius:var(--radius-md);color:var(--color-error);font-size:var(--font-size-base)}.clear-filters-suggestion-btn:hover{background:var(--color-error);box-shadow:var(--shadow-sm);color:var(--color-white)}@media (prefers-reduced-motion:reduce){.clear-filters-btn,.course-card,.courses-loading-spinner,.load-more-btn,.loading-spinner-small,.search-input,.show-more-btn,.sort-select{animation:none!important;transition:none!important}.course-card:hover,.load-more-btn:hover:not(:disabled){transform:none!important}}@media (prefers-contrast:high){.course-card,.search-input,.sort-select{border-color:var(--color-text);border-width:2px}.course-card:hover{border-color:var(--color-primary)}.clear-filters-btn:focus-visible,.course-card:focus-visible,.load-more-btn:focus-visible,.search-input:focus-visible,.show-more-btn:focus-visible,.sort-select:focus-visible{outline-color:var(--color-text);outline-width:3px}}@media (max-width:1024px){.courses-page-header{padding:var(--space-6) 0 var(--space-4)}.courses-page-title{font-size:var(--font-size-2xl)}.courses-page-subtitle{font-size:var(--font-size-base)}.courses-main-layout{gap:var(--space-4);grid-template-columns:250px 1fr;padding:var(--space-4) var(--space-3)}.courses-sidebar{padding:var(--space-4)}.courses-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:768px){.courses-page-header{padding:var(--space-5) 0 var(--space-4)}.courses-page-title{font-size:var(--font-size-xl)}.courses-page-subtitle{font-size:var(--font-size-base)}.courses-main-layout{gap:var(--space-4);grid-template-columns:1fr;padding:var(--space-4) var(--space-3)}.courses-sidebar{max-height:none;order:2;overflow-y:visible;position:static}.courses-content{order:1}.results-header{align-items:flex-start;flex-direction:column;gap:var(--space-3)}.sort-section{justify-content:space-between;width:100%}.show-more-btn{font-size:var(--font-size-xs)}.filter-option,.show-more-btn{padding:var(--space-2) var(--space-3)}.filter-option{font-size:var(--font-size-sm);min-height:40px}.checkbox-custom{height:16px;width:16px}.active-filters-section{margin-bottom:var(--space-4);padding:var(--space-3)}.active-filters-header{align-items:flex-start;flex-direction:column;gap:var(--space-2)}.active-filters-chips{gap:var(--space-1)}.active-filter-chip{font-size:var(--font-size-xs);padding:var(--space-1) var(--space-2)}.no-results-section{min-height:300px;padding:var(--space-8) var(--space-3)}.no-results-icon{height:60px;width:60px}.no-results-title{font-size:var(--font-size-xl)}.no-results-description{font-size:var(--font-size-base)}.suggestions-tags{gap:var(--space-1)}.suggestion-tag{font-size:var(--font-size-xs);padding:var(--space-1) var(--space-3)}.courses-grid{gap:var(--space-4);grid-template-columns:1fr}.course-visual{height:140px}.course-content{padding:var(--space-3)}.course-title{font-size:var(--font-size-lg)}}@media (max-width:480px){.courses-page-header{padding:var(--space-8) 0 var(--space-6)}.courses-page-title{font-size:var(--font-size-2xl)}.courses-container,.courses-grid{padding:0 var(--space-3)}.course-visual{height:120px}.course-visual-icon{font-size:var(--font-size-2xl)}.course-content{padding:var(--space-3)}.course-meta{align-items:flex-start;flex-direction:column;gap:var(--space-2)}}@media (prefers-reduced-motion:reduce){.course-card{transition:none}.course-card:hover{transform:none}}@media (prefers-contrast:high){.course-card{border-width:2px}.course-badge{border:1px solid var(--color-white)}}.course-detail{background:var(--color-surface);min-height:100vh}.course-detail-container{box-sizing:border-box;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);width:100%}.course-detail-hero{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-12) 0 var(--space-8);position:relative}.course-detail-hero-content{align-items:start;display:grid;gap:var(--space-10);grid-template-columns:1fr 420px}.course-detail-info{display:flex;flex-direction:column;gap:var(--space-4)}.course-detail-category{background:var(--color-primary-light);border-radius:var(--radius-full);color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;margin-bottom:var(--space-2);padding:var(--space-2) var(--space-4);text-transform:uppercase;width:-moz-fit-content;width:fit-content}.course-detail-title{align-items:center;color:var(--color-text-heading);display:flex;font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);gap:var(--space-3);line-height:1.3;margin:0 0 var(--space-4) 0}.course-detail-mock-indicator{background:var(--color-warning-light);border-radius:var(--radius-sm);color:var(--color-warning);cursor:help;font-size:var(--font-size-base);font-size:var(--font-size-xs);opacity:.6;padding:var(--space-1) var(--space-2)}.course-detail-description{color:var(--color-text-body);font-size:var(--font-size-lg);line-height:1.7;margin:0 0 var(--space-6) 0;max-width:600px}.course-detail-meta{margin-top:0}.course-detail-stats{align-items:center;border-bottom:1px solid var(--color-border);border-top:1px solid var(--color-border);display:flex;flex-wrap:wrap;gap:var(--space-8);margin:var(--space-4) 0;padding:var(--space-4) 0}.course-detail-stat{align-items:center;background:var(--color-surface-hover);border-radius:var(--radius-md);color:var(--color-text-body);display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);gap:var(--space-3);padding:var(--space-2) var(--space-3)}.course-detail-stat svg{color:var(--color-primary);flex-shrink:0;height:18px;width:18px}.course-detail-sidebar{position:sticky;top:var(--space-4)}.course-detail-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);overflow:hidden;transition:all var(--transition-normal)}.course-detail-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.course-detail-thumbnail{aspect-ratio:16/9;overflow:hidden;position:relative}.course-detail-image{height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--transition-normal);width:100%}.course-detail-thumbnail:hover .course-detail-image{transform:scale(1.05)}.course-detail-overlay{align-items:center;background:var(--color-black);bottom:0;display:flex;justify-content:center;left:0;opacity:.5;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-normal)}.course-detail-thumbnail:hover .course-detail-overlay{opacity:1}.course-detail-preview-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);min-height:44px;min-width:44px;padding:var(--space-3) var(--space-4);transition:all var(--transition-normal);will-change:transform,box-shadow,background-color}.course-detail-preview-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.course-detail-preview-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.course-detail-preview-btn:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.course-detail-actions-main{border-bottom:1px solid var(--color-border);padding:var(--space-6)}.course-detail-enroll-btn,.course-detail-start-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-3);justify-content:center;min-height:52px;overflow:hidden;padding:var(--space-4) var(--space-6);position:relative;text-decoration:none;transition:all var(--transition-normal);width:100%}.course-detail-enroll-btn:before,.course-detail-start-btn:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.course-detail-enroll-btn:hover:before,.course-detail-start-btn:hover:before{left:100%}.course-detail-enroll-btn:hover:not(:disabled),.course-detail-start-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);text-decoration:none;transform:translateY(-1px)}.course-detail-enroll-btn:focus,.course-detail-start-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.course-detail-enroll-btn:focus-visible,.course-detail-start-btn:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.course-detail-enroll-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.course-detail-features{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6)}.course-detail-feature{align-items:center;color:var(--color-text-body);display:flex;font-size:var(--font-size-sm);gap:var(--space-3)}.course-detail-feature svg{color:var(--color-success);flex-shrink:0}.course-detail-content{display:flex;flex-direction:column;gap:var(--space-10);padding:var(--space-10) 0}.course-detail-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-8);transition:all var(--transition-normal)}.course-detail-section:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.course-detail-section-title{border-bottom:3px solid var(--color-primary);color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-6) 0;padding-bottom:var(--space-4);position:relative}.course-detail-section-title:after{background:var(--color-primary);border-radius:2px;bottom:-3px;content:"";height:3px;left:0;position:absolute;width:60px}.course-detail-learning-outcomes{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.course-detail-outcome{align-items:flex-start;background:var(--color-surface-hover);border-left:4px solid var(--color-success);border-radius:var(--radius-md);color:var(--color-text-body);display:flex;font-size:var(--font-size-base);gap:var(--space-3);line-height:1.6;padding:var(--space-3);transition:all var(--transition-normal)}.course-detail-outcome:hover{background:var(--color-success-light);transform:translate(4px)}.course-detail-outcome svg{color:var(--color-success);flex-shrink:0;height:18px;margin-top:2px;width:18px}.course-detail-requirements{display:flex;flex-direction:column;gap:var(--space-3)}.course-detail-requirement{background:var(--color-surface-hover);border-left:4px solid var(--color-primary);border-radius:var(--radius-md);color:var(--color-text-body);font-size:var(--font-size-base);line-height:1.6;padding:var(--space-3);padding-left:var(--space-6);position:relative}.course-detail-requirement:before{color:var(--color-primary);content:"•";font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);left:var(--space-3);position:absolute}.course-detail-curriculum{display:flex;flex-direction:column;gap:var(--space-6)}.course-detail-chapter{background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;padding:var(--space-6);position:relative;transition:all var(--transition-normal)}.course-detail-chapter:before{background:var(--color-primary);border-radius:0 2px 2px 0;content:"";height:100%;left:0;position:absolute;top:0;width:4px}.course-detail-chapter:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.course-detail-chapter-title{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-6) 0;padding-left:var(--space-4);position:relative}.course-detail-chapter-title:before{background:var(--color-primary);border-radius:2px;content:"";height:24px;left:0;position:absolute;top:50%;transform:translateY(-50%);width:3px}.course-detail-chapter-content{display:grid;gap:var(--space-6);grid-template-columns:1fr 1fr}.course-detail-chapter-exercises,.course-detail-chapter-objectives{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.course-detail-chapter-exercises:hover,.course-detail-chapter-objectives:hover{box-shadow:var(--shadow-sm);transform:translateY(-1px)}.course-detail-chapter-exercises h4,.course-detail-chapter-objectives h4{align-items:center;color:var(--color-text-heading);display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-2);margin:0 0 var(--space-3) 0}.course-detail-chapter-exercises h4:before,.course-detail-chapter-objectives h4:before{background:var(--color-primary);border-radius:50%;content:"";height:8px;width:8px}.course-detail-chapter-exercises ul,.course-detail-chapter-objectives ul{color:var(--color-text-body);font-size:var(--font-size-sm);line-height:1.6;list-style:none;margin:0;padding-left:0}.course-detail-chapter-exercises li,.course-detail-chapter-objectives li{background:var(--color-surface-hover);border-radius:var(--radius-sm);margin-bottom:var(--space-2);padding:var(--space-2);padding-left:var(--space-6);position:relative}.course-detail-chapter-exercises li:before,.course-detail-chapter-objectives li:before{color:var(--color-success);content:"✓";font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);left:var(--space-2);position:absolute;top:50%;transform:translateY(-50%)}.course-detail-loading{align-items:center;display:flex;justify-content:center;min-height:50vh}.course-detail-loading-spinner{animation:spin 1s linear infinite;border-top:3px solid var(--color-border);border:3px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:40px;width:40px}.course-detail-error{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:50vh;text-align:center}.course-detail-error p{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0}@media (prefers-reduced-motion:reduce){.course-detail-card,.course-detail-enroll-btn,.course-detail-hero,.course-detail-image,.course-detail-loading-spinner,.course-detail-overlay,.course-detail-preview-btn,.course-detail-section,.course-detail-start-btn{animation:none!important;transition:none!important}.course-detail-enroll-btn:hover:not(:disabled),.course-detail-preview-btn:hover,.course-detail-start-btn:hover,.course-detail-thumbnail:hover .course-detail-image{transform:none!important}}@media (prefers-contrast:high){.course-detail-card,.course-detail-enroll-btn,.course-detail-preview-btn,.course-detail-section,.course-detail-start-btn{border-color:var(--color-text);border-width:2px}.course-detail-enroll-btn:hover:not(:disabled),.course-detail-preview-btn:hover,.course-detail-start-btn:hover{border-color:var(--color-primary)}.course-detail-enroll-btn:focus-visible,.course-detail-preview-btn:focus-visible,.course-detail-start-btn:focus-visible{outline-color:var(--color-text);outline-width:3px}}@media (max-width:1024px){.course-detail-hero-content{gap:var(--space-8);grid-template-columns:1fr}.course-detail-sidebar{margin:0 auto;max-width:500px;order:-1;position:static}.course-detail-chapter-content{gap:var(--space-4);grid-template-columns:1fr}.course-detail-learning-outcomes{grid-template-columns:1fr}}@media (max-width:768px){.course-detail-container{padding:0 var(--space-4)}.course-detail-hero{padding:var(--space-8) 0 var(--space-6)}.course-detail-title{font-size:var(--font-size-2xl);line-height:1.2}.course-detail-description{font-size:var(--font-size-base);line-height:1.6}.course-detail-stats{align-items:stretch;flex-direction:column;gap:var(--space-3);padding:var(--space-3) 0}.course-detail-stat{justify-content:center;text-align:center}.course-detail-content{gap:var(--space-8);padding:var(--space-8) 0}.course-detail-section{padding:var(--space-6)}.course-detail-section-title{font-size:var(--font-size-xl)}.course-detail-learning-outcomes{gap:var(--space-3);grid-template-columns:1fr}.course-detail-outcome,.course-detail-requirement{padding:var(--space-3)}.course-detail-actions-main,.course-detail-chapter,.course-detail-features{padding:var(--space-5)}.course-detail-chapter-content{gap:var(--space-4)}}@media (max-width:480px){.course-detail-container{padding:0 var(--space-3)}.course-detail-hero{padding:var(--space-6) 0 var(--space-4)}.course-detail-title{font-size:var(--font-size-xl);line-height:1.2}.course-detail-description{font-size:var(--font-size-sm)}.course-detail-content{gap:var(--space-6);padding:var(--space-6) 0}.course-detail-section{padding:var(--space-4)}.course-detail-section-title{font-size:var(--font-size-lg)}.course-detail-outcome,.course-detail-requirement{font-size:var(--font-size-sm);padding:var(--space-2)}.course-detail-actions-main,.course-detail-features{padding:var(--space-4)}.course-detail-enroll-btn,.course-detail-start-btn{font-size:var(--font-size-sm);min-height:48px;padding:var(--space-3) var(--space-4)}.course-detail-chapter{padding:var(--space-4)}.course-detail-chapter-title{font-size:var(--font-size-lg)}.course-detail-chapter-exercises,.course-detail-chapter-objectives{padding:var(--space-3)}}@media (prefers-reduced-motion:reduce){.course-detail-image{transition:none}.course-detail-enroll-btn:hover:not(:disabled),.course-detail-preview-btn:hover,.course-detail-start-btn:hover,.course-detail-thumbnail:hover .course-detail-image{transform:none}}@media (prefers-contrast:high){.course-detail-card,.course-detail-chapter,.course-detail-section{border-width:2px}}.course-learning-container{background:var(--color-surface);display:flex;flex-direction:column;min-height:100vh}.course-learning-content{display:grid;flex:1;grid-template-columns:350px 1fr;min-height:100vh}.course-sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow-y:auto}.sidebar-header{background:var(--color-surface);padding:var(--space-6);position:relative}.course-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:1.3;margin:0 0 var(--space-4) 0}.progress-bar{background:var(--color-surface-hover);border:1px solid var(--color-border);height:10px;margin-bottom:var(--space-3)}.progress-fill{position:relative}.progress-fill:after{animation:shimmer 2s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-text{background:var(--color-primary-light);border-radius:var(--radius-md);color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);margin:0;padding:var(--space-2) var(--space-3);text-align:center}.course-navigation{flex:1;overflow-y:auto;padding:var(--space-4) 0}.nav-section,.section-header{margin-bottom:var(--space-2)}.section-header{background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-heading);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;min-height:48px;padding:var(--space-4) var(--space-5);text-align:left;text-transform:uppercase;transition:all var(--transition-normal);width:100%}.section-header:hover{box-shadow:var(--shadow-sm);color:var(--color-primary);transform:translateY(-1px)}.section-header:focus,.section-header:hover{background:var(--color-primary-light);border-color:var(--color-primary)}.section-header:focus{box-shadow:var(--shadow-focus);outline:none}.section-header:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.section-content{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-top:var(--space-2);overflow:hidden}.nav-item{align-items:center;border-left:4px solid transparent;color:var(--color-text-body);cursor:pointer;display:flex;font-size:var(--font-size-sm);gap:var(--space-3);min-height:48px;padding:var(--space-4) var(--space-5);position:relative;transition:all var(--transition-normal)}.nav-item:hover{background:var(--color-surface-hover);border-left-color:var(--color-primary-light);color:var(--color-text-heading);transform:translate(4px)}.nav-item.active{background:var(--color-primary);border-left-color:var(--color-primary-hover);box-shadow:var(--shadow-sm);color:var(--color-white);font-weight:var(--font-weight-semibold)}.nav-item.active:hover{background:var(--color-primary-hover);transform:translate(4px)}.nav-item.completed,.nav-item.completed:hover{background:var(--color-success-light);color:var(--color-success)}.nav-item.completed:hover{border-left-color:var(--color-success);transform:translate(4px)}.nav-item:focus{background:var(--color-surface);box-shadow:var(--shadow-focus);outline:none}.nav-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.nav-item svg{flex-shrink:0;height:16px;width:16px}.lecture-info{display:flex;flex:1;flex-direction:column;gap:var(--space-1)}.lecture-meta{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-xs);gap:var(--space-2)}.lecture-meta svg{height:12px;width:12px}.preview-badge{background:var(--color-warning);border-radius:var(--radius-sm);color:var(--color-white);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--space-0_5) var(--space-1_5)}.course-main-content{background:var(--color-background);overflow-y:auto;padding:var(--space-6)}.chapter-header{margin-bottom:var(--space-8)}.chapter-banner{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);padding:var(--space-8);position:relative;transition:all var(--transition-normal)}.chapter-banner:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.chapter-info{margin-bottom:var(--space-6)}.chapter-number{background:var(--color-primary-light);border-radius:var(--radius-full);color:var(--color-primary);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;margin-bottom:var(--space-3);padding:var(--space-2) var(--space-4);text-transform:uppercase;width:-moz-fit-content;width:fit-content}.chapter-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.3;margin:0;position:relative}.chapter-title:after{background:var(--color-primary);border-radius:var(--radius-sm);bottom:-8px;content:"";height:4px;left:0;position:absolute;width:60px}.chapter-actions{display:flex;justify-content:flex-end;margin-top:var(--space-4)}.btn-complete{background:var(--color-success);border:none;border-radius:var(--radius-lg);color:var(--color-white);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);min-height:48px;overflow:hidden;padding:var(--space-4) var(--space-8);position:relative;transition:all var(--transition-normal)}.btn-complete:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.btn-complete:hover:before{left:100%}.btn-complete:hover:not(:disabled){background:var(--color-success-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-complete:focus{box-shadow:var(--shadow-focus-strong);outline:none}.btn-complete:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.btn-complete:disabled{background:var(--color-text-muted);cursor:not-allowed;transform:none}.chapter-content{align-items:start;display:grid;gap:var(--space-10);grid-template-columns:1fr 350px}.content-text{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);padding:var(--space-8);transition:all var(--transition-normal)}.content-text:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.content-text h2{border-bottom:3px solid var(--color-primary);color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-6) 0;padding-bottom:var(--space-3);position:relative}.content-text h2:after{background:var(--color-primary);border-radius:var(--radius-sm);bottom:-3px;content:"";height:3px;left:0;position:absolute;width:60px}.content-text h2:not(:first-child){margin-top:var(--space-10)}.examples-list,.exercises-list,.learning-objectives{color:var(--color-text-body);line-height:1.7;list-style:none;margin:0 0 var(--space-6) 0;padding-left:0}.examples-list li,.exercises-list li,.learning-objectives li{background:var(--color-surface-hover);border-left:4px solid var(--color-primary);border-radius:var(--radius-md);margin-bottom:var(--space-3);padding:var(--space-3);padding-left:var(--space-6);position:relative}.examples-list li:before,.exercises-list li:before,.learning-objectives li:before{color:var(--color-primary);content:"✓";font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);left:var(--space-3);position:absolute;top:50%;transform:translateY(-50%)}.explanation-text{background:var(--color-surface-hover);border-left:4px solid var(--color-primary);border-radius:var(--radius-lg);color:var(--color-text-body);font-size:var(--font-size-lg);line-height:1.8;margin-bottom:var(--space-6);padding:var(--space-6)}.content-illustration{position:sticky;top:var(--space-8)}.illustration-placeholder{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);display:flex;height:400px;justify-content:center;overflow:hidden;padding:var(--space-8);position:relative;transition:all var(--transition-normal)}.illustration-placeholder:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.neural-network{height:200px;position:relative;width:200px}.node{animation:pulse 2s ease-in-out infinite;background:var(--color-primary);border-radius:50%;height:20px;position:absolute;width:20px}.node-1{animation-delay:0s;left:50px;top:20px}.node-2{animation-delay:.5s;left:20px;top:80px}.node-3{animation-delay:1s;right:20px;top:80px}.node-4{animation-delay:1.5s;bottom:80px;left:50px}.node-5{animation-delay:2s;bottom:20px;left:90px}.connection{animation:connectionPulse 3s ease-in-out infinite;background:var(--color-primary-light);height:2px;position:absolute;transform-origin:left center}.conn-1{animation-delay:0s;left:60px;top:30px;transform:rotate(45deg);width:40px}.conn-2{animation-delay:.5s;left:40px;top:90px;transform:rotate(-45deg);width:60px}.conn-3{animation-delay:1s;bottom:90px;left:60px;transform:rotate(45deg);width:50px}.conn-4{animation-delay:1.5s;bottom:30px;left:70px;transform:rotate(-30deg);width:30px}@keyframes connectionPulse{0%,to{opacity:.3}50%{opacity:.8}}.no-chapter-selected{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;justify-content:center;min-height:400px;padding:var(--space-8);text-align:center}.no-chapter-selected h2{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-4) 0}.no-chapter-selected p{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0}.course-learning-loading{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:50vh}.course-learning-loading p{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0}.course-learning-error{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:50vh;padding:var(--space-8);text-align:center}.course-learning-error h2{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0}.course-learning-error p{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0}.btn-primary{align-items:center;border:none;border-radius:var(--radius-lg);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);justify-content:center;padding:var(--space-3) var(--space-6);text-decoration:none;transition:all var(--transition-normal)}.btn-primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);text-decoration:none;transform:translateY(-1px)}.btn-primary:focus{box-shadow:var(--shadow-focus-strong);outline:none}.btn-primary:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}@media (prefers-reduced-motion:reduce){.btn-complete,.chapter-banner,.connection,.content-text,.illustration-placeholder,.nav-item,.node,.section-header,.sidebar-header{animation:none!important;transition:none!important}.btn-complete:hover:not(:disabled){transform:none!important}.chapter-banner:before,.sidebar-header:before{display:none}}@media (prefers-contrast:high){.btn-complete,.content-text,.illustration-placeholder,.nav-item,.section-header{border-color:var(--color-text);border-width:2px}.btn-complete:hover:not(:disabled),.nav-item:hover,.section-header:hover{border-color:var(--color-primary)}.btn-complete:focus-visible,.nav-item:focus-visible,.section-header:focus-visible{outline-color:var(--color-text);outline-width:3px}}@media (max-width:1024px){.course-learning-content{grid-template-columns:300px 1fr}.chapter-content{gap:var(--space-8);grid-template-columns:1fr}.content-illustration{order:-1;position:static}.illustration-placeholder{height:300px}.neural-network{height:180px;width:180px}}@media (max-width:768px){.course-learning-content{grid-template-columns:1fr;grid-template-rows:auto 1fr}.course-sidebar{border-bottom:1px solid var(--color-border);border-right:none;max-height:400px;order:2}.course-main-content{order:1}.chapter-banner,.course-main-content{padding:var(--space-6)}.chapter-title{font-size:var(--font-size-2xl)}.content-text{padding:var(--space-6)}.sidebar-header{padding:var(--space-5)}.course-title{font-size:var(--font-size-lg)}.chapter-content{gap:var(--space-6)}.illustration-placeholder{height:250px}}@media (max-width:480px){.course-main-content{padding:var(--space-4)}.chapter-banner{padding:var(--space-5)}.chapter-title{font-size:var(--font-size-xl)}.content-text,.sidebar-header{padding:var(--space-4)}.nav-item,.section-header{padding:var(--space-3) var(--space-4)}.illustration-placeholder{height:200px;padding:var(--space-4)}.neural-network{height:120px;width:120px}}@media (prefers-reduced-motion:reduce){.connection,.node{animation:none}.progress-fill{transition:none}.btn-complete:hover:not(:disabled),.btn-primary:hover{transform:none}}@media (prefers-contrast:high){.course-sidebar{border-right-width:2px}.content-text,.illustration-placeholder{border-width:2px}.nav-item{border-left-width:4px}}.tutorials-page{background:var(--color-surface);min-height:100vh}.tutorials-container{box-sizing:border-box;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);width:100%}.tutorials-page-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-8) 0 var(--space-6);position:relative;text-align:left;will-change:transform,opacity}.tutorials-page-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);position:relative;z-index:2}.tutorials-page-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.5;margin:0;max-width:900px;position:relative;z-index:2}.tutorials-main-layout{display:grid;gap:var(--space-6);grid-template-columns:300px 1fr;margin:0 auto;max-width:1400px;min-height:calc(100vh - 200px);padding:var(--space-6) var(--space-4)}.tutorials-sidebar{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);height:-moz-fit-content;height:fit-content;max-height:calc(100vh - var(--space-8));overflow-y:auto;padding:var(--space-5);position:sticky;top:var(--space-6)}.filter-checkbox{display:none}.checkbox-custom{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-sm);flex-shrink:0;height:18px;position:relative;transition:all var(--transition-normal);width:18px}.filter-option.selected .checkbox-custom{background:var(--color-white);border-color:var(--color-white)}.checkbox-custom:after{border:solid var(--color-primary);border-width:0 2px 2px 0;content:"";height:8px;left:5px;opacity:0;position:absolute;top:2px;transform:rotate(45deg);transition:opacity var(--transition-normal);width:4px}.filter-option.selected .checkbox-custom:after{opacity:1}.clear-filters-btn.has-filters{animation:pulse 2s infinite;background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white);font-weight:var(--font-weight-semibold)}@keyframes pulse{0%,to{box-shadow:var(--shadow-sm)}50%{box-shadow:var(--shadow-md)}}.tutorials-main-content{display:flex;flex-direction:column;gap:var(--space-6)}.active-filters-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:var(--space-4);padding:var(--space-4)}.active-filters-header{margin-bottom:var(--space-3)}.active-filters-title{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0}.active-filters-chips{display:flex;flex-wrap:wrap;gap:var(--space-2)}.active-filter-chip{align-items:center;background:var(--color-primary-light);border:1px solid var(--color-primary);border-radius:var(--radius-full);color:var(--color-primary);display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-2) var(--space-3);transition:all var(--transition-normal)}.active-filter-chip:hover{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white);transform:translateY(-1px)}.active-chip-text{flex:1}.active-chip-remove{align-items:center;background:none;border:none;border-radius:50%;color:inherit;cursor:pointer;display:flex;height:16px;justify-content:center;transition:all var(--transition-normal);width:16px}.active-chip-remove:hover{background:#fff3;transform:scale(1.1)}.tutorials-grid{align-items:stretch;display:grid;gap:var(--space-6);-moz-column-gap:var(--space-6);column-gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));margin:0 auto;max-width:var(--container-max-width);padding:0 var(--space-4);row-gap:var(--space-6)}.tutorials-grid.single-result{grid-template-columns:1fr;justify-items:center;margin:0 auto;max-width:500px}.tutorials-grid.single-result .tutorials-card{max-width:450px;width:100%}.tutorials-card-link{color:inherit;display:block;height:100%}.tutorials-card-link,.tutorials-card-link:active,.tutorials-card-link:focus,.tutorials-card-link:hover,.tutorials-card-link:visited{text-decoration:none!important}.tutorials-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);box-sizing:border-box;contain:layout style paint;cursor:pointer;display:flex;flex-direction:column;height:100%;min-height:44px;min-width:44px;overflow:hidden;position:relative;transition:all var(--transition-normal);will-change:transform,box-shadow,border-color}.tutorials-card,.tutorials-card *{text-decoration:none}.tutorials-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.tutorials-card:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.tutorials-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.tutorials-visual{height:160px;overflow:hidden;position:relative}.tutorials-visual-bg{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%}.tutorials-visual-blue-gradient{background:var(--gradient-category-blue)}.tutorials-visual-icon{color:var(--color-white);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);text-shadow:0 2px 4px rgba(0,0,0,.3)}.tutorials-badge{border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);position:absolute;right:var(--space-3);text-transform:uppercase;top:var(--space-3);z-index:2}.tutorials-badge.premium{background:var(--color-warning);color:var(--color-white)}.tutorials-content{display:flex;flex:1;flex-direction:column;gap:var(--space-3);justify-content:space-between;min-height:0;padding:var(--space-4)}.tutorials-category{color:var(--color-primary);flex-shrink:0;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);letter-spacing:.5px;margin-bottom:var(--space-2);text-transform:uppercase}.tutorials-content-main{display:flex;flex:1;flex-direction:column;margin-bottom:var(--space-2);min-height:0}.tutorials-title{color:var(--color-text-heading);display:-webkit-box;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);-webkit-line-clamp:2;line-clamp:2;line-height:1.4;margin:0 0 var(--space-3) 0;-webkit-box-orient:vertical;flex-shrink:0;min-height:2.8em;overflow:hidden}.tutorials-meta{align-items:center;border-top:1px solid var(--color-border);color:var(--color-text-muted);display:flex;flex-shrink:0;flex-wrap:wrap;font-size:var(--font-size-sm);gap:var(--space-3);margin-top:auto;min-height:44px;padding-top:var(--space-3)}.tutorials-rating{align-items:center;display:flex;gap:var(--space-1)}.tutorials-rating svg{color:var(--color-warning);height:14px;width:14px}.tutorials-reviews{color:var(--color-text-muted);font-size:var(--font-size-xs)}.tutorials-level{background:var(--color-background-hover);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--space-1) var(--space-2);text-transform:capitalize}.tutorials-duration{align-items:center;display:flex;gap:var(--space-1)}.tutorials-duration:before{content:"⏱️";font-size:var(--font-size-xs)}.tutorials-load-more{padding:var(--space-8) 0;text-align:center}.tutorials-loading{align-items:center;display:flex;justify-content:center;min-height:50vh}.tutorials-loading-spinner{animation:spin 1s linear infinite;border-top:3px solid var(--color-border);border:3px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:40px;width:40px}@media (max-width:1024px){.tutorials-main-layout{gap:var(--space-4);grid-template-columns:280px 1fr;padding:var(--space-4) var(--space-3)}.tutorials-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:768px){.tutorials-page-header{padding:var(--space-6) 0 var(--space-4)}.tutorials-page-title{font-size:var(--font-size-2xl)}.tutorials-page-subtitle{font-size:var(--font-size-base)}.tutorials-main-layout{gap:var(--space-4);grid-template-columns:1fr;padding:var(--space-4) var(--space-3)}.tutorials-sidebar{border:none;border-bottom:1px solid var(--color-border);border-radius:0;max-height:none;padding:var(--space-4);position:static}.tutorials-grid{gap:var(--space-4);grid-template-columns:1fr}.tutorials-visual{height:140px}.tutorials-content{gap:var(--space-2);padding:var(--space-3)}.tutorials-title{font-size:var(--font-size-lg)}}@media (max-width:480px){.tutorials-page-header{padding:var(--space-5) 0 var(--space-4)}.tutorials-page-title{font-size:var(--font-size-xl)}.tutorials-container{padding:0 var(--space-3)}.tutorials-main-layout{padding:var(--space-4) var(--space-3)}.tutorials-grid{padding:0 var(--space-3)}.tutorials-visual{height:120px}.tutorials-visual-icon{font-size:var(--font-size-2xl)}.tutorials-content{gap:var(--space-2);padding:var(--space-3)}.tutorials-meta{align-items:flex-start;flex-direction:column;gap:var(--space-2);min-height:auto}}@media (prefers-reduced-motion:reduce){.clear-filters-btn,.load-more-btn,.loading-spinner-small,.search-input,.tutorials-card,.tutorials-loading-spinner{animation:none!important;transition:none!important}.load-more-btn:hover:not(:disabled),.tutorials-card:hover{transform:none!important}}@media (prefers-contrast:high){.clear-filters-btn,.load-more-btn,.search-input,.tutorials-card{border-color:var(--color-text);border-width:2px}.tutorials-card:hover{border-color:var(--color-primary)}.clear-filters-btn:focus-visible,.load-more-btn:focus-visible,.search-input:focus-visible,.tutorials-card:focus-visible{outline-color:var(--color-text);outline-width:3px}}.tutorial-detail{background:var(--color-surface);min-height:100vh}.tutorial-detail-container{box-sizing:border-box;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);width:100%}.tutorial-detail-hero{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-12) 0 var(--space-8);position:relative;will-change:transform,opacity}.tutorial-detail-hero-content{align-items:start;display:grid;gap:var(--space-10);grid-template-columns:1fr 420px}.tutorial-detail-category{align-items:center;background:var(--color-primary-light);border-radius:var(--radius-full);color:var(--color-primary);display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);letter-spacing:.5px;margin-bottom:var(--space-2);padding:var(--space-2) var(--space-4);text-transform:uppercase;width:-moz-fit-content;width:fit-content}.tutorial-detail-title{align-items:center;color:var(--color-text-heading);display:flex;font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);gap:var(--space-3);line-height:1.3;margin:0 0 var(--space-4) 0}.tutorial-detail-mock-indicator{background:var(--color-warning-light);border-radius:var(--radius-sm);color:var(--color-warning);font-size:var(--font-size-base);font-size:var(--font-size-xs);opacity:.6;padding:var(--space-1) var(--space-2)}.tutorial-detail-description{color:var(--color-text-body);font-size:var(--font-size-lg);line-height:1.7;margin:0 0 var(--space-6) 0;max-width:600px}.tutorial-detail-meta{margin-top:0}.tutorial-detail-stats{align-items:center;border-bottom:1px solid var(--color-border);border-top:1px solid var(--color-border);display:flex;gap:var(--space-8);margin:var(--space-4) 0;padding:var(--space-4) 0}.tutorial-detail-stat{align-items:center;background:var(--color-surface-hover);border-left:4px solid var(--color-primary);border-radius:var(--radius-md);color:var(--color-text-body);display:flex;font-size:var(--font-size-base);gap:var(--space-3);padding:var(--space-2) var(--space-3);transition:all var(--transition-normal)}.tutorial-detail-stat:hover{background:var(--color-primary-light);transform:translate(4px)}.tutorial-detail-stat svg{color:var(--color-primary);height:18px;width:18px}.tutorial-detail-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-4)}.tutorial-detail-tag{background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--space-1) var(--space-3);transition:all var(--transition-normal)}.tutorial-detail-tag:hover{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-white);transform:translateY(-1px)}.tutorial-detail-sidebar{height:-moz-fit-content;height:fit-content;position:sticky;top:var(--space-6)}.tutorial-detail-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);overflow:hidden;transition:all var(--transition-normal)}.tutorial-detail-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.tutorial-detail-thumbnail{height:200px;overflow:hidden;position:relative}.tutorial-detail-image{height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--transition-normal);width:100%}.tutorial-detail-thumbnail:hover .tutorial-detail-image{transform:scale(1.05)}.tutorial-detail-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-normal)}.tutorial-detail-thumbnail:hover .tutorial-detail-overlay{opacity:1}.tutorial-detail-preview-btn{align-items:center;background:var(--color-white);border:none;border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-text-heading);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);min-height:44px;min-width:44px;padding:var(--space-3) var(--space-6);transition:all var(--transition-normal)}.tutorial-detail-preview-btn:hover{background:var(--color-primary);box-shadow:var(--shadow-md);color:var(--color-white);transform:translateY(-2px)}.tutorial-detail-actions{border-bottom:1px solid var(--color-border);padding:var(--space-6)}.tutorial-detail-start-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-3);justify-content:center;min-height:52px;overflow:hidden;padding:var(--space-4) var(--space-6);position:relative;transition:all var(--transition-normal);width:100%}.tutorial-detail-start-btn:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.tutorial-detail-start-btn:hover:before{left:100%}.tutorial-detail-start-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.tutorial-detail-features{padding:var(--space-5)}.tutorial-detail-feature{align-items:center;color:var(--color-text-body);display:flex;font-size:var(--font-size-sm);gap:var(--space-3);padding:var(--space-2) 0}.tutorial-detail-feature svg{color:var(--color-success);flex-shrink:0}.tutorial-detail-content{display:flex;flex-direction:column;gap:var(--space-10);padding:var(--space-10) 0}.tutorial-detail-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8);transition:all var(--transition-normal)}.tutorial-detail-section:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.tutorial-detail-section-title{border-bottom:3px solid var(--color-primary);color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-6) 0;padding-bottom:var(--space-3);position:relative}.tutorial-detail-section-title:after{background:var(--color-primary-hover);bottom:-3px;content:"";height:3px;left:0;position:absolute;width:60px}.tutorial-detail-overview{color:var(--color-text-body);font-size:var(--font-size-lg);line-height:1.7;margin:0}.tutorial-detail-objectives{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.tutorial-detail-objective{align-items:flex-start;background:var(--color-surface-hover);border-left:4px solid var(--color-success);border-radius:var(--radius-lg);display:flex;font-size:var(--font-size-base);gap:var(--space-3);line-height:1.6;padding:var(--space-3);transition:all var(--transition-normal)}.tutorial-detail-objective:hover{background:var(--color-success-light);transform:translate(4px)}.tutorial-detail-objective svg{color:var(--color-success);flex-shrink:0;height:18px;width:18px}.tutorial-detail-prerequisites{display:flex;flex-direction:column;gap:var(--space-3)}.tutorial-detail-prerequisite{align-items:center;background:var(--color-surface-hover);border-left:4px solid var(--color-warning);border-radius:var(--radius-lg);display:flex;font-size:var(--font-size-base);gap:var(--space-3);line-height:1.6;padding:var(--space-3);padding-left:var(--space-6);position:relative}.tutorial-detail-prerequisite:before{color:var(--color-warning);content:"•";font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);left:var(--space-4);position:absolute}.tutorial-detail-sections{display:flex;flex-direction:column;gap:var(--space-6)}.tutorial-detail-section-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;position:relative;transition:all var(--transition-normal)}.tutorial-detail-section-item:before{background:var(--color-primary);bottom:0;content:"";left:0;opacity:0;position:absolute;top:0;transition:opacity var(--transition-normal);width:4px}.tutorial-detail-section-item:hover:before{opacity:1}.tutorial-detail-section-item:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.tutorial-detail-section-header{align-items:center;cursor:pointer;display:flex;justify-content:space-between;min-height:48px;padding:var(--space-6);transition:all var(--transition-normal)}.tutorial-detail-section-header:hover{background:var(--color-surface-hover)}.tutorial-detail-section-info{flex:1}.tutorial-detail-section-name{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-2) 0;padding-left:var(--space-4);position:relative}.tutorial-detail-section-name:before{background:var(--color-primary);border-radius:var(--radius-sm);content:"";height:20px;left:0;position:absolute;top:50%;transform:translateY(-50%);width:3px}.tutorial-detail-section-description{color:var(--color-text-body);font-size:var(--font-size-base);line-height:1.6;margin:0 0 var(--space-3) 0}.tutorial-detail-section-meta{color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-4)}.tutorial-detail-section-duration,.tutorial-detail-section-lessons{align-items:center;display:flex;gap:var(--space-1)}.tutorial-detail-section-toggle{align-items:center;background:var(--color-surface-hover);border-radius:var(--radius-full);color:var(--color-text-muted);display:flex;height:40px;justify-content:center;transition:all var(--transition-normal);width:40px}.tutorial-detail-section-header:hover .tutorial-detail-section-toggle{background:var(--color-primary);color:var(--color-white)}.tutorial-detail-lessons{display:flex;flex-direction:column;gap:var(--space-4);padding:0 var(--space-6) var(--space-6)}.tutorial-detail-lesson{background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.tutorial-detail-lesson:hover{background:var(--color-primary-light);border-color:var(--color-primary);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.tutorial-detail-lesson-header{align-items:flex-start;display:flex;gap:var(--space-3);margin-bottom:var(--space-3)}.tutorial-detail-lesson-icon{align-items:center;background:var(--color-primary);border-radius:var(--radius-full);color:var(--color-white);display:flex;flex-shrink:0;height:32px;justify-content:center;width:32px}.tutorial-detail-lesson-info{flex:1}.tutorial-detail-lesson-title{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.tutorial-detail-lesson-description{color:var(--color-text-body);font-size:var(--font-size-sm);line-height:1.5;margin:0 0 var(--space-2) 0}.tutorial-detail-lesson-meta{color:var(--color-text-muted);display:flex;font-size:var(--font-size-xs);gap:var(--space-3)}.tutorial-detail-lesson-duration,.tutorial-detail-lesson-type{align-items:center;display:flex;gap:var(--space-1)}.tutorial-detail-lesson-content{background:var(--color-surface);border-left:3px solid var(--color-primary);border-radius:var(--radius-md);color:var(--color-text-body);font-size:var(--font-size-sm);line-height:1.6;padding:var(--space-3)}.tutorial-detail-resources{display:flex;flex-direction:column;gap:var(--space-4)}.tutorial-detail-resource{align-items:flex-start;background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-lg);display:flex;gap:var(--space-4);padding:var(--space-4);transition:all var(--transition-normal)}.tutorial-detail-resource:hover{background:var(--color-primary-light);border-color:var(--color-primary);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.tutorial-detail-resource-icon{align-items:center;background:var(--color-primary);border-radius:var(--radius-full);color:var(--color-white);display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.tutorial-detail-resource-info{flex:1}.tutorial-detail-resource-title{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.tutorial-detail-resource-description{color:var(--color-text-body);font-size:var(--font-size-sm);line-height:1.5;margin:0}.tutorial-detail-loading{align-items:center;display:flex;justify-content:center;min-height:50vh}.tutorial-detail-loading-spinner{animation:spin 1s linear infinite;border-top:3px solid var(--color-border);border:3px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:40px;width:40px}.tutorial-detail-error{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:50vh;padding:var(--space-8);text-align:center}.tutorial-detail-error h2{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-4) 0}.tutorial-detail-error p{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0;max-width:500px}@media (max-width:1024px){.tutorial-detail-hero-content{gap:var(--space-8)}.tutorial-detail-sidebar{margin:0 auto;max-width:500px}.tutorial-detail-lessons{gap:var(--space-3)}}@media (max-width:768px){.tutorial-detail-hero{padding:var(--space-8) 0 var(--space-6)}.tutorial-detail-hero-content{gap:var(--space-6);grid-template-columns:1fr}.tutorial-detail-title{font-size:var(--font-size-2xl);line-height:1.2}.tutorial-detail-description{font-size:var(--font-size-base);line-height:1.6}.tutorial-detail-stats{align-items:stretch;gap:var(--space-3);padding:var(--space-3) 0}.tutorial-detail-stat{justify-content:center;text-align:center}.tutorial-detail-content{gap:var(--space-8);padding:var(--space-8) 0}.tutorial-detail-section{padding:var(--space-6)}.tutorial-detail-section-title{font-size:var(--font-size-xl)}.tutorial-detail-objectives{gap:var(--space-3)}.tutorial-detail-features,.tutorial-detail-section-item{padding:var(--space-5)}.tutorial-detail-section-name{font-size:var(--font-size-lg)}}@media (max-width:480px){.tutorial-detail-hero{padding:var(--space-6) 0 var(--space-4)}.tutorial-detail-title{font-size:var(--font-size-xl)}.tutorial-detail-description{font-size:var(--font-size-sm)}.tutorial-detail-content{gap:var(--space-6);padding:var(--space-6) 0}.tutorial-detail-section{padding:var(--space-4)}.tutorial-detail-section-title{font-size:var(--font-size-lg)}.tutorial-detail-objective,.tutorial-detail-prerequisite{font-size:var(--font-size-sm);padding:var(--space-2)}.tutorial-detail-features{padding:var(--space-4)}.tutorial-detail-start-btn{font-size:var(--font-size-sm);min-height:48px;padding:var(--space-3) var(--space-4)}.tutorial-detail-section-item{padding:var(--space-4)}.tutorial-detail-section-name{font-size:var(--font-size-lg)}}@media (prefers-reduced-motion:reduce){.tutorial-detail-card,.tutorial-detail-lesson,.tutorial-detail-loading-spinner,.tutorial-detail-preview-btn,.tutorial-detail-resource,.tutorial-detail-section,.tutorial-detail-section-item,.tutorial-detail-start-btn{animation:none!important;transition:none!important}.tutorial-detail-card:hover,.tutorial-detail-lesson:hover,.tutorial-detail-resource:hover,.tutorial-detail-section-item:hover,.tutorial-detail-section:hover{transform:none!important}.tutorial-detail-start-btn:before{display:none}}@media (prefers-contrast:high){.tutorial-detail-card,.tutorial-detail-lesson,.tutorial-detail-resource,.tutorial-detail-section,.tutorial-detail-section-item{border-color:var(--color-text);border-width:2px}.tutorial-detail-card:hover,.tutorial-detail-lesson:hover,.tutorial-detail-resource:hover,.tutorial-detail-section-item:hover,.tutorial-detail-section:hover{border-color:var(--color-primary)}.tutorial-detail-preview-btn,.tutorial-detail-start-btn{border:2px solid var(--color-primary)}.tutorial-detail-preview-btn:focus-visible,.tutorial-detail-start-btn:focus-visible{outline-color:var(--color-text);outline-width:3px}}.interview-questions-page{background:var(--color-surface);min-height:100vh}.interview-container{box-sizing:border-box;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);width:100%}.interview-page-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-8) 0 var(--space-6);position:relative;text-align:left;will-change:transform,opacity}.interview-page-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);position:relative;z-index:2}.interview-page-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.5;margin:0;max-width:900px;position:relative;z-index:2}.interview-main-layout{display:grid;gap:var(--space-6);grid-template-columns:300px 1fr;margin:0 auto;max-width:1400px;min-height:calc(100vh - 200px);padding:var(--space-6) var(--space-4)}.interview-sidebar{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);height:-moz-fit-content;height:fit-content;max-height:calc(100vh - var(--space-8));overflow-y:auto;padding:var(--space-5);position:sticky;top:var(--space-6)}.sidebar-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-4);padding-bottom:var(--space-3)}.sidebar-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.sidebar-search{margin-bottom:var(--space-4)}.searchbar{align-items:center;display:flex;position:relative}.search-icon{z-index:2}.search-input:focus{box-shadow:var(--shadow-focus)}.sidebar-filters{gap:var(--space-6)}.filter-section,.sidebar-filters{display:flex;flex-direction:column}.filter-section{gap:var(--space-3)}.filter-section-header{align-items:center;display:flex;justify-content:space-between}.filter-section-title{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0}.filter-count{background:var(--color-surface-hover);border-radius:var(--radius-sm);color:var(--color-text-muted);font-size:var(--font-size-sm);padding:var(--space-1) var(--space-2)}.filter-options{display:flex;flex-direction:column;gap:var(--space-1)}.filter-option{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;display:flex;gap:var(--space-3);min-height:48px;padding:var(--space-3) var(--space-4);position:relative;transition:all var(--transition-normal)}.filter-option:hover{background:var(--color-surface-hover);border-color:var(--color-primary-light);transform:translate(4px)}.filter-option.selected{background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white);font-weight:var(--font-weight-semibold)}.filter-option.selected:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translate(4px)}.filter-radio{display:none}.radio-custom{background:var(--color-surface);border:2px solid var(--color-border);border-radius:50%;flex-shrink:0;height:18px;position:relative;transition:all var(--transition-normal);width:18px}.filter-option.selected .radio-custom{background:var(--color-white);border-color:var(--color-white)}.radio-custom:after{background:var(--color-primary);border-radius:50%;content:"";height:8px;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity var(--transition-normal);width:8px}.filter-option.selected .radio-custom:after{opacity:1}.option-name{flex:1;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.selection-mode-toggle{background:var(--color-surface-hover);border-radius:var(--radius-lg);display:flex;gap:var(--space-1);padding:var(--space-1)}.selection-mode-btn{align-items:center;background:transparent;border:none;border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text-muted);cursor:pointer;display:flex;flex:1;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);justify-content:center;min-height:44px;min-width:44px;padding:var(--space-2) var(--space-3);transition:all var(--transition-normal)}.selection-mode-btn:hover{background:var(--color-surface);color:var(--color-text)}.selection-mode-btn.active{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.clear-filters-btn{background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--space-2) var(--space-4);transition:all var(--transition-normal)}.clear-filters-btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:var(--color-white)}.clear-filters-btn:disabled{cursor:not-allowed;opacity:.5}.interview-content{display:flex;flex-direction:column;gap:var(--space-6)}.results-header{justify-content:space-between;margin-bottom:var(--space-4)}.results-header,.results-info{align-items:center;display:flex}.results-info{gap:var(--space-3)}.results-title{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);line-height:1.4;margin:0}.interview-questions-grid{display:flex;flex-direction:column;gap:var(--space-4)}.interview-question-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);contain:layout style paint;overflow:hidden;transition:all var(--transition-normal);will-change:transform,box-shadow,border-color}.interview-question-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.interview-question-card.expanded{border-color:var(--color-primary);box-shadow:var(--shadow-lg)}.interview-question-header{align-items:flex-start;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--space-4);min-height:44px;min-width:44px;padding:var(--space-6);transition:all var(--transition-normal)}.interview-question-header:hover{background:var(--color-surface-hover)}.interview-question-number{align-items:center;background:var(--color-primary);border-radius:var(--radius-full);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);height:32px;justify-content:center;width:32px}.interview-question-content{flex:1;min-width:0}.interview-question-title{color:var(--color-text-heading);display:-webkit-box;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);-webkit-line-clamp:2;line-clamp:2;line-height:1.4;margin:0 0 var(--space-3) 0;-webkit-box-orient:vertical;overflow:hidden}.interview-question-meta{align-items:center;color:var(--color-text-muted);display:flex;flex-wrap:wrap;font-size:var(--font-size-sm);gap:var(--space-3)}.interview-question-category,.interview-question-topic{font-weight:var(--font-weight-medium)}.interview-question-category,.interview-question-difficulty,.interview-question-topic{background:var(--color-surface-hover);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2)}.interview-question-difficulty{font-weight:var(--font-weight-semibold);text-transform:capitalize}.interview-question-toggle{align-items:center;background:var(--color-surface-hover);border-radius:var(--radius-full);color:var(--color-text-muted);display:flex;flex-shrink:0;height:32px;justify-content:center;transition:all var(--transition-normal);width:32px}.interview-question-header:hover .interview-question-toggle{background:var(--color-primary);color:var(--color-white)}.interview-question-answer{animation:slideDown .3s ease-out;background:var(--color-surface-hover);border-top:1px solid var(--color-border)}@keyframes slideDown{0%{max-height:0;opacity:0}to{max-height:500px;opacity:1}}.interview-answer-content{padding:var(--space-6)}.interview-answer-title{align-items:center;color:var(--color-text-heading);display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-2);margin:0 0 var(--space-3) 0}.interview-answer-title:before{content:"💡";font-size:var(--font-size-sm)}.interview-answer-text{color:var(--color-text-body);font-size:var(--font-size-base);line-height:1.6;margin:0 0 var(--space-4) 0}.interview-answer-meta{align-items:center;border-top:1px solid var(--color-border);color:var(--color-text-muted);display:flex;flex-wrap:wrap;font-size:var(--font-size-sm);gap:var(--space-4);padding-top:var(--space-3)}.interview-answer-company,.interview-answer-time,.interview-answer-type{align-items:center;background:var(--color-surface);border-radius:var(--radius-sm);display:flex;font-weight:var(--font-weight-medium);gap:var(--space-1);padding:var(--space-1) var(--space-2)}.no-results-section{align-items:center;display:flex;justify-content:center;min-height:400px;padding:var(--space-8)}.no-results-content{max-width:500px;text-align:center}.no-results-icon{color:var(--color-text-muted);margin-bottom:var(--space-4)}.no-results-title{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-3) 0}.no-results-description{color:var(--color-text-body);font-size:var(--font-size-lg);line-height:1.6;margin:0 0 var(--space-6) 0}.no-results-actions{display:flex;gap:var(--space-3);justify-content:center}.clear-filters-suggestion-btn{background:var(--color-primary);border:none;border-radius:var(--radius-lg);color:var(--color-white);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);padding:var(--space-3) var(--space-6);transition:all var(--transition-normal)}.clear-filters-suggestion-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.interview-load-more{padding:var(--space-8) 0;text-align:center}.load-more-btn{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-text);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);min-height:44px;min-width:44px;padding:var(--space-3) var(--space-6);transition:all var(--transition-normal)}.load-more-btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);box-shadow:var(--shadow-md);color:var(--color-white);transform:translateY(-1px)}.load-more-btn:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.load-more-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.load-more-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.loading-spinner-small{animation:spin 1s linear infinite;border-top:2px solid var(--color-border);border:2px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:16px;width:16px}@media (max-width:1024px){.interview-main-layout{gap:var(--space-4);grid-template-columns:280px 1fr;padding:var(--space-4) var(--space-3)}}@media (max-width:768px){.interview-page-header{padding:var(--space-6) 0 var(--space-4)}.interview-page-title{font-size:var(--font-size-2xl)}.interview-page-subtitle{font-size:var(--font-size-base)}.interview-main-layout{gap:var(--space-4);grid-template-columns:1fr;padding:var(--space-4) var(--space-3)}.interview-sidebar{border:none;border-bottom:1px solid var(--color-border);border-radius:0;max-height:none;position:static}.interview-question-header,.interview-sidebar{padding:var(--space-4)}.interview-question-title{font-size:var(--font-size-base)}.interview-answer-content{padding:var(--space-4)}}@media (max-width:480px){.interview-page-header{padding:var(--space-5) 0 var(--space-4)}.interview-page-title{font-size:var(--font-size-xl)}.interview-container{padding:0 var(--space-3)}.interview-main-layout{padding:var(--space-4) var(--space-3)}.interview-question-header{gap:var(--space-3);padding:var(--space-3)}.interview-question-number{font-size:var(--font-size-xs);height:28px;width:28px}.interview-question-title{font-size:var(--font-size-sm)}.interview-question-meta{align-items:flex-start;flex-direction:column;gap:var(--space-2)}.interview-answer-content{padding:var(--space-3)}.interview-answer-meta{align-items:flex-start;flex-direction:column;gap:var(--space-2)}}@media (prefers-reduced-motion:reduce){.clear-filters-btn,.filter-option,.interview-question-card,.load-more-btn,.loading-spinner-small,.search-input,.selection-mode-btn{animation:none!important;transition:none!important}.interview-question-card:hover,.load-more-btn:hover:not(:disabled){transform:none!important}.interview-question-answer{animation:none!important}}@media (prefers-contrast:high){.clear-filters-btn,.filter-option,.interview-question-card,.load-more-btn,.search-input,.selection-mode-btn{border-color:var(--color-text);border-width:2px}.filter-option:hover,.interview-question-card:hover,.selection-mode-btn:hover{border-color:var(--color-primary)}.clear-filters-btn:focus-visible,.filter-option:focus-visible,.interview-question-card:focus-visible,.load-more-btn:focus-visible,.search-input:focus-visible,.selection-mode-btn:focus-visible{outline-color:var(--color-text);outline-width:3px}}.blog{background:var(--color-surface);min-height:100vh}.blog-container{box-sizing:border-box;margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding-x);width:100%}.blog-page-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-8) 0 var(--space-6);position:relative;text-align:left;will-change:transform,opacity}.blog-page-header:before{background:radial-gradient(circle at 20% 20%,hsla(0,0%,100%,.1) 0,transparent 50%),radial-gradient(circle at 80% 80%,hsla(0,0%,100%,.05) 0,transparent 50%),radial-gradient(circle at 40% 60%,hsla(0,0%,100%,.03) 0,transparent 50%);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;will-change:opacity}.blog-page-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);position:relative;z-index:2}.blog-page-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.5;margin:0;max-width:900px;position:relative;z-index:2}.blog-main-layout{margin:0 auto;max-width:1400px;min-height:calc(100vh - 200px);padding:var(--space-6) var(--space-4)}.blog-filters{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-6) 0;position:sticky;top:0;z-index:100}.blog-search-filters{display:flex;flex-direction:column;gap:var(--space-4);margin:0 auto;max-width:1000px}.blog-search{margin:0 auto;max-width:500px;position:relative}.blog-search svg{color:var(--color-text-muted);left:var(--space-3);position:absolute;top:50%;transform:translateY(-50%);z-index:2}.blog-search input{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-text);font-size:var(--font-size-base);min-height:44px;padding:var(--space-3) var(--space-3) var(--space-3) var(--space-10);transition:all var(--transition-normal);width:100%;will-change:border-color,box-shadow}.blog-search input:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.blog-search input::-moz-placeholder{color:var(--color-text-muted)}.blog-search input::placeholder{color:var(--color-text-muted)}.blog-filter-controls{display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:center}.blog-filter-group{background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-lg);display:flex;flex-direction:column;gap:var(--space-1);min-width:150px;padding:var(--space-3)}.blog-filter-group svg{color:var(--color-primary);flex-shrink:0;font-size:var(--font-size-sm)}.blog-filter-label{color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;text-transform:uppercase}.blog-filter-group select{background:transparent;border:none;color:var(--color-text);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);outline:none;width:100%}.blog-filter-group select:focus{outline:none}.blog-filter-group:hover{background:var(--color-surface);border-color:var(--color-primary-light)}.blog-filter-group:focus-within{border-color:var(--color-primary);box-shadow:var(--shadow-focus)}.blog-section-header{margin-bottom:var(--space-8);text-align:center}.blog-section-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.blog-section-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0 auto;max-width:600px}.blog-featured{background:var(--color-surface);padding:var(--space-12) 0}.blog-featured-grid{display:grid;gap:var(--space-8);grid-template-columns:repeat(auto-fit,minmax(400px,1fr));margin:0 auto;max-width:1200px}.blog-featured-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);contain:layout style paint;overflow:hidden;position:relative;transition:all var(--transition-normal);will-change:transform,box-shadow,border-color}.blog-featured-card:hover{background:var(--color-surface);border-color:var(--color-primary-light);box-shadow:var(--shadow-xl);transform:translateY(-4px)}.blog-featured-image{aspect-ratio:16/9;overflow:hidden;position:relative}.blog-featured-image img{height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--transition-normal);width:100%}.blog-featured-card:hover .blog-featured-image img{transform:scale(1.05)}.blog-featured-badge{align-items:center;background:var(--color-warning);border-radius:var(--radius-full);color:var(--color-white);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);gap:var(--space-1);padding:var(--space-2) var(--space-3);position:absolute;right:var(--space-4);top:var(--space-4);z-index:2}.blog-featured-content{padding:var(--space-6)}.blog-post-meta{align-items:center;display:flex;flex-wrap:wrap;font-size:var(--font-size-sm);gap:var(--space-3);margin-bottom:var(--space-4)}.blog-post-category{background:var(--color-primary);border-radius:var(--radius-sm);color:var(--color-white);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--space-1) var(--space-2)}.blog-post-date,.blog-post-read-time{align-items:center;color:var(--color-text-muted);display:flex;gap:var(--space-1)}.blog-post-date svg,.blog-post-read-time svg{color:var(--color-primary)}.blog-post-title{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:1.3;margin:0 0 var(--space-3) 0}.blog-post-link{color:inherit;text-decoration:none;transition:color var(--transition-normal)}.blog-post-link:hover{color:var(--color-primary)}.blog-post-link:focus{border-radius:var(--radius-sm);outline:2px solid var(--color-primary);outline-offset:2px}.blog-post-excerpt{color:var(--color-text-body);line-height:1.6;margin:0 0 var(--space-4) 0}.blog-post-author{gap:var(--space-3);margin-bottom:var(--space-4)}.blog-post-author img{height:40px;width:40px}.blog-author-info{display:flex;flex-direction:column}.blog-author-name{color:var(--color-text-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.blog-author-role{color:var(--color-text-muted);font-size:var(--font-size-xs)}.blog-post-stats{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-4)}.blog-post-likes,.blog-post-views{align-items:center;display:flex;gap:var(--space-1)}.blog-post-likes svg,.blog-post-views svg{color:var(--color-primary)}.blog-categories{background:var(--color-surface-alt);padding:var(--space-12) 0}.blog-categories-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:0 auto;max-width:1000px}.blog-category-card{align-items:center;background:var(--color-surface);border:none;border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);cursor:pointer;display:flex;flex-direction:column;font-family:inherit;gap:var(--space-3);padding:var(--space-6);text-align:center;transition:all var(--transition-normal);width:100%}.blog-category-card:hover{background:var(--color-surface);border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.blog-category-card:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.blog-category-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.blog-category-icon{align-items:center;background:var(--color-primary);border-radius:var(--radius-full);color:var(--color-white);display:flex;font-size:var(--font-size-xl);height:60px;justify-content:center;margin:0 auto var(--space-4);width:60px}.blog-category-card h4{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-2) 0}.blog-category-card p{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0}.blog-latest{background:var(--color-surface);padding:var(--space-12) 0}.blog-posts-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(350px,1fr));margin:0 auto;max-width:1200px}.blog-post-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden;position:relative;transition:all var(--transition-normal)}.blog-post-card:hover{background:var(--color-surface);border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.blog-post-image{aspect-ratio:16/9;overflow:hidden;position:relative}.blog-post-image img{height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--transition-normal);width:100%}.blog-post-card:hover .blog-post-image img{transform:scale(1.05)}.blog-post-overlay{display:flex;gap:var(--space-2);opacity:0;position:absolute;right:var(--space-3);top:var(--space-3);transition:opacity var(--transition-normal)}.blog-post-card:hover .blog-post-overlay{opacity:1}.blog-bookmark-btn,.blog-share-btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000b3;border:none;border-radius:var(--radius-full);color:var(--color-white);cursor:pointer;display:flex;height:36px;justify-content:center;transition:all var(--transition-normal);width:36px}.blog-bookmark-btn:hover,.blog-share-btn:hover{background:var(--color-primary);transform:scale(1.1)}.blog-bookmark-btn:focus,.blog-share-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.blog-post-content{padding:var(--space-4)}.blog-post-footer{align-items:center;display:flex;justify-content:space-between;margin-top:var(--space-4)}.blog-post-author{align-items:center;display:flex;gap:var(--space-2)}.blog-post-author img{border-radius:var(--radius-full);height:32px;-o-object-fit:cover;object-fit:cover;width:32px}.blog-load-more{margin-top:var(--space-8);text-align:center}.blog-load-more-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);color:var(--color-white);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);padding:var(--space-3) var(--space-6);transition:all var(--transition-normal)}.blog-load-more-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.blog-load-more-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.blog-load-more-btn:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.blog-newsletter{background:var(--gradient-primary);overflow:hidden;padding:var(--space-12) 0;position:relative}.blog-newsletter:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpattern id='a' width='100' height='100' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='25' cy='25' r='1' fill='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='75' cy='75' r='1' fill='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='50' cy='10' r='1' fill='rgba(255,255,255,0.03)'/%3E%3Ccircle cx='10' cy='60' r='1' fill='rgba(255,255,255,0.03)'/%3E%3Ccircle cx='90' cy='40' r='1' fill='rgba(255,255,255,0.03)'/%3E%3C/pattern%3E%3C/defs%3E%3Cpath fill='url(%23a)' d='M0 0h100v100H0z'/%3E%3C/svg%3E");bottom:0;content:"";left:0;opacity:.4;pointer-events:none;position:absolute;right:0;top:0}.blog-newsletter-content{align-items:center;display:grid;gap:var(--space-8);grid-template-columns:1fr 1fr;margin:0 auto;max-width:1000px;position:relative;z-index:2}.blog-newsletter-text h2{color:var(--color-white);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.blog-newsletter-text p{color:#ffffffe6;font-size:var(--font-size-lg);line-height:1.6;margin-bottom:var(--space-6)}.blog-newsletter-features{display:flex;flex-direction:column;gap:var(--space-2)}.blog-newsletter-feature{align-items:center;color:#fffc;display:flex;font-size:var(--font-size-sm);gap:var(--space-2)}.blog-newsletter-feature svg{color:var(--color-success);flex-shrink:0}.blog-newsletter-form{display:flex;flex-direction:column;gap:var(--space-4)}.blog-newsletter-input{align-items:center;background:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;overflow:hidden;position:relative}.blog-newsletter-input svg{color:var(--color-text-muted);left:var(--space-3);position:absolute;z-index:2}.blog-newsletter-input input{background:transparent;border:none;color:var(--color-text);flex:1;font-size:var(--font-size-base);outline:none;padding:var(--space-3) var(--space-3) var(--space-3) var(--space-10)}.blog-newsletter-input input::-moz-placeholder{color:var(--color-text-muted)}.blog-newsletter-input input::placeholder{color:var(--color-text-muted)}.blog-newsletter-btn{align-items:center;background:var(--color-primary);border:none;color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.blog-newsletter-btn:hover{background:var(--color-primary-hover)}.blog-newsletter-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.blog-newsletter-btn:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.blog-newsletter-note{color:#ffffffb3;font-size:var(--font-size-xs);margin:0;text-align:center}.blog-tags{background:var(--color-surface-alt);padding:var(--space-12) 0}.blog-tags-grid{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center;margin:0 auto;max-width:800px}.blog-tag{align-items:center;background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-1);padding:var(--space-2) var(--space-3);transition:all var(--transition-normal)}.blog-tag:hover{background:var(--color-primary-light);color:var(--color-primary)}.blog-tag.active,.blog-tag:hover{border-color:var(--color-primary)}.blog-tag.active{background:var(--color-primary);color:var(--color-white)}.blog-tag:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.blog-tag:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.blog-tag-count{color:var(--color-text-muted);font-size:var(--font-size-xs)}.blog-tag.active .blog-tag-count{color:#fffc}@media (prefers-reduced-motion:reduce){.blog-category-card,.blog-featured-card,.blog-filter-group,.blog-newsletter-form,.blog-post-card,.blog-search input,.blog-tag{animation:none!important;transition:none!important}.blog-category-card:hover,.blog-featured-card:hover,.blog-post-card:hover{transform:none!important}.blog-featured-card:before{display:none}}@media (prefers-contrast:high){.blog-category-card,.blog-featured-card,.blog-filter-group,.blog-newsletter-form,.blog-post-card,.blog-search input{border-color:var(--color-text);border-width:2px}.blog-category-card:hover,.blog-featured-card:hover,.blog-post-card:hover{border-color:var(--color-primary)}.blog-filter-group:focus-visible,.blog-newsletter-form:focus-visible,.blog-search input:focus-visible{outline-color:var(--color-text);outline-width:3px}}@media (max-width:1024px){.blog-featured-grid{gap:var(--space-6);grid-template-columns:1fr}.blog-categories-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.blog-posts-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.blog-newsletter-content{gap:var(--space-6);grid-template-columns:1fr;text-align:center}}@media (max-width:768px){.blog-container{padding:0 var(--space-4)}.blog-search-filters{gap:var(--space-3)}.blog-filter-controls{align-items:center;flex-direction:column;gap:var(--space-2)}.blog-filter-group{justify-content:center;max-width:300px;width:100%}.blog-section-title{font-size:var(--font-size-2xl)}.blog-section-subtitle{font-size:var(--font-size-base)}.blog-featured{padding:var(--space-8) 0}.blog-featured-content{padding:var(--space-4)}.blog-post-title{font-size:var(--font-size-lg)}.blog-categories{padding:var(--space-8) 0}.blog-categories-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.blog-category-card{padding:var(--space-4)}.blog-category-icon{font-size:var(--font-size-lg);height:50px;width:50px}.blog-latest{padding:var(--space-8) 0}.blog-posts-grid{gap:var(--space-4);grid-template-columns:1fr}.blog-newsletter{padding:var(--space-8) 0}.blog-newsletter-text h2{font-size:var(--font-size-2xl)}.blog-newsletter-text p{font-size:var(--font-size-base)}.blog-tags{padding:var(--space-8) 0}.blog-tags-grid{gap:var(--space-2)}}@media (max-width:480px){.blog-container{padding:0 var(--space-3)}.blog-filters{padding:var(--space-4) 0}.blog-featured{padding:var(--space-6) 0}.blog-featured-content{padding:var(--space-3)}.blog-post-meta{align-items:flex-start;flex-direction:column;gap:var(--space-2)}.blog-categories{padding:var(--space-6) 0}.blog-categories-grid{gap:var(--space-3);grid-template-columns:1fr}.blog-latest{padding:var(--space-6) 0}.blog-post-content{padding:var(--space-3)}.blog-post-footer{align-items:flex-start;flex-direction:column;gap:var(--space-2)}.blog-newsletter{padding:var(--space-6) 0}.blog-newsletter-text h2{font-size:var(--font-size-xl)}.blog-newsletter-input{align-items:stretch;flex-direction:column}.blog-newsletter-input svg{margin-bottom:var(--space-2);position:static}.blog-newsletter-btn,.blog-newsletter-input input{padding:var(--space-3)}.blog-newsletter-btn{justify-content:center}.blog-tags{padding:var(--space-6) 0}}@media (prefers-reduced-motion:reduce){.blog-category-card,.blog-featured-card,.blog-post-card{transition:none}.blog-category-card:hover,.blog-featured-card:hover,.blog-post-card:hover{transform:none}.blog-featured-image img,.blog-post-image img{transition:none}.blog-bookmark-btn:hover,.blog-featured-card:hover .blog-featured-image img,.blog-load-more-btn:hover,.blog-post-card:hover .blog-post-image img,.blog-share-btn:hover{transform:none}}@media (prefers-contrast:high){.blog-category-card,.blog-featured-card,.blog-post-card,.blog-tag{border-width:2px}.blog-search input{border-width:3px}}.pricing-page{background:var(--color-surface);min-height:100vh}.pricing-page-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);contain:layout style paint;overflow:hidden;padding:var(--space-8) 0 var(--space-6);position:relative;text-align:left;will-change:transform,opacity}.pricing-page-header:before{background:radial-gradient(circle at 20% 20%,hsla(0,0%,100%,.1) 0,transparent 50%),radial-gradient(circle at 80% 80%,hsla(0,0%,100%,.05) 0,transparent 50%),radial-gradient(circle at 40% 60%,hsla(0,0%,100%,.03) 0,transparent 50%);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;will-change:opacity}.pricing-page-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);position:relative;z-index:2}.pricing-page-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.5;margin:0;max-width:900px;position:relative;z-index:2}.pricing-main-layout{margin:0 auto;max-width:1400px;min-height:calc(100vh - 200px);padding:var(--space-6) var(--space-4)}.pricing-cards{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin:0 auto;max-width:1200px;padding:var(--space-8) 0}.pricing-card{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);contain:layout style paint;display:flex;flex-direction:column;height:100%;padding:var(--space-6);position:relative;transition:all var(--transition-normal);will-change:transform,box-shadow,border-color}.pricing-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-xl);transform:translateY(-4px)}.pricing-card:focus-within{border-color:var(--color-primary);box-shadow:var(--shadow-focus)}.pricing-card:before{background:var(--gradient-primary);border-radius:var(--radius-xl) var(--radius-xl) 0 0;content:"";height:4px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-normal)}.pricing-card:hover:before{opacity:1}.pricing-card-header{flex:1;margin-bottom:var(--space-6);text-align:center}.pricing-plan-name{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-2) 0}.pricing-plan-description{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:1.5;margin:0 0 var(--space-4) 0}.pricing-plan-price{align-items:baseline;display:flex;gap:var(--space-1);justify-content:center;margin-bottom:var(--space-2)}.pricing-price-amount{color:var(--color-primary);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold)}.pricing-price-period{color:var(--color-text-muted);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium)}.pricing-original-price{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0;text-decoration:line-through}.pricing-card-features{flex:1;margin:var(--space-6) 0}.pricing-features-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-4) 0}.pricing-features-list{display:flex;flex-direction:column;gap:var(--space-3);list-style:none;margin:0;padding:0}.pricing-feature-item{align-items:center;display:flex;gap:var(--space-3);padding:var(--space-2) 0}.pricing-feature-icon{align-items:center;display:flex;flex-shrink:0;height:20px;justify-content:center;width:20px}.pricing-feature-icon.checked{color:var(--color-success)}.pricing-feature-icon.crossed{color:var(--color-error)}.pricing-feature-label{color:var(--color-text-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.pricing-card-footer{margin-top:auto}.pricing-cta-button{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-2);justify-content:center;min-height:44px;min-width:44px;padding:var(--space-4) var(--space-6);text-decoration:none;transition:all var(--transition-normal);width:100%;will-change:background-color,transform,box-shadow}.pricing-cta-button:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);text-decoration:none;transform:translateY(-1px)}.pricing-cta-button:focus{box-shadow:var(--shadow-focus-strong);outline:none}.pricing-cta-button:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.pricing-cta-button.primary{background:var(--color-primary)}.pricing-cta-button.primary:hover{background:var(--color-primary-hover)}.pricing-comparison{background:var(--color-surface);padding:var(--space-12) 0}.pricing-comparison-header{margin-bottom:var(--space-8);text-align:center}.pricing-comparison-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.pricing-comparison-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0 auto;max-width:600px}.pricing-comparison-table{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);margin:0 auto;max-width:1000px;overflow:hidden}.comparison-table-header{background:var(--color-surface-hover);border-bottom:2px solid var(--color-border);display:grid;grid-template-columns:2fr 1fr 1fr 1fr}.comparison-feature-column,.comparison-plan-column{border-right:1px solid var(--color-border);color:var(--color-text-heading);font-weight:var(--font-weight-semibold);padding:var(--space-4)}.comparison-plan-column{text-align:center}.comparison-plan-column:last-child{border-right:none}.comparison-table-body{display:flex;flex-direction:column}.comparison-row{border-bottom:1px solid var(--color-border);display:grid;grid-template-columns:2fr 1fr 1fr 1fr;transition:background-color var(--transition-fast)}.comparison-row:hover{background:var(--color-surface-hover)}.comparison-row:last-child{border-bottom:none}.comparison-feature{color:var(--color-text-body);font-weight:var(--font-weight-medium)}.comparison-feature,.comparison-value{align-items:center;border-right:1px solid var(--color-border);display:flex;padding:var(--space-4)}.comparison-value{color:var(--color-success);font-size:var(--font-size-lg);justify-content:center}.comparison-value:last-child{border-right:none}.comparison-value.featured{background:#2563eb0d}.comparison-value svg{color:var(--color-error)}.comparison-value:has(svg[class*=check]){color:var(--color-success)}.comparison-value:has(svg[class*=check]) svg{color:var(--color-success)}.pricing-faq{background:var(--color-surface-alt);padding:var(--space-12) 0}.pricing-faq-header{margin-bottom:var(--space-8);text-align:center}.pricing-faq-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.pricing-faq-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0 auto var(--space-6);max-width:600px}.pricing-faq-search{margin:0 auto;max-width:400px}.pricing-faq-search-wrapper{align-items:center;display:flex;position:relative}.pricing-faq-search-icon{color:var(--color-text-muted);left:var(--space-3);position:absolute;z-index:2}.pricing-faq-search-input{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text);font-size:var(--font-size-base);padding:var(--space-3) var(--space-3) var(--space-3) var(--space-10);transition:all var(--transition-normal);width:100%}.pricing-faq-search-input:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.pricing-faq-search-input::-moz-placeholder{color:var(--color-text-muted)}.pricing-faq-search-input::placeholder{color:var(--color-text-muted)}.pricing-faq-list{display:flex;flex-direction:column;gap:var(--space-4);margin:0 auto;max-width:800px}.pricing-faq-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);cursor:pointer;overflow:hidden;transition:all var(--transition-normal)}.pricing-faq-item:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md)}.pricing-faq-item.expanded{border-color:var(--color-primary);box-shadow:var(--shadow-lg)}.pricing-faq-question-wrapper{align-items:center;background:none;border:none;cursor:pointer;display:flex;justify-content:space-between;padding:var(--space-4);text-align:left;width:100%}.pricing-faq-question-wrapper:focus,.pricing-faq-question-wrapper:hover{background:var(--color-surface-hover)}.pricing-faq-question-wrapper:focus{box-shadow:var(--shadow-focus);outline:none}.pricing-faq-question-wrapper:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.pricing-faq-question{color:var(--color-text-heading);flex:1;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.pricing-faq-toggle{color:var(--color-text-muted);flex-shrink:0;transition:transform var(--transition-normal)}.pricing-faq-item.expanded .pricing-faq-toggle{transform:rotate(180deg)}.pricing-faq-answer-wrapper{max-height:0;overflow:hidden;transition:max-height var(--transition-normal)}.pricing-faq-item.expanded .pricing-faq-answer-wrapper{max-height:500px}.pricing-faq-answer{color:var(--color-text-body);line-height:1.6;margin:0;padding:0 var(--space-4) var(--space-4)}.pricing-faq-no-results{color:var(--color-text-muted);font-style:italic;padding:var(--space-8);text-align:center}.pricing-loading{align-items:center;display:flex;justify-content:center;min-height:50vh}.pricing-loading-spinner{animation:spin 1s linear infinite;border-top:3px solid var(--color-border);border:3px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:40px;width:40px}@media (prefers-reduced-motion:reduce){.pricing-card,.pricing-comparison-table,.pricing-cta-button{animation:none!important;transition:none!important}.pricing-card:hover,.pricing-cta-button:hover{transform:none!important}.pricing-card:before{display:none}}@media (prefers-contrast:high){.pricing-card,.pricing-comparison-table,.pricing-cta-button{border-color:var(--color-text);border-width:2px}.pricing-card:hover,.pricing-cta-button:hover{border-color:var(--color-primary)}.pricing-cta-button:focus-visible{outline-color:var(--color-text);outline-width:3px}}@media (max-width:1024px){.pricing-cards{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.comparison-row,.comparison-table-header{grid-template-columns:1.5fr 1fr 1fr 1fr}.comparison-feature,.comparison-feature-column,.comparison-plan-column,.comparison-value{font-size:var(--font-size-sm);padding:var(--space-3)}}@media (max-width:768px){.pricing-cards{gap:var(--space-4);grid-template-columns:1fr;padding:var(--space-6) 0}.pricing-card{padding:var(--space-4)}.pricing-plan-name{font-size:var(--font-size-xl)}.pricing-price-amount{font-size:var(--font-size-3xl)}.pricing-comparison{padding:var(--space-8) 0}.pricing-comparison-title{font-size:var(--font-size-2xl)}.pricing-comparison-subtitle{font-size:var(--font-size-base)}.comparison-row,.comparison-table-header{gap:var(--space-2);grid-template-columns:1fr}.comparison-feature-column,.comparison-plan-column{display:none}.comparison-feature{background:var(--color-surface-hover);font-weight:var(--font-weight-semibold)}.comparison-feature,.comparison-value{border-bottom:1px solid var(--color-border);border-right:none}.comparison-value{justify-content:flex-start;padding-left:var(--space-6)}.comparison-value:last-child{border-bottom:none}.pricing-faq{padding:var(--space-8) 0}.pricing-faq-title{font-size:var(--font-size-2xl)}.pricing-faq-question,.pricing-faq-subtitle{font-size:var(--font-size-base)}}@media (max-width:480px){.pricing-cards{padding:var(--space-4) 0}.pricing-card{padding:var(--space-3)}.pricing-plan-name{font-size:var(--font-size-lg)}.pricing-price-amount{font-size:var(--font-size-2xl)}.pricing-cta-button{font-size:var(--font-size-sm);padding:var(--space-3) var(--space-4)}.pricing-comparison{padding:var(--space-6) 0}.pricing-comparison-title{font-size:var(--font-size-xl)}.pricing-faq{padding:var(--space-6) 0}.pricing-faq-title{font-size:var(--font-size-xl)}.pricing-faq-question-wrapper{padding:var(--space-3)}.pricing-faq-answer{padding:0 var(--space-3) var(--space-3)}}@media (prefers-reduced-motion:reduce){.pricing-card{transition:none}.pricing-card:hover,.pricing-cta-button:hover{transform:none}.pricing-faq-answer-wrapper,.pricing-faq-toggle{transition:none}}@media (prefers-contrast:high){.pricing-card{border-width:3px}.pricing-comparison-table,.pricing-faq-item{border-width:2px}.pricing-faq-search-input{border-width:3px}}.login-page{align-items:center;background:var(--gradient-hero);background-image:radial-gradient(circle at 20% 20%,hsla(0,0%,100%,.1) 0,transparent 50%),radial-gradient(circle at 80% 80%,hsla(0,0%,100%,.05) 0,transparent 50%),radial-gradient(circle at 40% 60%,hsla(0,0%,100%,.03) 0,transparent 50%);display:flex;justify-content:center;min-height:100vh;overflow:hidden;padding:var(--space-4);position:relative}.login-page:before{background:radial-gradient(circle at 25% 25%,hsla(0,0%,100%,.05) 1px,transparent 0),radial-gradient(circle at 75% 75%,hsla(0,0%,100%,.05) 1px,transparent 0);background-size:50px 50px;bottom:0;content:"";left:0;opacity:.6;right:0;top:0;will-change:opacity}.login-floating,.login-page:before{pointer-events:none;position:absolute}.login-floating{animation:float 8s ease-in-out infinite;color:var(--color-white);filter:blur(.5px);font-size:var(--font-size-4xl);opacity:.08}.login-floating:first-child{animation-delay:0s;left:10%;top:20%}.login-floating:nth-child(2){animation-delay:2s;right:15%;top:60%}.login-floating:nth-child(3){animation-delay:4s;bottom:20%;left:20%}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.login-left{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:var(--color-surface);background:#fffffff2;border:1px solid var(--color-border);border:1px solid hsla(0,0%,100%,.2);border-radius:var(--radius-2xl);box-shadow:0 25px 50px -12px #00000040,0 0 0 1px #ffffff1a;contain:layout style paint;max-width:480px;padding:var(--space-8);position:relative;width:100%;will-change:transform,box-shadow;z-index:2}.login-logo-section{margin-bottom:var(--space-8);position:relative;text-align:center}.login-logo-section:after{background:var(--gradient-primary);border-radius:var(--radius-full);bottom:-var(--space-4);content:"";height:2px;left:50%;position:absolute;transform:translate(-50%);width:60px}.login-logo{align-items:center;background:var(--gradient-primary);border-radius:var(--radius-xl);box-shadow:0 10px 25px -5px #2563eb4d,0 0 0 1px #ffffff1a;display:flex;height:72px;justify-content:center;margin:0 auto var(--space-4);overflow:hidden;position:relative;transition:all var(--transition-normal);width:72px}.login-logo:hover{box-shadow:0 15px 35px -5px #2563eb66,0 0 0 1px #fff3;transform:translateY(-2px)}.login-logo:before{background:linear-gradient(45deg,transparent 30%,var(--color-white) 50%,transparent 70%);bottom:0;content:"";left:0;opacity:.2;position:absolute;right:0;top:0;transform:translate(-100%);transition:transform var(--transition-slow)}.login-logo:hover:before{transform:translate(100%)}.login-logo img,.login-logo-gradient .header-logo,.login-logo-gradient img{filter:brightness(0) invert(1);height:36px;-o-object-fit:contain;object-fit:contain;position:relative;width:36px;z-index:2}.login-logo-gradient{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%;z-index:2}.login-brand-title{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.025em}.login-brand-subtitle{color:var(--color-text-body);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:1.5;opacity:.8}.login-title{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;line-height:1.2;margin:0 0 var(--space-4) 0;text-align:center}.login-subtitle{color:var(--color-text-body);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);line-height:1.6;margin:0 0 var(--space-8) 0;text-align:center}.login-subtitle b{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.login-oauth-buttons{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-6)}.login-oauth-btn{align-items:center;background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:0 1px 3px #0000001a;box-sizing:border-box;color:var(--color-text);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-3);justify-content:center;min-height:52px;min-width:44px;overflow:hidden;padding:var(--space-4) var(--space-5);position:relative;text-decoration:none;transition:all var(--transition-normal);will-change:border-color,background-color,transform}.login-oauth-btn:before{background:linear-gradient(90deg,transparent,var(--color-white),transparent);content:"";height:100%;left:-100%;opacity:.2;position:absolute;top:0;transition:left var(--transition-normal);width:100%}.login-oauth-btn:hover:before{left:100%}.login-oauth-btn:hover{background:var(--color-primary-light);border-color:var(--color-primary);box-shadow:var(--shadow-md);opacity:1;text-decoration:none;transform:translateY(-1px)}.login-oauth-btn:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus);outline:none}.login-oauth-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.login-oauth-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.login-oauth-btn.google,.login-oauth-btn.google:hover{border-color:var(--color-google);color:var(--color-google)}.login-oauth-btn.google:hover{background:var(--color-google-light);opacity:1}.login-oauth-btn.google:focus{box-shadow:var(--shadow-focus)}.login-oauth-btn.microsoft,.login-oauth-btn.microsoft:hover{border-color:var(--color-microsoft);color:var(--color-microsoft)}.login-oauth-btn.microsoft:hover{background:var(--color-microsoft-light);opacity:1}.login-oauth-btn.microsoft:focus{box-shadow:var(--shadow-focus)}.oauth-icon{flex-shrink:0;font-size:var(--font-size-lg)}.login-form{flex-direction:column}.login-form,.login-or{display:flex;gap:var(--space-4)}.login-or{align-items:center;color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin:var(--space-6) 0}.login-or span:first-child,.login-or span:last-child{background:var(--color-border);flex:1;height:1px}.login-or span:nth-child(2){background:var(--color-surface);padding:0 var(--space-2)}.login-input-group{align-items:center;display:flex;position:relative}.login-input-icon{color:var(--color-text-muted);font-size:var(--font-size-lg);left:var(--space-3);pointer-events:none;position:absolute;z-index:2}.login-input-group input{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:0 1px 3px #0000001a;box-sizing:border-box;color:var(--color-text);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);min-height:52px;outline:none;padding:var(--space-4) var(--space-4) var(--space-4) var(--space-12);transition:all var(--transition-normal);width:100%;will-change:border-color,box-shadow}.login-input-group input:focus{border-color:var(--color-primary);box-shadow:var(--shadow-focus)}.login-input-group input:invalid:not(:focus):not(:-moz-placeholder){border-color:var(--color-error);box-shadow:var(--shadow-error)}.login-input-group input:invalid:not(:focus):not(:placeholder-shown){border-color:var(--color-error);box-shadow:var(--shadow-error)}.login-input-group input:valid:not(:focus):not(:-moz-placeholder){border-color:var(--color-success)}.login-input-group input:valid:not(:focus):not(:placeholder-shown){border-color:var(--color-success)}.login-input-group input::-moz-placeholder{color:var(--color-text-muted)}.login-input-group input::placeholder{color:var(--color-text-muted)}.login-password-toggle{background:none;border:none;border-radius:var(--radius-sm);box-sizing:border-box;color:var(--color-text-muted);cursor:pointer;min-height:44px;min-width:44px;padding:var(--space-1);position:absolute;right:var(--space-3);transition:all var(--transition-fast);will-change:color,background-color;z-index:2}.login-password-toggle:hover{background:var(--color-primary-light);color:var(--color-primary)}.login-password-toggle:focus{box-shadow:var(--shadow-focus);color:var(--color-primary);outline:none}.login-password-toggle:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.password-strength{align-items:center;display:flex;gap:var(--space-3);margin-top:var(--space-2)}.password-strength-bar{background:var(--color-border);border-radius:var(--radius-full);flex:1;height:4px;overflow:hidden}.password-strength-fill{border-radius:var(--radius-full);height:100%;transition:all var(--transition-normal)}.password-strength-text{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);min-width:80px;text-align:right}.login-signin-btn{align-items:center;background:var(--gradient-primary);border:none;border-radius:var(--radius-lg);box-shadow:0 4px 14px #2563eb4d,0 1px 3px #0000001a;box-sizing:border-box;color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-2);justify-content:center;letter-spacing:.025em;margin-top:var(--space-6);min-height:52px;overflow:hidden;padding:var(--space-4) var(--space-6);position:relative;text-decoration:none;transition:all var(--transition-normal);width:100%;will-change:background-color,transform,box-shadow}.login-signin-btn:before{background:linear-gradient(90deg,transparent,var(--color-white),transparent);content:"";height:100%;left:-100%;opacity:.2;position:absolute;top:0;transition:left var(--transition-normal);width:100%}.login-signin-btn:hover:before{left:100%}.login-signin-btn:hover{background:var(--gradient-button-hover);box-shadow:0 8px 25px -5px #2563eb66,0 4px 14px #2563eb4d;text-decoration:none;transform:translateY(-2px)}.login-signin-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.login-signin-btn:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.login-signin-btn.loading{color:transparent;position:relative}.login-signin-btn.loading:after{animation:spin 1s linear infinite;border:2px solid var(--color-white);border-radius:50%;border-top:2px solid transparent;content:"";height:20px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:20px}.login-signin-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.login-input-group.error input{border-color:var(--color-error);box-shadow:var(--shadow-error)}.login-input-group.success input{border-color:var(--color-success);box-shadow:var(--shadow-success)}.login-error,.login-success{align-items:center;border-radius:var(--radius-md);display:flex;gap:var(--space-2);margin-top:var(--space-2);padding:var(--space-2) var(--space-3)}.login-terms-checkbox{margin:var(--space-2) 0}.login-checkbox-label{align-items:flex-start;cursor:pointer;display:flex;font-size:var(--font-size-sm);gap:var(--space-2);line-height:1.5}.login-checkbox-input{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-sm);box-sizing:border-box;cursor:pointer;flex-shrink:0;height:20px;margin-top:2px;min-height:20px;min-width:20px;transition:all var(--transition-normal);width:20px;will-change:background-color,border-color}.login-checkbox-input:checked{background:var(--color-primary);border-color:var(--color-primary)}.login-checkbox-input:focus{box-shadow:var(--shadow-focus);outline:none}.login-checkbox-input:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.login-checkbox-text{color:var(--color-text-body)}.login-terms-link{color:var(--color-primary);font-weight:var(--font-weight-medium);text-decoration:none}.login-terms-link:focus,.login-terms-link:hover{text-decoration:underline}.login-terms-link:focus{box-shadow:var(--shadow-focus);outline:none}.login-links a{transition:color var(--transition-fast)}.login-links a:focus{border-radius:var(--radius-sm);outline:2px solid var(--color-primary);outline-offset:2px}.login-forgot-link{margin:var(--space-2) 0;text-align:right}.login-forgot-btn{color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-decoration:none;transition:all var(--transition-fast)}.login-forgot-btn:hover{color:var(--color-primary-hover);text-decoration:underline}.login-forgot-btn:focus{box-shadow:var(--shadow-focus);outline:none;text-decoration:underline}.login-submit-btn{align-items:center;background:var(--gradient-primary);border:none;border-radius:var(--radius-lg);box-sizing:border-box;color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);gap:var(--space-2);justify-content:center;margin-top:var(--space-2);min-height:48px;padding:var(--space-4) var(--space-6);text-decoration:none;transition:all var(--transition-normal)}.login-submit-btn:hover{background:var(--gradient-button-hover);box-shadow:var(--shadow-lg);text-decoration:none;transform:translateY(-1px)}.login-submit-btn:focus{box-shadow:var(--shadow-focus-strong);outline:none}.login-submit-btn:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.login-submit-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.login-submit-btn.secondary{background:var(--color-surface);border:2px solid var(--color-border);color:var(--color-text)}.login-submit-btn.secondary:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.login-loading-spinner{animation:spin 1s linear infinite;border:2px solid var(--color-white);border-radius:50%;border-top:2px solid transparent;height:16px;width:16px}.login-submit-btn.secondary .login-loading-spinner{border:2px solid var(--color-text);border-top:2px solid transparent}.login-error{background:var(--color-error-light);border:1px solid var(--color-error);border-radius:var(--radius-lg);color:var(--color-error)}.login-error,.login-success{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin:var(--space-2) 0;padding:var(--space-3) var(--space-4)}.login-success{background:var(--color-success-light);border:1px solid var(--color-success);border-radius:var(--radius-lg);color:var(--color-success)}.reset-success{padding:var(--space-6) 0;text-align:center}.reset-success-icon{align-items:center;background:var(--color-success);border-radius:var(--radius-full);color:var(--color-white);display:flex;font-size:var(--font-size-2xl);height:64px;justify-content:center;margin:0 auto var(--space-4);width:64px}.reset-success-title{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0 0 var(--space-3) 0}.reset-success-message{color:var(--color-text-body);font-size:var(--font-size-lg);margin:0 0 var(--space-4) 0}.reset-success-instructions{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:1.5;margin:0 0 var(--space-6) 0}.reset-success-actions{display:flex;flex-direction:column;gap:var(--space-3)}.login-links{border-top:1px solid var(--color-border);margin-top:var(--space-6);padding-top:var(--space-4);text-align:center}.login-links p{color:var(--color-text-body);font-size:var(--font-size-sm);margin:0}.login-links a{color:var(--color-primary);font-weight:var(--font-weight-medium);text-decoration:none;transition:all var(--transition-fast)}.login-links a:hover{color:var(--color-primary-hover);text-decoration:underline}.login-links a:focus{box-shadow:var(--shadow-focus);outline:none;text-decoration:underline}@media (prefers-reduced-motion:reduce){.login-checkbox-input,.login-floating,.login-forgot-link,.login-input-group input,.login-left,.login-oauth-btn,.login-page,.login-password-toggle{animation:none!important;transition:none!important}.login-oauth-btn:hover{transform:none!important}.login-oauth-btn:before,.login-page:before{display:none}.login-floating{animation:none!important}}@media (prefers-contrast:high){.login-checkbox-input,.login-input-group input,.login-left,.login-oauth-btn{border-color:var(--color-text);border-width:2px}.login-oauth-btn:hover{border-color:var(--color-primary)}.login-checkbox-input:focus-visible,.login-input-group input:focus-visible,.login-oauth-btn:focus-visible,.login-password-toggle:focus-visible{outline-color:var(--color-text);outline-width:3px}}@media (max-width:768px){.login-page{padding:var(--space-2)}.login-left{margin:var(--space-4);max-width:100%;padding:var(--space-6)}.login-oauth-btn,.login-signin-btn{font-size:var(--font-size-base);min-height:48px;padding:var(--space-4) var(--space-5)}.login-input-group input{font-size:16px;min-height:48px}.login-checkbox-input{height:24px;min-height:24px;min-width:24px;width:24px}.login-password-toggle{min-height:48px;min-width:48px}.login-brand-title{font-size:var(--font-size-xl)}.login-logo{height:56px;width:56px}.login-logo img,.login-logo-gradient .header-logo,.login-logo-gradient img{height:32px;width:32px}.login-title{font-size:var(--font-size-2xl)}.login-subtitle{font-size:var(--font-size-base)}.login-oauth-buttons{gap:var(--space-2)}.login-oauth-btn{font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3)}.login-form{gap:var(--space-3)}.login-input-group input{font-size:var(--font-size-sm);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-8)}.login-input-icon{font-size:var(--font-size-base);left:var(--space-2)}.login-password-toggle{right:var(--space-2)}.login-signin-btn,.login-submit-btn{font-size:var(--font-size-sm);min-height:48px;padding:var(--space-3) var(--space-4)}.reset-success-actions{gap:var(--space-2)}}@media (max-width:480px){.login-page{padding:var(--space-1)}.login-left{padding:var(--space-4)}.login-logo{height:48px;margin-bottom:var(--space-4);width:48px}.login-logo img,.login-logo-gradient .header-logo,.login-logo-gradient img{height:28px;width:28px}.login-title{font-size:var(--font-size-xl)}.login-subtitle{font-size:var(--font-size-sm);margin-bottom:var(--space-6)}.login-oauth-btn{font-size:var(--font-size-xs);padding:var(--space-2)}.oauth-icon{font-size:var(--font-size-base)}.login-or{font-size:var(--font-size-xs);margin:var(--space-4) 0}.login-input-group input{padding:var(--space-2) var(--space-2) var(--space-2) var(--space-7)}.login-input-icon{font-size:var(--font-size-sm);left:var(--space-2)}.login-checkbox-label{font-size:var(--font-size-xs)}.login-checkbox-input{height:16px;width:16px}.login-submit-btn{font-size:var(--font-size-xs);padding:var(--space-2) var(--space-3)}.reset-success-icon{height:48px;width:48px}.reset-success-icon,.reset-success-title{font-size:var(--font-size-xl)}.reset-success-message{font-size:var(--font-size-base)}}@media (prefers-reduced-motion:reduce){.login-checkbox-input,.login-floating,.login-forgot-link,.login-input-group input,.login-left,.login-oauth-btn,.login-page,.login-password-toggle,.login-signin-btn,.login-submit-btn{animation:none!important;transition:none!important}.login-logo:before,.login-oauth-btn:before,.login-signin-btn:before{display:none}.login-oauth-btn:hover,.login-signin-btn:hover,.login-submit-btn:hover{transform:none!important}.password-strength-fill{transition:none}.login-loading-spinner{animation:none}}@media (prefers-contrast:high){.login-left{border-width:2px}.login-checkbox-input,.login-input-group input,.login-oauth-btn,.login-submit-btn{border-width:3px}}.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;white-space:nowrap}@media print{.login-page{background:#fff}.login-floating{display:none}.login-left{border:1px solid var(--color-black);box-shadow:none}.login-oauth-buttons,.login-or{display:none}}.user-dashboard{background:var(--color-surface);margin:0 auto;max-width:1400px;min-height:100vh;padding:var(--space-6)}.dashboard-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.dashboard-welcome h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.dashboard-welcome p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.dashboard-actions{display:flex;gap:var(--space-4)}.dashboard-btn{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);display:inline-flex;font-weight:var(--font-weight-semibold);gap:var(--space-2);padding:var(--space-3) var(--space-5);text-decoration:none;transition:all var(--transition-normal)}.dashboard-btn.primary{background:var(--color-primary);box-shadow:var(--shadow-md);color:var(--color-white)}.dashboard-btn.primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.dashboard-btn.secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.dashboard-btn.secondary:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.dashboard-stats{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:var(--space-8)}.stat-icon.courses{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%)}.stat-icon.completed{background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-hover) 100%)}.stat-icon.progress{background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-hover) 100%)}.stat-icon.hours{background:linear-gradient(135deg,var(--color-info) 0,var(--color-info-hover) 100%)}.stat-icon.certificates{background:linear-gradient(135deg,var(--color-accent) 0,var(--color-accent-hover) 100%)}.stat-icon.streak{background:linear-gradient(135deg,var(--color-error) 0,var(--color-error-hover) 100%)}.dashboard-content{display:grid;gap:var(--space-8);grid-template-columns:2fr 1fr}.dashboard-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-6)}.activity-icon-wrapper{align-items:center;background:var(--color-primary-light);border-radius:var(--radius-lg);display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.activity-icon{color:var(--color-primary);height:20px;width:20px}.activity-status{align-items:center;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-1)}.activity-status.completed{background:var(--color-success-light);color:var(--color-success-dark)}.activity-status.in-progress{background:var(--color-warning-light);color:var(--color-warning-dark)}.activity-status.new{background:var(--color-info-light);color:var(--color-info-dark)}.deadlines-list{display:flex;flex-direction:column;gap:var(--space-4)}.deadline-item{align-items:center;background:var(--color-surface-alt);border-radius:var(--radius-lg);display:flex;justify-content:space-between;padding:var(--space-4);transition:all var(--transition-normal)}.deadline-item:hover{background:var(--color-surface-hover);transform:translate(4px)}.deadline-content h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.deadline-course{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0 0 var(--space-2) 0}.deadline-date{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);gap:var(--space-1)}.date-icon{height:14px;width:14px}.deadline-priority{border-radius:var(--radius-md);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);text-transform:uppercase}.priority-high{background:var(--color-error-light);color:var(--color-error-dark)}.priority-medium{background:var(--color-warning-light);color:var(--color-warning-dark)}.priority-low{background:var(--color-success-light);color:var(--color-success-dark)}.quick-actions{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.action-icon{height:24px;width:24px}.empty-state{color:var(--color-text-muted)}.dashboard-loading{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px}.dashboard-loading p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1024px){.dashboard-content{gap:var(--space-6);grid-template-columns:1fr}.dashboard-stats{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}@media (max-width:768px){.user-dashboard{padding:var(--space-4)}.dashboard-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.dashboard-actions{justify-content:stretch;width:100%}.dashboard-btn{flex:1;justify-content:center}.dashboard-stats{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat-card{padding:var(--space-4)}.quick-actions{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.quick-action{padding:var(--space-4)}}@media (max-width:480px){.dashboard-stats{grid-template-columns:1fr}.quick-actions{grid-template-columns:repeat(2,1fr)}.activity-item,.deadline-item{align-items:flex-start;flex-direction:column;gap:var(--space-3)}.activity-status,.deadline-priority{align-self:flex-end}}.bookmarks-page{background:var(--color-surface);margin:0 auto;max-width:1400px;min-height:100vh;padding:var(--space-6)}.bookmarks-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.bookmarks-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.bookmarks-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.bookmarks-stats{display:flex;gap:var(--space-6)}.stat-item{color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2)}.stat-icon{height:16px;width:16px}.bookmarks-filters{align-items:center;display:flex;gap:var(--space-4);margin-bottom:var(--space-8)}.bookmarks-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}.bookmark-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--transition-normal)}.bookmark-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.bookmark-header{align-items:center;background:var(--color-surface-alt);border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;padding:var(--space-4)}.bookmark-type{align-items:center;border-radius:var(--radius-md);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);gap:var(--space-2);letter-spacing:.5px;padding:var(--space-1) var(--space-3);text-transform:uppercase}.bookmark-type-icon{height:14px;width:14px}.type-course{background:var(--color-primary-light);color:var(--color-primary-dark)}.type-tutorial{background:var(--color-success-light);color:var(--color-success-dark)}.type-article{background:var(--color-warning-light);color:var(--color-warning-dark)}.type-video{background:var(--color-info-light);color:var(--color-info-dark)}.type-default{background:var(--color-gray-100);color:var(--color-gray-700)}.remove-bookmark{align-items:center;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;display:flex;height:32px;justify-content:center;transition:all var(--transition-fast);width:32px}.remove-bookmark:hover{background:var(--color-error-light);color:var(--color-error)}.bookmark-thumbnail{height:200px;overflow:hidden;position:relative;width:100%}.bookmark-thumbnail img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.duration-badge{align-items:center;background:#000c;border-radius:var(--radius-md);bottom:var(--space-2);color:var(--color-white);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);gap:var(--space-1);padding:var(--space-1) var(--space-2);position:absolute;right:var(--space-2)}.duration-icon{height:12px;width:12px}.bookmark-content{padding:var(--space-6)}.bookmark-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);line-height:1.4;margin:0 0 var(--space-3) 0}.bookmark-title a{color:var(--color-text-heading);text-decoration:none;transition:color var(--transition-fast)}.bookmark-title a:hover{color:var(--color-primary)}.bookmark-description{color:var(--color-text-muted);display:-webkit-box;font-size:var(--font-size-sm);-webkit-line-clamp:3;line-height:1.5;margin:0 0 var(--space-4) 0;-webkit-box-orient:vertical;overflow:hidden}.bookmark-meta{flex-direction:column;margin-bottom:var(--space-4)}.bookmark-meta,.meta-item{display:flex;gap:var(--space-2)}.meta-item{align-items:center;color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.meta-icon{color:var(--color-primary);height:14px;width:14px}.progress-section{margin-bottom:var(--space-4)}.progress-label,.progress-percentage{font-size:var(--font-size-xs)}.bookmark-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-4)}.bookmark-actions{display:flex;gap:var(--space-3)}.bookmark-action{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);text-decoration:none;transition:all var(--transition-normal)}.bookmark-action.primary{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.bookmark-action.primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.bookmarks-loading{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px}.bookmarks-loading p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1024px){.bookmarks-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (max-width:768px){.bookmarks-page{padding:var(--space-4)}.bookmarks-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.bookmarks-stats{flex-direction:column;gap:var(--space-3);width:100%}.bookmarks-filters{align-items:stretch;flex-direction:column;gap:var(--space-4)}.search-box{max-width:none}.filter-group{flex-direction:column;gap:var(--space-3)}.bookmarks-grid{gap:var(--space-4);grid-template-columns:1fr}}@media (max-width:480px){.bookmark-content{padding:var(--space-4)}.bookmark-meta{gap:var(--space-1)}.bookmark-actions,.bookmark-meta{flex-direction:column}.bookmark-action{justify-content:center}}.notes-page{background:var(--color-surface);margin:0 auto;max-width:1400px;min-height:100vh;padding:var(--space-6)}.notes-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.notes-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.notes-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.create-note-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);color:var(--color-white);cursor:pointer;display:flex;font-weight:var(--font-weight-semibold);gap:var(--space-2);padding:var(--space-3) var(--space-5);transition:all var(--transition-normal)}.create-note-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.notes-filters{align-items:center;display:flex;gap:var(--space-4);margin-bottom:var(--space-8)}.search-box{max-width:400px}.search-input{font-size:var(--font-size-base);transition:all var(--transition-normal)}.filter-checkbox{align-items:center;color:var(--color-text);cursor:pointer;display:flex;font-size:var(--font-size-sm);gap:var(--space-2)}.filter-checkbox input[type=checkbox]{accent-color:var(--color-primary);height:16px;width:16px}.note-modal-overlay{align-items:center;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:var(--space-4);position:fixed;right:0;top:0;z-index:var(--z-modal)}.note-modal{background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);max-height:90vh;max-width:600px;overflow-y:auto;width:100%}.modal-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;padding:var(--space-6)}.modal-header h3{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0}.modal-close{align-items:center;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;display:flex;height:32px;justify-content:center;transition:all var(--transition-fast);width:32px}.modal-close:hover{background:var(--color-surface-hover);color:var(--color-text)}.modal-content{padding:var(--space-6)}.form-group{margin-bottom:var(--space-6)}.form-group label{display:block;margin-bottom:var(--space-2)}.form-input,.form-select,.form-textarea{font-size:var(--font-size-base);transition:all var(--transition-normal);width:100%}.form-textarea{min-height:120px}.tags-input{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-3);transition:all var(--transition-normal)}.tags-input:focus-within{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.tags-list{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-3)}.tag{background:var(--color-primary-light);gap:var(--space-1)}.tag,.tag-remove{align-items:center;color:var(--color-primary-dark);display:flex}.tag-remove{background:transparent;border:none;border-radius:var(--radius-sm);cursor:pointer;height:16px;justify-content:center;transition:all var(--transition-fast);width:16px}.tag-remove:hover{background:var(--color-primary);color:var(--color-white)}.tag-input-group{display:flex;gap:var(--space-2)}.tag-input{background:transparent;border:none;color:var(--color-text);flex:1;font-size:var(--font-size-sm);outline:none}.tag-input::-moz-placeholder{color:var(--color-text-muted)}.tag-input::placeholder{color:var(--color-text-muted)}.tag-add-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-md);color:var(--color-white);cursor:pointer;display:flex;height:32px;justify-content:center;transition:all var(--transition-fast);width:32px}.tag-add-btn:hover{background:var(--color-primary-hover)}.color-picker{display:flex;gap:var(--space-2)}.color-option{border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;height:32px;transition:all var(--transition-fast);width:32px}.color-option:hover{transform:scale(1.1)}.color-option.selected{border-color:var(--color-text);box-shadow:0 0 0 2px var(--color-primary)}.modal-actions{border-top:1px solid var(--color-border);display:flex;gap:var(--space-3);justify-content:flex-end;padding:var(--space-6)}.btn-primary,.btn-secondary{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-5);transition:all var(--transition-normal)}.btn-primary{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn-primary:disabled{cursor:not-allowed;opacity:.5}.btn-secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.btn-secondary:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.notes-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}.note-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden;position:relative;transition:all var(--transition-normal)}.note-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.note-card.pinned{border-color:var(--color-warning);box-shadow:var(--shadow-md)}.note-card.pinned:before{background:var(--color-warning);content:"";height:4px;left:0;position:absolute;right:0;top:0}.note-header{align-items:center;background:var(--color-surface-alt);border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;padding:var(--space-4)}.note-meta{display:flex;flex-direction:column;gap:var(--space-1)}.note-category{color:var(--color-primary);font-weight:var(--font-weight-semibold);letter-spacing:.5px;text-transform:uppercase}.note-category,.note-date{font-size:var(--font-size-xs)}.note-date{color:var(--color-text-muted)}.note-actions{display:flex;gap:var(--space-1)}.action-btn.pinned{color:var(--color-warning)}.note-content{padding:var(--space-6)}.note-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);line-height:1.4;margin:0 0 var(--space-3) 0}.note-text{color:var(--color-text);display:-webkit-box;font-size:var(--font-size-sm);-webkit-line-clamp:4;line-height:1.6;margin:0 0 var(--space-4) 0;-webkit-box-orient:vertical;overflow:hidden}.related-content{align-items:center;background:var(--color-primary-light);border-radius:var(--radius-md);color:var(--color-primary-dark);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);gap:var(--space-2);margin-bottom:var(--space-4);padding:var(--space-2) var(--space-3)}.related-icon{height:14px;width:14px}.note-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-4)}.note-tags .tag{background:var(--color-gray-100);color:var(--color-gray-700);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.note-footer{background:var(--color-surface-alt);border-top:1px solid var(--color-border);padding:var(--space-4)}.note-stats{display:flex;gap:var(--space-4)}.stat{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.stat-icon{height:12px;width:12px}.empty-state{grid-column:1/-1;padding:var(--space-12)}.empty-state p{max-width:400px}.empty-action{display:flex}.notes-loading{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px}.notes-loading p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1024px){.notes-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (max-width:768px){.notes-page{padding:var(--space-4)}.notes-header{align-items:flex-start}.notes-filters,.notes-header{flex-direction:column;gap:var(--space-4)}.notes-filters{align-items:stretch}.search-box{max-width:none}.filter-group{flex-direction:column;gap:var(--space-3)}.notes-grid{gap:var(--space-4);grid-template-columns:1fr}.note-modal{margin:var(--space-4);max-height:calc(100vh - var(--space-8))}}@media (max-width:480px){.note-content{padding:var(--space-4)}.note-footer,.note-header{padding:var(--space-3)}.modal-actions,.modal-content{padding:var(--space-4)}.modal-actions{flex-direction:column}.btn-primary,.btn-secondary{justify-content:center}}.progress-page{background:var(--color-surface);margin:0 auto;max-width:1400px;min-height:100vh;padding:var(--space-6)}.progress-header{border-bottom:1px solid var(--color-border);margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.progress-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.progress-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.progress-actions{display:flex;gap:var(--space-3)}.progress-stats{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:var(--space-8)}.stat-card.primary{border-left:4px solid var(--color-primary)}.stat-card.success{border-left:4px solid var(--color-success)}.stat-card.warning{border-left:4px solid var(--color-warning)}.stat-card.info{border-left:4px solid var(--color-info)}.stat-card.accent{border-left:4px solid var(--color-accent)}.stat-card.purple{border-left:4px solid var(--color-category-purple)}.stat-icon{font-size:var(--font-size-xl);height:48px;width:48px}.stat-card.accent .stat-icon{background:linear-gradient(135deg,var(--color-accent) 0,var(--color-accent-hover) 100%)}.stat-card.purple .stat-icon{background:linear-gradient(135deg,var(--color-category-purple) 0,var(--color-category-purple-light) 100%)}.progress-content{display:flex;flex-direction:column;gap:var(--space-8)}.period-selector{background:var(--color-surface-alt);border-radius:var(--radius-lg);display:flex;gap:var(--space-1);padding:var(--space-1)}.progress-chart{min-height:300px}.chart-container{display:flex;flex-direction:column;gap:var(--space-6)}.chart-bars{align-items:end;background:var(--color-surface-alt);border-radius:var(--radius-lg);height:200px;padding:var(--space-4)}.chart-bar,.chart-bars{display:flex;gap:var(--space-2)}.chart-bar{align-items:center;flex:1;flex-direction:column;min-height:100%}.bar-fill{background:linear-gradient(180deg,var(--color-primary) 0,var(--color-primary-hover) 100%);border-radius:var(--radius-sm) var(--radius-sm) 0 0;min-height:4px;transition:all var(--transition-normal);width:100%}.bar-label{color:var(--color-text-muted);font-weight:var(--font-weight-medium);text-align:center}.bar-label,.bar-value{font-size:var(--font-size-xs)}.bar-value{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.chart-summary{background:var(--color-surface-alt);border-radius:var(--radius-lg);display:flex;justify-content:space-around;padding:var(--space-4)}.summary-item{align-items:center;display:flex;flex-direction:column;gap:var(--space-1)}.summary-label{color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);letter-spacing:.5px;text-transform:uppercase}.summary-value{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.empty-chart{align-items:center;color:var(--color-text-muted);display:flex;flex-direction:column;gap:var(--space-3);height:200px;justify-content:center}.empty-icon{height:48px;width:48px}.filter-group{gap:var(--space-3)}.filter-select{border-radius:var(--radius-lg);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.course-progress-list{display:flex;flex-direction:column;gap:var(--space-4)}.course-progress-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-6);transition:all var(--transition-normal)}.course-progress-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.course-header{margin-bottom:var(--space-4)}.course-info{gap:var(--space-4)}.course-thumbnail{height:60px;width:80px}.course-details{display:flex;flex-direction:column;gap:var(--space-1)}.course-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.course-instructor{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0}.course-category{color:var(--color-primary);font-weight:var(--font-weight-medium)}.course-category,.course-status{font-size:var(--font-size-xs);letter-spacing:.5px;text-transform:uppercase}.course-status{align-items:center;border-radius:var(--radius-md);display:flex;font-weight:var(--font-weight-semibold);gap:var(--space-2);padding:var(--space-2) var(--space-3)}.status-completed{background:var(--color-success-light);color:var(--color-success-dark)}.status-progress{background:var(--color-warning-light);color:var(--color-warning-dark)}.status-not-started{background:var(--color-gray-100);color:var(--color-gray-700)}.course-progress{margin-bottom:var(--space-4)}.progress-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:var(--space-2)}.progress-label{color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;text-transform:uppercase}.progress-percentage{color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold)}.progress-bar{background:var(--color-gray-200);height:8px;margin-bottom:var(--space-2)}.progress-bar,.progress-fill{border-radius:var(--radius-full)}.progress-fill{background:linear-gradient(90deg,var(--color-primary) 0,var(--color-primary-hover) 100%)}.progress-details{color:var(--color-text-muted);font-size:var(--font-size-xs);justify-content:space-between}.course-action,.progress-details{display:flex;font-weight:var(--font-weight-medium)}.course-action{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-sm);gap:var(--space-2);padding:var(--space-3) var(--space-4);text-decoration:none;transition:all var(--transition-normal)}.course-action.primary{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.course-action.primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.course-action.secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.course-action.secondary:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.action-icon{height:16px;width:16px}.achievements-grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.achievement-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden;padding:var(--space-4);position:relative;transition:all var(--transition-normal)}.achievement-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.achievement-card:before{background:var(--color-primary);content:"";height:4px;left:0;position:absolute;right:0;top:0}.achievement-card.rarity-rare:before{background:var(--color-success)}.achievement-card.rarity-epic:before{background:var(--color-warning)}.achievement-card.rarity-legendary:before{background:var(--color-accent)}.achievement-icon{align-items:center;background:var(--color-primary-light);border-radius:var(--radius-lg);color:var(--color-primary);display:flex;font-size:var(--font-size-xl);height:48px;justify-content:center;width:48px}.achievement-content,.achievement-icon{margin-bottom:var(--space-3)}.achievement-title{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.achievement-description{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:1.5;margin:0 0 var(--space-2) 0}.achievement-meta{align-items:center;display:flex;font-size:var(--font-size-xs);justify-content:space-between}.achievement-category{color:var(--color-primary);font-weight:var(--font-weight-medium);letter-spacing:.5px;text-transform:uppercase}.achievement-date{color:var(--color-text-muted);font-weight:var(--font-weight-medium)}.achievement-rarity{border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);position:absolute;right:var(--space-3);text-transform:uppercase;top:var(--space-3)}.rarity-common{background:var(--color-gray-100);color:var(--color-gray-700)}.rarity-rare{background:var(--color-success-light);color:var(--color-success-dark)}.rarity-epic{background:var(--color-warning-light);color:var(--color-warning-dark)}.rarity-legendary{background:var(--color-accent-light);color:var(--color-accent-dark)}.empty-state{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-8);text-align:center}.empty-icon{color:var(--color-text-muted);height:64px;opacity:.5;width:64px}.empty-state h3{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0}.empty-state p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}.empty-action{align-items:center;background:var(--color-primary);border-radius:var(--radius-lg);color:var(--color-white);display:inline-flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-5);text-decoration:none;transition:all var(--transition-normal)}.empty-action:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.progress-loading{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px}.progress-loading p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1024px){.progress-stats{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.achievements-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}@media (max-width:768px){.progress-page{padding:var(--space-4)}.progress-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.progress-actions{justify-content:stretch;width:100%}.export-btn,.refresh-btn{flex:1;justify-content:center}.progress-stats{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat-card{padding:var(--space-4)}.chart-bars{gap:var(--space-1)}.course-header{align-items:flex-start;flex-direction:column;gap:var(--space-3)}.course-info{width:100%}.course-actions{flex-direction:column}.achievements-grid{grid-template-columns:1fr}}@media (max-width:480px){.progress-stats{grid-template-columns:1fr}.chart-summary{flex-direction:column;gap:var(--space-3)}.course-info{align-items:flex-start;flex-direction:column}.course-thumbnail{height:120px;width:100%}}.admin-dashboard{background:var(--color-surface);margin:0 auto;max-width:1600px;min-height:100vh;padding:var(--space-6)}.admin-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.admin-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.admin-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.admin-actions{display:flex;gap:var(--space-3)}.export-btn,.refresh-btn{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.export-btn{background:var(--color-primary)}.export-btn:hover{background:var(--color-primary-hover)}.admin-period-selector{margin-bottom:var(--space-8)}.period-buttons{background:var(--color-surface-alt);border-radius:var(--radius-lg);display:flex;gap:var(--space-2);padding:var(--space-1)}.period-btn{background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--space-2) var(--space-4);transition:all var(--transition-fast)}.period-btn.active{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.period-btn:hover:not(.active){background:var(--color-surface-hover);color:var(--color-text)}.admin-stats{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:var(--space-8)}.stat-card{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);display:flex;gap:var(--space-4);overflow:hidden;padding:var(--space-6);position:relative;transition:all var(--transition-normal)}.stat-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.stat-card:before{background:var(--color-primary);content:"";height:4px;left:0;position:absolute;right:0;top:0}.stat-card.success:before{background:var(--color-success)}.stat-card.warning:before{background:var(--color-warning)}.stat-card.info:before{background:var(--color-info)}.stat-icon{align-items:center;border-radius:var(--radius-lg);color:var(--color-white);display:flex;font-size:var(--font-size-2xl);height:56px;justify-content:center;width:56px}.stat-card.primary .stat-icon{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%)}.stat-card.success .stat-icon{background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-hover) 100%)}.stat-card.warning .stat-icon{background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-hover) 100%)}.stat-card.info .stat-icon{background:linear-gradient(135deg,var(--color-info) 0,var(--color-info-hover) 100%)}.stat-content{flex:1}.stat-content h3{font-size:var(--font-size-3xl)}.stat-content p{margin:0 0 var(--space-2) 0}.stat-change{align-items:center;display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);gap:var(--space-1)}.stat-change.positive{color:var(--color-success)}.change-icon{height:12px;width:12px}.admin-content{display:grid;gap:var(--space-8);grid-template-columns:2fr 1fr}.admin-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-6)}.section-header{align-items:center;display:flex;justify-content:space-between}.section-header h2{margin:0}.section-link{color:var(--color-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-decoration:none;transition:color var(--transition-fast)}.section-link:hover{color:var(--color-primary-hover)}.activity-list{flex-direction:column}.activity-item,.activity-list{display:flex;gap:var(--space-4)}.activity-item{align-items:center;background:var(--color-surface-alt);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.activity-item:hover{background:var(--color-surface-hover);transform:translate(4px)}.activity-icon{align-items:center;border-radius:var(--radius-lg);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-lg);height:40px;justify-content:center;width:40px}.activity-icon.status-success{background:var(--color-success)}.activity-icon.status-warning{background:var(--color-warning)}.activity-icon.status-error{background:var(--color-error)}.activity-icon.status-info{background:var(--color-info)}.activity-content{flex:1}.activity-content h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.activity-content p{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0 0 var(--space-1) 0}.activity-time{color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.activity-status{border-radius:var(--radius-md);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);text-transform:uppercase}.activity-status.status-success{background:var(--color-success-light);color:var(--color-success-dark)}.activity-status.status-warning{background:var(--color-warning-light);color:var(--color-warning-dark)}.activity-status.status-error{background:var(--color-error-light);color:var(--color-error-dark)}.activity-status.status-info{background:var(--color-info-light);color:var(--color-info-dark)}.courses-table{display:flex;flex-direction:column;gap:var(--space-2)}.table-header{border-radius:var(--radius-lg);padding:var(--space-3) var(--space-4)}.table-header,.table-row{grid-template-columns:2fr 1fr 1fr 1fr 1fr 1fr 1fr}.table-row{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.table-row:hover{border-color:var(--color-primary-light)}.course-info h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0}.star-icon{height:14px;width:14px}.status-badge.published{background:var(--color-success-light);color:var(--color-success-dark)}.status-badge.draft{background:var(--color-warning-light);color:var(--color-warning-dark)}.status-badge.archived{background:var(--color-gray-100);color:var(--color-gray-700)}.action-btn.delete:hover{background:var(--color-error-light);color:var(--color-error)}.alerts-list{display:flex;flex-direction:column;gap:var(--space-3)}.alert-item{align-items:center;border-radius:var(--radius-lg);display:flex;gap:var(--space-4);padding:var(--space-4);transition:all var(--transition-normal)}.alert-item.alert-success{background:var(--color-success-light);border-left:4px solid var(--color-success)}.alert-item.alert-warning{background:var(--color-warning-light);border-left:4px solid var(--color-warning)}.alert-item.alert-error{background:var(--color-error-light);border-left:4px solid var(--color-error)}.alert-item.alert-info{background:var(--color-info-light);border-left:4px solid var(--color-info)}.alert-icon{align-items:center;border-radius:var(--radius-md);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-lg);height:32px;justify-content:center;width:32px}.alert-item.alert-success .alert-icon{background:var(--color-success)}.alert-item.alert-warning .alert-icon{background:var(--color-warning)}.alert-item.alert-error .alert-icon{background:var(--color-error)}.alert-item.alert-info .alert-icon{background:var(--color-info)}.alert-content{flex:1}.alert-content h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.alert-content p{font-size:var(--font-size-sm);margin:0 0 var(--space-1) 0}.alert-content p,.alert-time{color:var(--color-text-muted)}.alert-time{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.alert-actions{display:flex;gap:var(--space-2)}.resolve-btn{align-items:center;background:var(--color-success);border:none;border-radius:var(--radius-md);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);gap:var(--space-1);padding:var(--space-2) var(--space-3);transition:all var(--transition-fast)}.resolve-btn:hover{background:var(--color-success-hover);transform:translateY(-1px)}.quick-actions{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.quick-action{align-items:center;background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text);display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6);text-align:center;text-decoration:none;transition:all var(--transition-normal)}.quick-action:hover{background:var(--color-primary-light);border-color:var(--color-primary);box-shadow:var(--shadow-md);color:var(--color-primary);transform:translateY(-2px)}.action-icon{color:inherit;height:32px;width:32px}.quick-action span{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.admin-error{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px;text-align:center}.admin-error h2{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);margin:0}.admin-error p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}.error-link{align-items:center;background:var(--color-primary);border-radius:var(--radius-lg);color:var(--color-white);display:inline-flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-5);text-decoration:none;transition:all var(--transition-normal)}.error-link:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.admin-loading{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px}.admin-loading p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1200px){.admin-content{gap:var(--space-6);grid-template-columns:1fr}.admin-stats{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}@media (max-width:768px){.admin-dashboard{padding:var(--space-4)}.admin-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.admin-actions{justify-content:stretch;width:100%}.export-btn,.refresh-btn{flex:1;justify-content:center}.admin-stats{gap:var(--space-4);grid-template-columns:1fr}.stat-card{padding:var(--space-4)}.table-header,.table-row{gap:var(--space-2);grid-template-columns:1fr}.table-cell{border-bottom:1px solid var(--color-border);justify-content:space-between;padding:var(--space-2) 0}.table-cell:last-child{border-bottom:none}.quick-actions{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width:480px){.period-buttons{flex-direction:column;gap:var(--space-1)}.activity-item,.alert-item{align-items:flex-start;flex-direction:column;gap:var(--space-3)}.activity-status,.alert-actions{align-self:flex-end}}.user-management{background:var(--color-surface);margin:0 auto;max-width:1600px;min-height:100vh;padding:var(--space-6)}.user-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.user-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.user-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.user-actions{display:flex;gap:var(--space-3)}.add-user-btn,.export-btn,.refresh-btn{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.add-user-btn{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.add-user-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.user-filters{background:var(--color-surface-alt);border-radius:var(--radius-lg);display:flex;flex-wrap:wrap;gap:var(--space-4);padding:var(--space-4)}.user-filters,.users-table{border:1px solid var(--color-border);margin-bottom:var(--space-6)}.users-table{background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden}.table-header,.table-row{grid-template-columns:50px 2fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr}.user-avatar{border:2px solid var(--color-border);height:40px;width:40px}.user-details h4{font-size:var(--font-size-base)}.user-details p{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0 0 var(--space-1) 0}.user-location{color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.role-badge.role-default{background:var(--color-gray-100);color:var(--color-gray-700)}.status-info{align-items:center;display:flex;gap:var(--space-2)}.status-icon{height:16px;width:16px}.status-icon.active{color:var(--color-success)}.status-icon.inactive{color:var(--color-error)}.status-icon.warning{color:var(--color-warning)}.status-text{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.status-text.active{color:var(--color-success)}.status-text.inactive{color:var(--color-error)}.course-stats{display:flex;flex-direction:column;gap:var(--space-1)}.course-stats span{color:var(--color-text);font-weight:var(--font-weight-medium)}.amount,.course-stats span{font-size:var(--font-size-sm)}.amount{color:var(--color-success);font-weight:var(--font-weight-semibold)}.date{color:var(--color-text-muted);font-size:var(--font-size-sm)}.user-stats{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}@media (max-width:1200px){.table-header,.table-row{grid-template-columns:50px 2fr 1fr 1fr 1fr 1fr 1fr 1fr}.table-cell:nth-child(8){display:none}}@media (max-width:768px){.user-management{padding:var(--space-4)}.user-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.user-actions{justify-content:stretch;width:100%}.add-user-btn,.export-btn,.refresh-btn{flex:1;justify-content:center}.user-filters{flex-direction:column;gap:var(--space-3)}.filter-group{flex-wrap:wrap;gap:var(--space-2)}.table-header,.table-row{gap:var(--space-2);grid-template-columns:1fr}.table-cell{border-bottom:1px solid var(--color-border);justify-content:space-between;padding:var(--space-2) 0}.table-cell:last-child{border-bottom:none}.table-cell.checkbox{justify-content:flex-start;order:-1}.user-stats{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width:480px){.bulk-actions{flex-direction:column;gap:var(--space-3)}.bulk-buttons{flex-wrap:wrap;gap:var(--space-2)}.bulk-btn{flex:1;justify-content:center;min-width:120px}.action-buttons{flex-wrap:wrap;gap:var(--space-1)}.action-btn{height:28px;width:28px}}.course-management{background:var(--color-surface);margin:0 auto;max-width:1600px;min-height:100vh;padding:var(--space-6)}.course-header{align-items:center;justify-content:space-between;margin-bottom:var(--space-8)}.course-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.course-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.course-actions{align-items:center;display:flex;gap:var(--space-3)}.view-controls{background:var(--color-surface-alt);border-radius:var(--radius-lg);display:flex;gap:var(--space-1);padding:var(--space-1)}.view-btn{align-items:center;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;display:flex;height:36px;justify-content:center;transition:all var(--transition-fast);width:36px}.view-btn.active{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.view-btn:hover:not(.active){background:var(--color-surface-hover);color:var(--color-text)}.add-course-btn,.export-btn,.refresh-btn{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.refresh-btn{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.refresh-btn:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.export-btn{background:var(--color-info);box-shadow:var(--shadow-sm);color:var(--color-white)}.export-btn:hover{background:var(--color-info-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.add-course-btn{background:var(--color-primary);box-shadow:var(--shadow-sm);color:var(--color-white)}.add-course-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.course-filters{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);display:flex;flex-wrap:wrap;gap:var(--space-4);margin-bottom:var(--space-6);padding:var(--space-4)}.search-box{flex:1;min-width:250px;position:relative}.search-icon{color:var(--color-text-muted);height:18px;left:var(--space-3);position:absolute;top:50%;transform:translateY(-50%);width:18px}.search-input{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text);font-size:var(--font-size-sm);padding:var(--space-3) var(--space-3) var(--space-3) var(--space-10);transition:all var(--transition-fast);width:100%}.search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.filter-group{align-items:center;display:flex;gap:var(--space-2)}.filter-select{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3);transition:all var(--transition-fast)}.filter-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.sort-btn{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;display:flex;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);height:36px;justify-content:center;transition:all var(--transition-fast);width:36px}.sort-btn:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.bulk-actions{background:var(--color-primary-light);border:1px solid var(--color-primary);border-radius:var(--radius-lg);justify-content:space-between;margin-bottom:var(--space-6);padding:var(--space-4)}.bulk-actions,.bulk-info{align-items:center;display:flex}.bulk-info{color:var(--color-primary-dark);font-weight:var(--font-weight-medium);gap:var(--space-2)}.bulk-buttons{display:flex;gap:var(--space-2)}.bulk-btn{align-items:center;border:none;border-radius:var(--radius-md);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-1);padding:var(--space-2) var(--space-3);transition:all var(--transition-fast)}.bulk-btn.success{background:var(--color-success);color:var(--color-white)}.bulk-btn.success:hover{background:var(--color-success-hover)}.bulk-btn.warning{background:var(--color-warning);color:var(--color-white)}.bulk-btn.warning:hover{background:var(--color-warning-hover)}.bulk-btn.info{background:var(--color-info);color:var(--color-white)}.bulk-btn.info:hover{background:var(--color-info-hover)}.bulk-btn.danger{background:var(--color-error);color:var(--color-white)}.bulk-btn.danger:hover{background:var(--color-error-hover)}.bulk-btn.cancel{background:var(--color-gray-100);color:var(--color-gray-700)}.bulk-btn.cancel:hover{background:var(--color-gray-200)}.courses-table{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);margin-bottom:var(--space-6);overflow:hidden}.table-header{background:var(--color-surface-alt);color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;text-transform:uppercase}.table-header,.table-row{border-bottom:1px solid var(--color-border);display:grid;gap:var(--space-4);grid-template-columns:50px 3fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;padding:var(--space-4)}.table-row{transition:all var(--transition-normal)}.table-row:hover{background:var(--color-surface-hover)}.table-row:last-child{border-bottom:none}.table-cell{align-items:center;color:var(--color-text);display:flex;font-size:var(--font-size-sm)}.table-cell.checkbox{justify-content:center}.table-cell input[type=checkbox]{cursor:pointer;height:18px;width:18px}.course-info{align-items:center;display:flex;gap:var(--space-3)}.course-thumbnail{border-radius:var(--radius-md);height:40px;width:60px}.course-details h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.course-details p{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:1.4;margin:0 0 var(--space-2) 0}.course-meta{gap:var(--space-2);margin-bottom:var(--space-2)}.level-badge.level-beginner{background:var(--color-success-light);color:var(--color-success-dark)}.level-badge.level-intermediate{background:var(--color-warning-light);color:var(--color-warning-dark)}.level-badge.level-advanced{background:var(--color-error-light);color:var(--color-error-dark)}.duration,.lessons{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);gap:var(--space-1)}.meta-icon{height:12px;width:12px}.course-tags{gap:var(--space-1)}.instructor-info{align-items:center;display:flex;gap:var(--space-2)}.instructor-avatar{border:1px solid var(--color-border);border-radius:var(--radius-lg);height:32px;-o-object-fit:cover;object-fit:cover;width:32px}.category-badge{border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);text-transform:uppercase}.status-badge.status-published{background:var(--color-success-light);color:var(--color-success-dark)}.status-badge.status-draft{background:var(--color-warning-light);color:var(--color-warning-dark)}.status-badge.status-archived{background:var(--color-gray-100);color:var(--color-gray-700)}.stats{align-items:center;display:flex;gap:var(--space-2)}.trend-icon{height:14px;width:14px}.revenue,.trend-icon{color:var(--color-success)}.revenue{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.rating{align-items:center;display:flex;gap:var(--space-1)}.star-icon{color:var(--color-warning);height:12px;width:12px}.reviews{font-size:var(--font-size-xs)}.no-rating,.reviews{color:var(--color-text-muted)}.no-rating{font-size:var(--font-size-sm);font-style:italic}.action-buttons{display:flex;gap:var(--space-1)}.action-btn{align-items:center;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;display:flex;height:32px;justify-content:center;transition:all var(--transition-fast);width:32px}.action-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.action-btn.view:hover{background:var(--color-info-light);color:var(--color-info)}.action-btn.edit:hover{background:var(--color-warning-light);color:var(--color-warning)}.action-btn.success:hover{background:var(--color-success-light);color:var(--color-success)}.action-btn.warning:hover{background:var(--color-warning-light);color:var(--color-warning)}.action-btn.info:hover{background:var(--color-info-light);color:var(--color-info)}.action-btn.danger:hover{background:var(--color-error-light);color:var(--color-error)}.courses-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(350px,1fr));margin-bottom:var(--space-6)}.course-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--transition-normal)}.course-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.course-card-header{height:200px;overflow:hidden;position:relative}.course-checkbox{cursor:pointer;height:18px;left:var(--space-3);position:absolute;top:var(--space-3);width:18px;z-index:2}.course-card-thumbnail{height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--transition-normal);width:100%}.course-card:hover .course-card-thumbnail{transform:scale(1.05)}.course-card-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;gap:var(--space-2);justify-content:center;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity var(--transition-normal)}.course-card:hover .course-card-overlay{opacity:1}.overlay-btn{align-items:center;background:var(--color-white);border:none;border-radius:var(--radius-lg);color:var(--color-text);cursor:pointer;display:flex;height:40px;justify-content:center;transition:all var(--transition-fast);width:40px}.overlay-btn:hover{background:var(--color-primary);color:var(--color-white);transform:scale(1.1)}.featured-badge{align-items:center;background:var(--color-warning);border-radius:var(--radius-md);color:var(--color-white);display:flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);gap:var(--space-1);padding:var(--space-1) var(--space-2);position:absolute;right:var(--space-3);top:var(--space-3);z-index:2}.course-card-content{padding:var(--space-4)}.course-card-title{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:var(--space-2)}.course-card-title h4{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);line-height:1.3;margin:0}.course-card-description{color:var(--color-text-muted);display:-webkit-box;font-size:var(--font-size-sm);-webkit-line-clamp:2;line-height:1.4;margin:0 0 var(--space-3) 0;-webkit-box-orient:vertical;overflow:hidden}.course-card-meta{align-items:center}.course-card-meta,.course-card-stats{display:flex;justify-content:space-between;margin-bottom:var(--space-3)}.stat{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-1)}.stat-icon{height:14px;width:14px}.course-card-actions{justify-content:space-between}.course-card-actions,.price{align-items:center;display:flex}.price{gap:var(--space-1)}.original-price{color:var(--color-text-muted);font-size:var(--font-size-sm);text-decoration:line-through}.current-price{color:var(--color-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.pagination{align-items:center;display:flex;gap:var(--space-4);justify-content:center;margin-bottom:var(--space-6)}.pagination-btn{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--space-2) var(--space-4);transition:all var(--transition-fast)}.pagination-btn:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.pagination-btn:disabled{cursor:not-allowed;opacity:.5}.pagination-info{color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.course-stats{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.stat-item{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;gap:var(--space-3);padding:var(--space-4)}.stat-icon{color:var(--color-primary);flex-shrink:0;height:40px;width:40px}.stat-content h3{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);line-height:1;margin:0 0 var(--space-1) 0}.stat-content p{color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin:0}.loading-state{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px}.loading-spinner{animation:spin 1s linear infinite;border-top:3px solid var(--color-border);border:3px solid var(--color-border);border-radius:50%;border-top-color:var(--color-primary);height:40px;width:40px}.loading-state p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1200px){.table-header,.table-row{grid-template-columns:50px 3fr 1fr 1fr 1fr 1fr 1fr 1fr}.table-cell:nth-child(8){display:none}.courses-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (max-width:768px){.course-management{padding:var(--space-4)}.course-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.course-actions{justify-content:stretch;width:100%}.add-course-btn,.export-btn,.refresh-btn{flex:1;justify-content:center}.course-filters{flex-direction:column;gap:var(--space-3)}.filter-group{flex-wrap:wrap;gap:var(--space-2)}.table-header,.table-row{gap:var(--space-2);grid-template-columns:1fr}.table-cell{border-bottom:1px solid var(--color-border);justify-content:space-between;padding:var(--space-2) 0}.table-cell:last-child{border-bottom:none}.table-cell.checkbox{justify-content:flex-start;order:-1}.courses-grid{gap:var(--space-4);grid-template-columns:1fr}.course-stats{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width:480px){.bulk-actions{flex-direction:column;gap:var(--space-3)}.bulk-buttons{flex-wrap:wrap;gap:var(--space-2)}.bulk-btn{flex:1;justify-content:center;min-width:120px}.action-buttons{flex-wrap:wrap;gap:var(--space-1)}.action-btn{height:28px;width:28px}.course-card-actions{align-items:stretch;flex-direction:column;gap:var(--space-2)}}.ai-course-generator{background:var(--color-surface);margin:0 auto;max-width:1600px;min-height:100vh;padding:var(--space-6)}.generator-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.generator-title{gap:var(--space-4)}.generator-title,.title-icon{align-items:center;display:flex}.title-icon{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);color:var(--color-white);font-size:var(--font-size-2xl);height:64px;justify-content:center;width:64px}.generator-title h1{color:var(--color-text-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.generator-title p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.generator-actions{display:flex;gap:var(--space-3)}.reset-btn{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text);cursor:pointer;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.reset-btn:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.reset-btn:disabled{cursor:not-allowed;opacity:.5}.btn-icon{height:18px;width:18px}.generator-content{display:flex;flex-direction:column;gap:var(--space-8)}.config-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-6)}.section-header{border-bottom:1px solid var(--color-border);margin-bottom:var(--space-6);padding-bottom:var(--space-4)}.section-header h2{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.section-header p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}.config-form{display:flex;flex-direction:column;gap:var(--space-6)}.form-row{display:grid;gap:var(--space-4);grid-template-columns:1fr 1fr}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-group label{color:var(--color-text-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.form-input,.form-select,.form-textarea{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text);font-size:var(--font-size-sm);padding:var(--space-3);transition:all var(--transition-fast)}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.form-input:disabled,.form-select:disabled,.form-textarea:disabled{background:var(--color-surface-alt);cursor:not-allowed;opacity:.6}.form-textarea{min-height:80px;resize:vertical}.pricing-options{display:flex;flex-direction:column;gap:var(--space-3)}.checkbox-label{align-items:center;color:var(--color-text);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2)}.checkbox-label input[type=checkbox]{cursor:pointer;height:18px;width:18px}.price-inputs{display:flex;gap:var(--space-2)}.price-inputs .form-input{flex:1}.feature-options{display:flex;flex-wrap:wrap;gap:var(--space-6)}.progress-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-6)}.progress-steps{flex-direction:column}.progress-step,.progress-steps{display:flex;gap:var(--space-4)}.progress-step{align-items:center;background:var(--color-surface-alt);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.progress-step.completed{background:var(--color-success-light);border-left:4px solid var(--color-success)}.progress-step.processing{background:var(--color-primary-light);border-left:4px solid var(--color-primary)}.progress-step.error{background:var(--color-error-light);border-left:4px solid var(--color-error)}.step-icon{align-items:center;border-radius:var(--radius-lg);color:var(--color-white);display:flex;flex-shrink:0;font-size:var(--font-size-lg);height:40px;justify-content:center;width:40px}.progress-step.completed .step-icon{background:var(--color-success)}.progress-step.processing .step-icon{background:var(--color-primary)}.progress-step.error .step-icon{background:var(--color-error)}.progress-step.pending .step-icon{background:var(--color-gray-400)}.step-content{flex:1}.step-content h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.step-content p{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0 0 var(--space-2) 0}.progress-bar{background:var(--color-border);height:6px;overflow:hidden;width:100%}.progress-bar,.progress-fill{border-radius:var(--radius-sm)}.progress-fill{background:var(--color-primary);height:100%;transition:width var(--transition-normal)}.spinning{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.preview-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);padding:var(--space-6)}.preview-actions{display:flex;gap:var(--space-3)}.regenerate-btn,.save-btn{align-items:center;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.save-btn{background:var(--color-success);box-shadow:var(--shadow-sm);color:var(--color-white)}.save-btn:hover{background:var(--color-success-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.regenerate-btn{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.regenerate-btn:hover{background:var(--color-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.course-preview{margin-top:var(--space-6)}.course-header{border-bottom:1px solid var(--color-border);display:flex;gap:var(--space-6);margin-bottom:var(--space-6);padding-bottom:var(--space-6)}.course-thumbnail{border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-shrink:0;height:150px;-o-object-fit:cover;object-fit:cover;width:200px}.course-info h3{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.course-info p{color:var(--color-text-muted);font-size:var(--font-size-base);line-height:1.6}.course-info p,.course-meta{margin-bottom:var(--space-4)}.course-meta{display:flex;flex-wrap:wrap;gap:var(--space-4)}.level-badge{border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);text-transform:uppercase}.level-badge.beginner{background:var(--color-success-light);color:var(--color-success-dark)}.level-badge.intermediate{background:var(--color-warning-light);color:var(--color-warning-dark)}.level-badge.advanced{background:var(--color-error-light);color:var(--color-error-dark)}.difficulty,.duration{align-items:center;color:var(--color-text-muted);display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-1)}.meta-icon{height:16px;width:16px}.course-tags{display:flex;flex-wrap:wrap;gap:var(--space-2)}.tag{background:var(--color-surface-alt);border-radius:var(--radius-sm);color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--space-1) var(--space-2)}.course-details{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-bottom:var(--space-6)}.details-section h4{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}.details-section ul{list-style:none;margin:0;padding:0}.details-section li{border-bottom:1px solid var(--color-border);color:var(--color-text);font-size:var(--font-size-sm);padding:var(--space-2) 0}.details-section li:last-child{border-bottom:none}.details-section li:before{color:var(--color-success);content:"✓";font-weight:var(--font-weight-bold);margin-right:var(--space-2)}.details-section p{color:var(--color-text);font-size:var(--font-size-sm);margin:0}.course-chapters h4{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.chapters-list{display:flex;flex-direction:column;gap:var(--space-4)}.chapter-item{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.chapter-item:hover{background:var(--color-surface-hover);border-color:var(--color-primary-light)}.chapter-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:var(--space-2)}.chapter-header h5{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.chapter-duration{font-weight:var(--font-weight-medium)}.chapter-duration,.chapter-item p{color:var(--color-text-muted);font-size:var(--font-size-sm)}.chapter-item p{margin-bottom:var(--space-4)}.lessons-list{display:flex;flex-direction:column;gap:var(--space-2)}.lesson-item{align-items:center;background:var(--color-surface);border-radius:var(--radius-md);display:flex;gap:var(--space-3);padding:var(--space-3);transition:all var(--transition-fast)}.lesson-item:hover{background:var(--color-surface-hover)}.lesson-type{align-items:center;background:var(--color-primary-light);border-radius:var(--radius-md);color:var(--color-primary);display:flex;flex-shrink:0;height:32px;justify-content:center;width:32px}.lesson-info{flex:1}.lesson-info h6{color:var(--color-text-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.lesson-info p{margin:0 0 var(--space-1) 0}.lesson-duration,.lesson-info p{color:var(--color-text-muted);font-size:var(--font-size-xs)}.lesson-duration{font-weight:var(--font-weight-medium)}.generate-section{display:flex;justify-content:center;padding:var(--space-8)}.generate-btn{align-items:center;background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%);border:none;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);gap:var(--space-3);overflow:hidden;padding:var(--space-4) var(--space-8);position:relative;transition:all var(--transition-normal)}.generate-btn:hover:not(:disabled){box-shadow:var(--shadow-xl);transform:translateY(-4px)}.generate-btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.generate-btn:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.generate-btn:hover:before{left:100%}.generate-btn .btn-icon{height:24px;width:24px}.access-denied{align-items:center;display:flex;flex-direction:column;gap:var(--space-4);justify-content:center;min-height:400px;text-align:center}.error-icon{color:var(--color-error);height:64px;opacity:.5;width:64px}.access-denied h2{color:var(--color-text-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);margin:0}.access-denied p{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0}@media (max-width:1200px){.course-details{gap:var(--space-4);grid-template-columns:1fr}.course-header{flex-direction:column;gap:var(--space-4)}.course-thumbnail{height:200px;width:100%}}@media (max-width:768px){.ai-course-generator{padding:var(--space-4)}.generator-header{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.generator-actions{justify-content:stretch;width:100%}.reset-btn{flex:1;justify-content:center}.form-row{gap:var(--space-3);grid-template-columns:1fr}.feature-options{flex-direction:column;gap:var(--space-3)}.preview-actions{flex-direction:column;gap:var(--space-2)}.regenerate-btn,.save-btn{justify-content:center}.chapter-header,.course-meta{flex-direction:column;gap:var(--space-2)}.chapter-header{align-items:flex-start}.generate-btn{justify-content:center;width:100%}}@media (max-width:480px){.title-icon{font-size:var(--font-size-xl);height:48px;width:48px}.generator-title h1{font-size:var(--font-size-2xl)}.lesson-item,.price-inputs{flex-direction:column}.lesson-item{align-items:flex-start;gap:var(--space-2)}.lesson-type{align-self:flex-start}}.test-login{background:var(--color-surface);margin:0 auto;max-width:1200px;min-height:100vh;padding:var(--space-6)}.test-login-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;gap:var(--space-4);margin-bottom:var(--space-8);padding-bottom:var(--space-6)}.header-icon{align-items:center;background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-hover) 100%);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);color:var(--color-white);display:flex;font-size:var(--font-size-2xl);height:64px;justify-content:center;width:64px}.header-content h2{color:var(--color-text-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:-.025em;margin-bottom:var(--space-2)}.header-content p{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.current-user{background:var(--color-primary-light);border:1px solid var(--color-primary);border-radius:var(--radius-lg);justify-content:space-between;margin-bottom:var(--space-6);padding:var(--space-4)}.current-user,.user-info{align-items:center;display:flex}.user-info{gap:var(--space-3)}.user-avatar{border:2px solid var(--color-white);border-radius:var(--radius-lg);height:48px;-o-object-fit:cover;object-fit:cover;width:48px}.user-details h4{color:var(--color-text-heading);font-size:var(--font-size-lg);margin:0 0 var(--space-1) 0}.role-badge,.user-details h4{font-weight:var(--font-weight-semibold)}.role-badge{align-items:center;border-radius:var(--radius-sm);display:flex;font-size:var(--font-size-xs);gap:var(--space-1);letter-spacing:.5px;padding:var(--space-1) var(--space-2);text-transform:uppercase}.role-badge.role-admin{background:var(--color-error-light);color:var(--color-error-dark)}.role-badge.role-instructor{background:var(--color-warning-light);color:var(--color-warning-dark)}.role-badge.role-student{background:var(--color-info-light);color:var(--color-info-dark)}.role-icon{height:12px;width:12px}.logout-btn{align-items:center;background:var(--color-error);border:none;border-radius:var(--radius-md);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-2) var(--space-3);transition:all var(--transition-fast)}.logout-btn:hover{background:var(--color-error-hover);transform:translateY(-1px)}.test-login-content{display:flex;flex-direction:column;gap:var(--space-8)}.custom-login-section h3,.feature-guide h3,.quick-login-section h3,.test-users-section h3{color:var(--color-text-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.quick-login-buttons{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.quick-login-btn{align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;display:flex;gap:var(--space-3);padding:var(--space-4);text-align:left;transition:all var(--transition-normal)}.quick-login-btn:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.quick-login-btn.admin{border-left:4px solid var(--color-error)}.quick-login-btn.admin:hover{background:var(--color-error-light)}.quick-login-btn.instructor{border-left:4px solid var(--color-warning)}.quick-login-btn.instructor:hover{background:var(--color-warning-light)}.quick-login-btn.student{border-left:4px solid var(--color-info)}.quick-login-btn.student:hover{background:var(--color-info-light)}.btn-icon{color:var(--color-primary);height:24px;width:24px}.btn-content{display:flex;flex-direction:column;gap:var(--space-1)}.btn-title{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.btn-subtitle{color:var(--color-text-muted);font-size:var(--font-size-sm)}.custom-login-section{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6)}.user-selection{align-items:flex-end;display:flex;gap:var(--space-3)}.user-select{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text);cursor:pointer;flex:1;font-size:var(--font-size-sm);padding:var(--space-3);transition:all var(--transition-fast)}.user-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.custom-login-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.custom-login-btn:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.custom-login-btn:disabled{cursor:not-allowed;opacity:.5}.test-users-grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}.test-user-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.test-user-card:hover{border-color:var(--color-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.user-card-header{align-items:center;border-bottom:1px solid var(--color-border);display:flex;gap:var(--space-3);margin-bottom:var(--space-4);padding-bottom:var(--space-3)}.card-avatar{border:2px solid var(--color-border);border-radius:var(--radius-lg);height:48px;-o-object-fit:cover;object-fit:cover;width:48px}.card-info h4{color:var(--color-text-heading);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-1) 0}.user-card-details{gap:var(--space-3);margin-bottom:var(--space-4)}.detail-item,.user-card-details{display:flex;flex-direction:column}.detail-item{gap:var(--space-1)}.detail-item strong{color:var(--color-text-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.email-container,.password-container{align-items:center;display:flex;gap:var(--space-2)}.email-text,.password-text{background:var(--color-surface-alt);border-radius:var(--radius-sm);color:var(--color-text);flex:1;font-family:monospace;font-size:var(--font-size-sm);padding:var(--space-1) var(--space-2)}.copy-btn,.toggle-password-btn{align-items:center;background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-muted);cursor:pointer;display:flex;height:28px;justify-content:center;transition:all var(--transition-fast);width:28px}.copy-btn:hover,.toggle-password-btn:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.status-badge{border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;padding:var(--space-1) var(--space-2);text-transform:uppercase;width:-moz-fit-content;width:fit-content}.status-badge.active{background:var(--color-success-light);color:var(--color-success-dark)}.status-badge.inactive{background:var(--color-error-light);color:var(--color-error-dark)}.user-stats{display:flex;flex-direction:column;gap:var(--space-1)}.user-stats span{background:var(--color-surface-alt);border-radius:var(--radius-sm);color:var(--color-text-muted);font-size:var(--font-size-xs);padding:var(--space-1) var(--space-2)}.user-card-actions{display:flex;justify-content:center}.login-as-btn{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-md);color:var(--color-white);cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-2);padding:var(--space-2) var(--space-4);transition:all var(--transition-fast)}.login-as-btn:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.feature-guide{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6)}.feature-grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.feature-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);transition:all var(--transition-normal)}.feature-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.feature-card.admin{border-left:4px solid var(--color-error)}.feature-card.instructor{border-left:4px solid var(--color-warning)}.feature-card.student{border-left:4px solid var(--color-info)}.feature-icon{color:var(--color-primary);height:32px;margin-bottom:var(--space-3);width:32px}.feature-card h4{color:var(--color-text-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}.feature-card ul{list-style:none;margin:0;padding:0}.feature-card li{border-bottom:1px solid var(--color-border);color:var(--color-text);font-size:var(--font-size-sm);padding:var(--space-1) 0}.feature-card li:last-child{border-bottom:none}.feature-card li:before{color:var(--color-success);content:"✓";font-weight:var(--font-weight-bold);margin-right:var(--space-2)}@media (max-width:768px){.test-login{padding:var(--space-4)}.current-user,.test-login-header{flex-direction:column;gap:var(--space-3);text-align:center}.quick-login-buttons{grid-template-columns:1fr}.user-selection{flex-direction:column;gap:var(--space-3)}.feature-grid,.test-users-grid{grid-template-columns:1fr}}@media (max-width:480px){.header-icon{font-size:var(--font-size-xl);height:48px;width:48px}.header-content h2{font-size:var(--font-size-2xl)}.quick-login-btn,.user-card-header{flex-direction:column;text-align:center}.email-container,.password-container{flex-direction:column;gap:var(--space-1)}}