@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";*,*:before,*:after{box-sizing:border-box}*{margin:0}ul[role=list],ol[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}h1,h2,h3,h4,h5,h6{margin:0;font-weight:inherit}p{margin:0}button{background:none;border:none;padding:0;cursor:pointer}fieldset{margin:0;padding:0;border:none}legend{padding:0}ul,ol{margin:0;padding:0;list-style:none}table{border-collapse:collapse;border-spacing:0}th,td{padding:0;text-align:left}input,textarea,select{background:transparent;border:none;outline:none}button,input[type=button],input[type=reset],input[type=submit]{background:none;border:none;padding:0;cursor:pointer;outline:none}a{color:inherit;text-decoration:none}:focus{outline:none}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}:root{--color-primary: #2563eb;--color-primary-dark: #1d4ed8;--color-primary-light: #3b82f6;--color-secondary: #64748b;--color-secondary-dark: #475569;--color-secondary-light: #94a3b8;--color-success: #10b981;--color-success-light: #d1fae5;--color-warning: #f59e0b;--color-warning-light: #fef3c7;--color-error: #ef4444;--color-error-light: #fee2e2;--color-info: #06b6d4;--color-background: #ffffff;--color-background-secondary: #f8fafc;--color-background-tertiary: #f1f5f9;--color-text-primary: #1e293b;--color-text-secondary: #64748b;--color-text-tertiary: #94a3b8;--color-text-inverse: #ffffff;--color-border: #e2e8f0;--color-border-light: #f1f5f9;--color-border-dark: #cbd5e1;--font-family-base: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family-heading: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, monospace;--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-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-base: 1.5;--line-height-relaxed: 1.75;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--spacing-4xl: 6rem;--container-max-width: 1200px;--header-height: 64px;--footer-height: 80px;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--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);--transition-fast: .15s ease-in-out;--transition-base: .25s ease-in-out;--transition-slow: .35s ease-in-out;--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}@media (prefers-color-scheme: dark){:root{--color-background: #0f172a;--color-background-secondary: #1e293b;--color-background-tertiary: #334155;--color-text-primary: #f8fafc;--color-text-secondary: #cbd5e1;--color-text-tertiary: #94a3b8;--color-border: #334155;--color-border-light: #475569;--color-border-dark: #1e293b}}@media (prefers-reduced-motion: reduce){:root{--transition-fast: 0ms;--transition-base: 0ms;--transition-slow: 0ms}*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}body{font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-base);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}h1,h2,h3,h4,h5,h6{font-family:var(--font-family-heading);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text-primary);margin:0 0 var(--spacing-md) 0}h1{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold)}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);font-weight:var(--font-weight-medium)}p{margin:0 0 var(--spacing-md) 0;color:var(--color-text-secondary)}p:last-child{margin-bottom:0}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-dark);text-decoration:underline}a:focus{outline:2px solid var(--color-primary);outline-offset:2px}ul,ol{margin:0 0 var(--spacing-md) 0;padding-left:var(--spacing-lg)}li{margin-bottom:var(--spacing-xs);color:var(--color-text-secondary)}strong,b{font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}em,i{font-style:italic}code{font-family:var(--font-family-mono);font-size:.875em;background-color:var(--color-background-tertiary);padding:.125rem .25rem;border-radius:var(--radius-sm);color:var(--color-text-primary)}pre{font-family:var(--font-family-mono);background-color:var(--color-background-tertiary);padding:var(--spacing-md);border-radius:var(--radius-md);overflow-x:auto;margin:0 0 var(--spacing-md) 0}pre code{background:none;padding:0}blockquote{border-left:4px solid var(--color-primary);padding-left:var(--spacing-md);margin:0 0 var(--spacing-md) 0;font-style:italic;color:var(--color-text-secondary)}small{font-size:var(--font-size-sm);color:var(--color-text-tertiary)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.text-4xl{font-size:var(--font-size-4xl)}.text-5xl{font-size:var(--font-size-5xl)}.font-light{font-weight:var(--font-weight-light)}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.leading-tight{line-height:var(--line-height-tight)}.leading-normal{line-height:var(--line-height-base)}.leading-relaxed{line-height:var(--line-height-relaxed)}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.text-inverse{color:var(--color-text-inverse)}@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)}body{font-size:var(--font-size-sm)}}@media print{body{font-size:12pt;line-height:1.4;color:#000}h1,h2,h3,h4,h5,h6{color:#000;page-break-after:avoid}p{orphans:3;widows:3}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:1;text-decoration:none;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);user-select:none;white-space:nowrap;vertical-align:middle;background:none;outline:none}.btn:focus{outline:2px solid var(--color-primary);outline-offset:2px}.btn:disabled{opacity:.6;cursor:not-allowed;pointer-events:none}.btn-primary{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.btn-primary:hover{background-color:var(--color-primary-dark);border-color:var(--color-primary-dark);color:var(--color-text-inverse);text-decoration:none}.btn-secondary{background-color:var(--color-secondary);border-color:var(--color-secondary);color:var(--color-text-inverse)}.btn-secondary:hover{background-color:var(--color-secondary-dark);border-color:var(--color-secondary-dark);color:var(--color-text-inverse);text-decoration:none}.btn-outline{background-color:transparent;border-color:var(--color-primary);color:var(--color-primary)}.btn-outline:hover{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse);text-decoration:none}.btn-ghost{background-color:transparent;border-color:transparent;color:var(--color-primary)}.btn-ghost:hover{background-color:var(--color-background-tertiary);color:var(--color-primary-dark);text-decoration:none}.btn-success{background-color:var(--color-success);border-color:var(--color-success);color:var(--color-text-inverse)}.btn-success:hover{background-color:#059669;border-color:#059669;color:var(--color-text-inverse);text-decoration:none}.btn-warning{background-color:var(--color-warning);border-color:var(--color-warning);color:var(--color-text-inverse)}.btn-warning:hover{background-color:#d97706;border-color:#d97706;color:var(--color-text-inverse);text-decoration:none}.btn-error{background-color:var(--color-error);border-color:var(--color-error);color:var(--color-text-inverse)}.btn-error:hover{background-color:#dc2626;border-color:#dc2626;color:var(--color-text-inverse);text-decoration:none}.btn-xs{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}.btn-sm{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm)}.btn-lg{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-lg)}.btn-xl{padding:var(--spacing-lg) var(--spacing-xl);font-size:var(--font-size-xl)}.btn-loading{position:relative;color:transparent}.btn-loading:after{content:"";position:absolute;top:50%;left:50%;width:1rem;height:1rem;margin:-.5rem 0 0 -.5rem;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:btn-spin .8s linear infinite}@keyframes btn-spin{to{transform:rotate(360deg)}}.btn-group{display:inline-flex;vertical-align:middle}.btn-group .btn{border-radius:0;border-right-width:0}.btn-group .btn:first-child{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.btn-group .btn:last-child{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);border-right-width:1px}.btn-group .btn:only-child{border-radius:var(--radius-md);border-right-width:1px}.btn-icon{padding:var(--spacing-sm);width:2.5rem;height:2.5rem}.btn-icon.btn-sm{width:2rem;height:2rem;padding:var(--spacing-xs)}.btn-icon.btn-lg{width:3rem;height:3rem;padding:var(--spacing-md)}.btn-block{display:flex;width:100%}@media (max-width: 768px){.btn{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}.btn-lg{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base)}.btn-group{flex-direction:column}.btn-group .btn{border-radius:0;border-right-width:1px;border-bottom-width:0}.btn-group .btn:first-child{border-radius:var(--radius-md) var(--radius-md) 0 0}.btn-group .btn:last-child{border-radius:0 0 var(--radius-md) var(--radius-md);border-bottom-width:1px}}.card{background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.feature-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;transition:all var(--transition-fast)}.feature-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px);border-color:var(--color-primary)}.feature-icon{font-size:var(--font-size-4xl);margin-bottom:var(--spacing-md)}.feature-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm);color:var(--color-text-primary)}.feature-description{color:var(--color-text-secondary);margin-bottom:var(--spacing-lg);line-height:var(--line-height-relaxed)}.feature-link{display:inline-flex;align-items:center;gap:var(--spacing-xs);color:var(--color-primary);font-weight:var(--font-weight-medium);text-decoration:none;transition:color var(--transition-fast)}.feature-link:hover{color:var(--color-primary-dark)}.feature-link:after{content:"→";transition:transform var(--transition-fast)}.feature-link:hover:after{transform:translate(4px)}.app-header{background:var(--color-background);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:var(--z-sticky);backdrop-filter:blur(8px)}.header-content{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) 0}.logo{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.logo-text{color:var(--color-primary)}.main-nav{display:flex;align-items:center;gap:var(--spacing-lg)}.nav-link{color:var(--color-text-secondary);text-decoration:none;font-weight:var(--font-weight-medium);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-fast);position:relative}.nav-link:hover,.nav-link.active{color:var(--color-primary);background-color:var(--color-background-tertiary)}.nav-link.active:after{content:"";position:absolute;bottom:-1px;left:50%;transform:translate(-50%);width:20px;height:2px;background-color:var(--color-primary);border-radius:1px}.app-footer{background:var(--color-background-secondary);border-top:1px solid var(--color-border);margin-top:auto;padding:var(--spacing-xl) 0}.footer-content{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--spacing-md)}.footer-links{display:flex;gap:var(--spacing-lg)}.footer-link{color:var(--color-text-secondary);text-decoration:none;font-size:var(--font-size-sm);transition:color var(--transition-fast)}.footer-link:hover{color:var(--color-primary)}@media (max-width: 768px){.header-content{flex-direction:column;gap:var(--spacing-md)}.main-nav{gap:var(--spacing-md);flex-wrap:wrap;justify-content:center}.nav-link{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm)}.footer-content{flex-direction:column;text-align:center}.footer-links{justify-content:center}}.loading-overlay{position:fixed;inset:0;background:#ffffffe6;backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:var(--z-modal)}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:var(--spacing-md)}.loading-text{color:var(--color-text-secondary);font-size:var(--font-size-sm);margin:0}.loading-inline{display:inline-flex;align-items:center;gap:var(--spacing-sm)}.loading-inline .loading-spinner{width:16px;height:16px;border-width:2px;margin:0}.btn-loading{position:relative;color:transparent!important}.btn-loading:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:spin .8s linear infinite}.skeleton{background:linear-gradient(90deg,var(--color-background-tertiary) 25%,var(--color-background-secondary) 50%,var(--color-background-tertiary) 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-text{height:1em;border-radius:var(--radius-sm);margin-bottom:var(--spacing-xs)}.skeleton-text:last-child{margin-bottom:0;width:60%}.skeleton-avatar{width:40px;height:40px;border-radius:50%}.skeleton-card{height:200px;border-radius:var(--radius-lg)}.chart-container{position:relative;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:20px;margin-bottom:20px}.chart-container h3{margin:0 0 16px;font-size:18px;font-weight:600;color:#1f2937}.chart-container svg{width:100%;height:auto;overflow:visible}.chart-bar,.chart-line,.chart-slice,.chart-area,.chart-point{transition:all .3s ease}.chart-bar:hover,.chart-slice:hover{opacity:.8;transform:scale(1.05);cursor:pointer}.chart-point:hover{r:6;cursor:pointer}.chart-tooltip{position:absolute;background:#000000e6;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;pointer-events:none;z-index:1000;box-shadow:0 4px 12px #0000004d}.chart-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:#000000e6}.chart-legend{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;padding-top:16px;border-top:1px solid #e5e7eb}.legend-item{display:flex;align-items:center;gap:8px;font-size:14px;color:#6b7280}.legend-color{width:12px;height:12px;border-radius:2px;flex-shrink:0}.legend-summary{margin-top:8px;font-weight:600;color:#374151}.progress-chart-container{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.progress-chart-container h3{color:#fff}.progress-bar-container{margin:8px 0}.progress-bar-bg{background:#fff3;border-radius:15px;overflow:hidden}.progress-bar-fill{height:30px;background:linear-gradient(90deg,#10b981,#3b82f6);border-radius:15px;transition:width 1s ease;display:flex;align-items:center;padding:0 12px;color:#fff;font-weight:600;font-size:14px}.quiz-stats-container{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.quiz-stats-container h3{color:#fff}.accuracy-distribution{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px;margin-top:16px}.accuracy-item{text-align:center;padding:12px;background:#ffffff1a;border-radius:8px}.accuracy-value{font-size:24px;font-weight:700;margin-bottom:4px}.accuracy-label{font-size:12px;opacity:.8}.dashboard-container{padding:20px;background:#f8fafc;min-height:100vh}.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.stat-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a;display:flex;align-items:center;gap:16px;transition:transform .2s ease,box-shadow .2s ease}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.stat-icon{font-size:32px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff}.stat-content h3{margin:0;font-size:28px;font-weight:700;color:#1f2937;transition:transform .2s ease}.stat-content p{margin:4px 0 0;color:#6b7280;font-size:14px}.stat-trend{font-size:12px;font-weight:600;padding:2px 6px;border-radius:4px;margin-top:4px;display:inline-block}.stat-trend.positive{background:#dcfce7;color:#166534}.stat-trend.negative{background:#fee2e2;color:#991b1b}.charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(500px,1fr));gap:20px;margin-bottom:30px}.chart-widget{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.widget-header{padding:20px 20px 0;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e5e7eb;margin-bottom:20px}.widget-header h3{margin:0;font-size:18px;font-weight:600;color:#1f2937}.widget-controls{display:flex;align-items:center;gap:12px}.widget-controls select{padding:6px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff}.refresh-btn{background:none;border:1px solid #d1d5db;border-radius:6px;padding:6px 10px;cursor:pointer;font-size:14px;transition:all .2s ease}.refresh-btn:hover{background:#f3f4f6;border-color:#9ca3af}.widget-content{padding:0 20px 20px;min-height:300px}.status-indicator{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px}.status-indicator.online{background:#10b981;animation:pulse 2s infinite}.status-indicator.offline{background:#ef4444}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.data-table-widget{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.table-container{overflow-x:auto}.data-table th,.data-table td{padding:12px 16px;text-align:left;border-bottom:1px solid #e5e7eb}.data-table th{background:#f9fafb;font-weight:600;color:#374151;font-size:14px}.data-table td{font-size:14px;color:#6b7280}.data-table tr:hover{background:#f9fafb}.status{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600;text-transform:uppercase}.status.success{background:#dcfce7;color:#166534}.status.error{background:#fee2e2;color:#991b1b}.status.warning{background:#fef3c7;color:#92400e}@media (max-width: 768px){.charts-grid,.stats-row{grid-template-columns:1fr}.widget-header{flex-direction:column;align-items:flex-start;gap:12px}.widget-controls{width:100%;justify-content:flex-end}}.chart-loading{display:flex;align-items:center;justify-content:center;height:200px;color:#6b7280;font-size:14px}.chart-loading:before{content:"";width:20px;height:20px;border:2px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite;margin-right:8px}@keyframes spin{to{transform:rotate(360deg)}}.chart-error{display:flex;align-items:center;justify-content:center;height:200px;color:#ef4444;font-size:14px;flex-direction:column;gap:8px}.chart-error-icon{font-size:32px}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg)}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--spacing-2xl);align-items:center;padding:var(--spacing-3xl) 0;min-height:50vh;max-width:1200px;margin:0 auto}.hero-content{max-width:600px}.hero-title{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text-primary);margin-bottom:var(--spacing-lg)}.hero-description{font-size:var(--font-size-lg);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-xl)}.hero-actions{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.hero-image{display:flex;justify-content:center;align-items:center}.features{padding:var(--spacing-3xl) 0;background:var(--color-background-secondary)}.section-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);text-align:center;color:var(--color-text-primary);margin-bottom:var(--spacing-2xl)}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-xl);max-width:1000px;margin:0 auto;padding:0 var(--spacing-lg)}@media (max-width: 1024px){.hero{grid-template-columns:1fr;gap:var(--spacing-2xl);text-align:center}.hero-title{font-size:var(--font-size-4xl)}.hero-description{font-size:var(--font-size-lg)}.hero-image div{width:400px!important;height:300px!important}}@media (max-width: 768px){.hero{padding:var(--spacing-2xl) 0}.hero-title{font-size:var(--font-size-3xl)}.hero-description{font-size:var(--font-size-base);margin-bottom:var(--spacing-xl)}.hero-actions{justify-content:center}.hero-image div{width:300px!important;height:200px!important;font-size:32px!important}.features{padding:var(--spacing-2xl) 0}.section-title{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-2xl)}.features-grid{grid-template-columns:1fr;gap:var(--spacing-xl)}.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.stats-grid{grid-template-columns:1fr;gap:var(--spacing-md)}}.stats-section{padding:var(--spacing-2xl) 0;background:var(--color-background)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-lg);max-width:900px;margin:0 auto;padding:0 var(--spacing-lg)}.stat-item{text-align:center;padding:var(--spacing-lg);background:var(--color-background-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border);transition:all var(--transition-fast);cursor:pointer}.stat-item:hover{box-shadow:var(--shadow-md);border-color:var(--color-primary)}.stat-number{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-primary);margin-bottom:var(--spacing-sm)}.stat-label{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.recent-activity{padding:var(--spacing-2xl) 0;max-width:900px;margin:0 auto;background:var(--color-background-secondary)}.activity-list{display:flex;flex-direction:column;gap:var(--spacing-lg);padding:0 var(--spacing-lg)}.activity-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.activity-item:hover{box-shadow:var(--shadow-sm);border-color:var(--color-primary)}.activity-icon{width:48px;height:48px;background:var(--color-background-tertiary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);flex-shrink:0}.activity-content{flex:1}.activity-content h4{margin:0 0 var(--spacing-xs) 0;color:var(--color-text-primary);font-size:var(--font-size-base);font-weight:var(--font-weight-medium)}.activity-content p{margin:0 0 var(--spacing-xs) 0;color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed)}.activity-time{color:var(--color-text-tertiary);font-size:var(--font-size-xs)}@media (max-width: 480px){.hero-actions{flex-direction:column;align-items:center}.hero-actions .btn{width:100%;max-width:200px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}.stat-item{padding:var(--spacing-md)}.stat-number{font-size:var(--font-size-2xl)}.activity-item{padding:var(--spacing-md)}.activity-icon{width:40px;height:40px;font-size:var(--font-size-lg)}}.video-page{min-height:100vh;background:var(--color-background)}.page-header{background:var(--color-background-secondary);border-bottom:1px solid var(--color-border);padding:var(--spacing-lg) 0}.page-header-content{display:flex;align-items:center;gap:var(--spacing-lg)}.back-btn{background:none;border:1px solid var(--color-border);color:var(--color-text-secondary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);font-size:var(--font-size-sm)}.back-btn:hover{background:var(--color-background-tertiary);color:var(--color-text-primary);border-color:var(--color-primary)}.page-info{flex:1}.page-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:0 0 var(--spacing-xs) 0}.page-description{color:var(--color-text-secondary);margin:0;line-height:var(--line-height-relaxed)}.video-section{padding:var(--spacing-2xl) 0;background:var(--color-background)}.video-container{max-width:1000px;margin:0 auto}.video-player-wrapper{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}.video-element{width:100%;height:100%;object-fit:cover}.video-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.video-loading{text-align:center}.video-loading .loading-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto var(--spacing-md)}.video-loading p{margin:0;font-size:var(--font-size-lg)}.video-info{display:flex;justify-content:space-between;align-items:center;margin-top:var(--spacing-lg);padding:var(--spacing-md);background:var(--color-background-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border)}.video-meta{display:flex;gap:var(--spacing-lg);color:var(--color-text-secondary);font-size:var(--font-size-sm)}.video-duration,.video-progress{font-weight:var(--font-weight-medium)}.video-controls-extra{display:flex;gap:var(--spacing-sm)}.video-content{padding:var(--spacing-2xl) 0;background:var(--color-background-secondary)}.content-grid{display:grid;grid-template-columns:2fr 1fr;gap:var(--spacing-2xl);max-width:1000px;margin:0 auto}.video-description h2,.learning-points h3{color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.video-description h2{font-size:var(--font-size-xl)}.learning-points h3{font-size:var(--font-size-lg)}.video-description p{color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.learning-points ul{list-style:none;padding:0;margin:0}.learning-points li{padding:var(--spacing-sm) 0;color:var(--color-text-secondary);position:relative;padding-left:var(--spacing-lg)}.learning-points li:before{content:"✓";position:absolute;left:0;color:var(--color-success);font-weight:var(--font-weight-bold)}.related-content{padding:var(--spacing-2xl) 0;max-width:1000px;margin:0 auto}.related-content h3{color:var(--color-text-primary);margin-bottom:var(--spacing-lg);font-size:var(--font-size-xl)}.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg)}.related-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.related-item:hover{box-shadow:var(--shadow-md);border-color:var(--color-primary)}.related-thumbnail{width:60px;height:60px;background:var(--color-background-tertiary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);flex-shrink:0}.related-info h4{margin:0 0 var(--spacing-xs) 0;color:var(--color-text-primary);font-size:var(--font-size-base)}.related-info p{margin:0;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.completion-section{padding:var(--spacing-2xl) 0;background:var(--color-background)}.completion-card{max-width:600px;margin:0 auto;text-align:center;padding:var(--spacing-2xl);background:var(--color-background-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.completion-card h3{color:var(--color-text-primary);margin-bottom:var(--spacing-md);font-size:var(--font-size-xl)}.completion-card p{color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);line-height:var(--line-height-relaxed)}.completion-actions{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}@media (max-width: 1024px){.content-grid{grid-template-columns:1fr;gap:var(--spacing-xl)}}@media (max-width: 768px){.page-header-content{flex-direction:column;align-items:flex-start;gap:var(--spacing-md)}.video-section{padding:var(--spacing-xl) 0}.video-info{flex-direction:column;gap:var(--spacing-md);align-items:stretch}.video-meta,.video-controls-extra{justify-content:center}.video-content,.related-content,.completion-section{padding:var(--spacing-xl) 0}.completion-actions{flex-direction:column;align-items:center}.completion-actions .btn{width:100%;max-width:200px}}@media (max-width: 480px){.video-player-wrapper{aspect-ratio:4/3}.related-grid{grid-template-columns:1fr}.related-item{flex-direction:column;text-align:center}.related-thumbnail{align-self:center}}.quiz-header{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);color:#fff;padding:var(--spacing-2xl) 0;position:relative}.quiz-header:before{content:"";position:absolute;inset:0;background:#0000001a;z-index:1}.quiz-header-content{text-align:center;max-width:800px;margin:0 auto;position:relative;z-index:2}.quiz-title{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-md);color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.quiz-description{font-size:var(--font-size-lg);color:#fffffff2;margin-bottom:var(--spacing-xl);text-shadow:0 1px 2px rgba(0,0,0,.2)}.quiz-stats{display:flex;justify-content:center;gap:var(--spacing-xl);margin-top:var(--spacing-xl)}.quiz-stats .stat-item{text-align:center;background:#ffffff26;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-lg);padding:var(--spacing-md) var(--spacing-lg);min-width:120px;box-shadow:0 4px 6px #0000001a}.quiz-stats .stat-label{display:block;font-size:var(--font-size-sm);color:#ffffffe6;margin-bottom:var(--spacing-xs);text-shadow:0 1px 2px rgba(0,0,0,.5);font-weight:var(--font-weight-medium)}.quiz-stats .stat-value{display:block;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.6)}.quiz-content{padding:var(--spacing-2xl) 0;min-height:60vh}.quiz-start-screen{display:flex;justify-content:center;align-items:center;min-height:60vh;width:100%;padding:var(--spacing-xl) 0}.start-card{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-3xl);box-shadow:var(--shadow-lg);text-align:center;max-width:600px;width:100%;margin:0 auto}.start-icon{font-size:4rem;margin-bottom:var(--spacing-lg)}.start-card h2{font-size:var(--font-size-3xl);color:var(--color-text-primary);margin-bottom:var(--spacing-xl)}.quiz-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.info-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.info-icon{font-size:var(--font-size-2xl)}.info-text{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.quiz-rules{background:var(--color-background-secondary);border-radius:var(--radius-md);padding:var(--spacing-xl);margin-bottom:var(--spacing-2xl);text-align:left}.quiz-rules h3{font-size:var(--font-size-lg);color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.quiz-rules ul{list-style:none;padding:0;margin:0}.quiz-rules li{padding:var(--spacing-xs) 0;color:var(--color-text-secondary);position:relative;padding-left:var(--spacing-lg)}.quiz-rules li:before{content:"•";color:var(--color-primary);font-weight:700;position:absolute;left:0}.progress-container{margin-bottom:var(--spacing-2xl)}.progress-bar{width:100%;height:8px;background:var(--color-background-secondary);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-md)}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-full);transition:width var(--transition-normal);width:0%}.progress-label{display:block;text-align:center;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.question-card{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-2xl);box-shadow:var(--shadow-md);margin-bottom:var(--spacing-2xl)}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl);flex-wrap:wrap;gap:var(--spacing-md)}.question-number{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-primary)}.question-type{background:var(--color-primary);color:#fff;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.question-difficulty{color:var(--color-warning);font-size:var(--font-size-sm)}.question-content{margin-bottom:var(--spacing-2xl)}.question-title{font-size:var(--font-size-xl);color:var(--color-text-primary);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-lg)}.question-image{max-width:100%;height:auto;border-radius:var(--radius-md);margin-top:var(--spacing-lg)}.question-options{display:flex;flex-direction:column;gap:var(--spacing-md)}.option-item{border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-lg);cursor:pointer;transition:all var(--transition-fast);position:relative}.option-item:hover{border-color:var(--color-primary);background:var(--color-background-secondary)}.option-item.selected{border-color:var(--color-primary);background:var(--color-primary-light)}.option-item.disabled{cursor:not-allowed;opacity:.7}.option-item.correct-answer{border-color:var(--color-success);background:var(--color-success-light)}.option-input{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.option-label{display:flex;align-items:center;gap:var(--spacing-md);cursor:pointer;width:100%}.option-marker{width:32px;height:32px;border-radius:var(--radius-full);background:var(--color-background-secondary);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);color:var(--color-text-secondary);flex-shrink:0}.option-item.selected .option-marker{background:var(--color-primary);color:#fff}.option-item.correct-answer .option-marker{background:var(--color-success);color:#fff}.option-text{flex:1;color:var(--color-text-primary);line-height:var(--line-height-relaxed)}.question-feedback{margin-top:var(--spacing-xl);padding:var(--spacing-lg);border-radius:var(--radius-md);border-left:4px solid var(--color-primary)}.feedback-content.correct{background:var(--color-success-light);border-left-color:var(--color-success)}.feedback-content.incorrect{background:var(--color-error-light);border-left-color:var(--color-error)}.feedback-header{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.feedback-icon{font-size:var(--font-size-lg)}.feedback-text{font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.feedback-score{margin-left:auto;font-weight:var(--font-weight-bold);color:var(--color-primary)}.feedback-explanation{color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.explanation-text{margin-top:var(--spacing-sm);font-style:italic}.quiz-navigation{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-md);margin-top:var(--spacing-2xl)}.nav-center-buttons{display:flex;align-items:center;justify-content:center;flex:1}.quiz-navigation .btn{min-width:120px}#submit-answer-btn{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff;font-weight:var(--font-weight-medium);min-width:120px}#submit-answer-btn:hover:not(:disabled){background-color:var(--color-primary-dark);border-color:var(--color-primary-dark);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}#submit-answer-btn:disabled{background-color:var(--color-secondary);border-color:var(--color-secondary);cursor:not-allowed;transform:none;box-shadow:none}.quiz-result-screen{display:flex;justify-content:center;align-items:center;min-height:70vh;padding:var(--spacing-xl) 0;width:100%}.result-card{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-3xl);box-shadow:var(--shadow-lg);text-align:center;max-width:700px;width:100%;margin:0 auto;position:relative}.result-header{margin-bottom:var(--spacing-2xl)}.result-icon{font-size:4rem;margin-bottom:var(--spacing-lg)}.result-title{font-size:var(--font-size-3xl);color:var(--color-text-primary);margin-bottom:var(--spacing-lg)}.result-score{display:flex;align-items:baseline;justify-content:center;gap:var(--spacing-sm)}.score-label{font-size:var(--font-size-lg);color:var(--color-text-secondary)}.score-value{font-size:var(--font-size-5xl);font-weight:var(--font-weight-bold);color:var(--color-primary)}.score-total{font-size:var(--font-size-xl);color:var(--color-text-secondary)}.result-details{margin-bottom:var(--spacing-2xl)}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--spacing-lg);margin-top:var(--spacing-xl)}.detail-item{text-align:center}.detail-label{display:block;font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.detail-value{display:block;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.result-analysis{background:var(--color-background-secondary);border-radius:var(--radius-md);padding:var(--spacing-xl);margin-bottom:var(--spacing-2xl);text-align:left}.analysis-content h3{font-size:var(--font-size-lg);color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.analysis-text{color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-lg)}.suggestions h4{font-size:var(--font-size-base);color:var(--color-text-primary);margin-bottom:var(--spacing-sm)}.suggestions ul{list-style:none;padding:0;margin:0}.suggestions li{padding:var(--spacing-xs) 0;color:var(--color-text-secondary);position:relative;padding-left:var(--spacing-lg)}.suggestions li:before{content:"💡";position:absolute;left:0}.result-actions{display:flex;justify-content:center;gap:var(--spacing-md);flex-wrap:wrap}.result-actions .btn{min-width:140px}.quiz-review-screen{padding:var(--spacing-2xl) 0}.review-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2xl);padding-bottom:var(--spacing-lg);border-bottom:2px solid var(--color-border)}.review-header h2{font-size:var(--font-size-2xl);color:var(--color-text-primary)}.review-content{display:flex;flex-direction:column;gap:var(--spacing-2xl)}.review-item{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-sm);border-left:4px solid var(--color-border)}.review-item.correct{border-left-color:var(--color-success)}.review-item.incorrect{border-left-color:var(--color-error)}.review-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg)}.review-number{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.review-result{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.review-question h4{font-size:var(--font-size-lg);color:var(--color-text-primary);margin-bottom:var(--spacing-lg);line-height:var(--line-height-relaxed)}.review-options{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.review-option{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);border-radius:var(--radius-sm);border:1px solid var(--color-border)}.review-option.correct-answer{background:var(--color-success-light);border-color:var(--color-success)}.review-option.wrong-answer{background:var(--color-error-light);border-color:var(--color-error)}.review-option.user-selected{font-weight:var(--font-weight-medium)}.review-option .option-marker{width:24px;height:24px;border-radius:var(--radius-full);background:var(--color-background-secondary);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text-secondary);flex-shrink:0}.review-option.correct-answer .option-marker{background:var(--color-success);color:#fff}.review-option.wrong-answer .option-marker{background:var(--color-error);color:#fff}.review-explanation{background:var(--color-background-secondary);border-radius:var(--radius-sm);padding:var(--spacing-md);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);font-size:var(--font-size-sm)}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:9999}.loading-spinner{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-2xl);text-align:center;box-shadow:var(--shadow-lg)}.spinner{width:40px;height:40px;border:4px solid var(--color-background-secondary);border-top:4px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto var(--spacing-lg)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-spinner p{color:var(--color-text-secondary);margin:0}@media (max-width: 768px){.quiz-header{padding:var(--spacing-xl) 0}.quiz-title{font-size:var(--font-size-3xl)}.quiz-stats{flex-direction:column;gap:var(--spacing-md);margin-top:var(--spacing-lg)}.quiz-stats .stat-item{display:flex;justify-content:space-between;align-items:center;min-width:auto;padding:var(--spacing-sm) var(--spacing-md)}.quiz-stats .stat-label,.quiz-stats .stat-value{display:inline}.quiz-stats .stat-label{margin-bottom:0}.start-card{padding:var(--spacing-2xl)}.quiz-info{grid-template-columns:1fr}.question-card{padding:var(--spacing-xl)}.question-header{flex-direction:column;align-items:flex-start}.quiz-navigation{flex-direction:column;gap:var(--spacing-md)}.nav-center-buttons{width:100%;order:2}.quiz-navigation #prev-btn{order:1}.quiz-navigation #next-btn{order:3}.quiz-navigation .btn{width:100%}.quiz-result-screen{min-height:60vh;padding:var(--spacing-lg) 0}.result-card{padding:var(--spacing-2xl);margin:0 var(--spacing-md)}.result-actions{flex-direction:column}.result-actions .btn{width:100%}.detail-grid{grid-template-columns:repeat(2,1fr)}.review-header{flex-direction:column;align-items:flex-start;gap:var(--spacing-md)}}@media (max-width: 480px){.quiz-content{padding:var(--spacing-lg) 0}.quiz-stats{gap:var(--spacing-sm);margin-top:var(--spacing-md)}.quiz-stats .stat-item{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm)}.quiz-stats .stat-value{font-size:var(--font-size-lg)}.quiz-start-screen{min-height:50vh;padding:var(--spacing-md) 0}.start-card{padding:var(--spacing-xl);margin:0 var(--spacing-sm)}.question-card{padding:var(--spacing-lg)}.quiz-result-screen{min-height:50vh;padding:var(--spacing-md) 0}.result-card{padding:var(--spacing-xl);margin:0 var(--spacing-sm)}.score-value{font-size:var(--font-size-4xl)}.detail-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.review-item{padding:var(--spacing-lg)}}.admin-login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2)}.login-container{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 10px 25px #0000001a;width:100%;max-width:400px}.login-header{text-align:center;margin-bottom:2rem}.login-header h1{color:#1f2937;margin-bottom:.5rem}.login-header p{color:#6b7280;font-size:.9rem}.login-form .form-group{margin-bottom:1.5rem}.login-form label{display:block;margin-bottom:.5rem;color:#374151;font-weight:500}.login-form input{width:100%;padding:.75rem;border:1px solid #d1d5db;border-radius:6px;font-size:1rem;transition:border-color .2s}.login-form input:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.login-footer{text-align:center;margin-top:1.5rem}.login-footer a{color:#6b7280;text-decoration:none;font-size:.9rem}.login-footer a:hover{color:#2563eb}.admin-dashboard{display:flex;min-height:100vh;background:#f9fafb}.admin-sidebar{width:250px;background:#fff;border-right:1px solid #e5e7eb;display:flex;flex-direction:column}.sidebar-header{padding:1.5rem;border-bottom:1px solid #e5e7eb}.sidebar-header h2{color:#1f2937;font-size:1.25rem;margin:0}.sidebar-nav{flex:1;padding:1rem 0}.nav-item{display:flex;align-items:center;padding:.75rem 1.5rem;color:#6b7280;text-decoration:none;transition:all .2s;border-left:3px solid transparent}.nav-item:hover{background:#f3f4f6;color:#374151}.nav-item.active{background:#eff6ff;color:#2563eb;border-left-color:#2563eb}.nav-icon{margin-right:.75rem;font-size:1.1rem}.sidebar-footer{padding:1rem 1.5rem;border-top:1px solid #e5e7eb}.logout-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem}.admin-main{flex:1;overflow:auto}.admin-content{padding:2rem}.dashboard-header{margin-bottom:2rem}.dashboard-header h1{color:#1f2937;margin-bottom:.5rem}.dashboard-header p{color:#6b7280}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 1px 3px #0000001a;display:flex;align-items:center;gap:1rem}.stat-icon{font-size:2rem;width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:#eff6ff;border-radius:50%}.stat-content h3{font-size:1.75rem;font-weight:700;color:#1f2937;margin:0 0 .25rem}.stat-content p{color:#6b7280;margin:0;font-size:.9rem}.quick-actions{margin-bottom:2rem}.quick-actions h2{color:#1f2937;margin-bottom:1rem}.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.action-btn{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:1rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s}.action-btn:hover{border-color:#2563eb;box-shadow:0 2px 8px #2563eb1a}.action-icon{font-size:1.5rem}.action-text{font-size:.9rem;color:#374151}.recent-activity h2{color:#1f2937;margin-bottom:1rem}.activity-list{background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a}.activity-item{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;border-bottom:1px solid #f3f4f6}.activity-item:last-child{border-bottom:none}.activity-icon{width:40px;height:40px;background:#f3f4f6;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem}.activity-content p{margin:0 0 .25rem;color:#374151;font-size:.9rem}.activity-time{color:#9ca3af;font-size:.8rem}.manager-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.manager-header h1{color:#1f2937;margin:0}.header-actions{display:flex;gap:.75rem}.questions-filters{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 1px 3px #0000001a;margin-bottom:1.5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.filter-group label{display:block;margin-bottom:.5rem;color:#374151;font-weight:500;font-size:.9rem}.filter-group select,.filter-group input{width:100%;padding:.5rem;border:1px solid #d1d5db;border-radius:6px;font-size:.9rem}.questions-list{background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a}.list-header{padding:1rem 1.5rem;border-bottom:1px solid #f3f4f6}.list-controls{display:flex;justify-content:space-between;align-items:center}.total-count{color:#6b7280;font-size:.9rem}.pagination-info{color:#9ca3af;font-size:.8rem}.data-table{width:100%;border-collapse:collapse}.data-table th{background:#f9fafb;padding:.75rem 1rem;text-align:left;font-weight:600;color:#374151;font-size:.9rem;border-bottom:1px solid #e5e7eb}.data-table td{padding:.75rem 1rem;border-bottom:1px solid #f3f4f6;font-size:.9rem;color:#374151}.question-content{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{display:inline-block;padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:500}.badge-success{background:#d1fae5;color:#065f46}.badge-warning{background:#fef3c7;color:#92400e}.difficulty-badge{color:#f59e0b}.actions{display:flex;gap:.5rem}.btn-icon{background:none;border:none;padding:.25rem;cursor:pointer;border-radius:4px;transition:background-color .2s}.btn-icon:hover{background:#f3f4f6}.empty-state{text-align:center;padding:3rem;color:#6b7280}.empty-icon{font-size:3rem;margin-bottom:1rem}.empty-state h3{margin-bottom:.5rem;color:#374151}@media (max-width: 768px){.admin-dashboard{flex-direction:column}.admin-sidebar{width:100%;height:auto}.sidebar-nav{display:flex;overflow-x:auto;padding:0}.nav-item{flex-shrink:0;border-left:none;border-bottom:3px solid transparent}.nav-item.active{border-left:none;border-bottom-color:#2563eb}.stats-grid{grid-template-columns:1fr}.actions-grid{grid-template-columns:repeat(2,1fr)}.questions-filters{grid-template-columns:1fr}.manager-header{flex-direction:column;align-items:flex-start;gap:1rem}}*{box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text-primary);background-color:var(--color-background);margin:0;padding:0;min-height:100vh;display:flex;flex-direction:column}#app{display:flex;flex-direction:column;min-height:100vh}.app-main{flex:1;padding:var(--spacing-lg) 0}.container{max-width:var(--container-max-width);margin:0 auto;padding:0 var(--spacing-md)}@media (max-width: 768px){.container{padding:0 var(--spacing-sm)}.app-main{padding:var(--spacing-md) 0}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.hidden{display:none!important}.visible{display:block!important}*:focus{outline:2px solid var(--color-primary);outline-offset:2px}@media print{.app-header,.app-footer,.hero-actions,.feature-link{display:none}body{font-size:12pt;line-height:1.4}}