:root {
    color-scheme: light;
    --bg: #f7f8fa; --surface: #fff; --surface-alt: #f0f2f6;
    --text: #202b40; --muted: #626e82; --border: #e1e5ed; --border-strong: #bcc5d5;
    --accent: #465bce; --accent-dark: #3043aa; --accent-soft: #eef0ff;
    --success: #176b53; --success-bg: #eaf6f0; --danger: #a53444; --danger-bg: #fff0f1;
    --radius: 16px; --ease: cubic-bezier(.22,1,.36,1);
    --font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mono: ui-monospace, "SFMono-Regular", Consolas, monospace;
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --bg: #10141d; --surface: #171d28; --surface-alt: #1f2735;
    --text: #e7edf7; --muted: #a0adc3; --border: #2c3546; --border-strong: #4b5a73;
    --accent: #a8b5ff; --accent-dark: #c5ceff; --accent-soft: #262e50;
    --success: #8dd7b8; --success-bg: #1a342e; --danger: #ffabba; --danger-bg: #3e2630;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {color-scheme:dark;--bg:#10141d;--surface:#171d28;--surface-alt:#1f2735;--text:#e7edf7;--muted:#a0adc3;--border:#2c3546;--border-strong:#4b5a73;--accent:#a8b5ff;--accent-dark:#c5ceff;--accent-soft:#262e50;--success:#8dd7b8;--success-bg:#1a342e;--danger:#ffabba;--danger-bg:#3e2630}
}
*, *::before, *::after {box-sizing:border-box}
[hidden] {display:none!important}
html {font-size:16px;scroll-padding-top:2rem}
body {margin:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.65;-webkit-font-smoothing:antialiased}
::selection {background:var(--accent);color:var(--surface)}
a {color:var(--accent);text-decoration:none;text-underline-offset:4px;transition:color 160ms ease}
a:hover {color:var(--accent-dark)}
button, input, textarea {font:inherit}
button, .button {border:1px solid transparent;border-radius:10px;background:var(--accent);color:var(--surface);padding:.7rem 1.1rem;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-weight:620;font-size:.9rem;line-height:1.45;cursor:pointer;transition:background 160ms,color 160ms,transform 200ms var(--ease),box-shadow 200ms}
button:hover, .button:hover {background:var(--accent-dark);color:var(--surface);transform:translateY(-1px)}
button:active, .button:active {transform:translateY(0) scale(.98)}
button:disabled {opacity:.6;cursor:wait;transform:none}
.button-secondary {border-color:var(--border-strong);background:var(--surface);color:var(--text)}
.button-secondary:hover {background:var(--surface-alt);color:var(--text)}
.text-button {background:transparent;border:0;padding:.4rem .5rem;font-size:.82rem;color:var(--muted);box-shadow:none}
.text-button:hover {background:var(--surface-alt);color:var(--text);transform:none}
.danger {color:var(--danger)}
.button-danger {background:var(--danger);color:var(--surface)}
.icon-button {width:40px;height:40px;padding:0;border:1px solid var(--border);background:var(--surface);color:var(--muted);flex:none}
.icon-button:hover {color:var(--accent);background:var(--accent-soft);border-color:var(--border-strong)}
.icon {display:inline-block;flex:0 0 auto;vertical-align:middle}
:focus-visible {outline:3px solid var(--accent);outline-offset:4px}
main:focus {outline:none}
h1,h2,h3,h4 {line-height:1.25;letter-spacing:-.025em;margin:0 0 .8rem;font-weight:650}
h1 {font-size:clamp(2rem,4.5vw,3.4rem);letter-spacing:-.05em;text-wrap:balance}
h2 {font-size:1.35rem} h3 {font-size:1.08rem} h4 {font-size:1rem}
p {margin:0 0 1rem}
ul,ol {padding-left:1.35rem}
img,video,iframe {max-width:100%}
img,video {height:auto}
code,pre {font-family:var(--mono);font-size:.87em}
code {background:var(--surface-alt);padding:.15em .35em;border-radius:4px;overflow-wrap:anywhere}
pre {max-width:100%;overflow:auto;background:var(--surface-alt);padding:1.2rem;border:1px solid var(--border);border-radius:10px;line-height:1.65}
pre code {padding:0;background:none;overflow-wrap:normal}
table {width:100%;border-collapse:collapse;font-size:.9rem}
th,td {padding:.8rem 1rem;text-align:left;border-bottom:1px solid var(--border);vertical-align:top}
th {font-weight:600;color:var(--muted);background:var(--surface-alt)}
input:not([type="hidden"]),textarea {width:100%;min-width:0;background:var(--surface);border:1px solid var(--border-strong);border-radius:9px;color:var(--text);padding:.75rem .9rem;transition:border-color 160ms,box-shadow 160ms}
input::placeholder,textarea::placeholder {color:var(--muted);opacity:.9}
input:focus,textarea:focus {border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}
textarea {min-height:160px;resize:vertical}
label {display:block;font-weight:550;font-size:.9rem;margin-bottom:.4rem}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link {position:absolute;top:8px;left:8px;transform:translateY(-160%);z-index:10;background:var(--surface);padding:.6rem 1rem;border:1px solid var(--accent);border-radius:8px}
.skip-link:focus {transform:none}
.site-shell {width:min(1088px,calc(100% - 64px));margin:0 auto}
.header {min-height:94px;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;border-bottom:1px solid var(--border)}
.brand {display:inline-flex;align-items:center;gap:.75rem;font-size:1.24rem;font-weight:750;letter-spacing:-.045em;color:var(--text);flex:none}
.brand:hover {color:var(--text)}
.brand-dot {color:var(--accent)}
.brand-mark {display:flex;align-items:center;gap:3px;width:27px;height:29px;transform:rotate(-12deg)}
.brand-mark span {display:block;width:6px;height:20px;border-radius:3px;background:var(--accent);transform-origin:center;animation:mark-in 650ms var(--ease) both}
.brand-mark span:first-child {height:13px;animation-delay:60ms}
.brand-mark span:last-child {height:27px;animation-delay:120ms}
.brand:hover .brand-mark {transform:rotate(0);transition:transform 250ms var(--ease)}
.menu {display:flex;align-items:center;gap:.25rem;flex-wrap:wrap;justify-content:flex-end}
.menu>a {font-size:.86rem;font-weight:550;color:var(--muted);padding:.55rem .8rem;border-radius:8px;position:relative}
.menu>a:hover {background:var(--surface-alt);color:var(--text)}
.menu>a[aria-current="page"] {background:var(--accent-soft);color:var(--accent)}
.menu .account-link {display:flex;flex-direction:column;line-height:1.35}
.username {font-size:.7rem;max-width:130px;overflow:hidden;text-overflow:ellipsis}
.theme-toggle {margin-left:.6rem}
.theme-toggle .icon-sun {display:none}
[data-theme="dark"] .theme-toggle .icon-sun {display:block}
[data-theme="dark"] .theme-toggle .icon-moon {display:none}
main {min-height:65vh;padding-bottom:1rem}
.course-hero {display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:54px 0 36px;animation:enter 500ms var(--ease) both}
.hero-copy {max-width:760px;min-width:0}
.eyebrow {font-family:var(--mono);font-size:.69rem;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);font-weight:600;margin:0 0 1rem}
.course-author {font-size:.96rem;font-weight:550;margin:.8rem 0 .45rem}
.course-description {max-width:660px;font-size:.91rem;color:var(--muted);margin:0;line-height:1.7}
.hero-art {width:212px;flex:0 0 212px;text-align:center;color:var(--accent);opacity:.85}
.hero-art svg {width:100%;overflow:visible}
.art-grid {stroke:var(--border);stroke-width:1;opacity:.7}
.plot-axes {stroke:var(--border-strong);stroke-width:1.15}
.plot-label {font-family:var(--mono);font-size:10px;fill:var(--muted)}
.regression-points circle {fill:var(--accent);transform-box:fill-box;transform-origin:center;animation:point-in 400ms var(--point-delay) var(--ease) both}
.regression-line {stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;animation:regression-fit 700ms 1000ms var(--ease) both}
.regression-residuals {stroke:var(--success);stroke-width:1.2;stroke-dasharray:2 2;opacity:.55;animation:residual-in 450ms 1700ms ease both}
.course-tools {padding-bottom:24px}
.search-box {display:flex;align-items:center;gap:.65rem;width:100%;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.15rem .85rem;color:var(--muted)}
.search-box:focus-within {border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.search-box input {border:0;background:transparent;padding:.75rem .1rem;font-size:.92rem;outline:none}
.search-box input::-webkit-search-cancel-button {display:none}
.search-box .icon-button {width:30px;height:30px;border:0;background:transparent}
.filter-row {display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:13px}
.filter-list {display:flex;flex-wrap:wrap;gap:.3rem}
.filter-button {padding:.35rem .8rem;background:transparent;color:var(--muted);font-size:.78rem;border-radius:7px;font-weight:550}
.filter-button:hover {background:var(--surface-alt);color:var(--text);transform:none}
.filter-button[aria-pressed="true"] {background:var(--text);color:var(--bg)}
.result-count {font-family:var(--mono);font-size:.69rem;color:var(--muted);white-space:nowrap}
.course-lessons {display:grid;gap:24px}
.lesson {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:clip;scroll-margin-top:20px;animation:enter 550ms 80ms var(--ease) both}
.lesson.current {border-top:2px solid var(--accent)}
.lesson-heading {padding:25px 28px 20px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.lesson-heading h2 {font-size:1.18rem;letter-spacing:-.02em;margin:0;line-height:1.4}
.current-label {display:flex;align-items:center;gap:.4rem;color:var(--success);font-size:.68rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.6rem}
.current-label>span {width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px var(--success-bg)}
.lesson-index {font-family:var(--mono);font-size:1.8rem;font-weight:400;color:var(--border-strong)}
.description {color:var(--muted);font-size:.9rem;margin:.5rem 0 0}
.resource-list {list-style:none;margin:0;padding:0 14px 12px}
.lesson-item {border-top:1px solid var(--border);padding:15px 14px;position:relative;border-radius:0;transition:background 180ms,border-radius 180ms}
.lesson-item:hover {background:var(--surface-alt);border-radius:9px}
.resource-main {display:flex;align-items:flex-start;gap:14px;min-width:0}
.resource-icon {display:flex;width:32px;height:32px;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent);border-radius:8px;flex:none}
.resource-icon .icon {width:17px;height:17px}
.resource-copy {flex:1;min-width:0;padding-top:3px}
.resource-link {font-size:.9rem;font-weight:550;line-height:1.55;color:var(--text);overflow-wrap:anywhere}
.resource-link::after {content:"";position:absolute;inset:0}
.resource-link:focus-visible {outline:none}
.lesson-item:has(.resource-link:focus-visible) {outline:2px solid var(--accent);outline-offset:-2px;border-radius:9px}
.resource-description {font-size:.8rem;color:var(--muted);line-height:1.6;margin:.35rem 0 0}
.resource-type {font-family:var(--mono);text-transform:uppercase;font-size:.61rem;letter-spacing:.04em;color:var(--muted);padding-top:7px;white-space:nowrap}
.resource-arrow {margin-top:5px;color:var(--border-strong);transition:transform 220ms var(--ease),color 220ms}
.resource-arrow .icon {width:17px;height:17px}
.lesson-item:hover .resource-arrow {transform:translateX(3px);color:var(--accent)}
.assignment-status {display:flex;align-items:center;gap:.5rem;margin:.65rem 0 0 46px}
.grade-status-pill {display:inline-flex;align-items:center;gap:.35rem;font-size:.7rem;line-height:1.5;font-weight:550;border-radius:6px;padding:.2rem .5rem;background:var(--surface-alt);color:var(--muted)}
.status-graded {background:var(--accent-soft);color:var(--accent)}
.status-submitted {background:var(--success-bg);color:var(--success)}
.status-pending {border:1px solid var(--border);background:transparent}
.assignment-grade-chip {font-size:.75rem;color:var(--accent);font-family:var(--mono)}
.attachments {position:relative;z-index:1;margin:.7rem 0 0 46px;font-size:.8rem;width:fit-content;max-width:calc(100% - 46px)}
.attachments summary {cursor:pointer;color:var(--accent);display:flex;align-items:center;gap:.5rem;list-style:none;width:fit-content;border-radius:3px}
.attachments summary::-webkit-details-marker {display:none}
.attachments summary>span {color:var(--muted);font-family:var(--mono);font-size:.7rem}
.attachments summary .icon {width:13px;height:13px;transition:transform 180ms}
.attachments[open] summary .icon {transform:rotate(90deg)}
.attachments ul,.file-list {list-style:none;padding:0;margin:.75rem 0 0}
.attachments li,.file-list li {margin:0 0 .7rem}
.attachments li>a,.file-list li>a {display:flex;align-items:center;gap:.6rem;overflow-wrap:anywhere}
.attachments li>a>span:nth-child(2),.file-list li>a>span:nth-child(2) {min-width:0}
.attachments p,.file-list p {color:var(--muted);font-size:.8rem;margin:.3rem 0 0}
.file-format {font-family:var(--mono);font-size:.65rem;border:1px solid var(--border-strong);border-radius:4px;padding:.1rem .35rem;flex:none;color:var(--muted)}
.search-empty {padding:3rem 1rem;text-align:center;border:1px dashed var(--border-strong);border-radius:var(--radius)}
.search-empty p {color:var(--muted);font-size:.9rem}
.page-heading {padding:35px 0 28px;max-width:900px}
.page-heading h1 {font-size:clamp(1.8rem,3.5vw,2.65rem);line-height:1.2}
.page-heading .eyebrow {margin-bottom:.7rem}
.breadcrumbs {margin-top:30px;font-size:.8rem}
.breadcrumbs a {color:var(--muted);display:inline-flex;gap:.5rem;align-items:flex-start;max-width:100%}
.breadcrumbs .icon {width:17px;height:17px;margin-top:3px}
.jump-submit {font-size:.8rem;padding:.5rem .8rem;margin-top:.5rem}
.component-layout {display:grid;gap:28px;max-width:800px}
.component-layout.has-assignment {max-width:100%;grid-template-columns:minmax(0,1fr) minmax(290px,370px);align-items:start;column-gap:40px}
.has-assignment>.content {grid-column:1;grid-row:1}
.has-assignment>.material-files {grid-column:1;grid-row:2}
.has-assignment>.submission {grid-column:2;grid-row:1 / span 2}
.content {min-width:0;font-size:.96rem;line-height:1.8;overflow-wrap:anywhere}
.content h1 {font-size:1.65rem}.content h2 {font-size:1.35rem}.content h3 {font-size:1.15rem}
.content h1,.content h2,.content h3,.content h4 {margin:1.5rem 0 .7rem}
.content>h1:first-child,.content>h2:first-child {margin-top:0}
.content a {text-decoration:underline;text-decoration-color:var(--border-strong)}
.content li {margin:.45rem 0}
.content blockquote {border-left:2px solid var(--accent);margin:1.2rem 0;padding:.3rem 1.2rem;color:var(--muted)}
.content table {display:block;max-width:100%;overflow-x:auto}
.panel {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;min-width:0}
.panel h2 {font-size:1.15rem}.panel h3 {font-size:.85rem;margin:1.2rem 0 .6rem}
.submission {scroll-margin-top:20px}
.submission-heading {display:flex;align-items:center;justify-content:space-between;gap:.8rem}
.submission-heading h2 {margin:0}
.max-grade {color:var(--muted);font-family:var(--mono);font-size:.75rem;white-space:nowrap}
.submission-state {margin:.9rem 0 1.2rem}
.muted {color:var(--muted)}
.submission>.muted {font-size:.85rem}
.submission-files {list-style:none;margin:0 0 1.2rem;padding:0}
.submission-files li {display:flex;align-items:flex-start;gap:.5rem;border-bottom:1px solid var(--border);padding:.8rem 0}
.submission-file-copy {min-width:0;flex:1}
.file-name {overflow-wrap:anywhere;font-size:.85rem;font-weight:550}
.file-meta {display:block;font-size:.68rem;color:var(--muted);margin-top:.3rem}
.upload-zone {position:relative;text-align:center;background:var(--surface-alt);border:1px dashed var(--border-strong);border-radius:11px;padding:22px 12px;transition:background 180ms,border-color 180ms,transform 180ms}
.upload-zone>.icon {color:var(--accent);width:27px;height:27px;margin-bottom:.7rem}
.upload-zone label {font-size:.85rem;max-width:230px;margin:0 auto .6rem;line-height:1.5;cursor:pointer}
.upload-zone input {font-size:.74rem;background:transparent;border:none;padding:.5rem 0;cursor:pointer}
.upload-zone input::file-selector-button {border:1px solid var(--border-strong);border-radius:6px;padding:.4rem .6rem;background:var(--surface);color:var(--text);cursor:pointer}
.upload-zone.enhanced input {position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.upload-zone:focus-within {outline:2px solid var(--accent);outline-offset:3px}
.upload-zone.dragover {background:var(--accent-soft);border-color:var(--accent);transform:scale(1.01)}
.upload-zone p {font-size:.72rem;color:var(--muted);margin:0;pointer-events:none}
.upload-zone #uploadSelected:not(:empty) {font-size:.8rem;color:var(--accent);margin:.5rem 0;font-weight:600}
.form-hint {font-size:.72rem;color:var(--muted);margin:.7rem 0 1rem;line-height:1.6}
#uploadSubmit {width:100%}
#uploadSubmit[disabled] .icon {animation:upload-pulse 1s ease-in-out infinite}
.upload-error {font-size:.8rem;color:var(--danger);background:var(--danger-bg);padding:.6rem .8rem;border-radius:7px}
.feedback {border-top:1px solid var(--border);margin-top:1.5rem;font-size:.88rem}
.feedback-score {font-size:2rem;font-weight:650;color:var(--accent);margin:0 0 .5rem}
.feedback-score span {font-size:1rem;font-weight:400;color:var(--muted)}
.material-navigation {display:flex;justify-content:space-between;gap:2rem;border-top:1px solid var(--border);margin-top:3rem;padding-top:1.4rem}
.material-navigation>a {flex:1;min-width:0;max-width:48%;font-size:.8rem;color:var(--text)}
.material-navigation>a>span {display:flex;gap:.4rem;align-items:center;font-size:.72rem;color:var(--muted);margin-bottom:.4rem}
.material-navigation .icon {width:15px;height:15px}
.material-navigation strong {font-weight:550;overflow-wrap:anywhere}
.material-navigation .next-material {text-align:right;margin-left:auto}
.next-material>span {justify-content:flex-end}
.auth-panel {max-width:440px;margin:60px auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:36px;animation:enter 450ms var(--ease) both}
.auth-panel h1 {font-size:2rem}.auth-panel>.muted {font-size:.9rem}
.auth-panel form {margin-top:1.6rem}.auth-panel input {margin-bottom:1.15rem}.auth-panel button {width:100%;margin-top:.5rem}
.auth-switch {font-size:.8rem;color:var(--muted);margin:1.5rem 0 0}
.flash {display:flex;align-items:flex-start;gap:.7rem;background:var(--accent-soft);color:var(--accent);border:1px solid var(--border);padding:1rem 1.2rem;border-radius:11px;font-size:.87rem;margin:24px 0 0;animation:enter 300ms var(--ease) both}
.flash-success {background:var(--success-bg);color:var(--success)}
.flash-error {background:var(--danger-bg);color:var(--danger)}
.flash-error .icon-check {display:none}
.footer {display:flex;justify-content:space-between;gap:1rem;border-top:1px solid var(--border);margin:48px 0 0;padding:24px 0 32px;font-size:.75rem;color:var(--muted)}
.footer-brand {font-weight:650;color:var(--text)}
.grades-toolbar {display:flex;justify-content:flex-end;margin-bottom:1rem}
.view-toggle {background:var(--surface);color:var(--text);border-color:var(--border);font-size:.8rem;padding:.5rem .8rem}
.view-toggle:hover {background:var(--surface-alt);color:var(--text)}
.grades-section {margin-bottom:2rem}.grades-section__header {margin-bottom:1rem}.grades-section__header h3 {font-size:1rem}
.lesson-description {font-size:.85rem;color:var(--muted)}
.grades-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:1rem}
.grade-card {display:flex;flex-direction:column;gap:.8rem;border:1px solid var(--border);border-radius:var(--radius);padding:24px;background:var(--surface);min-width:0}
.grade-card__meta {display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
.grade-type {font-size:.65rem;font-family:var(--mono);text-transform:uppercase;color:var(--muted)}
.grade-card h4 {font-size:1.1rem;margin:0}.grade-desc,.grade-comment {font-size:.85rem;color:var(--muted);margin:0}
.grade-score .score {font-size:2.5rem;letter-spacing:-.05em;font-weight:600}.grade-score .max {color:var(--muted)}
.grade-card__actions {margin-top:auto;font-size:.85rem}
.grade-card.is-graded {border-top:2px solid var(--accent)}.grade-card.is-submitted {border-top:2px solid var(--success)}
.grades-table {display:none}.grades-table__wrapper {overflow-x:auto;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.grades-table table {min-width:700px}.grade-row__secondary {font-size:.75rem;color:var(--muted);margin-top:.3rem}.grade-row__primary {font-size:.85rem;font-weight:550}.grade-row__score {white-space:nowrap}
.grades-page.compact-mode .grades-sections {display:none}.grades-page.compact-mode .grades-table {display:block}
.empty-grades {background:var(--surface);border:1px dashed var(--border-strong);padding:2rem;border-radius:var(--radius);color:var(--muted)}
.post,.mypost {border:1px solid var(--border);background:var(--surface);padding:1.5rem;border-radius:var(--radius);margin:1rem 0;overflow-wrap:anywhere}.mypost {border-left:3px solid var(--accent)}
dialog {background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:28px;width:min(440px,calc(100% - 32px));box-shadow:0 20px 100px #0003}
dialog::backdrop {background:#0b14246b;backdrop-filter:blur(3px)}
dialog[open] {animation:enter 180ms var(--ease)}
dialog h2 {font-size:1.25rem}dialog p {font-size:.85rem;color:var(--muted)}
.dialog-actions {display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.5rem}
@keyframes enter {from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes mark-in {from{transform:scaleY(.35);opacity:.25}to{transform:scaleY(1);opacity:1}}
@keyframes regression-fit {from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes residual-in {from{opacity:0}to{opacity:.55}}
@keyframes point-in {from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes upload-pulse {50%{transform:translateY(-3px)}}
::view-transition-old(root),::view-transition-new(root) {animation-duration:180ms}
@media (min-width:760px) and (prefers-reduced-motion:no-preference) {@view-transition {navigation:auto}}
@media (max-width:900px) {.hero-art{width:165px;flex-basis:165px}.component-layout.has-assignment{column-gap:24px;grid-template-columns:minmax(0,1fr) 310px}.panel{padding:20px}}
@media (max-width:700px) {
.site-shell{width:calc(100% - 36px)}.header{min-height:100px;flex-wrap:wrap;padding:20px 0 16px;gap:15px}.brand{font-size:1.16rem}.brand-mark{transform:scale(.9) rotate(-12deg);width:24px}
.menu{gap:.1rem;justify-content:flex-start}.menu>a{font-size:.78rem;padding:.45rem .65rem}.theme-toggle{margin-left:.3rem;width:34px;height:34px}.menu .account-link{font-size:.72rem}.username{max-width:100px}
.course-hero{padding:36px 0 28px;gap:0}.hero-art{display:none}.eyebrow{font-size:.63rem}.course-author{font-size:.9rem}.course-description{font-size:.85rem}
.filter-row{gap:.5rem;align-items:flex-start;flex-wrap:wrap}.filter-list{gap:.1rem}.filter-button{padding:.35rem .65rem;font-size:.73rem}.result-count{padding-top:.35rem}
.lesson-heading{padding:20px 20px 16px}.lesson-heading h2{font-size:1.06rem}.lesson-index{font-size:1.4rem}.resource-list{padding:0 8px 8px}.lesson-item{padding:14px 10px}
.resource-main{gap:10px}.resource-icon{width:28px;height:28px;border-radius:7px}.resource-copy{padding-top:1px}.resource-link{font-size:.84rem}.resource-type{font-size:.57rem;padding-top:5px}.resource-arrow{display:none}
.resource-description{font-size:.76rem}.attachments{margin-left:38px;max-width:calc(100% - 38px)}.assignment-status{margin-left:38px}.current-label{font-size:.61rem}
.page-heading{padding:25px 0}.component-layout.has-assignment{display:flex;flex-direction:column;gap:24px}.component-layout>*{width:100%}.has-assignment>.submission{max-width:100%}.content{font-size:.93rem}
.panel{padding:22px}.auth-panel{margin:32px auto;padding:26px}.footer{font-size:.68rem;margin-top:36px}.material-navigation{gap:1rem}.material-navigation strong{font-size:.75rem}
}
@media (max-width:390px) {.site-shell{width:calc(100% - 28px)}.menu>a{padding:.4rem .5rem}.resource-type{display:none}.filter-button{padding:.35rem .6rem}.lesson-heading{padding:18px}.footer{flex-direction:column;gap:.3rem}.auth-panel{padding:22px}}
@media (prefers-reduced-motion:reduce) {*,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}.brand:hover .brand-mark,button:hover,.button:hover,.lesson-item:hover .resource-arrow,.upload-zone.dragover {transform:none}::view-transition-old(root),::view-transition-new(root){animation:none!important}}
@media print {.header,.course-tools,.footer,.jump-submit,.submission form,.theme-toggle,.material-navigation{display:none!important}.site-shell{width:100%}body{background:white;color:black}.lesson,.panel{break-inside:avoid}.hero-art{display:none}}

.submission-receipt {margin:0 0 1.2rem;font-size:.8rem;padding:.8rem;border:0}

/* Deadlines and progress use the existing panels and typography. */
.deadlines {margin-block: 0 1.6rem; padding:1.25rem 1.5rem;}
.deadlines header {display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem;}
.deadlines h2 {font-size:1.05rem;margin:0;}
.deadlines ul {list-style:none;padding:0;margin:.75rem 0 0;}
.deadlines li {display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.4rem 1.5rem;padding:.5rem 0;}
.deadlines li>a {min-width:0;overflow-wrap:anywhere;}
.deadline-meta {display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .85rem;}
.deadline-meta time {white-space:nowrap;}
.deadlines time,.resource-deadline {font-size:.85rem;color:var(--muted);}
.deadline-projects {margin-top:.65rem;}
.deadline-regular+.deadline-projects {border-top:1px solid var(--border);padding-top:.35rem;}
.deadline-projects summary {display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.4rem 1.5rem;list-style:none;cursor:pointer;padding:.6rem 0;border-radius:3px;}
.deadline-projects summary::-webkit-details-marker {display:none;}
.deadline-projects-label {display:flex;align-items:center;gap:.5rem;font-size:.9rem;}
.deadline-projects-label .icon {width:13px;height:13px;flex:none;transition:transform 180ms;}
.deadline-projects[open] .deadline-projects-label .icon {transform:rotate(90deg);}
.deadline-projects ul {margin-top:.2rem;font-size:.9rem;}
.resource-deadline {margin:.4rem 0 0 3.1rem;}
.progress-summary {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1rem;margin-bottom:1rem;}
.progress-summary article {padding:1.3rem;}
.progress-summary h2 {font-size:1rem;margin:0;}
.summary-score {font-size:2rem;font-weight:650;margin:.65rem 0;}
.summary-score span {font-size:1rem;font-weight:400;color:var(--muted);}
.progress-summary p:not(.summary-score) {font-size:.85rem;}
.submission-history {border-top:1px solid var(--border);margin-top:1.2rem;padding-top:1rem;}
.submission-history summary {cursor:pointer;font-weight:600;}
.submission-history ol {padding-left:1.2rem;font-size:.85rem;}
.submission-history li {margin:.4rem 0;overflow-wrap:anywhere;}
.submission-history ul {padding-left:1rem;}
.submission-warning {font-size:.85rem;padding:.65rem;border-left:3px solid var(--accent);background:var(--surface-alt);}
.assignment-deadline {font-size:.9rem;}