:root{font-family:system-ui,"Microsoft JhengHei",sans-serif;color:#262934;background:#f3f4f8;line-height:1.6;--purple:#6558d9}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,.button{border:0;border-radius:10px;padding:11px 18px;background:var(--purple);color:white;cursor:pointer;min-height:44px;display:inline-block}button.secondary,.button.secondary{background:#efedf9;color:#483e99}button.danger{background:#fff0f1;color:#ab3145}button:disabled{opacity:.5;cursor:wait}input,textarea,select{width:100%;border:1px solid #d6d9e3;border-radius:9px;padding:11px;background:white;color:#262934}textarea{min-height:100px;resize:vertical}label{display:block;margin:14px 0 5px;font-size:14px;font-weight:600}h1{font-size:32px;letter-spacing:-1px;line-height:1.3}h2{font-size:21px;margin-top:0}h3{font-size:17px}p{color:#696e7d}.shell{display:grid;grid-template-columns:235px 1fr;min-height:100dvh}aside{background:#22252b;color:#e2e2ee;padding:28px 18px;position:sticky;top:0;height:100dvh;display:flex;flex-direction:column}.brand{font-size:21px;font-weight:750;padding:0 14px}.brand small{display:block;font-size:10px;letter-spacing:3px;color:#aca7d5}.nav{display:grid;gap:6px;margin-top:40px}.nav a{padding:12px 14px;border-radius:9px;color:#b9bbc6}.nav a.active,.nav a:hover{background:#3a355c;color:white}.account{margin-top:auto;padding:20px 12px 0;font-size:13px}.account button{margin-top:12px;width:100%;background:#353841}main{padding:28px 42px;max-width:1500px;width:100%;margin:auto}.topline{display:flex;justify-content:space-between;align-items:center;color:#747a89;font-size:13px;border-bottom:1px solid #e1e3eb;padding-bottom:18px}.pill{background:#ece9fa;color:#5a4eb9;border-radius:30px;padding:4px 11px;font-size:12px;display:inline-block}.heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:24px 0}.heading h1{margin:5px 0}.eyebrow{font-size:11px;letter-spacing:2px;color:#8076b5}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}.card{background:white;border:1px solid #e2e3ea;border-radius:16px;padding:24px;margin-bottom:20px}.course-cover{height:130px;background:linear-gradient(125deg,#272b3e,#7366c0);border-radius:12px;display:flex;align-items:flex-end;padding:18px;color:white;font-size:22px;margin-bottom:20px}.meta{font-size:13px;color:#767c8c}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.empty{padding:45px 20px;text-align:center;background:white;border:1px dashed #cbcdd8;border-radius:16px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.full{grid-column:1/-1}.lesson-editor{background:#f6f6fa;padding:18px;border-radius:12px;margin:16px 0}.row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid #ececf2}.row:last-child{border-bottom:0}.row h3{margin:0}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;white-space:nowrap}th,td{text-align:left;padding:14px;border-bottom:1px solid #ebecf1;font-size:14px}th{color:#767a89;font-weight:500}.login{max-width:480px;margin:7vh auto;padding:32px}.login .brand{color:#292638;padding:0}.login .brand small{color:#8171b2}.error{background:#fff0ef;color:#a33232;padding:12px;border-radius:8px}.notice{background:#f0eef9;border:1px solid #ded9f1;padding:13px 17px;border-radius:10px;color:#635b85;font-size:13px;margin-bottom:22px}.watch{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px}.watch video{width:100%;max-height:65vh;background:#13151c;border-radius:12px}.lesson-link{display:block;padding:13px;border-radius:8px;margin-bottom:6px;border:1px solid #e6e5ef}.lesson-link.active{background:#eeeafa;border-color:#a098dd}.stat{font-size:28px;font-weight:700;color:#52469c}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#22252b;color:white;padding:12px 22px;border-radius:12px;z-index:9;display:none;max-width:90vw}.small{font-size:12px}.link{background:none;color:#6455c8;padding:0}progress{width:100%;accent-color:var(--purple)}@media(max-width:850px){.shell{grid-template-columns:1fr}aside{height:auto;position:static;padding:16px}.brand{font-size:17px}.nav{display:flex;overflow:auto;margin-top:16px;gap:4px}.nav a{white-space:nowrap;padding:10px}.account{position:absolute;right:18px;top:14px;padding:0;margin:0}.account span{display:none}.account button{width:auto;margin:0;padding:6px 12px}.watch{grid-template-columns:1fr}main{padding:20px}.heading{align-items:flex-start}.heading h1{font-size:26px}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.card{padding:18px}.row{align-items:flex-start;flex-wrap:wrap}.login{margin:20px auto;padding:24px}.heading>.button{white-space:nowrap}}

.shell>*,.watch>*,.grid>*,.form-grid>*{min-width:0}.nav{max-width:100%}.watch video{display:block;width:100%;min-width:0}.topline{gap:12px}.topline .pill{white-space:nowrap}

main{margin:0 auto;align-self:start}
.admin-list{padding:0 20px 12px}.list-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.admin-tabs{display:flex;gap:24px;border-bottom:1px solid #dddfea;margin-bottom:20px;overflow:auto}.admin-tabs>span,.admin-tabs>button{padding:12px 4px;white-space:nowrap;background:none;color:#777c89;border-radius:0}.admin-tabs .selected{color:#5a4cba;border-bottom:3px solid #6558d9}.admin-tabs b{font-size:12px;border-radius:20px;background:#eae7f7;padding:3px 8px;margin-left:8px}.list-heading .admin-tabs{margin:0;border:0}.list-toolbar{display:grid;grid-template-columns:2fr 1.5fr 1fr;gap:12px;padding:20px 0}.student-name{font-weight:650;color:#5545ad}.student-name:hover{text-decoration:underline}.status{font-size:12px;padding:4px 9px;border-radius:6px;background:#eef0f3;display:inline-block}.status.active{color:#256b54;background:#e8f4ee}.status.expired{color:#946016;background:#fff2da}.status.revoked{color:#994653;background:#faecee}.back-link{display:block;color:#685aac;margin:0 0 18px}.profile-banner{display:flex;gap:18px;align-items:center;padding:22px;background:white;border:1px solid #e2e3ea;border-radius:14px;margin-bottom:24px}.profile-banner .actions{margin:0 0 0 auto}.avatar{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#eeebfc;color:#6558d9}.enrollment-row{display:grid;grid-template-columns:1fr auto auto;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid #ececf2}.enrollment-row h3{margin:0 0 8px}.admin-dialog{border:0;border-radius:18px;padding:28px;width:min(540px,94vw);max-height:90dvh;box-shadow:0 24px 100px #1115}.admin-dialog::backdrop{background:#1d233977}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-heading h2{margin:0}.admin-dialog input,.admin-dialog select{min-width:0}.editor-tabs{margin-bottom:20px} [hidden]{display:none!important}@media(max-width:700px){.list-toolbar{grid-template-columns:1fr}.profile-banner{flex-wrap:wrap}.profile-banner .actions{margin:0}.enrollment-row{grid-template-columns:1fr auto}.enrollment-row>div{grid-column:1/-1}.admin-list{padding:0 12px 12px}.list-heading{align-items:flex-start}.admin-dialog{padding:20px}.profile-banner .meta{overflow-wrap:anywhere}.admin-list td{white-space:normal;min-width:110px}.admin-list td:first-child{min-width:200px}}
/* Course administration: layered navigation based on the approved Teachify reference. */
.admin-shell{grid-template-columns:210px 1fr;background:#fff;color:#343a46;font-size:14px;--purple:#087ff5}.admin-shell aside{padding:18px 12px;background:#f8f9fb;color:#4d5562;border-right:1px solid #eaedf1}.admin-shell .brand{padding:0;font-size:15px}.admin-brand{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#7052e9;color:white}.admin-shell .brand small{font-size:10px;letter-spacing:1px;color:#8c929e}.admin-shell .nav{margin-top:28px;gap:3px}.admin-shell .nav a{padding:9px 12px;color:#626b77;font-size:14px;display:flex;gap:12px;border-radius:6px}.admin-shell .nav a.active,.admin-shell .nav a:hover{background:#e9ebef;color:#252e3b}.nav-group{font-size:12px;color:#9098a4;padding:16px 8px 4px}.nav-icon{width:18px;text-align:center}.admin-shell .account{padding:14px 4px;border-top:1px solid #e6e9ee}.admin-shell .account small{display:block;color:#8f97a5}.admin-shell .account button{background:#e9ecf2;color:#596270}.admin-shell main{padding:0;max-width:none}.admin-top{height:52px;border-bottom:1px solid #eaedf1;display:flex;justify-content:space-between;align-items:center;padding:0 30px;font-size:12px;color:#9198a4}.crumb-sep{margin:0 12px;color:#cbd0d7}.admin-content{padding:26px 30px;max-width:1900px;margin:auto}.admin-shell h1{font-size:27px;letter-spacing:0;margin:0}.admin-shell .heading{margin:0 0 24px}.admin-shell .heading p{margin:6px 0;font-size:13px;color:#9299a4}.admin-shell .card{border-radius:9px;border-color:#e9ebf0;padding:22px;box-shadow:0 1px 2px #1a253004}.admin-shell button,.admin-shell .button{border-radius:6px;min-height:40px;padding:9px 16px}.admin-shell .secondary{background:white;border:1px solid #dce1e8;color:#5a6575}.admin-shell input,.admin-shell select,.admin-shell textarea{border-color:#dce1e7;border-radius:5px;padding:9px}.admin-shell .notice{background:#f6f8fc;border-color:#e5eaf2;color:#7c8595}.admin-shell .student-name{color:#34455a}.admin-shell .admin-tabs .selected{color:#087ff5;border-bottom-color:#087ff5}.admin-shell .stat{color:#2c4158}.admin-shell .pill{background:#f1f3f7;color:#7b8493}.admin-shell #editor{display:grid;grid-template-columns:165px minmax(0,1fr);gap:24px;align-items:start}.admin-shell .editor-tabs{display:flex;flex-direction:column;gap:5px;border:0;margin:0;position:sticky;top:20px;grid-column:1;grid-row:1 / span 6}.admin-shell .editor-tabs button{text-align:left;border:0;padding:10px 13px;border-radius:5px;color:#777f8c;font-size:13px}.admin-shell .editor-tabs button.selected{background:#edf0f5;color:#263647}.admin-shell #editor>.card,.admin-shell #editor>.actions{grid-column:2}.course-offers{border-top:1px solid #e6eaf0;margin-top:25px;padding-top:25px}.course-offers h2{font-size:18px}.offer-item{border:1px solid #e6eaf0;border-radius:8px;padding:18px;display:flex;justify-content:space-between;gap:16px;margin-top:14px}.offer-item .actions{margin:0;align-items:center}.offer-checkout{max-width:650px}.video-uploader{margin-top:12px;border:1px dashed #c8d3e4;background:#f8faff;padding:14px;border-radius:8px}.video-uploader input{font-size:12px;max-width:100%}.upload-message{overflow-wrap:anywhere}.course-catalog-admin{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:24px;align-items:start}.course-cards-admin{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.admin-course-card{border:1px solid #e5e8ed;border-radius:9px;overflow:hidden}.course-art{aspect-ratio:16/9;background:linear-gradient(135deg,#e5edf5,#f6f8fb);padding:22px;display:flex;flex-direction:column;justify-content:space-between;color:#556e8b}.course-art strong{font-size:22px;max-width:90%;line-height:1.5}.course-art span{font-size:11px;letter-spacing:2px}.course-card-info{padding:16px}.course-card-info h2{font-size:16px;margin:8px 0 14px}.course-card-info .row{padding:0;border:0;font-size:12px;color:#8a939f}.catalog-filter{position:sticky;top:20px}.catalog-filter h2{font-size:15px}.admin-course-card:hover{border-color:#aac5e6;box-shadow:0 4px 14px #14345c0b}.admin-dialog .offer-list{max-height:40vh;overflow:auto}@media(min-width:1700px){.course-cards-admin{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:1050px){.course-catalog-admin{grid-template-columns:1fr}.catalog-filter{position:static;grid-row:1}.catalog-filter form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.admin-content{padding:22px}.admin-shell #editor{grid-template-columns:135px minmax(0,1fr)}}@media(max-width:850px){.admin-shell{grid-template-columns:1fr}.admin-shell aside{border-right:0;padding:14px;position:static}.admin-shell .nav{flex-direction:row;display:flex;margin-top:16px;overflow:auto}.admin-shell .nav-group{display:none}.admin-shell .nav a{flex-shrink:0}.admin-shell .account{position:absolute;right:16px;top:12px;padding:0;border:0}.admin-shell .account button{margin:0}.admin-shell .account span{display:none}.admin-top{padding:0 20px}.admin-shell #editor{display:block}.admin-shell .editor-tabs{position:static;flex-direction:row;overflow:auto;margin-bottom:18px}.admin-shell .editor-tabs button{white-space:nowrap}.admin-shell .heading{gap:12px}.admin-shell .heading h1{font-size:24px}.course-cards-admin{grid-template-columns:1fr}.offer-item{flex-direction:column}.admin-content{padding:20px 16px}.catalog-filter form{display:block}}
.monitor-stats{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:20px}.monitor-stats .stat{font-size:32px}.integration-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.integration-grid article{padding:16px;border:1px solid #e5e7eb;border-radius:8px}.integration-grid h3{margin-top:0}.audit-row{padding:12px 0;border-bottom:1px solid #eee;gap:12px}.teacher-course-options{display:grid;gap:10px;max-height:350px;overflow:auto}.teacher-course-options label{display:flex;align-items:center;gap:10px;padding:10px;background:#f7f8fa}.teacher-course-options input{width:20px;height:20px;flex-shrink:0}.admin-content>.card+.card{margin-top:20px}@media(max-width:850px){.integration-grid{grid-template-columns:1fr}.monitor-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.audit-row{align-items:flex-start;flex-direction:column}}
/* Single-lesson content workspace */
.editor-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}.editor-toolbar .actions{margin:0}.lesson-workspace{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:28px;align-items:start}.lesson-workspace>div{min-width:0}.outline-panel{background:#fff;border:1px solid #e4e5eb;border-radius:12px;padding:20px;position:sticky;top:20px;max-height:82vh;overflow:auto}.outline-panel h2{font-size:18px}.outline-panel h3{font-size:13px;color:#777e8c;margin:24px 0 10px}.outline-panel>button{width:100%;margin-top:8px}.outline-item{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:48px;text-align:left;background:transparent;color:#363b47;border:0;white-space:normal;padding:12px}.outline-item.selected{background:#f0edff;color:#6247d2;border-left:3px solid #7054db}.outline-item small{white-space:nowrap;color:#737b8a}.lesson-heading input.lesson-title{font-size:23px;font-weight:600}.content-block{background:#fff;border:1px solid #e4e5eb;border-radius:12px;padding:24px;margin-top:18px}.content-block h2{font-size:18px}.content-block video{display:block;width:100%;max-height:420px;background:#10131b;border-radius:8px;margin:18px 0;object-fit:contain}.asset-name{font-weight:600;overflow-wrap:anywhere}.lesson-drop{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:2px dashed #d7d2ed;border-radius:10px;min-height:140px;padding:20px;background:#fbfaff;text-align:center;margin-top:18px;cursor:pointer}.lesson-drop>span:first-child{color:#684bd3;font-weight:600}.lesson-drop input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.lesson-drop.dragover{border-color:#7054db;background:#eee8ff}.advanced-assets{margin-top:20px}.advanced-assets summary{cursor:pointer;min-height:44px}.lesson-actions{margin-top:20px}#edit-state{font-size:13px;color:#767d88}#upload-state{overflow-wrap:anywhere;margin-top:12px}#course-workspace textarea{min-height:140px}.lesson-heading label{margin-top:14px}
@media(max-width:1000px){.lesson-workspace{grid-template-columns:minmax(0,1fr) 220px;gap:16px}.outline-panel{padding:14px}}
@media(max-width:700px){.editor-toolbar{align-items:flex-start;flex-direction:column}.editor-toolbar .actions{flex-wrap:wrap}.lesson-workspace{display:flex;flex-direction:column}.lesson-workspace>div,.outline-panel{width:100%;box-sizing:border-box}.outline-panel{position:static;order:-1;max-height:250px}.content-block{padding:16px}.lesson-heading input.lesson-title{font-size:20px}.lesson-heading .row{flex-wrap:wrap}.editor-tabs{overflow:auto;white-space:nowrap}.content-block .row{gap:12px;flex-wrap:wrap}.lesson-drop{min-height:130px;padding:16px}}
.admin-shell .editor-toolbar + .editor-tabs{position:static;flex-direction:row;align-items:center;gap:8px;margin:0 0 24px;border-bottom:1px solid #e5e8ed;padding-bottom:10px}.admin-shell .editor-toolbar + .editor-tabs>*{flex-shrink:0}