:root { font-family: "Segoe UI", Arial, sans-serif; color: #30283d; background: #f7f1e9; font-synthesis: none; --accent: #7844b5; --border: #dfd6e5; }
* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh; padding: 32px 16px; font-size: 15px;
  background: radial-gradient(circle at 12% 15%, #e7d8f1 0, transparent 40%), radial-gradient(circle at 88% 80%, #f5dfbc 0, transparent 40%), #f7f1e9;
}
.card { max-width: 480px; margin: 0 auto; overflow: hidden; background: #fff; border: 1px solid #ffffff; border-radius: 24px; box-shadow: 0 24px 65px #40294c22, 0 4px 12px #40294c0a; }
.card-header { position: relative; isolation: isolate; overflow: hidden; padding: 23px 28px 21px; text-align: center; color: white; background: linear-gradient(120deg, #2b213b, #503663); }
.card-header::before, .card-header::after { content: ""; position: absolute; z-index: -1; width: 210px; height: 210px; border: 1px solid #ffffff14; border-radius: 50%; pointer-events: none; }
.card-header::before { top: -125px; right: -30px; box-shadow: 0 0 0 26px #ffffff04, 0 0 0 52px #ffffff04; }
.card-header::after { bottom: -180px; left: -50px; width: 280px; height: 280px; background: #d69eff10; }
.presentation-icon { width: 44px; height: 44px; display: grid; place-items: center; margin: 0 auto 11px; border: 1px solid #e3bcff55; border-radius: 13px; background: #e2b6ff18; color: #f2ceff; }
.presentation-icon svg { width: 29px; height: 29px; }
h1 { margin: 0; font-size: 26px; font-weight: 700; letter-spacing: -.6px; }
#className { margin: 7px 0 0; color: #ddd0e7; font-size: 12px; line-height: 1.5; }
form { padding: 25px 30px 29px; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
label { display: flex; align-items: center; gap: 8px; margin: 17px 0 8px; color: #4d3c59; font-size: 13px; font-weight: 650; }
label svg { width: 16px; height: 16px; flex-shrink: 0; fill: none; stroke: #9164a8; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
label:has(+ select:focus-visible), label:has(+ input:focus-visible) { color: #7844b5; }
fieldset label:first-child { margin-top: 0; }
select, input, button { width: 100%; min-height: 47px; border: 1px solid var(--border); border-radius: 10px; font: inherit; transition: border-color .18s, box-shadow .18s, background-color .18s, transform .18s; }
select { appearance: none; padding: 11px 42px 11px 14px; background: #faf7fc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238666a0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center; color: #51415e; font-size: 14px; cursor: pointer; }
select:disabled { background-color: #f2eff3; color: #968c9c; cursor: default; }
select:required:valid:not(:disabled) { background-color: #f5edfc; border-color: #c9aedf; color: #64378a; box-shadow: inset 3px 0 #9561ba; }
input[type=file] { padding: 10px; border: 1px dashed #c7aad9; background: #fcf6eb; color: #75647f; font-size: 12px; }
input::file-selector-button { padding: 9px 12px; margin-right: 10px; border: 0; border-radius: 6px; background: #eddcf8; color: #653988; font: 600 12px "Segoe UI", Arial, sans-serif; cursor: pointer; }
button { margin-top: 24px; padding: 14px; border: 0; background: linear-gradient(105deg, #7542ad, #7542ad); box-shadow: 0 6px 15px #7542ad33; color: white; font-size: 15px; font-weight: 650; cursor: pointer; }
button::before { content: ""; display: inline-block; vertical-align: -3px; width: 18px; height: 18px; margin-right: 9px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V3m-5 5 5-5 5 5M4 15v5h16v-5'/%3E%3C/svg%3E") center / contain no-repeat; }
fieldset:disabled button::before { background: none; border: 2px solid #ffffff66; border-top-color: #fff; border-radius: 50%; animation: spin .9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
button:disabled { background: #aa9db4; box-shadow: none; cursor: wait; }
select:focus-visible, input:focus-visible, button:focus-visible { outline: 3px solid #d4b5eb; outline-offset: 3px; border-color: #9365b7; }
#status { margin-top: 16px; padding: 12px; border-radius: 9px; font-size: 13px; line-height: 1.5; }
#status:empty { display: none; }
.error { color: #b33b42; background: #fff0f1; }
.success { color: #237548; background: #ecf8f0; }
.info { color: #653988; background: #f5edfc; }
progress { width: 100%; height: 7px; margin-top: 18px; accent-color: var(--accent); }
.preview { margin: 0; padding: 8px 16px; background: #fff8e8; color: #8a661c; font-size: 11px; text-align: center; }
.preview-copy { padding: 24px; line-height: 1.6; }
[hidden] { display: none !important; }
@media (hover: hover) {
  select:not(:disabled):hover, input:not(:disabled):hover { border-color: #b894d0; }
  input:not(:disabled)::file-selector-button:hover { background: #e1caf2; }
  button:not(:disabled):hover { transform: translateY(-1px); box-shadow: 0 9px 20px #7542ad44; filter: brightness(1.07); }
}
button:not(:disabled):active { transform: translateY(0); box-shadow: 0 2px 6px #7542ad33; }
@media (max-width: 520px) { body { padding: 18px 14px; } .card { border-radius: 20px; } .card-header { padding: 21px 22px; } form { padding: 23px 22px; } h1 { font-size: 24px; } select { font-size: 16px; } }
@media (prefers-reduced-motion: reduce) { select, input, button { transition: none; } button:not(:disabled):hover { transform: none; } fieldset:disabled button::before { animation: none; } }
@media (forced-colors: active) { select { appearance: auto; background-image: none; } button { border: 1px solid ButtonText; } .card { border: 1px solid CanvasText; } }
.page-nav { display: flex; gap: 12px; margin: 0 30px 24px; padding-top: 18px; border-top: 1px solid #e9e0ed; }
.page-nav a { flex: 1; padding: 11px 12px; border: 1px solid #dfd6e5; border-radius: 9px; background: #faf7fc; text-align: center; text-decoration: none; color: #704295; font-size: 12px; font-weight: 600; }
.page-nav a:hover { background: #f1e6f8; border-color: #c7aad9; }
.page-nav a:focus-visible { outline: 3px solid #d4b5eb; outline-offset: 3px; }
input[type=password] { padding: 12px; background: #faf7fc; }
#unlock::before { display: none; }
@media (max-width: 520px) { .page-nav { margin-right: 22px; margin-left: 22px; } }
.team-section { margin-top: 19px; padding: 15px; border: 1px solid #e1cfe9; border-radius: 11px; background: #faf4fd; }
.team-section > label:first-child { margin-top: 0; }
.team-section select { background-color: #fff; }
.team-section label { font-size: 12px; }
.notes-section { margin-top: 22px; padding-top: 18px; border-top: 1px solid #e9e0ed; }
.payment-section { margin: 16px 0 20px; padding: 14px; border: 1px solid #e1cfe9; border-radius: 11px; background: #faf4fd; }
.payment-section h2 { margin: 0; color: #4d3c59; font-size: 15px; }
.payment-section p { margin: 7px 0 0; color: #75647f; font-size: 12px; line-height: 1.5; }
.payment-section button { margin-top: 10px; }
.payment-section button::before { display: none; }
.notes-section h2 { margin: 0; color: #4d3c59; font-size: 18px; }
.notes-help, .notes-status { color: #75647f; font-size: 12px; line-height: 1.5; }
.notes-help { margin: 6px 0 13px; }
.notes-section label { margin-top: 14px; }
.notes-section button { margin-top: 11px; }
.notes-section button::before { display: none; }
.notes-status { min-height: 1em; margin: 8px 0 0; }

/* Subtle paper grain for the existing PPT submission page only. */
body:has(#submissionForm)::before {
  position: fixed;
  z-index: 20;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)' opacity='.22'/%3E%3C/svg%3E");
}
.topic-schedule{grid-column:1/-1;margin:5px 0 8px;padding:16px 17px;border:1px solid #dce7f1;border-radius:12px;background:#f6faff}.topic-schedule h2{margin:0 0 6px;color:#284763;font-size:16px}.topic-schedule p{margin:0 0 11px;color:#5e6d7b;font-size:13px;line-height:1.5}.topic-schedule label{display:grid;gap:7px;color:#344e66;font-weight:650}.topic-schedule select{width:100%;min-height:43px;padding:10px 12px;border:1px solid #cddbe8;border-radius:9px;background:#fff;color:#33495e;font:inherit}.topic-schedule button{margin-top:10px}.assigned-topic{margin:10px 0 0;padding:12px 14px;border-radius:9px;background:#fff;color:#284763;font-weight:750}.assigned-topic span{display:block;margin-bottom:4px;color:#637b91;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.topic-document-link{display:inline-block;margin:0 0 10px;color:#245d91;font-weight:700;text-decoration:underline}

/* Student workspace: notes, topic allocation, and PPT submission are separate views. */
.student-workspace { max-width: 920px; }
.student-identity { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,340px); align-items:center; gap:20px; padding:16px 34px; border-bottom:1px solid #e5edf3; background:#f7fbff; }
.student-logo { display:block; width:135px; height:92px; object-fit:contain; margin:0 auto 12px; background:#fff; }
.workspace-cards-vertical { grid-template-columns:1fr; max-width:620px; margin:0 auto; }
.workspace-cards-vertical .workspace-card { text-decoration:none; }
.student-home-page .student-identity, .student-home-page #submissionView, .student-home-page #notesView, .student-home-page #scheduleView { display:none !important; }
.student-home-page .home-only-nav { display:flex; }
.home-only-nav { max-width:560px; margin-left:auto; margin-right:auto; }
.notes-dashboard-link { display:inline-block; margin:18px 0 0; color:#075d9c; font-size:13px; font-weight:750; text-decoration:underline; }
.workspace-card { cursor:pointer; }
.notes-choice-cards { gap:24px; }
.notes-choice-cards .workspace-card { min-height:150px; }
.page-nav.staff-nav { justify-content:space-between; max-width:820px; gap:36px; }
.page-nav.staff-nav a { flex:0 1 220px; }
.student-identity strong { color:#164b79; font-size:13px; }
.student-identity p { margin:4px 0 0; color:#5e7183; font-size:12px; line-height:1.45; }
.student-identity select { background-color:#fff; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.student-view { padding:25px 34px 30px; }
.student-view-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin:0 0 20px; }
.student-view-heading h2 { margin:0; color:#164b79; font-size:22px; line-height:1.25; }
.student-view-heading p:not(.workspace-eyebrow) { margin:7px 0 0; color:#5e7183; font-size:13px; line-height:1.5; }
.workspace-eyebrow { margin:0 0 6px; color:#1684c8; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.workspace-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.workspace-card { display:flex; flex-direction:column; align-items:flex-start; gap:10px; min-height:208px; margin:0; padding:18px; border:1px solid #c8dced; border-bottom:3px solid #39a9e8; border-radius:13px; background:linear-gradient(145deg,#fff,#f3faff); box-shadow:0 5px 15px #12447710; color:#164b79; text-align:left; }
.workspace-card::before,.back-button::before { display:none; }
.workspace-card:hover { border-color:#1684c8; background:linear-gradient(145deg,#fff,#eaf7ff); }
.workspace-card-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:#e3f4ff; color:#0875c9; font-size:16px; font-weight:800; }
.workspace-card-title { color:#123f72; font-size:16px; font-weight:750; }
.workspace-card-copy { color:#5e7183; font-size:12px; font-weight:400; line-height:1.5; }
.workspace-card-link { display:flex; gap:7px; align-items:center; margin-top:auto; color:#075d9c; font-size:12px; font-weight:750; }
.back-button { width:auto; min-height:38px; margin:0 0 18px; padding:8px 12px; border:1px solid #b5d1e7; border-radius:9px; background:#f3faff; box-shadow:none; color:#13558a; font-size:12px; }
.back-button:hover { border-color:#1684c8; background:#e7f5ff; box-shadow:none; }
.student-view form { padding:0; }
.student-view form > fieldset { padding:0; }
.notes-workspace { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr); gap:16px; align-items:start; }
.notes-list-panel,.notes-upload-panel { min-width:0; padding:18px; border:1px solid #c8dced; border-radius:12px; background:#fff; box-shadow:0 4px 14px #1244770c; }
.notes-list-panel h3,.notes-upload-panel h3 { margin:18px 0 6px; color:#164b79; font-size:15px; }
.notes-upload-panel h3 { margin-top:0; }
.notes-list-panel label,.notes-upload-panel label { margin-top:0; color:#214b70; }
.notes-list-panel select,.notes-upload-panel input { background-color:#f7fbff; }
.notes-upload-panel button { margin-top:13px; }
.notes-list { display:grid; gap:9px; margin:12px 0 0; padding:0; list-style:none; }
.note-item { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px; border:1px solid #dce9f3; border-radius:9px; background:#f8fbfe; }
.note-item-details { display:grid; gap:4px; min-width:0; }
.note-item-details strong { overflow-wrap:anywhere; color:#214b70; font-size:12px; }
.note-item-details span { color:#61778a; font-size:10px; line-height:1.4; }
.note-download { flex:none; padding:7px 10px; border:1px solid #b5d1e7; border-radius:8px; background:#fff; color:#13558a; font-size:11px; font-weight:700; text-decoration:none; }
.schedule-selectors { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; max-width:640px; }
.schedule-selectors label { display:grid; align-items:start; gap:7px; margin:0; color:#214b70; }
.schedule-selectors select { background-color:#fff; }
.student-view .topic-schedule { margin-top:18px; }
.student-view .topic-schedule h3 { margin:0 0 6px; color:#164b79; font-size:16px; }
.student-view .topic-schedule p { color:#5e7183; }
.student-view .topic-schedule label { margin:12px 0 0; }
@media(max-width:760px) { .student-workspace { max-width:600px; } .workspace-cards { grid-template-columns:1fr; } .workspace-card { min-height:0; } .notes-workspace { grid-template-columns:1fr; } }
@media(max-width:520px) { .student-identity { grid-template-columns:1fr; gap:10px; padding:15px 22px; } .student-view { padding:21px 22px 25px; } .student-view-heading h2 { font-size:20px; } .schedule-selectors { grid-template-columns:1fr; } }