:root{--purple:#6c4ef5;--ink:#15213b;--muted:#6f7b90;--line:#e8ebf2}*{box-sizing:border-box}body{margin:0;background:#f7f8fc;color:var(--ink);font-family:"Microsoft JhengHei",Arial,sans-serif;display:grid;grid-template-columns:235px 1fr}aside{min-height:100vh;background:#121a31;padding:24px 14px;color:#cbd3eb}aside a{display:block;color:inherit;text-decoration:none;padding:11px 12px;border-radius:8px}aside a:hover{background:#29375b;color:white}.brand{font-size:20px;font-weight:900;color:#fff}aside p{border:1px solid #2d3859;padding:12px;border-radius:10px;font-size:13px}aside p small{display:block;margin-top:5px}aside form button{background:transparent;color:#ffbdc5;padding:11px 12px}main{max-width:1300px;width:100%;padding:48px 7vw}.kicker{color:var(--purple);font-size:12px;font-weight:bold;letter-spacing:.1em}h1{font-size:30px}h2{font-size:19px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}.grid article,.panel,.form{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px}.cover{height:120px;background:linear-gradient(135deg,#302264,#9079fa);color:white;padding:18px;border-radius:10px;font-size:28px;font-weight:bold}.button,button{display:inline-block;border:0;background:var(--purple);color:white;border-radius:8px;padding:10px 14px;text-decoration:none;font-weight:bold}.row{display:flex;gap:15px;align-items:center;border-top:1px solid var(--line);padding:14px 0;text-decoration:none;color:var(--ink)}.row em{margin-left:auto;color:var(--muted);font-style:normal}.player{min-height:410px;border-radius:16px;background:radial-gradient(circle at 70% 20%,#594aa5,#171d36 58%);color:white;display:grid;place-items:center;font-size:20px;font-weight:bold;position:relative}.player small{position:absolute;top:58%;font-weight:normal}.watermark{position:absolute;right:7%;top:14%;text-align:right;font-size:14px;line-height:1.6;opacity:.5;font-weight:normal}.form{max-width:650px;display:grid;gap:15px}.form label{display:grid;gap:6px;font-weight:bold}.form input,.form textarea,.form select{padding:10px;border:1px solid #dce1ec;border-radius:8px;font:inherit}.form textarea{min-height:100px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px;border-bottom:1px solid var(--line)}.inline{display:inline}.inline button{font-size:12px;padding:6px 9px}.flash{padding:12px;background:#e7f7ef;color:#168557;border-radius:8px;margin-bottom:15px}.error{background:#ffe8ea;color:#b02531}.login{display:grid;grid-template-columns:1.1fr .9fr;min-height:100vh}.login section{padding:70px 10%;background:linear-gradient(135deg,#241b57,#5945c8);color:white}.login section h1{font-size:44px;margin-top:100px}.login form{align-self:center;padding:45px;max-width:460px}.login label{display:grid;gap:7px;margin:18px 0}.login input{padding:12px;border:1px solid #dce1ec;border-radius:8px}@media(max-width:800px){body,.login{grid-template-columns:1fr}aside{min-height:auto}main{padding:28px 20px}.login section{display:none}table{font-size:12px}}
.video-wrap{min-height:410px;border-radius:16px;background:#101525;position:relative;overflow:hidden}.video-wrap video{width:100%;height:410px;background:#101525}.video-wrap .watermark{color:#fff}.empty-player{min-height:280px;border:1px dashed #c9cfe0;border-radius:16px;display:grid;place-items:center;color:#6f7b90;background:#fff}
.video-wrap iframe{width:100%;height:410px;border:0;background:#101525}
.drive-control-shield{position:absolute;right:0;top:0;width:78px;height:72px;background:#101525;z-index:3}
.fullscreen-button{position:absolute;right:18px;bottom:18px;background:#6c4ef5;color:#fff;border:0;border-radius:8px;padding:9px 12px;z-index:3}.video-wrap:fullscreen{width:100%;height:100%;display:grid;place-items:center}.video-wrap:fullscreen video,.video-wrap:fullscreen iframe{width:100%;height:100%;object-fit:contain}.video-wrap:fullscreen .watermark{z-index:4;font-size:16px;opacity:.65}
.video-fallback{position:absolute;inset:0;display:grid;place-items:center;background:#101525e8;color:#fff;text-align:center;padding:24px}.video-fallback a,.external-video-link a{color:#6c4ef5;font-weight:bold}.video-fallback a{color:#fff;text-decoration:underline}.external-video-link{font-size:14px}
.material-button{display:inline-block;color:#5c40d6;background:#f0edff;border:1px solid #ded6ff;border-radius:8px;padding:9px 12px;text-decoration:none;font-weight:bold;font-size:14px}
.source-options{display:flex;align-items:center;gap:28px;border:1px solid #dce1ec;border-radius:8px;padding:14px 16px;margin:0}.source-options legend{padding:0 6px;font-weight:bold}.form .source-options label{display:flex;align-items:center;gap:8px;font-weight:bold;white-space:nowrap}.form .source-options input[type="radio"]{margin:0;padding:0;width:18px;height:18px}
.home-hero{min-height:230px;border-radius:16px;padding:38px;background:linear-gradient(135deg,#302264,#8068e8);background-size:cover;background-position:center;color:#fff;margin-bottom:32px}.home-hero h1{font-size:32px;margin:0 0 12px;max-width:720px}.home-hero p{font-size:17px;max-width:650px;line-height:1.6}.site-footer{margin-top:42px;padding:20px 0;border-top:1px solid var(--line);display:grid;gap:7px;color:var(--muted);font-size:14px}.site-footer strong{color:var(--ink)}.home-preview{width:100%;max-height:230px;object-fit:cover;border:1px solid var(--line);border-radius:10px}
.site-logo{display:block;max-width:100%;height:52px;object-fit:contain;object-position:left;margin-bottom:10px}.brand strong{display:block}
.form-grid{display:grid;grid-template-columns:1fr 180px;gap:15px}.video-source-panel{background:#faf9ff;border:1px solid #e4e0ff;border-radius:10px;padding:16px}.video-source-panel small{display:block;color:var(--muted);margin:8px 0 12px}.preview-button{background:#f0edff;color:#5c40d6;border:1px solid #ded6ff}.video-preview{border:1px solid var(--line);border-radius:12px;padding:18px;background:#fff}.video-preview h2{font-size:17px;margin:0 0 14px}.video-preview>div:first-of-type{min-height:150px;display:grid;place-items:center;background:#f7f8fc;color:var(--muted);border-radius:8px}.video-preview video,.video-preview iframe{width:100%;min-height:300px;background:#101525;border:0;border-radius:8px}.preview-result{min-height:22px;margin:12px 0 0;font-size:14px}.preview-result.success{color:#14865b}.preview-result.error{color:#b02531}.video-info{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 0}.video-info div{padding:11px;background:#f7f8fc;border-radius:8px}.video-info dt{font-size:12px;color:var(--muted)}.video-info dd{margin:5px 0 0;font-weight:bold}@media(max-width:800px){.form-grid,.video-info{grid-template-columns:1fr}.source-options{align-items:flex-start;flex-direction:column;gap:12px}}
.app-sidebar{position:sticky;top:0;height:100vh;width:250px;background:#121a31;padding:25px 15px;color:#cad3e9}.app-sidebar .brand{font-size:20px;line-height:1.45}.member-summary{margin:24px 0;padding:14px;border:1px solid #2d3859;border-radius:12px;font-size:13px}.member-summary b,.member-summary span{display:block}.member-summary b{color:#fff;margin-bottom:5px}.app-sidebar nav{display:grid;gap:4px}.app-sidebar nav a{font-size:14px}.app-content{padding:48px clamp(28px,6vw,90px);max-width:1500px}.welcome-block{margin-bottom:30px}.welcome-block h1{font-size:32px;margin:8px 0}.welcome-block>p{color:var(--muted)}.dashboard-banner{min-height:220px;border-radius:17px;padding:38px;background:linear-gradient(135deg,#302264,#8068e8);background-size:cover;background-position:center;color:#fff}.dashboard-banner h1{font-size:31px;margin:0 0 12px}.dashboard-banner p{font-size:17px;max-width:680px}.course-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}.course-card{border:1px solid var(--line);border-radius:17px;background:#fff;overflow:hidden;box-shadow:0 7px 18px #15213b08}.course-cover{height:150px;padding:18px;display:flex;justify-content:space-between;flex-direction:column;background:linear-gradient(135deg,#2d235e,#9079fa);color:#fff}.course-cover span{font-size:34px;font-weight:900}.course-cover small{font-size:10px;letter-spacing:.1em;opacity:.8}.course-body{padding:19px}.course-body h2{margin:0 0 10px;font-size:20px}.course-description{color:var(--muted);font-size:14px;min-height:24px}.course-button{display:flex;justify-content:space-between;align-items:center;margin-top:15px;background:var(--purple);color:#fff;text-decoration:none;border-radius:9px;padding:11px 13px;font-weight:bold}.back-link{display:inline-block;margin-bottom:20px;color:var(--purple);font-weight:bold;text-decoration:none}.course-header{margin-bottom:24px}.course-header h1{margin:8px 0}.lesson-panel{border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}.lesson-panel-head{display:flex;justify-content:space-between;align-items:center;padding:19px 22px;border-bottom:1px solid var(--line)}.lesson-panel-head h2{margin:0;font-size:18px}.lesson-panel-head span{color:var(--purple);font-size:13px;font-weight:bold}.lesson-row{display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:12px;padding:17px 22px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}.lesson-row:last-child{border-bottom:0}.lesson-row:hover{background:#faf9ff}.lesson-row small{color:var(--muted)}.player-stage{min-height:460px;background:radial-gradient(circle at 72% 18%,#594aa5,#171d36 58%);border-radius:17px;position:relative;overflow:hidden;color:#fff}.player-stage video,.player-stage iframe{width:100%;height:460px;border:0;background:#101525}.player-stage .watermark{color:#fff;z-index:4}.player-stage:fullscreen{width:100%;height:100%;display:grid;place-items:center}.player-stage:fullscreen video,.player-stage:fullscreen iframe{width:100%;height:100%;object-fit:contain}.login-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;background:#fff}.login-brand{padding:68px clamp(40px,8vw,130px);background:linear-gradient(135deg,#241b57,#5945c8 55%,#8c75ff);color:#fff}.login-brand h1{font-size:47px;margin:95px 0 12px}.login-brand p{font-size:18px;line-height:1.7;opacity:.86}.login-brand ul{list-style:'✓  ';padding-left:20px;margin-top:55px;display:grid;gap:15px}.login-form{align-self:center;margin:auto;padding:42px;max-width:490px;width:100%;display:grid;gap:12px}.login-form h2{font-size:30px;margin:0}.login-form label{display:grid;gap:7px;font-weight:bold;font-size:14px}.login-form input{border:1px solid #dbe0ea;border-radius:10px;padding:13px;outline-color:var(--purple)}.login-form button{margin-top:10px;box-shadow:0 9px 20px #6c4ef540}.login-form small{color:var(--muted);background:#f1efff;padding:12px;border-radius:9px}.muted{color:var(--muted)}@media(max-width:800px){body{display:block}.app-sidebar{position:static;width:auto;height:auto}.app-sidebar nav{grid-template-columns:repeat(2,1fr)}.app-content{padding:28px 20px}.course-grid{grid-template-columns:1fr}.player-stage,.player-stage video,.player-stage iframe{min-height:320px;height:320px}.login-page{grid-template-columns:1fr}.login-brand{display:none}.lesson-row{grid-template-columns:38px 1fr}.lesson-row small{grid-column:2}}
.player-stage:fullscreen .drive-control-shield{display:block;top:0;right:0;width:140px;height:110px;background:#101525;z-index:20}.player-stage:fullscreen .fullscreen-button{display:none}.player-stage:fullscreen #watermarks,.player-stage:fullscreen .watermark{z-index:30;pointer-events:none}.player-stage:fullscreen .watermark{font-size:16px;opacity:.68;text-shadow:0 1px 3px #000}
.player-stage #watermarks{position:absolute;inset:0;z-index:30;pointer-events:none}.player-stage .watermark{pointer-events:none}.player-stage:fullscreen{display:block;background:#101525}.player-stage:fullscreen iframe,.player-stage:fullscreen video{position:absolute;inset:0;width:100vw;height:100vh;min-height:0;display:block;object-fit:contain}.player-stage:fullscreen .drive-control-shield{position:absolute;top:0;right:0;width:150px;height:120px;background:#101525;z-index:20}.player-stage:fullscreen #watermarks{position:absolute;inset:0;z-index:30}.player-stage:fullscreen .watermark{z-index:31}
.fullscreen-button{top:18px;left:18px;right:auto;bottom:auto;z-index:60}.player-stage:fullscreen .fullscreen-button{display:block;top:18px;left:18px;right:auto;bottom:auto;z-index:60}.drive-control-shield{width:170px;height:110px;z-index:50}.drive-bottom-control-shield{position:absolute;right:0;bottom:0;width:170px;height:120px;z-index:50;background:transparent}.player-stage:fullscreen .drive-control-shield{width:170px;height:110px;z-index:50}.player-stage:fullscreen .drive-bottom-control-shield{position:absolute;right:0;bottom:0;width:170px;height:120px;z-index:50;background:transparent}