/* NDC presentation layer. Scope overrides to branded views; existing application
   controls and behavior remain owned by their original templates and handlers. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');

.ndc-brand { display: inline-flex; align-items: center; gap: 11px; color: #f8f6ff; font: 400 27px/1.1 'DM Sans', sans-serif; letter-spacing: .03em; }
.ndc-brand img { width: 43px; height: 43px; flex: 0 0 auto; }
.ndc-brand small { display: block; margin-top: 4px; font: 400 9px/1.4 'DM Sans', sans-serif; letter-spacing: .015em; }
.worktales-brand, .worktales-footer-copy { display: none; }
.worktales-brand img { display: block; width: 165px; height: auto; max-height: 48px; object-fit: contain; }

body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) {
    --primary-color: #8770f5; --primary-hover: #9a86ff; --text-muted: #b3b8cf;
    background: #05091c; color: #f6f4ff; font-family: 'DM Sans', sans-serif; font-size: 16px;
}
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #app { height: auto; min-height: 100svh; }
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #app > header {
    background: transparent; border: 0; backdrop-filter: none;
}
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #navbar {
    max-width: 1440px; margin: auto; padding: 24px 5%; background: transparent;
    border-bottom: 1px solid #ffffff12; backdrop-filter: none; gap: 24px;
}
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #nav-links { align-items: center; flex-wrap: wrap; justify-content: flex-end; }
/* One visible entry point per role. Keep existing handlers and signed-in
   navigation intact; hide only redundant login shortcuts on these views. */
body:has(.ndc-welcome, .ndc-login #student-login-form) #nav-links :is([data-action="student-login"], [data-action="lecturer-login"]),
body:has(.ndc-login #lecturer-login-form) #nav-links [data-action="lecturer-login"] { display: none; }
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #nav-links button {
    min-height: 44px; font: 500 13px/1.3 'DM Sans', sans-serif; padding: 11px 19px; border-radius: 8px;
}
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #app > footer {
    background: transparent; border-top: 1px solid #ffffff12; padding: 22px 20px; margin-top: 28px;
    text-align: center; color: #929bb9; font-size: 12px;
}
body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) :is(button, a, input):focus-visible {
    outline: 3px solid #c0b4ff; outline-offset: 4px;
}
body:has(.ndc-welcome, .ndc-login) .btn-primary {
    background: linear-gradient(165deg, #9278ff, #6546d9); color: #fff; border: 1px solid #b9a8ff70;
    box-shadow: inset 0 1px 0 #ffffff29, 0 8px 24px #6040db20;
}
body:has(.ndc-welcome, .ndc-login) .btn-secondary {
    background: #ffffff03; border: 1px solid #a6add044; color: #e8e8f5;
}
body:has(.ndc-welcome, .ndc-login) :is(.btn-primary, .btn-secondary) {
    font: 500 15px/1.4 'DM Sans', sans-serif; cursor: pointer; transition: transform .2s, background .2s, box-shadow .2s;
}
body:has(.ndc-welcome, .ndc-login) :is(.btn-primary, .btn-secondary):hover { transform: translateY(-2px); text-decoration: none; box-shadow: 0 10px 30px #7961ff25; }
body:has(.ndc-welcome, .ndc-login) button:disabled { opacity: .6; cursor: wait; transform: none; }

/* Welcome: artwork and copy reflow, rather than shrinking the desktop layout. */
.hero.ndc-welcome { width: 100%; max-width: 1320px; padding: 22px 5% 16px; margin: auto; text-align: left; background: none; }
.ndc-welcome-layout { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; min-height: min(570px, 66vh); gap: 12px; }
.ndc-welcome-copy { position: relative; z-index: 1; }
.ndc-welcome .ndc-eyebrow, .ndc-login .ndc-eyebrow, .ndc-dashboard .ndc-eyebrow {
    margin: 0 0 20px; color: #bbaeff; font: 500 11px/1.6 'DM Sans', sans-serif; letter-spacing: .16em; text-transform: uppercase;
}
.hero.ndc-welcome h1 { font: 400 clamp(48px, 5.2vw, 78px)/1.03 'Libre Caslon Display', Georgia, serif; color: #f9f7ff;
    letter-spacing: -.035em; background: none; -webkit-text-fill-color: currentColor; margin: 0 0 25px; animation: none; }
.hero.ndc-welcome .ndc-intro { font: 400 17px/1.8 'DM Sans', sans-serif; color: #bbc0d6; margin: 0 0 29px; max-width: 400px; }
.ndc-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.ndc-actions button { display: inline-flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 50px; padding: 13px 23px; border-radius: 8px; }
.ndc-actions button span { font-size: 21px; line-height: 1; }
.ndc-sculpture { min-width: 0; position: relative; }
.ndc-sculpture img, .ndc-login-art img { width: 100%; height: auto; display: block; mix-blend-mode: screen;
    mask-image: radial-gradient(ellipse at center, #000 48%, #000e 60%, transparent 73%); }
.ndc-sculpture img { animation: ndc-arrive 1s ease-out both, ndc-float 7s 1s ease-in-out infinite; }
.ndc-sculpture-stage { position: relative; width: 100%; aspect-ratio: 1; isolation: isolate; }
.ndc-sculpture-stage img.ndc-approved-artwork {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
    animation: none; transition: none;
}
.ndc-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; border-top: 1px solid #ffffff20; padding: 30px 0 14px; }
.ndc-principles > div { display: flex; align-items: flex-start; gap: 16px; }
.ndc-principles > div + div { border-left: 1px solid #ffffff20; padding-left: 28px; }
.ndc-principle-number { color: #a893ff; font-size: 12px; padding-top: 4px; }
.hero.ndc-welcome .ndc-principles h2 { font: 500 16px/1.5 'DM Sans', sans-serif; margin: 0 0 5px; color: #eeeef8; }
.hero.ndc-welcome .ndc-principles p { font: 400 13px/1.7 'DM Sans', sans-serif; color: #929dbb; margin: 0; }
.ndc-welcome #university-list:empty { display: none; }

/* Same master N image on both login pages. IDs, submit paths and MFA preserved. */
#main-content .ndc-login { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 35px;
    width: 100%; max-width: 1160px; padding: 48px 5%; margin: auto; min-height: 650px; }
.ndc-login-art { min-width: 0; }
.ndc-login-art img { animation: ndc-arrive .8s ease-out both; }
.ndc-login .login-card { width: 100%; max-width: 465px; padding: 36px; text-align: left; border: 1px solid #9b9bd63d;
    border-radius: 18px; background: linear-gradient(140deg, #191d4380, #0c112d9c); box-shadow: 0 18px 70px #00000020; }
.ndc-card-brand { margin-bottom: 28px; }
.ndc-card-brand .ndc-brand { font-size: 24px; }
.ndc-card-brand .ndc-brand img { width: 37px; height: 37px; }
.ndc-login .login-header { text-align: left; margin-bottom: 0; }
.ndc-login .login-card h1 { font: 400 clamp(34px, 3.2vw, 45px)/1.08 'Libre Caslon Display', Georgia, serif; letter-spacing: -.02em; margin: 0 0 15px; color: #faf7ff; }
.ndc-login .login-card p { color: #aeb6d0; font-size: 13px; line-height: 1.6; margin: 0 0 26px; }
.ndc-login .login-card .ndc-eyebrow { font-size: 10px; color: #bbaeff; margin-bottom: 12px; }
.ndc-login .form-group { margin: 0 0 20px; text-align: left; }
.ndc-login .form-group label { display: block; color: #dddff0; font: 500 12px/1.5 'DM Sans', sans-serif; margin-bottom: 8px; }
.ndc-login .form-group input { display: block; width: 100%; min-width: 0; min-height: 49px; padding: 12px 14px;
    font: 400 16px/1.4 'DM Sans', sans-serif; background: #03091d9c; color: #f6f4ff; border: 1px solid #a1acd13d; border-radius: 8px; }
.ndc-login .form-group input::placeholder { color: #8791b0; }
.ndc-login .form-group input:focus { border-color: #af9dff; outline: 2px solid #af9dff40; outline-offset: 1px; background: #080e29; }
.ndc-login form .btn-primary { width: 100%; min-height: 49px; padding: 12px 20px; border-radius: 8px; font-size: 15px; }
.ndc-login .login-footer { border-top: 1px solid #ffffff13; margin-top: 24px; padding-top: 17px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; }
.ndc-login .login-footer p { margin: 0; font-size: 12px; }
.ndc-login .text-link { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; font: inherit; color: #c1b3ff; background: transparent; cursor: pointer; }
.ndc-login .login-footer > .btn-secondary { min-height: 44px; padding: 8px 0; border: 0; background: none; font-size: 12px; color: #bbc1d8; }
.ndc-login form > .btn-secondary { min-height: 44px; width: 100%; margin-top: 12px; font-size: 12px; }
.ndc-login .error-message { padding: 12px; margin-top: 16px; border: 1px solid #f1989855; border-radius: 8px; color: #ffc1c1; background: #bc34341a; font-size: 14px; overflow-wrap: anywhere; }
.ndc-login .mfa-header { margin: 12px 0 24px; }
.ndc-login .mfa-header h3 { font-size: 20px; }

/* Organization styles exist only while the corresponding view is rendered. */
body:has([data-organization-theme="worktales"]) {
    --primary-color: #c64210; --primary-hover: #a73107; --text-main: #292724;
    --text-muted: #706b64; --text-inverse: #211e1a; --bg-card: #fffdfa; --bg-accent: #f2ece5;
    --glass-border: #d9cfc4; background: #f6f2ec; color: #292724;
}
body:has([data-organization-theme="worktales"]) #app > header { background: #151619; }
body:has([data-organization-theme="worktales"]) #navbar { max-width: 1440px; border: 0; }
body:has([data-organization-theme="worktales"]) #navbar .ndc-brand { display: none; }
body:has([data-organization-theme="worktales"]) .worktales-brand { display: inline-flex; }
body:has([data-organization-theme="worktales"]) #nav-links :is(button, span) { color: #fff8f1 !important; }
body:has([data-organization-theme="worktales"]) #app > footer { background: #151619; color: #cec8c3; margin-top: 48px; }
body:has([data-organization-theme="worktales"]) .ndc-footer-copy { display: none; }
body:has([data-organization-theme="worktales"]) .worktales-footer-copy { display: inline; }
body:has([data-organization-theme="worktales"]) :is(button, a, input):focus-visible { outline-color: #b13d12; }
#main-content .ndc-dashboard { width: 100%; max-width: 1160px; margin: 42px auto 0; padding: 0 32px; }
.ndc-dashboard .dashboard-header { position: relative; padding: 36px; border: 1px solid #8b92ca33; border-radius: 18px; background: #101630; backdrop-filter: none; overflow: hidden; }
.ndc-dashboard .dashboard-header h1 { font: 400 clamp(30px, 3.4vw, 46px)/1.12 'Libre Caslon Display', Georgia, serif; max-width: 800px; margin: 0 0 14px; overflow-wrap: anywhere; }
.ndc-dashboard .dashboard-header > p:not(.ndc-eyebrow) { font-size: 15px; }
.ndc-dashboard .dashboard-header .ndc-eyebrow { margin-bottom: 16px; overflow-wrap: anywhere; }
.ndc-dashboard .dashboard-header > button { min-height: 48px; font-size: 15px !important; }
.ndc-dashboard .materials-list { margin-top: 28px; }
.ndc-progress { display: block; width: 100%; height: 5px; border: 0; border-radius: 10px; overflow: hidden; margin-bottom: 12px; accent-color: var(--primary-color); background: #ffffff20; }
.ndc-progress::-webkit-progress-bar { background: #ffffff20; border-radius: 10px; }
.ndc-progress::-webkit-progress-value { background: var(--primary-color); border-radius: 10px; }
.ndc-progress::-moz-progress-bar { background: var(--primary-color); border-radius: 10px; }
[data-organization-theme="worktales"] .ndc-progress,
[data-organization-theme="worktales"] .ndc-progress::-webkit-progress-bar { background: #ece5de; }
.ndc-dashboard .material-card { background: transparent; padding: 0; border: 0; }
.worktales-orbit { display: none; }
[data-organization-theme="worktales"].ndc-dashboard .dashboard-header { border: 1px solid #eadbca; background: radial-gradient(ellipse at 90% 10%, #ffb97535, transparent 60%), #fcf7ef; padding-right: 235px; }
[data-organization-theme="worktales"] .ndc-eyebrow { color: #a93a0f; }
[data-organization-theme="worktales"] .ndc-module-stats { background: #fffdfa !important; border: 1px solid #e6d9c9 !important; font-size: 14px; }
[data-organization-theme="worktales"] .ndc-module-stats span[style*="#818cf8"] { color: #98411d !important; }
[data-organization-theme="worktales"] span[style*="#818cf8"] { color: #98411d !important; }
[data-organization-theme="worktales"] .ndc-module-stats span,
[data-organization-theme="worktales"] .chapter-box-header > div > div:last-child span { font-size: 12px !important; }
[data-organization-theme="worktales"] .dashboard-header > button { background: linear-gradient(145deg, #d94e15, #b43607) !important; box-shadow: 0 5px 14px #d9531520 !important; border: 1px solid #df6b38 !important; }
[data-organization-theme="worktales"] .worktales-orbit { display: block; position: absolute; right: 25px; top: 40px; width: 180px; height: 180px; pointer-events: none; transform: rotate(-15deg); }
.worktales-orbit b { display: block; position: absolute; inset: 55px; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #fff0c4, #f78731 25%, #d9500b 58%, #7f230a); box-shadow: inset -8px -7px 18px #872c0d60, 0 20px 30px #c5571133; }
.worktales-orbit i { position: absolute; inset: 17px 0; border: 4px solid #e87e39; border-radius: 50%; transform: rotate(40deg) scaleX(.48); box-shadow: inset 2px 1px 2px #fff7ce, 2px 1px 2px #ab3f12; }
.worktales-orbit i:nth-child(2) { transform: rotate(-40deg) scaleX(.48); }
.worktales-orbit i:nth-child(3) { transform: rotate(90deg) scaleX(.48); }
[data-organization-theme="worktales"] :is(.chapter-box, .topic-section, .video-item) { background: #fffdfa; border-color: #e6ddd2; color: #2b2723; }
[data-organization-theme="worktales"] .chapter-box { border-radius: 14px; overflow: hidden; margin-bottom: 20px; }
[data-organization-theme="worktales"] .chapter-box-header { background: #f0e8dc; color: #27211b; padding: 18px; }
[data-organization-theme="worktales"] .chapter-box-content { background: #fffdfa; padding: 20px; }
[data-organization-theme="worktales"] :is(.video-title, .topic-title) { font-size: 15px; }
[data-organization-theme="worktales"] .video-meta { font-size: 12px; }
[data-organization-theme="worktales"] .chapter-box-header > div { flex-wrap: wrap; gap: 12px; }
[data-organization-theme="worktales"] .chapter-box h3 { font-size: 18px; color: #33271e; }
[data-organization-theme="worktales"] .topic-title { color: #342c26; flex-wrap: wrap; gap: 12px; }
[data-organization-theme="worktales"] .video-item { border-radius: 9px; padding: 16px; }
[data-organization-theme="worktales"] .video-item:hover { background: #fff1e4; }
[data-organization-theme="worktales"] .play-icon { color: #ac3b0e; }
[data-organization-theme="worktales"] :is(.video-title, .video-info) { min-width: 0; overflow-wrap: anywhere; }
body:has([data-organization-theme="worktales"]) :is(.majors-hero, .modules-hero) { padding: 45px 24px 30px; background: #fcf7ef; }
body:has([data-organization-theme="worktales"]) :is(.majors-hero, .modules-hero) h1 { color: #29211b; font: 400 48px/1.15 'Libre Caslon Display', Georgia, serif; }
body:has([data-organization-theme="worktales"]) :is(.major-card, .module-card) { background: #fffdfa; border-color: #e3d9cc; color: #34291f; box-shadow: 0 7px 24px #4f31100a; }
body:has([data-organization-theme="worktales"]) :is(.major-card, .module-card) h3 { color: #a03b14; }
body:has([data-organization-theme="worktales"]) .back-button { color: #a03b14; margin: 24px; }

@keyframes ndc-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ndc-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }

@media (min-width: 1600px) { .ndc-welcome-layout { min-height: 620px; } }
@media (min-width: 701px) and (max-width: 900px) {
    .hero.ndc-welcome { max-width: 680px; }
    .ndc-welcome .ndc-welcome-layout { grid-template-columns: 1fr; min-height: 0; }
    .ndc-welcome .ndc-sculpture { grid-row: 1; width: 310px; margin: -12px auto -15px; }
    .ndc-welcome .ndc-welcome-copy { padding-bottom: 28px; }
    .ndc-welcome .ndc-actions { flex-wrap: nowrap; }
}
@media (max-width: 900px) {
    .ndc-welcome-layout { gap: 0; min-height: 450px; }
    .hero.ndc-welcome h1 { font-size: 55px; }
    #main-content .ndc-login { grid-template-columns: .8fr 1fr; gap: 5px; padding: 40px 4%; min-height: 630px; }
    .ndc-login .login-card { padding: 28px; }
    .ndc-principles { gap: 15px; }
    .ndc-principles > div + div { padding-left: 15px; }
}
@media (max-width: 700px) {
    body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) #navbar { padding: 17px 22px; gap: 12px; flex-wrap: wrap; }
    .ndc-brand { font-size: 23px; gap: 7px; }
    .ndc-brand img { width: 35px; height: 35px; }
    .ndc-brand small { font-size: 8px; }
    body:has(.ndc-login) #nav-links { gap: 6px !important; }
    body:has(.ndc-login) #nav-links button { font-size: 11px; padding: 8px 10px; }
    body:has([data-organization-theme]) #nav-links { width: 100%; justify-content: flex-start; gap: 5px !important; }
    body:has([data-organization-theme="worktales"]) #nav-links { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body:has([data-organization-theme="worktales"]) #nav-links > span { grid-column: 1 / -1; }
    body:has([data-organization-theme]) #nav-links button { padding: 10px 12px; }
    .hero.ndc-welcome { padding: 0 24px 12px; }
    .ndc-welcome-layout { display: flex; flex-direction: column; align-items: stretch; min-height: 0; }
    .ndc-sculpture { order: -1; width: min(85%, 370px); margin: -14px auto -12px; }
    .ndc-welcome .ndc-eyebrow { font-size: 10px; margin-bottom: 14px; }
    .hero.ndc-welcome h1 { font-size: clamp(43px, 8.5vw, 58px); margin-bottom: 19px; }
    .hero.ndc-welcome .ndc-intro { font-size: 15px; margin-bottom: 24px; }
    .ndc-actions { display: grid; grid-template-columns: 1fr; gap: 10px; }
    .ndc-actions button { min-height: 51px; width: 100%; }
    .ndc-principles { margin-top: 30px; padding-top: 22px; gap: 10px; }
    .ndc-principles > div { display: block; }
    .ndc-principles > div + div { padding-left: 12px; }
    .ndc-principle-number { display: block; padding: 0 0 10px; }
    .hero.ndc-welcome .ndc-principles h2 { font-size: 13px; }
    .hero.ndc-welcome .ndc-principles p { font-size: 11px; }
    #main-content .ndc-login { display: block; min-height: 0; max-width: 510px; padding: 30px 22px; position: relative; }
    .ndc-login .login-card { max-width: none; padding: 28px 23px; position: relative; }
    .ndc-login-art { position: absolute; width: 120px; top: 21px; right: 20px; z-index: 1; pointer-events: none; }
    .ndc-login .ndc-card-brand { min-height: 55px; margin-bottom: 28px; }
    .ndc-login .login-card h1 { font-size: 39px; }
    .ndc-login .login-card .ndc-eyebrow { margin-top: 12px; }
    .ndc-login .login-footer { gap: 3px 18px; }
    #main-content .ndc-dashboard { margin-top: 24px; padding: 0 18px; }
    .ndc-dashboard .dashboard-header { padding: 25px 20px; border-radius: 14px; }
    [data-organization-theme="worktales"].ndc-dashboard .dashboard-header { padding: 24px 20px; }
    [data-organization-theme="worktales"] .worktales-orbit { width: 80px; height: 80px; top: 14px; right: 15px; opacity: .3; }
    .worktales-orbit b { inset: 25px; }
    .worktales-orbit i { inset: 7px 0; border-width: 2px; }
    .ndc-dashboard .dashboard-header h1 { font-size: 35px; position: relative; z-index: 1; }
    .ndc-dashboard .dashboard-header .ndc-eyebrow { position: relative; z-index: 1; padding-right: 45px; font-size: 10px; }
    .ndc-dashboard .dashboard-header > button { width: 100%; justify-content: center; }
    .ndc-dashboard .ndc-module-stats > div { flex-wrap: wrap; }
    [data-organization-theme="worktales"] .chapter-box-header { padding: 14px; }
    [data-organization-theme="worktales"] .topic-title > div { flex-wrap: wrap; }
    body:has([data-organization-theme="worktales"]) :is(.modules-grid, .majors-grid) { grid-template-columns: minmax(0, 1fr); padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .ndc-sculpture img, .ndc-login-art img, .ndc-login, .ndc-dashboard { animation: none !important; }
    body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) *,
    body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) *::before,
    body:has(.ndc-welcome, .ndc-login, .ndc-dashboard, [data-organization-theme]) *::after { transition: none !important; animation: none !important; }
}

/* Lecturer workspace: presentation only. Keep the original template, permission
   checks, statistics elements, data-action hooks, and upload handlers intact. */
body:has(.lecturer-dashboard-container) {
    --primary-color: #8770f5;
    --primary-hover: #9a86ff;
    --text-muted: #b3b8cf;
    background: #05091c;
    color: #f6f4ff;
    font: 400 16px/1.6 'DM Sans', sans-serif;
}
body:has(.lecturer-dashboard-container) #app { height: auto; min-height: 100svh; }
body:has(.lecturer-dashboard-container) #app > header { background: transparent; border: 0; backdrop-filter: none; }
body:has(.lecturer-dashboard-container) #navbar {
    max-width: 1320px; margin: auto; padding: 10px 5%; gap: 24px;
    background: transparent; border-bottom: 1px solid #ffffff12; backdrop-filter: none;
}
body:has(.lecturer-dashboard-container) #nav-links { align-items: center; flex-wrap: wrap; justify-content: flex-end; }
body:has(.lecturer-dashboard-container) #nav-links button {
    min-height: 44px; padding: 10px 16px; border-radius: 8px;
    font: 500 13px/1.4 'DM Sans', sans-serif; color: #b8bfd8;
}
/* Dashboard cards provide navigation; preserve the original header controls and
   their handlers, hiding only these redundant shortcuts on the workspace. */
body:has(.lecturer-dashboard-container) #nav-links :is(
    [data-action="lecturer-dashboard"], [data-action="video-upload"], [data-action="library-management"]
) { display: none; }
body:has(.lecturer-dashboard-container) #nav-links button:hover { color: #f6f4ff; background: #8770f520; }
body:has(.lecturer-dashboard-container) #app > footer {
    margin-top: 8px; padding: 9px 20px; border-top: 1px solid #ffffff12;
    background: transparent; text-align: center; color: #929bb9; font-size: 12px;
}
body:has(.lecturer-dashboard-container) :is(button, a, [data-action]):focus-visible {
    outline: 3px solid #c0b4ff; outline-offset: 4px;
}

#main-content .lecturer-dashboard-container {
    width: 100%; max-width: 1160px; margin: 0 auto; padding: 20px 32px 12px;
}
.lecturer-dashboard-container .lecturer-header {
    position: relative; min-height: 110px; padding: 0 160px 14px 0;
    margin: 0 0 16px; text-align: left; background: transparent;
    border: 0; border-bottom: 1px solid #ffffff18; backdrop-filter: none;
}
.lecturer-dashboard-container .lecturer-header::before {
    content: 'Welcome back'; display: block; margin-bottom: 6px;
    color: #bbaeff; font: 500 11px/1.6 'DM Sans', sans-serif;
    letter-spacing: .16em; text-transform: uppercase;
}
.lecturer-dashboard-container .lecturer-header::after {
    content: ''; position: absolute; width: 150px; height: 134px; top: -18px; right: 0;
    background: url('../assets/brand/ndc-glass-n.png') center / contain no-repeat;
    mask-image: radial-gradient(ellipse at center, #000 38%, transparent 73%);
    mix-blend-mode: screen; pointer-events: none;
}
.lecturer-dashboard-container .lecturer-header h1 {
    margin: 0 0 8px; color: #f9f7ff;
    font: 400 34px/1.12 'Libre Caslon Display', Georgia, serif;
    letter-spacing: -.025em; text-indent: -.25em;
}
/* Suppress the decorative leading emoji without replacing the heading text. */
.lecturer-dashboard-container .lecturer-header h1::first-letter { font-size: 0; }
.lecturer-dashboard-container .lecturer-header p {
    max-width: 530px; margin: 0; color: #aeb7d0; font: 400 14px/1.5 'DM Sans', sans-serif;
}

/* Hide only dashboard shortcuts. Retained nodes remain available to existing JS. */
.lecturer-dashboard-container .stats-grid,
.lecturer-dashboard-container .action-card[data-action="video-upload"] { display: none; }

.lecturer-dashboard-container .action-cards {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px;
}
.lecturer-dashboard-container .action-card {
    --workspace-icon-color: #c2b4ff;
    position: relative; min-width: 0; min-height: 136px; padding: 18px 22px;
    border: 1px solid #929acc30; border-radius: 16px;
    background: linear-gradient(125deg, #171d3a, #0e142d);
    box-shadow: inset 0 1px 0 #ffffff04; text-align: left; cursor: pointer;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.lecturer-dashboard-container .action-card::after {
    content: '↗' / ''; position: absolute; top: 18px; right: 20px;
    display: grid; place-items: center; width: 28px; height: 28px;
    border: 1px solid #aab0d42b; border-radius: 50%;
    color: #aaaed0; font: 400 18px/1 'DM Sans', sans-serif;
    transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.lecturer-dashboard-container .action-card:hover {
    transform: translateY(-3px); border-color: #b09aff80;
    background: linear-gradient(125deg, #202346, #141a37);
    box-shadow: 0 14px 32px #00000024;
}
.lecturer-dashboard-container .action-card:hover::after {
    color: #f1ebff; border-color: #b09aff80; background: #8770f52b;
}
.lecturer-dashboard-container .action-icon {
    display: grid; place-items: center; width: 36px; height: 36px;
    margin: 0 0 10px; border: 1px solid #b7a4ff2e; border-radius: 12px;
    background: #a48aff12; color: var(--workspace-icon-color); font-size: 0;
}
.lecturer-dashboard-container .action-icon::before {
    content: ''; display: block; width: 20px; height: 20px;
    background: currentColor; mask: var(--workspace-icon) center / contain no-repeat;
}
.lecturer-dashboard-container .action-card h3 {
    margin: 0 36px 4px 0; color: #f1effa;
    font: 500 16px/1.4 'DM Sans', sans-serif; letter-spacing: -.025em;
}
.lecturer-dashboard-container .action-card p {
    margin: 0; max-width: 410px; color: #aab3ce; font: 400 13px/1.5 'DM Sans', sans-serif;
}
.lecturer-dashboard-container [data-action="content-manager"] {
    border-color: #a58aff57; background: linear-gradient(125deg, #252044, #15172f);
    --workspace-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='M8 3v18M12 8h4M12 12h4M12 16h2'/%3E%3C/svg%3E");
}
.lecturer-dashboard-container [data-action="student-reports"] {
    --workspace-icon-color: #b2c8fb;
    --workspace-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 3v17h17M9 16v-5M14 16V7M19 16v-3'/%3E%3C/svg%3E");
}
.lecturer-dashboard-container [data-action="student-manager"] {
    --workspace-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 21v-2a6 6 0 0 1 12 0v2M16 5a3 3 0 0 1 0 6M21 21v-2a6 6 0 0 0-3-5.2'/%3E%3C/svg%3E");
}
.lecturer-dashboard-container [data-action="library-management"] {
    --workspace-icon-color: #b2c8fb;
    --workspace-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18a4 4 0 1 1 .2-8A6 6 0 0 1 18 8.5 4.8 4.8 0 0 1 18 18H6Z'/%3E%3C/svg%3E");
}
.lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"]) {
    --workspace-icon-color: #aeb7d0;
    --workspace-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m-4-4 4 4 4-4M4 15v5a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-5'/%3E%3C/svg%3E");
    display: grid; grid-template-columns: 32px minmax(0, 1fr); align-content: center;
    gap: 4px 12px; min-height: 78px; margin-top: 4px; padding: 12px 44px 12px 18px;
    border-radius: 12px; background: #0c1228; border-color: #929acc26;
}
.lecturer-dashboard-container .action-card[data-action="export-course"] { grid-column: 1; }
.lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"]) .action-icon {
    grid-row: 1 / span 2; align-self: center; width: 32px; height: 32px;
    margin: 0; border-color: #a5add51f; background: #ffffff04; border-radius: 10px;
}
.lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"]) h3 {
    margin: 0; font-size: 14px; line-height: 1.4; letter-spacing: 0;
}
.lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"]) p {
    grid-column: 2; font-size: 12px; line-height: 1.6;
}
.lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"])::after {
    content: '↓' / ''; top: 50%; right: 18px; width: 24px; height: 24px;
    margin-top: -12px; border: 0; border-radius: 6px; font-size: 19px;
}
.lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"]):hover {
    border-color: #b09aff70; background: #151b35;
}

@media (max-width: 760px) {
    body:has(.lecturer-dashboard-container) #navbar { padding: 10px 24px; gap: 14px; flex-wrap: wrap; }
    body:has(.lecturer-dashboard-container) #nav-links { gap: 5px !important; }
    body:has(.lecturer-dashboard-container) #nav-links button { padding: 10px 12px; font-size: 12px; }
    #main-content .lecturer-dashboard-container { padding: 20px 24px 12px; }
    .lecturer-dashboard-container .lecturer-header { padding-right: 130px; min-height: 110px; }
    .lecturer-dashboard-container .lecturer-header::after { width: 130px; height: 126px; right: -8px; top: -12px; }
    .lecturer-dashboard-container .lecturer-header h1 { font-size: 32px; }
    .lecturer-dashboard-container .action-card { padding: 18px 20px; }
    .lecturer-dashboard-container .action-card h3 { font-size: 16px; margin-right: 0; }
    .lecturer-dashboard-container .action-card p { font-size: 13px; }
}
@media (max-width: 560px) {
    body:has(.lecturer-dashboard-container) #nav-links { width: auto; justify-content: flex-end; }
    body:has(.lecturer-dashboard-container) #nav-links button { padding: 10px; font-size: 11px; }
    #main-content .lecturer-dashboard-container { padding: 20px 20px 12px; }
    .lecturer-dashboard-container .lecturer-header { min-height: 0; margin-bottom: 16px; padding: 0 0 16px; }
    .lecturer-dashboard-container .lecturer-header::before { margin-bottom: 12px; }
    .lecturer-dashboard-container .lecturer-header::after { width: 85px; height: 85px; right: -6px; top: -24px; }
    .lecturer-dashboard-container .lecturer-header h1 { font-size: 30px; }
    .lecturer-dashboard-container .lecturer-header p { font-size: 14px; }
    .lecturer-dashboard-container .action-cards { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .lecturer-dashboard-container .action-card { min-height: 136px; padding: 18px 20px; }
    .lecturer-dashboard-container .action-icon { margin-bottom: 10px; }
    .lecturer-dashboard-container .action-card h3 { font-size: 16px; }
    .lecturer-dashboard-container .action-card:is([data-action="export-course"], [data-action="export-students"]) {
        padding: 12px 40px 12px 16px; gap: 4px 12px; min-height: 78px;
    }
    .lecturer-dashboard-container .action-card[data-action="export-students"] { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .lecturer-dashboard-container,
    .lecturer-dashboard-container *,
    .lecturer-dashboard-container *::before,
    .lecturer-dashboard-container *::after { animation: none !important; transition: none !important; }
    .lecturer-dashboard-container .action-card:hover { transform: none; }
}

/* Content Manager: shared lecturer theme, presentation only. Existing template
   nodes, permissions, action handlers, plan states and persistence stay intact. */
body:has(.content-manager-container) {
    --primary-color: #9984f7;
    --primary-hover: #ac9bff;
    --bg-card: #111831;
    --bg-accent: #161e38;
    --text-primary: #f1effa;
    --text-muted: #aab4ce;
    --glass-border: #9ca8d229;
    background: #05091c;
    color: var(--text-primary);
    font: 400 14px/1.5 'DM Sans', sans-serif;
}
body:has(.content-manager-container) #app { height: auto; min-height: 100svh; }
body:has(.content-manager-container) #app > header {
    background: transparent; border: 0; backdrop-filter: none;
}
body:has(.content-manager-container) #navbar {
    --cm-control-height: 38px;
    --cm-control-radius: 8px;
    --cm-control-surface: #10162b;
    --cm-control-border: #929acc30;
    max-width: 1320px; margin: auto; padding: 10px 5%; gap: 24px;
    background: transparent; border-bottom: 1px solid #ffffff12; backdrop-filter: none;
}
body:has(.content-manager-container) #nav-links {
    flex: 1; min-width: 0; align-items: center; flex-wrap: nowrap; justify-content: flex-end; gap: 10px !important;
}
body:has(.content-manager-container) #app > footer {
    padding: 12px 24px 76px; border-top: 1px solid #ffffff12;
    background: transparent; text-align: center; color: #929bb9; font-size: 12px;
}
body:has(.content-manager-container) :is(button, a, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid #c0b4ff; outline-offset: 3px;
}
#main-content .content-manager-container {
    width: 100%; max-width: 1160px; margin: 0 auto; padding: 24px 32px 32px;
}
.content-manager-container .content-manager-header {
    display: block; margin: 0 0 14px; padding: 0 0 18px;
    background: transparent; border: 0; border-bottom: 1px solid var(--glass-border);
    backdrop-filter: none;
}
.content-manager-container .header-content { margin-bottom: 22px; }
.content-manager-container .content-manager-header:not(:has(> .header-actions)) .header-content { margin-bottom: 0; }
.content-manager-container .header-content::before {
    content: 'Lecturer workspace'; display: block; margin-bottom: 6px;
    color: #bbaeff; font: 500 10px/1.6 'DM Sans', sans-serif;
    letter-spacing: .16em; text-transform: uppercase;
}
.content-manager-container .header-content h1 {
    margin: 0 0 6px; color: #f9f7ff;
    font: 400 34px/1.12 'Libre Caslon Display', Georgia, serif;
    letter-spacing: -.025em; text-indent: -.25em;
}
.content-manager-container .header-content h1::first-letter { font-size: 0; }
.content-manager-container .header-content p { margin: 0; font: 400 14px/1.5 'DM Sans', sans-serif; }
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools) {
    display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
body:has(.content-manager-container) #navbar .cm-header-tools {
    flex: 0 1 auto; min-width: 0; flex-wrap: nowrap;
    padding-right: 16px; margin-right: 4px; border-right: 1px solid #929acc26;
}
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools, body:has(.content-manager-container) #nav-links) > button {
    position: relative; display: block; flex: 0 0 auto;
    height: var(--cm-control-height, 38px); min-height: var(--cm-control-height, 38px);
    padding: 8px 12px 8px 34px; margin: 0 !important;
    background: var(--cm-control-surface, #10162b) !important; border: 1px solid var(--cm-control-border, #929acc30) !important;
    border-radius: var(--cm-control-radius, 8px); color: #c3c8df !important;
    font: 500 12px/1.5 'DM Sans', sans-serif; white-space: nowrap;
    box-shadow: inset 0 1px 0 #ffffff04; transition: background .18s ease, border-color .18s ease, color .18s ease;
}
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools) > button::first-letter,
body:has(.content-manager-container) #nav-links > [data-action="lecturer-dashboard"]::first-letter { font-size: 0; }
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools, body:has(.content-manager-container) #nav-links) > button::before {
    content: ''; position: absolute; left: 12px; top: 50%; width: 14px; height: 14px;
    transform: translateY(-50%); background: #afa9cb;
    mask: var(--cm-nav-icon) center / contain no-repeat; pointer-events: none;
}
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools, body:has(.content-manager-container) #nav-links) > button:hover {
    transform: none; background: #1b213b !important; border-color: #a994f76b !important; color: #f1effa !important;
}
body:has(.content-manager-container) #nav-links [onclick="window.switchToRecycleBin()"] {
    --cm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M9 6V3h6v3M5 6l1 15h12l1-15M10 10v7M14 10v7'/%3E%3C/svg%3E");
}
body:has(.content-manager-container) #nav-links [onclick="window.toggleDraftsPanel()"] {
    --cm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H5v18h14V8l-5-5Zm0 0v5h5M9 12h6M9 16h4'/%3E%3C/svg%3E");
}
body:has(.content-manager-container) #nav-links [onclick="window.switchToResourceManager()"] {
    --cm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8V5h6l2 3h10v12H3V8Z'/%3E%3C/svg%3E");
}
body:has(.content-manager-container) #nav-links > [data-action="lecturer-dashboard"] {
    --cm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12H4m7-7-7 7 7 7'/%3E%3C/svg%3E");
}
body:has(.content-manager-container) #nav-links > [data-action="logout"] {
    --cm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 4H4v16h6M9 12h12m-5-5 5 5-5 5'/%3E%3C/svg%3E");
}
body:has(.content-manager-container .resource-manager-view) #nav-links .cm-header-tools > [onclick="window.switchToResourceManager()"],
body:has(.content-manager-container):has(.drafts-panel-overlay.active) #nav-links [onclick="window.toggleDraftsPanel()"] {
    background: #28213f !important; border-color: #ac97f770 !important; color: #e7ddff !important;
}
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools) > button[onclick="window.openJsonConverterTool()"] { display: none; }
/* Hide the header search visually while retaining its input and handlers. */
:is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools) > .search-container { display: none; }
:is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .search-container {
    flex: 0 1 200px; width: 200px; min-width: 170px; height: var(--cm-control-height, 38px);
    min-height: var(--cm-control-height, 38px); margin-left: 4px;
    padding: 0 4px 0 12px; background: var(--cm-control-surface, #10162b);
    border: 1px solid var(--cm-control-border, #929acc30); border-radius: var(--cm-control-radius, 8px);
}
:is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .search-container:focus-within { border-color: #a994f7; box-shadow: 0 0 0 3px #a994f714; transform: none; }
:is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .search-input { padding: 9px 0; font: 400 12px/1.5 'DM Sans', sans-serif; min-width: 0; }
:is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .search-input::placeholder { color: #8e9ab9; }
:is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .btn-search { min-width: 32px; min-height: 32px; padding: 0; font-size: 0; display: grid; place-items: center; }
body:has(.content-manager-container) #navbar .cm-header-tools .btn-search-clear {
    flex: 0 0 24px; width: 24px; height: 24px; margin: 0; padding: 0; border-radius: 5px; font-size: 12px;
}
:is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .btn-search::before {
    content: ''; width: 16px; height: 16px; background: #aab4ce;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m16 16 5 5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.content-manager-container .breadcrumb-nav {
    gap: 0 8px; min-height: 32px; margin: 0 0 20px; padding: 0;
    background: transparent; border: 0; border-radius: 0;
}
.content-manager-container .breadcrumb-item { padding: 5px 0; font: 400 12px/1.5 'DM Sans', sans-serif; overflow-wrap: anywhere; }
.content-manager-container .breadcrumb-item.active { color: #d1c7ff; font-weight: 500; }
.content-manager-container .breadcrumb-item.clickable:hover { background: transparent; color: #e8e0ff; text-decoration: underline; text-underline-offset: 4px; }
.content-manager-container .content-manager-layout { gap: 22px; }
.content-manager-container .content-level { margin-bottom: 12px; }
.content-manager-container .level-header { gap: 16px; margin: 0 0 16px; flex-direction: row; align-items: center; flex-wrap: wrap; }
.content-manager-container .level-header h2 {
    margin: 0; color: #f1effa; font: 500 18px/1.4 'DM Sans', sans-serif; letter-spacing: -.02em;
}
.content-manager-container .level-header > .btn-primary,
.content-manager-container .resource-manager-view .manager-header .btn-primary {
    min-height: 38px; padding: 9px 14px !important; border: 1px solid #b5a5ff55;
    border-radius: 8px; background: #7962cd; box-shadow: inset 0 1px 0 #ffffff17;
    font: 500 12px/1.5 'DM Sans', sans-serif; color: #fff;
}
.content-manager-container .level-header > .btn-primary:hover,
.content-manager-container .resource-manager-view .manager-header .btn-primary:hover { background: #8a73de; transform: none; }
.content-manager-container .content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.content-manager-container .content-grid > .content-item {
    min-width: 0; min-height: 162px; display: flex; flex-direction: column;
    padding: 20px; background: linear-gradient(125deg, #171d3a, #0e142d);
    border: 1px solid #929acc30; border-radius: 14px; box-shadow: inset 0 1px 0 #ffffff04;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.content-manager-container .content-grid > .content-item:not(.scope-disabled):hover {
    transform: translateY(-2px); border-color: #b09aff70;
    background: linear-gradient(125deg, #202346, #141a37); box-shadow: none;
}
.content-manager-container .content-grid > .scope-disabled { background: #10162a; border-color: #8893b41f; }
.content-manager-container .card-header { gap: 12px; margin: 0 0 12px; align-items: center; flex-wrap: wrap; }
.content-manager-container .card-header::before {
    content: ''; flex: 0 0 32px; height: 32px; background-color: #bcaeff;
    mask: var(--cm-card-icon) center / 26px 26px no-repeat;
}
.content-manager-container .university-card {
    --cm-card-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 9 9-6 9 6H3Zm2 3v7m5-7v7m4-7v7m5-7v7M3 21h18'/%3E%3C/svg%3E");
}
.content-manager-container .major-card {
    --cm-card-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5C9 3 5 3 3 4v15c3-1 6-1 9 1 3-2 6-2 9-1V4c-2-1-6-1-9 1Zm0 0v15'/%3E%3C/svg%3E");
}
.content-manager-container .module-card {
    --cm-card-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='M8 3v18M12 8h4M12 12h4M12 16h2'/%3E%3C/svg%3E");
}
.content-manager-container .card-header h3 {
    min-width: 100px; color: #efedf9; font: 500 16px/1.4 'DM Sans', sans-serif;
    letter-spacing: -.02em; overflow-wrap: anywhere;
}
.content-manager-container .card-actions { gap: 6px; flex-wrap: wrap; }
.content-manager-container .card-description { margin: 0; color: #aab4ce; font: 400 13px/1.5 'DM Sans', sans-serif; overflow-wrap: anywhere; }
.content-manager-container .card-stats {
    gap: 18px; flex-wrap: wrap; margin-top: auto; padding-top: 13px;
    border-top: 1px solid #929acc20; color: #a1acc8; font: 400 12px/1.5 'DM Sans', sans-serif;
}
.content-manager-container .card-description + .card-stats { margin-top: 18px; }
.content-manager-container .context-trigger {
    width: 32px; height: 32px; padding: 0; border: 1px solid #929acc24; border-radius: 8px;
    background: #ffffff04; color: #b5bfdb; font-size: 19px; box-shadow: none;
}
.content-manager-container .context-trigger:hover { background: #a28ce91a; border-color: #b09aff70; color: #efe9ff; }
.content-manager-container :is(.btn-plan-generate, .btn-survey-config, .btn-approve-objectives) {
    min-height: 30px; padding: 6px 9px; border-radius: 7px;
    font-family: 'DM Sans', sans-serif; font-size: 11px; line-height: 1.4; white-space: nowrap;
}
/* Hierarchy panels retain their collapsed, draft, approval and drag/drop states. */
.content-manager-container .expansion-controls { margin: 0 0 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.content-manager-container .btn-control-small {
    padding: 6px 9px; background: #11172d; border: 1px solid var(--glass-border);
    border-radius: 7px; color: #aeb8d2; font: 400 11px/1.5 'DM Sans', sans-serif;
}
.content-manager-container .chapters-container { gap: 14px; }
.content-manager-container .chapter-box {
    padding: 0; border-radius: 12px; background: #0d142a; cursor: default;
}
.content-manager-container .chapter-box:hover { transform: none; box-shadow: none; border-color: #929acc40; }
.content-manager-container .chapter-header {
    padding: 16px 18px; gap: 12px; background: linear-gradient(120deg, #181d38, #11182f);
}
.content-manager-container .chapter-header > div:first-child { min-width: 0; gap: 12px; }
.content-manager-container .chapter-header h3 { font: 500 15px/1.5 'DM Sans', sans-serif; color: #e8e4f8; overflow-wrap: anywhere; }
.content-manager-container .chapter-header .card-actions { flex-shrink: 0; flex-wrap: nowrap; }
.content-manager-container .chapter-content { padding: 14px 18px; }
.content-manager-container .topic-section { margin: 0 0 12px; padding: 0 0 12px; border-bottom: 1px solid #929acc1c; }
.content-manager-container .topic-header { gap: 14px; margin-bottom: 10px; flex-wrap: wrap; }
.content-manager-container .topic-title { border-left: 2px solid #a18cda; padding-left: 10px; color: #c9c5e4; font: 500 13px/1.5 'DM Sans', sans-serif; overflow-wrap: anywhere; }
.content-manager-container .topic-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.content-manager-container .video-list { gap: 6px; }
.content-manager-container .video-item { padding: 10px 12px; gap: 12px; border-radius: 8px; background: #141c34; }
.content-manager-container .video-item:hover { transform: none; background: #1c2542; box-shadow: none; }
.content-manager-container .video-item.video-item-draft { border-style: dashed; border-color: #f59e0b66; background: #f59e0b0a; }
.content-manager-container .video-info { min-width: 0; }
.content-manager-container .video-title { font: 500 13px/1.5 'DM Sans', sans-serif; overflow-wrap: anywhere; }
.content-manager-container .video-meta { font: 400 11px/1.5 'DM Sans', sans-serif; }
.content-manager-container .video-item-actions { opacity: 1; display: flex; gap: 4px; flex-shrink: 0; }
.content-manager-container .btn-icon-small { min-width: 30px; min-height: 30px; background: #ffffff04; border-color: #929acc20; border-radius: 7px; }
.content-manager-container .btn-add-topic { margin-top: 2px; padding: 10px; font: 500 12px/1.5 'DM Sans', sans-serif; border-radius: 8px; }
.content-manager-container .empty-state { padding: 36px 20px; font: 400 13px/1.6 'DM Sans', sans-serif; }
.content-manager-container .search-panel { width: 290px; border-radius: 12px; background: #111831; }
.content-manager-container .search-panel h3 { font: 500 15px/1.4 'DM Sans', sans-serif; }
.content-manager-container .search-result-item { font-size: 12px; }
.content-manager-container .result-title { font: 500 13px/1.5 'DM Sans', sans-serif; }
.content-manager-container .result-path { font: 400 11px/1.5 'DM Sans', sans-serif; }
/* The resource library keeps every filter and action; its toolbar wraps instead
   of squeezing the title and uploads onto one line. */
.content-manager-container .resource-manager-view .manager-header { display: block !important; margin-bottom: 18px !important; }
.content-manager-container .resource-manager-view .manager-header > div:last-child { margin-top: 16px; gap: 8px !important; flex-wrap: wrap; }
.content-manager-container .resource-manager-view .manager-header h2 {
    background: none; -webkit-text-fill-color: #efedf9;
    font: 500 18px/1.4 'DM Sans', sans-serif; color: #efedf9;
}
.content-manager-container .resource-manager-view .manager-header .btn-secondary {
    min-height: 38px; padding: 8px 12px !important; border-radius: 8px;
    background: #141b32 !important; color: #c3c8df !important; border: 1px solid var(--glass-border) !important;
    font: 500 12px/1.5 'DM Sans', sans-serif;
}
.content-manager-container .resource-filters-bar { padding: 12px !important; border-radius: 10px !important; background: #0c1329 !important; gap: 8px !important; }
.content-manager-container .resource-filters-bar :is(button, input) { font-family: 'DM Sans', sans-serif; font-size: 12px !important; }
.content-manager-container .resource-table-container { overflow-x: auto !important; border-radius: 12px !important; }
.content-manager-container .resource-table-container table { min-width: 720px; }
.content-manager-container .resource-table-container :is(th, td) { font-family: 'DM Sans', sans-serif; }
.content-manager-container .resource-table-container .btn-icon {
    display: inline-grid; place-items: center; width: 30px; height: 30px; padding: 0;
    border: 1px solid #929acc29; border-radius: 7px; background: #a28ce90a;
    color: #c5bddf; font-size: 13px; cursor: pointer;
}
.content-manager-container .resource-table-container .btn-icon:not(:disabled):hover { background: #a28ce927; border-color: #b09aff70; }
.content-manager-container .resource-table-container .btn-icon:disabled { cursor: not-allowed; }
.content-manager-container .resource-row-hover:hover { transform: none; background: #a28ce90a; }
.content-manager-container .bulk-actions-bar { flex-wrap: wrap; gap: 12px; }
.content-manager-container .bulk-actions-bar > div { flex-wrap: wrap; }
/* Supporting panels and the existing status toolbar use the same surfaces. */
body:has(.content-manager-container) .floating-toolbar {
    right: 20px; bottom: 14px; left: auto; gap: 10px; padding: 7px 9px;
    border-radius: 10px; background: #10172dee; border-color: #929acc30; box-shadow: 0 6px 24px #0003;
}
body:has(.content-manager-container) .floating-toolbar .toolbar-btn { padding: 7px 10px; border-radius: 7px; font: 500 11px/1.5 'DM Sans', sans-serif; }
body:has(.content-manager-container) .floating-toolbar .draft-status { font: 500 11px/1.5 'DM Sans', sans-serif; border-radius: 6px; }
body:has(.content-manager-container) .drafts-panel { background: #0d142a; border-left: 1px solid #929acc30; font-family: 'DM Sans', sans-serif; }
body:has(.content-manager-container) .drafts-panel-header { background: #111831; padding: 20px; }
body:has(.content-manager-container) .drafts-panel-header h2 { font: 500 18px/1.4 'DM Sans', sans-serif; }
body:has(.content-manager-container) .draft-card { background: #161d35; border-color: #929acc30; border-radius: 10px; }
body:has(.content-manager-container) .draft-title { font: 500 14px/1.5 'DM Sans', sans-serif; }
body:has(.content-manager-container) .draft-meta { font-size: 12px; }
body:has(.content-manager-container) .draft-btn { font: 500 12px/1.5 'DM Sans', sans-serif; }
body:has(.content-manager-container) .draft-actions { flex-wrap: wrap; }
.content-manager-container .recycle-bin-container { padding: 0; }
.content-manager-container .recycle-bin-container .view-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-bottom: 20px; }
.content-manager-container .recycle-bin-container .header-main { display: flex; align-items: flex-start; flex-direction: column; gap: 16px; }
.content-manager-container .recycle-bin-container h2 { font: 400 30px/1.2 'Libre Caslon Display', Georgia, serif; }
.content-manager-container .trash-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.content-manager-container .trash-item-card { background: #111831; border-radius: 12px; }
.content-manager-container .trash-item-card .item-title { font: 500 15px/1.5 'DM Sans', sans-serif; }
body:has(.content-manager-container) .context-menu { background: #151c34; border-color: #929acc40; border-radius: 10px; }
body:has(.content-manager-container) .context-menu-item { font: 400 13px/1.5 'DM Sans', sans-serif; padding: 10px 14px; }
body:has(.content-manager-container) :is(.modal-input, .modal-textarea) { font: 400 14px/1.5 'DM Sans', sans-serif; }
@media (max-width: 1100px) {
    body:has(.content-manager-container) #navbar {
        display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px 10px;
    }
    body:has(.content-manager-container) #nav-links { display: contents !important; }
    body:has(.content-manager-container) #nav-links > [data-action="lecturer-dashboard"] { grid-column: 2; grid-row: 1; }
    body:has(.content-manager-container) #nav-links > [data-action="logout"] { grid-column: 3; grid-row: 1; }
    body:has(.content-manager-container) #navbar .cm-header-tools { grid-column: 1 / -1; grid-row: 2; padding-right: 0; margin-right: 0; border-right: 0; }
    body:has(.content-manager-container) #navbar .cm-header-tools .search-container { margin-left: auto; }
}
@media (max-width: 1000px) {
    .content-manager-container.has-active-search .content-grid { grid-template-columns: minmax(0, 1fr); }
    .content-manager-container .chapter-header { flex-wrap: wrap; }
    .content-manager-container .chapter-header .card-actions { margin-left: auto; }
}
@media (max-width: 760px) {
    body:has(.content-manager-container) #navbar { padding: 10px 24px; gap: 12px; flex-wrap: wrap; }
    body:has(.content-manager-container) #nav-links { gap: 4px !important; }
    #main-content .content-manager-container { padding: 20px 24px 28px; }
    .content-manager-container .header-content h1 { font-size: 32px; }
    body:has(.content-manager-container) #navbar .cm-header-tools { flex-wrap: wrap; }
    :is(.content-manager-container, body:has(.content-manager-container) #navbar .cm-header-tools) .search-container { flex-basis: 200px; margin-top: 0; }
    .content-manager-container .content-grid { grid-template-columns: minmax(0, 1fr); }
    .content-manager-container .content-manager-layout { flex-direction: column; }
    .content-manager-container :is(.main-content-area, .search-panel) { width: 100%; }
    .content-manager-container .search-panel { position: static; max-height: 400px; }
}
@media (max-width: 480px) {
    body:has(.content-manager-container) #navbar { grid-template-columns: minmax(0, 1fr) auto; padding: 10px 20px; }
    body:has(.content-manager-container) #navbar > :first-child { grid-column: 1 / -1; grid-row: 1; }
    body:has(.content-manager-container) #nav-links > [data-action="lecturer-dashboard"] { grid-column: 1; grid-row: 2; justify-self: start; }
    body:has(.content-manager-container) #nav-links > [data-action="logout"] { grid-column: 2; grid-row: 2; }
    body:has(.content-manager-container) #navbar .cm-header-tools { grid-row: 3; }
    body:has(.content-manager-container) #navbar .cm-header-tools > button { padding: 8px 10px 8px 30px; font-size: 11px; }
    body:has(.content-manager-container) #navbar .cm-header-tools > button::before { left: 10px; width: 13px; height: 13px; }
    body:has(.content-manager-container) #navbar .cm-header-tools .search-container { margin-left: 0; }
    #main-content .content-manager-container { padding: 20px; }
    .content-manager-container .header-content h1 { font-size: 30px; }
    :is(.content-manager-container .header-actions, body:has(.content-manager-container) #navbar .cm-header-tools) > button { flex: 1 1 auto; }
    .content-manager-container .level-header h2 { font-size: 17px; }
    .content-manager-container .content-grid > .content-item { padding: 16px; }
    .content-manager-container .chapter-header > div:first-child { flex-wrap: wrap; }
    .content-manager-container :is(.chapter-header, .chapter-content) { padding: 12px; }
    .content-manager-container .video-item { flex-wrap: wrap; }
    .content-manager-container .video-item-actions { margin-left: auto; }
    .content-manager-container .resource-filters-bar > div:first-child { min-width: 0 !important; flex-basis: 100% !important; }
    .content-manager-container .resource-manager-view .manager-header h2 { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
    .content-manager-container, .content-manager-container *,
    body:has(.content-manager-container) .floating-toolbar { animation: none !important; transition: none !important; }
    .content-manager-container .content-grid > .content-item:hover { transform: none; }
}
