:root{--bg:#f5f8ff;--card:#ffffff;--text:#0f172a;--muted:#475569;--muted-light:#94a3b8;--line:#e2e8f0;--blue:#1597d4;--indigo:#4f46e5;--cyan:#06b6d4;--soft:#eaf5ff;--danger:#ef4444;--success:#16a34a;--warning:#f59e0b;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-7:32px;--sp-8:40px;--sp-9:48px;--sp-10:64px;--fs-xs:.75rem;--fs-sm:.875rem;--fs-base:.9375rem;--fs-lg:1.125rem;--fs-xl:1.5rem;--fs-2xl:1.875rem;--fs-3xl:2.125rem;--fs-4xl:2.625rem;--lh-tight:1.15;--lh-snug:1.3;--lh-normal:1.5;--lh-relaxed:1.7;--shadow-sm:0 1px 3px rgba(15,23,42,.06);--shadow-md:0 8px 24px rgba(15,23,42,.07);--shadow-lg:0 16px 40px rgba(15,23,42,.09);--shadow-xl:0 24px 50px rgba(15,23,42,.11);--r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:20px;--r-2xl:24px;--r-3xl:28px;--r-full:999px;--ease-out:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.175,.885,.32,1.275);--dur:.25s}*{box-sizing:border-box}body{margin:0;overscroll-behavior-y:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:radial-gradient(circle at top right,rgba(21,151,212,.12),transparent 30%),radial-gradient(circle at 20% 0%,rgba(79,70,229,.08),transparent 28%),var(--bg);color:var(--text);font-size:var(--fs-base);line-height:var(--lh-normal)}button,input,select,textarea{font:inherit}button{border:0;cursor:pointer}.hidden{display:none!important}.app{min-height:100vh}.login-page{min-height:100vh;display:grid;place-items:center;padding:var(--sp-6)}.login-card{width:min(960px,100%);display:grid;grid-template-columns:1.1fr .9fr;background:#ffffffd1;backdrop-filter:blur(18px);border:1px solid rgba(226,232,240,.85);border-radius:var(--r-3xl);box-shadow:var(--shadow-xl);overflow:hidden}.login-hero{padding:var(--sp-8);background:linear-gradient(145deg,#0ea5e9,#4f46e5);color:#fff;position:relative;overflow:hidden}.login-hero:after{content:"";position:absolute;right:-60px;bottom:-70px;width:200px;height:200px;border-radius:60px;background:#ffffff1f;transform:rotate(35deg)}.brand{display:flex;align-items:center;gap:var(--sp-3);font-weight:800}.brand-logo{width:42px;height:42px;border-radius:var(--r-lg);background:linear-gradient(135deg,#60a5fa,#fff);display:grid;place-items:center;color:#0f172a}.login-hero h1{font-size:var(--fs-4xl);line-height:var(--lh-tight);margin:var(--sp-10) 0 var(--sp-4);letter-spacing:-1px}.login-hero p{font-size:1.0625rem;line-height:var(--lh-relaxed);color:#ffffffd1;max-width:430px}.login-form{padding:var(--sp-8);display:flex;flex-direction:column;justify-content:center}.login-form h2{font-size:var(--fs-xl);margin:0 0 var(--sp-2)}.login-form p{margin:0 0 var(--sp-6);color:var(--muted)}.field{display:flex;flex-direction:column;gap:var(--sp-2);margin-bottom:var(--sp-4)}.field label{font-size:var(--fs-sm);font-weight:700;color:#334155}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);background:#fff;outline:none;transition:border-color var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out)}.field textarea{min-height:90px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px #1597d41a}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);font-weight:700;transition:all var(--dur) var(--ease-out)}.btn-primary{background:linear-gradient(135deg,var(--blue),var(--indigo));color:#fff;box-shadow:0 8px 20px #1597d42e}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 12px 28px #1597d438}.btn-ghost{background:#f8fafc;color:#0f172a;border:1px solid var(--line)}.btn-ghost:hover{background:#f1f5f9;border-color:#cbd5e1}.btn-danger{background:#fee2e2;color:#991b1b}.btn-danger:hover{background:#fecaca}.btn-small{padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);font-size:var(--fs-xs)}.btn:disabled,.btn[disabled]{opacity:.45;pointer-events:none;cursor:not-allowed;background:#f1f5f9;color:#94a3b8;border-color:var(--line);box-shadow:none!important}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:var(--r-full);padding:5px 10px;font-size:var(--fs-xs);font-weight:700;background:#e0f2fe;color:#0369a1}.badge.green{background:#dcfce7;color:#166534}.badge.gray{background:#f1f5f9;color:var(--muted)}.layout{display:grid;grid-template-columns:280px 1fr;min-height:100vh;transition:grid-template-columns var(--dur) var(--ease-out)}.layout.course-mode{grid-template-columns:1fr!important}.sidebar{background:#ffffffeb;backdrop-filter:blur(12px);border-right:1px solid var(--line);padding:var(--sp-5);position:sticky;top:0;height:100vh;overflow-y:auto;overflow-x:hidden;transition:all var(--dur) var(--ease-out);width:280px;opacity:1;visibility:visible;z-index:20}.layout.course-mode .sidebar{display:none!important}.side-brand{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-5)}.side-brand .brand-logo{width:38px;height:38px;border-radius:var(--r-lg)}.side-brand b{display:block}.side-brand span{font-size:var(--fs-xs);color:var(--muted)}.user-card{margin-top:auto;background:#f8fafc;border:1px solid var(--line);border-radius:var(--r-xl);padding:var(--sp-4)}.nav-btn{width:100%;display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-lg);background:transparent;color:#334155;text-align:left;font-weight:700;margin-bottom:var(--sp-1);transition:all var(--dur) var(--ease-out)}.nav-btn:hover,.nav-btn.active{background:linear-gradient(135deg,#e0f2fe,#eef2ff);color:#0f172a}.main{min-width:0}.topbar{height:64px;background:#ffffffc7;backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-6);position:sticky;top:0;z-index:10}.topbar h1{font-size:var(--fs-lg);margin:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50vw}.top-actions{display:flex;align-items:center;gap:var(--sp-3)}.content{padding:var(--sp-7);max-width:1440px;margin:0 auto}.hero{background:linear-gradient(135deg,#eefaff,#eef2ff);border:1px solid rgba(226,232,240,.8);border-radius:var(--r-3xl);padding:var(--sp-7);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-5);box-shadow:var(--shadow-md);margin-bottom:var(--sp-6)}.hero h2{font-size:var(--fs-2xl);line-height:var(--lh-tight);margin:0 0 var(--sp-3);letter-spacing:-.5px}.hero p{color:var(--muted);max-width:650px;margin:0;line-height:var(--lh-relaxed);font-size:var(--fs-base)}.spark{width:100px;height:100px;border-radius:var(--r-3xl);background:linear-gradient(135deg,#0ea5e9,#4f46e5);position:relative;box-shadow:0 16px 32px #4f46e52e;flex-shrink:0}.spark:before{content:"";position:absolute;inset:18px;border:12px solid white;border-top-color:transparent;border-radius:50%;transform:rotate(45deg)}.toolbar{display:flex;gap:var(--sp-3);align-items:center;justify-content:space-between;margin-bottom:var(--sp-5);flex-wrap:wrap}.search{position:relative;min-width:0;flex:1;max-width:520px}.search i{position:absolute;left:var(--sp-4);top:50%;transform:translateY(-50%);color:var(--muted)}.search input{width:100%;padding:var(--sp-3) var(--sp-4) var(--sp-3) var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;outline:none;transition:border-color var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out)}.search input:focus{border-color:var(--blue);box-shadow:0 0 0 4px #1597d414}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-5)}.card{background:#ffffffeb;border:1px solid var(--line);border-radius:var(--r-2xl);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--dur) var(--ease-out)}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:#cbd5e1}.course-cover{height:150px;background:linear-gradient(135deg,#0ea5e9,#6366f1);position:relative;overflow:hidden}.course-cover:after{content:"";position:absolute;right:-30px;bottom:-30px;width:100px;height:100px;border-radius:32px;background:#ffffff1f;transform:rotate(38deg)}.course-cover .edit-overlay{position:absolute;top:var(--sp-3);right:var(--sp-3);opacity:0;transition:opacity var(--dur) var(--ease-out)}.card:hover .edit-overlay{opacity:1}.card-body{padding:var(--sp-5)}.card h3{margin:var(--sp-3) 0 var(--sp-2);font-size:var(--fs-lg);font-weight:700;line-height:var(--lh-snug)}.card p{margin:0 0 var(--sp-4);color:var(--muted);line-height:var(--lh-normal);font-size:var(--fs-sm)}.card-actions{display:flex;gap:var(--sp-2);align-items:center}.card-actions .btn{height:38px;font-size:var(--fs-sm);border-radius:var(--r-lg)}.card-actions .btn.btn-primary{flex:1;white-space:nowrap;padding:0 var(--sp-3)}.card-actions .btn:not(.btn-primary){flex:0 0 auto;width:38px;padding:0;display:inline-flex;align-items:center;justify-content:center}.course-layout{display:grid;grid-template-columns:300px 1fr;gap:var(--sp-5);align-items:start;transition:grid-template-columns var(--dur) var(--ease-out),gap var(--dur) var(--ease-out)}.course-sidebar{background:#fff;border:1px solid var(--line);border-radius:var(--r-2xl);padding:var(--sp-4);height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:none;position:sticky;top:88px;transition:opacity var(--dur) var(--ease-out),visibility var(--dur) var(--ease-out);width:300px;opacity:1;visibility:visible}.course-sidebar h3{margin:0 0 var(--sp-2);font-size:var(--fs-base);font-weight:700}.course-progress{padding:var(--sp-2) var(--sp-1);margin-bottom:var(--sp-3)}.course-progress-label{display:flex;justify-content:space-between;align-items:center;font-size:var(--fs-xs);font-weight:700;color:var(--muted);margin-bottom:var(--sp-2)}.course-progress-label b{color:var(--blue);font-size:var(--fs-sm)}.course-progress-bg{width:100%;height:6px;background:#f1f5f9;border:1px solid var(--line);border-radius:var(--r-full);overflow:hidden}.course-progress-bar{height:100%;background:linear-gradient(135deg,var(--blue),var(--indigo));border-radius:var(--r-full);width:0%;transition:width .5s var(--ease-out)}.module-group{border-top:1px solid var(--line);padding-top:var(--sp-3);margin-top:var(--sp-3)}.group-title{display:flex;align-items:center;justify-content:space-between;font-weight:800;font-size:var(--fs-sm);margin-bottom:var(--sp-2);cursor:pointer;padding:6px var(--sp-2);border-radius:var(--r-sm);transition:background var(--dur) var(--ease-out);color:var(--text)}.group-title:hover{background:#f8fafc}.group-title i{transition:transform .2s var(--ease-out);color:var(--muted)}.group-title.collapsed i{transform:rotate(-90deg)}.group-modules{transition:max-height .3s var(--ease-out),opacity .2s;max-height:1000px;overflow:hidden;opacity:1}.group-modules.collapsed{max-height:0px!important;opacity:0;pointer-events:none}.module-item{width:100%;display:flex;align-items:flex-start;gap:var(--sp-2);text-align:left;padding:var(--sp-3);border-radius:var(--r-md);background:transparent;color:#334155;margin-bottom:var(--sp-1);transition:all .2s var(--ease-out);border-left:3px solid transparent}.module-item:hover{background:#f8fafc;color:var(--text)}.module-item.active{background:linear-gradient(90deg,#eaf5ff,#f3e8ff);color:#0f172a;font-weight:700;border-left:3px solid var(--blue);border-radius:var(--r-md);box-shadow:0 2px 8px #1597d40f}.module-item i{margin-top:2px;color:var(--blue)}.module-item small{display:block;color:var(--muted);margin-top:3px;font-size:var(--fs-xs)}.viewer{background:#fff;border:1px solid var(--line);border-radius:var(--r-2xl);box-shadow:var(--shadow-md);overflow:hidden;position:relative}.video-box{aspect-ratio:16/9;background:linear-gradient(135deg,#0f172a,#1e3a5f);display:grid;place-items:center;color:#fff;position:relative}.video-box i{font-size:64px;opacity:.6}.video-box iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}.file-protocol-warning{background:linear-gradient(135deg,#f59e0b14,#ef44440a);border:1px dashed rgba(245,158,11,.35);border-radius:var(--r-xl);padding:var(--sp-4) var(--sp-5);margin:var(--sp-4) var(--sp-7) 0 var(--sp-7);display:flex;gap:var(--sp-3);align-items:flex-start;font-size:var(--fs-sm);color:#78350f;line-height:var(--lh-relaxed)}.file-protocol-warning i{font-size:20px;color:var(--warning);margin-top:2px;flex-shrink:0}.file-protocol-warning a{color:var(--indigo);text-decoration:underline;font-weight:700;transition:color var(--dur) var(--ease-out)}.file-protocol-warning a:hover{color:var(--blue)}.viewer-body{padding:var(--sp-7);max-width:820px}.viewer-meta{display:flex;align-items:center;gap:var(--sp-3);color:var(--muted);font-size:var(--fs-sm);margin-bottom:var(--sp-5);font-weight:500;flex-wrap:wrap}.viewer-meta span{display:inline-flex;align-items:center;gap:5px}.viewer-body h2{margin:0 0 var(--sp-3);font-size:var(--fs-2xl);font-weight:800;letter-spacing:-.5px;color:var(--text);line-height:var(--lh-snug)}.viewer-content{line-height:var(--lh-relaxed);color:#334155;font-size:var(--fs-base)}.viewer-content h1,.viewer-content h2,.viewer-content h3{color:var(--text);margin-top:var(--sp-6);margin-bottom:var(--sp-3);font-weight:700}.viewer-content ul,.viewer-content ol{padding-left:var(--sp-5);margin:var(--sp-4) 0}.viewer-content li{margin-bottom:var(--sp-2)}.viewer-content p{margin-bottom:var(--sp-4)}.resource-card{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);background:#f8fafcb3;backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:var(--r-lg);margin-top:var(--sp-5);color:#0369a1;text-decoration:none;font-weight:700;font-size:var(--fs-sm);transition:all var(--dur) var(--ease-out)}.resource-card:hover{background:#f1f5f9;border-color:var(--blue);transform:translateY(-1px)}.resource-card span{display:inline-flex;align-items:center;gap:8px}.editor-page{position:fixed;inset:0;z-index:100;background:radial-gradient(circle at top right,rgba(21,151,212,.1),transparent 30%),radial-gradient(circle at 20% 0%,rgba(79,70,229,.07),transparent 28%),var(--bg);display:flex;flex-direction:column;overflow:hidden}.editor-topbar{height:60px;background:#ffffffc7;backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-6);flex-shrink:0}.editor-topbar-left{display:flex;align-items:center;gap:var(--sp-3)}.editor-topbar-left .close-btn{width:36px;height:36px;border-radius:var(--r-md);background:linear-gradient(135deg,#fee2e2,#fecaca);display:grid;place-items:center;color:#991b1b;font-size:18px;transition:all var(--dur) var(--ease-out);border:none;cursor:pointer}.editor-topbar-left .close-btn:hover{background:linear-gradient(135deg,#fecaca,#fca5a5);transform:translateY(-1px)}.editor-topbar-left .brand-icon{width:34px;height:34px;border-radius:var(--r-md);background:linear-gradient(135deg,#60a5fa,#fff);display:grid;place-items:center;font-size:15px;color:#0f172a}.editor-topbar-left .course-label{font-weight:700;font-size:var(--fs-sm);color:var(--muted)}.editor-topbar-left .course-label b{color:var(--text);font-size:var(--fs-base)}.editor-topbar-right{display:flex;align-items:center;gap:var(--sp-4)}.toggle-group{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);font-weight:600;color:var(--text)}.toggle-group .info-icon{opacity:.5;cursor:help;color:var(--muted)}.toggle-switch{position:relative;width:44px;height:24px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{position:absolute;inset:0;background:#cbd5e1;border-radius:var(--r-full);cursor:pointer;transition:.3s var(--ease-out)}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;left:3px;bottom:3px;transition:.3s var(--ease-out);box-shadow:0 2px 6px #0000001f}.toggle-switch input:checked+.toggle-slider{background:var(--blue)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px)}.editor-body{display:flex;flex:1;overflow:hidden}.editor-sidebar{width:300px;background:#ffffffe6;backdrop-filter:blur(14px);border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0;transition:width var(--dur) var(--ease-out)}.editor-sidebar.collapsed{width:0;border-right:none;overflow:hidden}.editor-sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4);border-bottom:1px solid var(--line);flex-shrink:0}.editor-tabs{display:flex;gap:0}.editor-tab{padding:var(--sp-2) var(--sp-4);font-weight:700;font-size:var(--fs-sm);color:var(--muted);background:transparent;border:none;cursor:pointer;border-bottom:2.5px solid transparent;border-radius:var(--r-md) var(--r-md) 0 0;transition:all var(--dur) var(--ease-out)}.editor-tab.active{color:var(--blue);border-bottom-color:var(--blue);background:#1597d40d}.editor-tab:hover{color:var(--text)}.collapse-btn{width:32px;height:32px;border-radius:var(--r-md);background:#f1f5f9cc;border:1px solid var(--line);display:grid;place-items:center;cursor:pointer;color:var(--muted);font-size:14px;transition:all var(--dur) var(--ease-out)}.collapse-btn:hover{background:#e2e8f0;color:var(--text)}.editor-sidebar-content{flex:1;overflow-y:auto;padding:var(--sp-3)}.section-block{background:#ffffffb3;border:1px solid var(--line);border-radius:var(--r-xl);margin-bottom:var(--sp-3);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow var(--dur) var(--ease-out)}.section-block:hover{box-shadow:var(--shadow-md)}.section-header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);cursor:pointer;transition:background var(--dur) var(--ease-out)}.section-header:hover{background:#eaf5ff66}.section-header .section-icon{color:var(--muted);font-size:15px;flex-shrink:0;transition:color var(--dur) var(--ease-out)}.section-header:hover .section-icon{color:var(--blue)}.section-header .section-name{flex:1;font-weight:700;font-size:var(--fs-sm);color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.section-header .section-toggle{flex-shrink:0}.section-header .section-expand{width:26px;height:26px;display:grid;place-items:center;color:var(--muted);font-size:15px;flex-shrink:0;background:transparent;border:none;cursor:pointer;border-radius:var(--r-sm);transition:all var(--dur) var(--ease-out)}.section-header .section-expand:hover{background:#1597d414;color:var(--blue)}.section-header .section-expand.collapsed{transform:rotate(180deg)}.section-modules{padding:0 var(--sp-3) var(--sp-3) var(--sp-3);overflow:hidden;transition:all .3s var(--ease-out)}.section-modules.collapsed{max-height:0!important;padding:0 var(--sp-3);overflow:hidden}.module-entry{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3);border-radius:var(--r-md);cursor:pointer;transition:all .2s var(--ease-out);margin-bottom:2px}.module-entry:hover{background:linear-gradient(135deg,#f0f7ff,#eef2ff);box-shadow:var(--shadow-sm)}.module-entry.active{background:linear-gradient(135deg,#e0f2fe,#eef2ff);box-shadow:0 4px 12px #1597d414}.module-entry .mod-edit-icon{color:var(--muted);font-size:14px;flex-shrink:0;cursor:pointer;opacity:.3;transition:all var(--dur) var(--ease-out)}.module-entry:hover .mod-edit-icon{opacity:1;color:var(--blue)}.module-entry .mod-info{flex:1;min-width:0}.module-entry .mod-title{font-size:var(--fs-sm);font-weight:600;color:#334155;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.module-entry .mod-type{font-size:var(--fs-xs);color:var(--muted);display:block;margin-top:2px}.module-entry .mod-toggle{flex-shrink:0}.toggle-switch.sm{width:36px;height:20px}.toggle-switch.sm .toggle-slider:before{width:14px;height:14px}.toggle-switch.sm input:checked+.toggle-slider:before{transform:translate(16px)}.add-link{display:flex;align-items:center;gap:6px;padding:var(--sp-3) var(--sp-4);color:var(--blue);font-size:var(--fs-sm);font-weight:700;background:transparent;border:none;cursor:pointer;width:100%;text-align:left;border-radius:var(--r-md);transition:background var(--dur) var(--ease-out)}.add-link:hover{background:#1597d40d}.editor-panel{flex:1;overflow-y:auto;padding:var(--sp-7) var(--sp-8);background:radial-gradient(circle at 80% 20%,rgba(21,151,212,.06),transparent 40%),radial-gradient(circle at 10% 80%,rgba(79,70,229,.04),transparent 35%),#f0f4f8}.editor-panel-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--muted);text-align:center;gap:var(--sp-4)}.editor-panel-empty i{font-size:56px;opacity:.15}.editor-panel-empty p{font-size:var(--fs-base);line-height:var(--lh-normal)}.module-title-input{font-size:var(--fs-2xl);font-weight:800;color:var(--text);border:none;outline:none;background:transparent;width:100%;padding:0;margin-bottom:var(--sp-6);letter-spacing:-.5px;transition:color var(--dur) var(--ease-out)}.module-title-input::placeholder{color:#cbd5e1}.module-title-input:focus{color:var(--blue)}.add-video-area{width:100%;aspect-ratio:16/9;max-height:280px;border:2px dashed #cbd5e1;border-radius:var(--r-2xl);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-3);color:var(--blue);font-weight:700;font-size:var(--fs-base);cursor:pointer;transition:all var(--dur) var(--ease-out);background:#ffffff80;margin-bottom:var(--sp-6)}.add-video-area:hover{border-color:var(--blue);background:#eaf5ff80}.add-video-area i{font-size:24px}.add-video-area.has-url{background:linear-gradient(135deg,#0f172a,#1e3a5f);color:#fff;border:none;font-size:var(--fs-sm);cursor:default;position:relative;border-radius:var(--r-2xl)}.add-video-area.has-url .video-url-display{font-size:var(--fs-sm);opacity:.7;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.add-video-area.has-url .remove-video{position:absolute;top:var(--sp-3);right:var(--sp-3);background:#ffffff2e;border:none;color:#fff;width:32px;height:32px;border-radius:var(--r-md);cursor:pointer;display:grid;place-items:center;font-size:15px;transition:all var(--dur) var(--ease-out)}.add-video-area.has-url .remove-video:hover{background:#ff00004d}.video-url-input-wrap{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-6)}.video-url-input-wrap input{flex:1;padding:var(--sp-3) var(--sp-4);border:1.5px solid var(--line);border-radius:var(--r-lg);background:#fff;outline:none;font-size:var(--fs-sm);transition:all var(--dur) var(--ease-out)}.video-url-input-wrap input:focus{border-color:var(--blue);box-shadow:0 0 0 4px #1597d414}.video-url-input-wrap button{padding:var(--sp-3) var(--sp-5);border-radius:var(--r-lg);background:linear-gradient(135deg,var(--blue),var(--indigo));color:#fff;border:none;font-weight:700;cursor:pointer;white-space:nowrap;box-shadow:0 6px 16px #1597d42e;transition:all var(--dur) var(--ease-out)}.video-url-input-wrap button:hover{transform:translateY(-1px)}.rich-editor-wrap{background:#ffffffeb;backdrop-filter:blur(10px);border:1.5px solid var(--line);border-radius:var(--r-2xl);overflow:hidden;box-shadow:var(--shadow-md)}.rich-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:2px;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--line);background:#f8fafce6;backdrop-filter:blur(8px)}.rich-toolbar button{width:34px;height:34px;border-radius:var(--r-sm);background:transparent;border:none;cursor:pointer;color:var(--muted);font-size:15px;display:grid;place-items:center;transition:all var(--dur) var(--ease-out)}.rich-toolbar button:hover{background:linear-gradient(135deg,#e0f2fe,#eef2ff);color:var(--blue)}.rich-toolbar button.active{background:#dbeafe;color:var(--blue)}.rich-toolbar .sep{width:1px;height:20px;background:var(--line);margin:0 var(--sp-2)}.rich-toolbar select{border:1px solid var(--line);border-radius:var(--r-sm);padding:6px var(--sp-3);font-size:var(--fs-xs);background:#fff;outline:none;color:var(--muted);cursor:pointer;transition:border-color var(--dur) var(--ease-out)}.rich-toolbar select:hover{border-color:var(--blue)}.rich-content{min-height:280px;padding:var(--sp-6);outline:none;line-height:var(--lh-relaxed);font-size:var(--fs-base);color:#334155}.rich-content:empty:before{content:attr(data-placeholder);color:var(--muted-light)}.rich-content h1,.rich-content h2,.rich-content h3{color:var(--text)}.rich-content ul,.rich-content ol{padding-left:var(--sp-6)}.link-editor-wrap{margin-bottom:var(--sp-6)}.link-editor-wrap label{display:block;font-size:var(--fs-sm);font-weight:700;color:#334155;margin-bottom:var(--sp-2)}.link-editor-wrap input{width:100%;padding:var(--sp-3) var(--sp-4);border:1.5px solid var(--line);border-radius:var(--r-lg);background:#fff;outline:none;font-size:var(--fs-sm);transition:all var(--dur) var(--ease-out)}.link-editor-wrap input:focus{border-color:var(--blue);box-shadow:0 0 0 4px #1597d414}.editor-modal-overlay{position:fixed;inset:0;background:#0f172a66;display:grid;place-items:center;z-index:200;padding:var(--sp-5);backdrop-filter:blur(4px)}.editor-modal{width:min(480px,100%);background:#fffffff5;backdrop-filter:blur(18px);border:1px solid rgba(226,232,240,.85);border-radius:var(--r-2xl);padding:var(--sp-7);box-shadow:var(--shadow-xl)}.editor-modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-5)}.editor-modal-head h3{font-size:var(--fs-xl);font-weight:800;margin:0}.editor-modal-head .close-x{width:34px;height:34px;display:grid;place-items:center;border-radius:var(--r-md);background:#fee2e2;border:none;cursor:pointer;color:#991b1b;font-size:17px;transition:all var(--dur) var(--ease-out)}.editor-modal-head .close-x:hover{background:#fecaca}.editor-modal .field{margin-bottom:var(--sp-4)}.editor-modal .field label{font-size:var(--fs-sm);font-weight:700;margin-bottom:var(--sp-2);display:block;color:#334155}.editor-modal .field label .req{color:var(--danger)}.editor-modal .field input,.editor-modal .field select{width:100%;padding:var(--sp-3) var(--sp-4);border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;outline:none;font-size:var(--fs-sm);transition:all var(--dur) var(--ease-out)}.editor-modal .field input:focus,.editor-modal .field select:focus{border-color:var(--blue);box-shadow:0 0 0 4px #1597d414}.editor-modal-actions{display:flex;gap:var(--sp-3);justify-content:center;margin-top:var(--sp-6)}.editor-modal-actions .btn-cancel{padding:var(--sp-3) var(--sp-6);border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);color:#334155;font-weight:700;cursor:pointer;transition:all var(--dur) var(--ease-out)}.editor-modal-actions .btn-cancel:hover{background:#f8fafc}.editor-modal-actions .btn-save{padding:var(--sp-3) var(--sp-6);border-radius:var(--r-lg);background:linear-gradient(135deg,var(--blue),var(--indigo));color:#fff;border:none;font-weight:700;cursor:pointer;transition:all var(--dur) var(--ease-out);box-shadow:0 6px 16px #1597d42e}.editor-modal-actions .btn-save:hover{transform:translateY(-1px)}.section-name-input{font-weight:700;font-size:var(--fs-sm);color:#334155;border:1.5px solid var(--blue);border-radius:var(--r-sm);padding:5px var(--sp-3);outline:none;background:#fff;width:100%;box-shadow:0 0 0 4px #1597d414;transition:all var(--dur) var(--ease-out)}.table-wrap{background:#fff;border:1px solid var(--line);border-radius:var(--r-2xl);overflow:auto;box-shadow:var(--shadow-md)}table{width:100%;border-collapse:collapse;min-width:780px}th,td{padding:var(--sp-4);border-bottom:1px solid var(--line);text-align:left;font-size:var(--fs-sm);vertical-align:top}th{background:#f8fafc;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.actions{display:flex;gap:var(--sp-2);flex-wrap:wrap}.modal{position:fixed;inset:0;background:#0f172a66;display:grid;place-items:center;padding:var(--sp-4);z-index:50;backdrop-filter:blur(4px)}.modal-card{width:min(620px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:var(--r-2xl);padding:var(--sp-6);box-shadow:var(--shadow-xl)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-4)}.modal-head h3{margin:0;font-size:var(--fs-xl)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}.full{grid-column:1/-1}.toast{position:fixed;right:var(--sp-5);bottom:var(--sp-5);z-index:300;display:flex;flex-direction:column;gap:var(--sp-3)}.toast-item{background:#fff;border:1px solid var(--line);border-left:3px solid var(--blue);box-shadow:var(--shadow-md);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);min-width:240px;font-weight:700;font-size:var(--fs-sm);animation:slideIn .3s var(--ease-out)}.toast-item.error{border-left-color:var(--danger)}@keyframes slideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.empty{padding:var(--sp-8);text-align:center;color:var(--muted);font-size:var(--fs-base)}.loader{padding:var(--sp-7);text-align:center;color:var(--muted)}.sidebar-overlay{display:none;position:fixed;inset:0;background:#0f172a59;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:25;transition:opacity .2s}.sidebar-overlay.open{display:block}.course-sidebar-overlay,.mobile-menu{display:none}:focus-visible{outline:2px solid var(--blue);outline-offset:2px}button:focus-visible,.btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}@media(max-width:900px){.login-card{grid-template-columns:1fr}.login-hero{padding:var(--sp-6)}.login-hero h1{margin-top:var(--sp-7);font-size:var(--fs-3xl)}.login-form{padding:var(--sp-6)}.layout{grid-template-columns:1fr}.sidebar{position:fixed;left:-300px;z-index:30;transition:left var(--dur) var(--ease-out);width:280px}.sidebar.open{left:0}.mobile-menu{display:inline-flex}.content{padding:var(--sp-4)}.hero{flex-direction:column;padding:var(--sp-5)}.hero h2{font-size:var(--fs-xl)}.spark{width:64px;height:64px;border-radius:var(--r-xl)}.spark:before{inset:12px;border-width:8px}.topbar{padding:0 var(--sp-4)}.topbar h1{max-width:40vw}.grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--sp-4)}.course-layout{grid-template-columns:1fr!important;gap:0!important}.course-sidebar{position:static!important;width:100%!important;height:auto!important;border:none!important;padding:var(--sp-4) 0!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;box-shadow:none!important;overflow:visible!important;background:transparent!important}.course-sidebar-overlay,.course-layout.tab-materi-active .course-sidebar,.course-layout.tab-kurikulum-active .viewer{display:none!important}.viewer{border-radius:0!important;border:none!important;box-shadow:none!important;background:transparent!important;overflow:visible!important}.viewer-body{padding:var(--sp-4) 0!important}.viewer-body h2{font-size:var(--fs-xl)}.form-grid{grid-template-columns:1fr}.editor-sidebar{width:260px}.editor-panel{padding:var(--sp-5)}.editor-topbar{padding:0 var(--sp-4)}}@media(max-width:600px){#topbarBackButton,#topbarSyllabusToggle{width:36px;height:36px;padding:0!important;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-md)}#topbarBackButton span,#topbarSyllabusToggle span{display:none!important}#topbarBackButton i,#topbarSyllabusToggle i{font-size:18px;margin:0!important}.editor-sidebar{width:100%;position:absolute;z-index:10;height:100%}.editor-sidebar.collapsed{width:0}.editor-topbar{padding:0 var(--sp-3)}.editor-topbar-right .toggle-group span{display:none}.editor-topbar-right{gap:var(--sp-2)}}@media(max-width:480px){.login-hero h1{font-size:clamp(1.5rem,7vw,var(--fs-3xl))}.login-hero p{font-size:var(--fs-sm)}.login-hero,.login-form{padding:var(--sp-5)}.content{padding:var(--sp-3)}.hero{padding:var(--sp-4)}.hero h2{font-size:var(--fs-lg)}.hero p{font-size:var(--fs-sm)}.spark{display:none}.toolbar{flex-direction:column;align-items:stretch}.search{max-width:none}.grid{grid-template-columns:1fr;gap:var(--sp-4)}.card-actions{flex-wrap:nowrap;align-items:center}.card-actions .btn{height:34px;font-size:var(--fs-xs);min-width:0}.card-actions .btn.btn-primary{flex:1;padding:0 var(--sp-2)}.card-actions .btn:not(.btn-primary){flex:0 0 auto;width:34px;padding:0}.course-mobile-media{margin:calc(-1 * var(--sp-3)) calc(-1 * var(--sp-3)) var(--sp-3) calc(-1 * var(--sp-3))!important}.viewer-body{padding:var(--sp-3) 0!important}.viewer-body h2{font-size:var(--fs-lg)}.module-title-input{font-size:var(--fs-xl)}.topbar h1{font-size:var(--fs-base);max-width:35vw}.toast{right:var(--sp-3);bottom:var(--sp-3);left:var(--sp-3)}.toast-item{min-width:0;width:100%}}@media(max-width:900px){.course-mobile-media{position:sticky;top:64px;z-index:10;background:#0f172a;margin:calc(-1 * var(--sp-4)) calc(-1 * var(--sp-4)) var(--sp-4) calc(-1 * var(--sp-4));box-shadow:var(--shadow-sm);overflow:hidden}.course-mobile-media .video-box{border-radius:0!important;border:none;border-bottom:1px solid var(--line)}}#editorSaveBtn{transition:all .3s cubic-bezier(.4,0,.2,1)}#editorSaveBtn.saving{background:linear-gradient(135deg,var(--muted),#64748b)!important;opacity:.8;pointer-events:none}#editorSaveBtn.success{background:linear-gradient(135deg,#10b981,#059669)!important;box-shadow:0 8px 20px #10b98159!important;animation:btnPop .35s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes btnPop{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1.03)}}@media(min-width:901px){.layout.course-mode{height:100vh;overflow:hidden}.layout.course-mode .main{height:100vh;display:flex;flex-direction:column;overflow:hidden}.layout.course-mode .content{flex:1;padding:var(--sp-4) var(--sp-6)!important;overflow:hidden;max-width:none!important;margin:0!important;width:100%!important}.layout.course-mode .course-layout{height:100%;grid-template-columns:320px 1fr;gap:var(--sp-4);overflow:hidden}.layout.course-mode .course-sidebar{height:100%!important;width:320px!important;border:1px solid var(--line)!important;border-radius:var(--r-2xl)!important;background:#fff!important;box-shadow:var(--shadow-sm)!important;position:static!important;overflow-y:auto!important;overscroll-behavior:none!important;padding:var(--sp-4)!important}.layout.course-mode .viewer{height:100%!important;border:1px solid var(--line)!important;border-radius:var(--r-2xl)!important;background:#fff!important;box-shadow:var(--shadow-md)!important;overflow-y:auto!important;overscroll-behavior:none!important;padding:0!important;display:flex;flex-direction:column}.layout.course-mode .viewer-body{padding:var(--sp-6) var(--sp-8) var(--sp-10) var(--sp-8)!important;max-width:820px;margin:0 auto;width:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}