:root{--fs-h1: clamp(1.5rem, 1.17rem + 1.67vw, 2.5rem);--fs-h2: clamp(1.25rem, 1.04rem + 1.04vw, 1.875rem);--fs-body: clamp(1rem, .92rem + .42vw, 1.25rem);--fs-sm: clamp(1rem, .96rem + .21vw, 1.125rem);--fs-xs: clamp(.75rem, .7rem + .25vw, .875rem);--icon-md: 1.25rem;--icon-lg: 1.5rem;--app-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--ui-scale: 1;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2.5rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .1);--color-primary: #6366f1;--color-primary-hover: #4f46e5;--color-on-primary: #ffffff;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--color-bg: #f9fafb;--color-surface: #ffffff;--color-surface-2: #f3f4f6;--color-text: #111827;--color-text-secondary: #6b7280;--color-text-muted: #9ca3af;--color-border: #e5e7eb;--color-border-strong: #d1d5db}[data-theme=dark]{--color-primary: #818cf8;--color-primary-hover: #a5b4fc;--color-on-primary: #0b1020;--color-success: #34d399;--color-warning: #fbbf24;--color-error: #f87171;--color-info: #60a5fa;--color-bg: #0b1020;--color-surface: #151b2e;--color-surface-2: #1e263d;--color-text: #e5e7eb;--color-text-secondary: #9ca3af;--color-text-muted: #6b7280;--color-border: #2a3350;--color-border-strong: #3b466b}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;scrollbar-gutter:stable;font-size:calc(100% * var(--ui-scale, 1))}body{margin:0;min-height:100dvh;font-family:var(--app-font-family);font-size:var(--fs-body);line-height:1.5;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased}h1{font-size:var(--fs-h1);line-height:1.5}h2{font-size:var(--fs-h2);line-height:1.5}h3{font-size:var(--fs-body);font-weight:600}small,.text-sm{font-size:var(--fs-sm)}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}.measure{max-width:65ch;margin-inline:auto}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important}}.skip-link{position:absolute;left:-999px;top:0;background:var(--color-primary);color:var(--color-on-primary);padding:var(--space-sm) var(--space-md);z-index:1000}.skip-link:focus{left:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);font:inherit;font-size:var(--fs-sm);font-weight:600;padding:.6em 1.1em;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;background:var(--color-surface-2);color:var(--color-text);transition:background .15s ease}.btn:hover{background:var(--color-border)}.btn-primary{background:var(--color-primary);color:var(--color-on-primary)}.btn-primary:hover{background:var(--color-primary-hover)}.btn-danger{background:var(--color-error);color:#fff}.btn:disabled{opacity:.55;cursor:not-allowed}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-lg)}.input,.textarea,.select{width:100%;font:inherit;font-size:var(--fs-sm);padding:.6em .8em;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);-webkit-appearance:none;-moz-appearance:none;appearance:none}.input:focus,.textarea:focus,.select:focus{border-color:var(--color-primary)}label{font-size:var(--fs-sm);font-weight:600;display:block;margin-bottom:var(--space-xs)}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border);font-size:var(--fs-sm)}.container{max-width:1200px;margin:0 auto;padding:var(--space-lg)}.stack{display:flex;flex-direction:column;gap:var(--space-md)}.row{display:flex;align-items:center;gap:var(--space-md)}.spinner{width:2rem;height:2rem;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite;margin:var(--space-xl) auto}@keyframes spin{to{transform:rotate(360deg)}}.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-muted{color:var(--color-text-secondary)}.app-shell,.student-shell{display:flex;flex-direction:column;min-height:100dvh}.app-header,.student-header{position:sticky;top:0;z-index:30;background:var(--color-surface);border-bottom:1px solid var(--color-border)}.app-header-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:var(--space-sm) var(--space-lg)}.app-logo{display:inline-flex;align-items:center;height:44px}.app-logo img{height:40px;width:auto;object-fit:contain}.app-logo .logo-text{font-weight:700;font-size:var(--fs-h2);color:var(--color-text)}.app-header-actions,.student-header-right{display:flex;align-items:center;gap:var(--space-xs)}.app-main{flex:1}.app-footer,.student-footer{border-top:1px solid var(--color-border);background:var(--color-surface);text-align:center;padding:var(--space-md)}.app-footer p,.student-footer p{margin:0;font-size:var(--fs-sm);color:var(--color-text-secondary)}.nav-icon-btn,.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:var(--icon-md);transition:background .15s ease,color .15s ease;text-decoration:none}.nav-icon-btn:hover,.icon-btn:hover{background:var(--color-surface-2);color:var(--color-text)}.tip{position:relative}.tip:after{content:attr(data-tooltip);position:absolute;top:110%;left:50%;transform:translate(-50%);white-space:nowrap;background:var(--color-text);color:var(--color-surface);font-size:var(--fs-xs);padding:.3em .6em;border-radius:var(--radius-sm);opacity:0;pointer-events:none;transition:opacity .15s ease;z-index:50}.tip:hover:after,.tip:focus-visible:after{opacity:1}.tip-right:after{left:auto;right:0;transform:none}.tip-left:after{left:0;transform:none}.nav-role-menu{position:relative}.nav-role-dropdown{position:absolute;right:0;top:110%;min-width:220px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:var(--space-xs);z-index:60}.nav-role-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);color:var(--color-text);text-decoration:none;font-size:var(--fs-sm)}.nav-role-item:hover{background:var(--color-surface-2);text-decoration:none}.nav-role-subitem{padding-left:calc(var(--space-md) + 1.5rem);color:var(--color-text-secondary);font-size:var(--fs-sm)}.avatar{border-radius:var(--radius-full);object-fit:cover;display:inline-flex;align-items:center;justify-content:center;background:var(--color-surface-2)}.avatar-fallback{background:var(--color-primary);color:var(--color-on-primary);font-weight:700}.badge{display:inline-flex;align-items:center;gap:.25em;font-size:var(--fs-xs);font-weight:600;padding:.2em .6em;border-radius:var(--radius-full);background:var(--color-surface-2);color:var(--color-text-secondary);white-space:nowrap}.badge-success{background:color-mix(in srgb,var(--color-success) 18%,transparent);color:var(--color-success)}.badge-warning{background:color-mix(in srgb,var(--color-warning) 20%,transparent);color:var(--color-warning)}.badge-error{background:color-mix(in srgb,var(--color-error) 18%,transparent);color:var(--color-error)}.badge-info{background:color-mix(in srgb,var(--color-info) 18%,transparent);color:var(--color-info)}.badge-primary{background:color-mix(in srgb,var(--color-primary) 18%,transparent);color:var(--color-primary)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:grid;place-items:center;padding:var(--space-lg);z-index:100}.modal-dialog{width:100%;background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);max-height:90vh;display:flex;flex-direction:column;outline:none}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border)}.modal-header h2{margin:0;font-size:var(--fs-h2)}.modal-body{padding:var(--space-lg);overflow-y:auto}.modal-footer{display:flex;justify-content:flex-end;gap:var(--space-sm);padding:var(--space-md) var(--space-lg);border-top:1px solid var(--color-border)}.cropper-stage{position:relative;width:100%;height:320px;background:var(--color-surface-2);border-radius:var(--radius-md);overflow:hidden}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-lg)}.course-card{display:flex;flex-direction:column;gap:var(--space-sm);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;text-decoration:none;color:inherit}.course-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);text-decoration:none}.course-card-logo{width:100%;aspect-ratio:16 / 9;object-fit:contain;background:var(--color-surface-2);border-radius:var(--radius-md)}.empty-state{text-align:center;padding:var(--space-xl)}.empty-state h3{margin-top:0}.progress-track{position:relative;width:min(420px,60vw);height:12px;background:var(--color-surface-2);border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;background:var(--color-primary);transition:width .3s ease}.progress-label{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:var(--fs-xs);font-weight:700;color:var(--color-text)}.progress-bar-inline{width:100%;height:8px;background:var(--color-surface-2);border-radius:var(--radius-full);overflow:hidden}.progress-bar-inline>span{display:block;height:100%;background:var(--color-primary)}.student-header{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-lg)}.student-header-left{flex:0 0 auto}.student-header-center{flex:1;display:flex;justify-content:center}.student-body{flex:1;position:relative;display:flex}.student-main{flex:1;max-width:900px;margin:0 auto;padding:var(--space-xl) var(--space-lg);width:100%}.toc-sidebar{position:fixed;top:0;right:0;height:100dvh;width:min(360px,90vw);background:var(--color-surface);border-left:1px solid var(--color-border);box-shadow:var(--shadow-md);transform:translate(100%);transition:transform .2s ease;z-index:90;display:flex;flex-direction:column;padding:var(--space-md);gap:var(--space-sm)}.toc-sidebar.open{transform:translate(0)}.toc-header{display:flex;align-items:center;justify-content:space-between}.toc-jump{width:100%}.toc-search{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-text-secondary)}.toc-list{overflow-y:auto;flex:1}.toc-item-header{display:flex;align-items:center;gap:var(--space-xs);border-radius:var(--radius-sm)}.toc-item-header.current-step{background:color-mix(in srgb,var(--color-primary) 14%,transparent)}.toc-item-header.is-section .toc-link{font-weight:700}.toc-expand,.toc-goto,.toc-expand-spacer{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:transparent;color:var(--color-text-secondary);cursor:pointer;flex:0 0 auto}.toc-link{flex:1;text-align:left;border:none;background:transparent;color:var(--color-text);font:inherit;font-size:var(--fs-sm);padding:.4em .2em;cursor:pointer;border-radius:var(--radius-sm)}.toc-link:disabled{color:var(--color-text-muted);cursor:not-allowed}.toc-link.dimmed{opacity:.5}.toc-lock{color:var(--color-text-muted);flex:0 0 auto}.toc-children{padding-left:var(--space-md)}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:80}.article-content{line-height:1.7}.article-text,.article-content>p,.article-content>ul,.article-content>ol,.article-content>blockquote{max-width:65ch}.article-content img,.article-image{max-width:100%;height:auto;border-radius:var(--radius-md)}.article-content pre,.article-code{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);overflow-x:auto;font-size:var(--fs-sm)}.article-content code{font-family:ui-monospace,SFMono-Regular,Cascadia Code,Consolas,monospace}.video-frame{position:relative;width:100%;aspect-ratio:16 / 9;border:0;border-radius:var(--radius-md);background:#000}.quiz-question{margin-bottom:var(--space-lg)}.quiz-answer{display:flex;align-items:center;gap:var(--space-sm);width:100%;text-align:left;padding:var(--space-md);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-surface);cursor:pointer;margin-bottom:var(--space-sm);font:inherit;color:inherit}.quiz-answer:hover:not(:disabled){border-color:var(--color-primary)}.quiz-answer.correct{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 12%,transparent)}.quiz-answer.incorrect{border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 12%,transparent)}.step-nav{display:flex;justify-content:space-between;gap:var(--space-md);margin-top:var(--space-xl);padding-top:var(--space-lg);border-top:1px solid var(--color-border)}.page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-md);margin-bottom:var(--space-lg)}.page-header h1{margin:0}.table-wrap{overflow-x:auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.table tbody tr:hover{background:var(--color-surface-2)}.table .row-actions{display:flex;gap:var(--space-xs);justify-content:flex-end}.toolbar{display:flex;gap:var(--space-sm);flex-wrap:wrap;align-items:center;margin-bottom:var(--space-md)}.toolbar .input,.toolbar .select{width:auto;min-width:200px}.pagination{justify-content:center;margin-top:var(--space-lg)}.segmented{display:inline-flex;border:1px solid var(--color-border-strong);border-radius:var(--radius-md);overflow:hidden}.segmented button{border:none;background:var(--color-surface);color:var(--color-text-secondary);padding:.5em 1em;cursor:pointer;font:inherit;font-size:var(--fs-sm)}.segmented button[aria-pressed=true]{background:var(--color-primary);color:var(--color-on-primary)}.chat-fab{position:fixed;right:var(--space-lg);bottom:var(--space-lg);width:56px;height:56px;border-radius:var(--radius-full);border:none;background:var(--color-primary);color:var(--color-on-primary);font-size:var(--icon-lg);cursor:pointer;box-shadow:var(--shadow-md);z-index:70;display:grid;place-items:center}.chat-panel{position:fixed;right:var(--space-lg);bottom:calc(var(--space-lg) + 72px);width:min(380px,92vw);height:min(560px,70vh);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:column;z-index:70;overflow:hidden}.chat-panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border)}.chat-messages{flex:1;overflow-y:auto;padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm)}.chat-quick{display:flex;gap:var(--space-sm);margin-top:var(--space-sm)}.chat-bubble{max-width:85%;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-size:var(--fs-sm);line-height:1.5}.chat-bubble>:first-child{margin-top:0}.chat-bubble>:last-child{margin-bottom:0}.chat-user{align-self:flex-end;background:var(--color-primary);color:var(--color-on-primary)}.chat-assistant{align-self:flex-start;background:var(--color-surface-2);color:var(--color-text)}.chat-input-row{display:flex;gap:var(--space-sm);padding:var(--space-sm);border-top:1px solid var(--color-border)}.auth-page{min-height:100dvh;display:grid;place-items:center;padding:var(--space-lg)}.auth-card{width:min(440px,100%)}.auth-card--wide{width:75%}@media(min-width:75em){.auth-card--wide{width:60%}}.auth-card--wide .btn-primary{font-weight:700}.auth-card--wide .input::-moz-placeholder,.auth-card--wide .textarea::-moz-placeholder{font-style:italic;font-size:var(--placeholder-fs, 1em)}.auth-card--wide .input::placeholder,.auth-card--wide .textarea::placeholder{font-style:italic;font-size:var(--placeholder-fs, 1em)}.field-row{display:grid;grid-template-columns:5.5rem 1fr;align-items:start;gap:var(--space-xs)}.field-row label{margin-bottom:0;text-align:left;padding-top:.6em}.field-row .field-error{grid-column:2;color:var(--color-error)}@media(max-width:40em){.field-row{grid-template-columns:1fr}.field-row label{padding-top:0}.field-row .field-error{grid-column:1}}.form-error,.form-notice{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);border:1px solid transparent;font-size:var(--fs-sm)}.form-error{background:color-mix(in srgb,var(--color-error) 12%,transparent);border-color:color-mix(in srgb,var(--color-error) 40%,transparent);color:var(--color-error)}.form-notice{background:color-mix(in srgb,var(--color-info) 12%,transparent);border-color:color-mix(in srgb,var(--color-info) 40%,transparent);color:var(--color-info)}.auth-logo{display:block;max-height:64px;margin:0 auto var(--space-sm)}.dnd-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);margin-bottom:var(--space-sm)}.dnd-item.dragging{opacity:.5}.dnd-item .drag-handle{cursor:grab;color:var(--color-text-muted)}@media(max-width:40em){.student-header-center{display:none}.app-header-inner{padding:var(--space-sm) var(--space-md)}}
