/* White and violet dashboard. Shared tokens keep every semester screen consistent. */
body.semester-mode { background: #f8f7fb; color: #383443; }
.semester-mode .shell { max-width: none; width: 100%; padding: 0; margin: 0; }
.semester-mode .shell > .topbar, .semester-mode .shell > .tabs { display: none; }
.semester-mode .toast:not(.show) { visibility: hidden; }
.sm-workspace, .sm-dialog, .sm-loading { --sm-ink: #383443; --sm-muted: #706b7b; --sm-line: #e8e5ed; --sm-purple: #6e56cf; --sm-purple-hover: #654dc4; --sm-soft: #f1ecfc; --sm-subtle: #faf8ff; --sm-surface: #ffffff; --sm-canvas: #f8f7fb; --sm-accent-border: #d4cafe; font-family: 'Segoe UI', Arial, sans-serif; color: var(--sm-ink); line-height: 1.5; }
.sm-workspace { display: grid; grid-template-columns: 238px minmax(0, 1fr); min-height: 100vh; }
.sm-workspace *, .sm-dialog * { box-sizing: border-box; }
.sm-workspace h1, .sm-workspace h2, .sm-workspace h3, .sm-dialog h2, .sm-workspace p, .sm-dialog p { margin: 0; }
.sm-workspace h1 { font-family: inherit; font-size: clamp(28px, 3vw, 34px); letter-spacing: -.8px; font-weight: 600; line-height: 1.2; }
.sm-workspace h2, .sm-dialog h2 { font-size: 23px; letter-spacing: -.45px; font-weight: 600; line-height: 1.35; }
.sm-workspace h3 { font-size: 16px; font-weight: 600; }
.sm-workspace button, .sm-dialog button { font-family: inherit; cursor: pointer; }
.sm-workspace label, .sm-dialog label { font-weight: 400; color: inherit; }
.sm-workspace button:disabled, .sm-dialog button:disabled { opacity: .5; cursor: default; }
.sm-workspace button:focus-visible, .sm-workspace a:focus-visible, .sm-dialog button:focus-visible { outline: 3px solid var(--sm-accent-border); outline-offset: 3px; }
.sm-workspace svg, .sm-dialog svg { width: 20px; height: 20px; flex-shrink: 0; }
.sm-sidebar { background: var(--sm-surface); border-right: 1px solid var(--sm-line); padding: 35px 23px 25px; position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; }
.sm-brand { display: flex; align-items: center; gap: 12px; background: none; border: 0; padding: 0; text-align: left; color: var(--sm-ink); }
.sm-brand > span { font: 35px Georgia, serif; color: var(--sm-muted); border: 1px solid var(--sm-soft); border-radius: 13px; background: var(--sm-subtle); width: 50px; height: 55px; display: grid; place-content: center; position: relative; }
.sm-brand sup { font: 14px Georgia, serif; position: absolute; top: 8px; right: 8px; }
.sm-brand > div { font-size: 14px; font-weight: 600; }
.sm-brand small { display: block; font-size: 11px; color: var(--sm-muted); letter-spacing: 1.8px; margin-top: 5px; }
.sm-sidebar-label { font-size: 11px; font-weight: 600; letter-spacing: 1.8px; color: var(--sm-muted); margin: 52px 12px 14px !important; }
.sm-sidebar nav { display: grid; gap: 6px; }
.sm-nav { display: flex; align-items: center; gap: 12px; width: 100%; border: none; border-radius: 9px; background: none; padding: 13px 12px; color: var(--sm-muted); text-align: left; font-size: 13px; }
.sm-nav:hover { background: var(--sm-subtle); color: var(--sm-ink); }
.sm-nav.active { background: var(--sm-subtle); color: var(--sm-muted); font-weight: 600; }
.sm-sidebar-bottom { margin-top: auto; padding-top: 70px; }
.sm-term-mark { padding: 16px 11px 23px; font-size: 11px; font-weight: 600; letter-spacing: 1px; border-bottom: 1px solid var(--sm-line); }
.sm-term-mark span, .sm-term-mark small { display: block; letter-spacing: 0; font-weight: 400; margin-top: 6px; color: var(--sm-muted); }
.sm-term-mark span { font-size: 12px; }
.sm-term-mark small { font-size: 11px; }
.sm-exit { display: flex; align-items: center; gap: 10px; background: none; border: none; padding: 20px 8px 0; font-size: 11px; color: var(--sm-muted); }
.sm-main { padding: 0 42px; max-width: 1540px; width: 100%; margin: 0 auto; min-width: 0; }
.sm-topline { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 27px 0; border-bottom: 1px solid var(--sm-line); margin-bottom: 36px; font-size: 11px; color: var(--sm-muted); letter-spacing: 1.1px; }
.sm-topline i { color: var(--sm-accent-border); padding: 0 10px; font-style: normal; }
.sm-topline > div { display: flex; align-items: center; gap: 20px; letter-spacing: 0; font-size: 11px; }
.sm-topline b { font-weight: 500; background: var(--sm-soft); padding: 6px 13px; border-radius: 30px; }
.sm-page-heading { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-bottom: 30px; }
.sm-eyebrow { color: var(--sm-muted); font-size: 11px; font-weight: 600; letter-spacing: 1.7px; margin-bottom: 10px !important; text-transform: uppercase; }
.sm-subtitle { color: var(--sm-muted); font-size: 13px; margin-top: 12px !important; max-width: 750px; }
.sm-heading-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px; }
.sm-button { padding: 11px 17px; border: 1px solid var(--sm-line); border-radius: 7px; background: var(--sm-surface); color: var(--sm-ink); display: inline-flex; align-items: center; justify-content: center; gap: 15px; font-size: 12px; font-weight: 500; min-height: 41px; }
.sm-button:hover { background: var(--sm-subtle); }
.sm-button.primary { background: var(--sm-ink); border-color: var(--sm-ink); color: white; }
.sm-button.primary:hover { background: var(--sm-ink); }
.sm-text-button { display: inline-flex; align-items: center; gap: 8px; background: none; border: none; color: var(--sm-muted); padding: 5px 0; font-size: 12px; }
.sm-text-button:hover, .sm-title-link:hover { color: var(--sm-muted); }
.sm-icon-button { border: 1px solid var(--sm-line); background: var(--sm-surface); min-width: 36px; min-height: 34px; padding: 6px 10px; border-radius: 6px; font-size: 12px; color: var(--sm-muted); }
.sm-panel { background: var(--sm-surface); border: 1px solid var(--sm-line); border-radius: 10px; padding: 26px; min-width: 0; }
.sm-panel > h2, .sm-panel > h3 { margin-bottom: 12px; }
.sm-panel > p { font-size: 13px; color: var(--sm-muted); margin-bottom: 18px; }
.sm-home-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; margin-bottom: 34px; }
.sm-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.sm-section-heading .sm-eyebrow { margin-bottom: 6px !important; }
.sm-badge { display: inline-flex; align-items: center; font-size: 11px; padding: 4px 8px; border-radius: 5px; background: var(--sm-subtle); color: var(--sm-muted); line-height: 1.4; font-weight: 500; }
.sm-badge.violet { background: var(--sm-subtle); color: var(--sm-muted); }
.sm-badge.orange { background: var(--sm-subtle); color: var(--sm-muted); }
.sm-badge.green { background: var(--sm-soft); color: var(--sm-ink); }
.sm-event { display: flex; align-items: flex-start; gap: 19px; padding: 19px 0; border-bottom: 1px solid var(--sm-line); }
.sm-event:last-of-type { border-bottom: 0; }
.sm-event.compact { padding: 14px 0; gap: 15px; }
.sm-date-block { background: var(--sm-subtle); border-radius: 7px; width: 48px; min-height: 55px; text-align: center; padding: 7px 2px; flex-shrink: 0; }
.sm-date-block strong { display: block; font: 24px/1.1 Georgia, serif; color: var(--sm-ink); }
.sm-date-block span { color: var(--sm-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .6px; }
.sm-event-content { min-width: 0; flex: 1; }
.sm-event-top { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 5px; }
.sm-title-link { background: none; border: 0; text-align: left; color: var(--sm-ink); font-size: 13px; padding: 0; font-weight: 600; line-height: 1.5; }
.sm-event p { color: var(--sm-muted); font-size: 11px; margin-top: 5px; }
.sm-event .sm-event-note { font-size: 12px; color: var(--sm-muted); margin-top: 9px; }
.sm-event .sm-source { margin-top: 8px; }
.sm-footnote { border-top: 1px solid var(--sm-line); padding-top: 13px; margin-top: 10px; color: var(--sm-muted); font-size: 11px; }
.sm-source { display: inline-block; font-size: 11px; color: var(--sm-muted); text-decoration: none; margin-right: 13px; line-height: 1.7; }
a.sm-source:hover { text-decoration: underline; }
.sm-week-mini { display: grid; }
.sm-week-mini > button { display: flex; align-items: center; gap: 14px; padding: 13px 0; border: 0; border-bottom: 1px solid var(--sm-line); background: none; text-align: left; }
.sm-week-mini > button:last-child { border-bottom: 0; }
.sm-week-mini > button > span:first-child { width: 34px; color: var(--sm-muted); font-size: 11px; text-transform: uppercase; flex-shrink: 0; }
.sm-week-mini strong { display: block; color: var(--sm-ink); font-size: 18px; font-weight: 500; }
.sm-week-mini > button > div { flex: 1; min-width: 0; }
.sm-week-mini b { font-size: 12px; font-weight: 500; }
.sm-week-mini small { display: block; color: var(--sm-muted); font-size: 11px; margin-top: 3px; }
.sm-mini-arrow { color: var(--sm-accent-border); font-size: 18px; }
.sm-course-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.sm-course-card { background: var(--sm-surface); border: 1px solid var(--sm-line); border-radius: 10px; padding: 22px; text-align: left; display: flex; flex-direction: column; align-items: stretch; color: var(--sm-ink); min-width: 0; transition: border-color .15s, box-shadow .15s; }
.sm-course-card:hover { border-color: var(--sm-purple); box-shadow: 0 3px 14px #2f265f08; }
.sm-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 19px; }
.sm-code { background: var(--sm-soft); color: var(--sm-purple); border: 1px solid var(--sm-accent-border); border-radius: 6px; padding: 7px 10px; font-size: 11px; letter-spacing: .6px; font-weight: 600; display: inline-block; }
.sm-course-card h3 { font-size: 16px; line-height: 1.45; min-height: 46px; margin-bottom: 10px; font-weight: 500; }
.sm-course-card > p { font-size: 11px; color: var(--sm-muted); margin-bottom: 22px; }
.sm-card-bottom { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; margin-top: auto; }
.sm-card-bottom > span:last-child { color: var(--sm-muted); font-size: 11px; }
.sm-card-next { border-top: 1px solid var(--sm-line); padding-top: 11px; margin-top: 13px; font-size: 11px; color: var(--sm-muted); }
.sm-bottom-note { color: var(--sm-muted); font-size: 11px; margin: 21px 0 !important; line-height: 1.7; }
.sm-footer { border-top: 1px solid var(--sm-line); color: var(--sm-muted); display: flex; justify-content: space-between; gap: 15px; margin-top: 45px; padding: 22px 0 27px; font-size: 11px; }
.sm-workspace input, .sm-workspace select, .sm-workspace textarea, .sm-dialog input, .sm-dialog select, .sm-dialog textarea { font-family: 'Segoe UI', Arial, sans-serif; font-size: 12px; color: var(--sm-ink); border: 1px solid var(--sm-line); border-radius: 6px; background: var(--sm-surface); padding: 10px 12px; width: 100%; max-width: 100%; }
.sm-workspace input:focus, .sm-workspace select:focus, .sm-workspace textarea:focus, .sm-dialog input:focus, .sm-dialog textarea:focus, .sm-dialog select:focus { outline: 2px solid var(--sm-line); outline-offset: 1px; }
.sm-workspace textarea, .sm-dialog textarea { resize: vertical; }
.sm-search { display: flex; align-items: center; gap: 16px; margin-bottom: 25px; }
.sm-search > span { font-size: 11px; color: var(--sm-muted); }
.sm-search > input { max-width: 430px; }
.sm-course-heading { display: flex; align-items: flex-start; gap: 19px; margin-top: 22px; }
.sm-course-heading > .sm-code { min-width: 57px; margin-top: 27px; padding: 14px 11px; text-align: center; }
.sm-course-heading h1 { font-size: clamp(28px, 3vw, 39px); }
.sm-local-tabs { display: flex; gap: 29px; border-bottom: 1px solid var(--sm-line); margin-bottom: 30px; }
.sm-local-tabs button { background: none; border: 0; border-bottom: 2px solid transparent; color: var(--sm-muted); padding: 11px 0 14px; font-size: 12px; }
.sm-local-tabs button.active { color: var(--sm-muted); border-bottom-color: var(--sm-muted); }
.sm-local-tabs span { background: var(--sm-soft); padding: 2px 6px; border-radius: 4px; font-size: 11px; margin-left: 5px; }
.sm-course-detail-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 25px; align-items: start; }
.sm-fact { border-top: 1px solid var(--sm-line); padding: 22px 0; }
.sm-fact:last-child { padding-bottom: 0; }
.sm-fact h3 { font-size: 13px; margin-bottom: 10px; }
.sm-fact p { font-size: 13px; line-height: 1.8; color: var(--sm-muted); margin-bottom: 9px; }
.sm-detail-aside { display: grid; gap: 20px; }
.sm-warning { background: var(--sm-subtle); border-color: var(--sm-line); }
.sm-warning p { margin-top: 10px; margin-bottom: 0; font-size: 12px; color: var(--sm-muted); }
.sm-slot-summary { display: grid; gap: 4px; padding: 13px 0; border-bottom: 1px solid var(--sm-line); font-size: 12px; }
.sm-slot-summary b { font-weight: 500; }
.sm-slot-summary span { font-size: 11px; color: var(--sm-muted); }
.sm-source-stack { display: grid; gap: 8px; margin-top: 19px; }
.sm-muted { font-size: 12px; color: var(--sm-muted); line-height: 1.7; }
.sm-field { display: grid; gap: 8px; margin: 18px 0; }
.sm-field > span { font-size: 11px; font-weight: 500; color: var(--sm-muted); }
.sm-form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
#sm-draft-status { margin-top: 15px; font-size: 11px; }
.sm-week-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.sm-week-toolbar > div { display: flex; align-items: center; gap: 12px; }
.sm-week-toolbar > div:first-child { flex-wrap: wrap; }
.sm-week-toolbar > div > span:last-child { font-size: 11px; color: var(--sm-muted); }
.sm-information { background: var(--sm-subtle); border: 1px solid var(--sm-soft); border-radius: 8px; padding: 15px 19px; margin-bottom: 20px; font-size: 12px; color: var(--sm-muted); line-height: 1.75; }
.sm-week-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; align-items: start; }
.sm-day { background: var(--sm-surface); border: 1px solid var(--sm-line); border-radius: 9px; overflow: hidden; min-height: 410px; }
.sm-day > header { padding: 18px 15px; border-bottom: 1px solid var(--sm-line); }
.sm-day > header > span { display: block; color: var(--sm-muted); font-size: 11px; }
.sm-day > header > strong { display: block; font: 31px Georgia, serif; color: var(--sm-ink); margin: 7px 0; }
.sm-day > header > small { font-size: 11px; color: var(--sm-muted); }
.sm-day.today { border-color: var(--sm-accent-border); }
.sm-day.today > header { background: var(--sm-soft); }
.sm-day > div { padding: 9px; display: grid; gap: 10px; }
.sm-agenda-item { width: 100%; padding: 13px 11px; border: 0; border-left: 3px solid var(--sm-purple); border-radius: 5px; text-align: left; background: var(--sm-subtle); }
.sm-agenda-item.conditional { border-left-style: dotted; }
.sm-agenda-time { font-size: 11px; color: var(--sm-purple); font-weight: 600; }
.sm-agenda-item h3 { font-size: 11px; line-height: 1.5; margin: 8px 0; color: var(--sm-ink); }
.sm-agenda-item p { font-size: 11px; color: var(--sm-muted); }
.sm-agenda-item small { font-size: 11px; display: block; color: var(--sm-muted); margin-top: 9px; line-height: 1.7; }
.sm-agenda-item:hover { outline: 1px solid var(--sm-purple); }
.sm-day-note { margin: 12px 13px 0 !important; font-size: 11px; color: var(--sm-muted); line-height: 1.7; }
.sm-no-classes { color: var(--sm-muted); font-size: 11px; padding: 20px 4px; }
.sm-warn-inline { color: var(--sm-muted) !important; }
.sm-schedule-sources { margin-top: 28px; }
.sm-schedule-sources > p { margin-bottom: 12px; }
.sm-filter-bar { display: flex; align-items: end; gap: 18px; margin: 25px 0; }
.sm-filter-bar label { font-size: 11px; color: var(--sm-muted); display: grid; gap: 8px; flex: 1; }
.sm-filter-bar label:first-child { flex: 2; }
.sm-filter-bar select { font-size: 12px; }
.sm-spaced { margin-top: 25px !important; }
.sm-tba-grid { display: grid; gap: 14px; }
.sm-workspace summary { cursor: pointer; display: flex; align-items: center; gap: 15px; font-size: 13px; }
.sm-workspace summary > small, .sm-workspace summary > span:last-child { margin-left: auto; color: var(--sm-muted); font-size: 11px; }
.sm-workspace details[open] > summary { margin-bottom: 22px; }
.sm-workspace details[open] > p { font-size: 13px; color: var(--sm-muted); margin-bottom: 20px; }
.sm-empty { font-size: 13px; padding: 25px 0; color: var(--sm-muted); }
.sm-notice { border: 1px solid var(--sm-line); background: var(--sm-subtle); color: var(--sm-ink); border-radius: 8px; padding: 13px 18px; margin-bottom: 25px; font-size: 12px; }
.sm-notice[hidden] { display: none; }
.sm-notice.error { background: var(--sm-subtle); border-color: var(--sm-line); color: var(--sm-muted); }
.sm-dialog { padding: 27px; width: min(660px, calc(100vw - 32px)); max-height: 90vh; border: 1px solid var(--sm-line); border-radius: 12px; background: var(--sm-surface); overflow-y: auto; box-shadow: 0 25px 100px #242d2633; }
.sm-dialog::backdrop { background: #33392c70; backdrop-filter: blur(3px); }
.sm-dialog-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 20px; }
.sm-form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.sm-form-pair .sm-field { margin: 8px 0; }
.sm-dialog-error { font-size: 12px; color: var(--sm-muted); margin: 16px 0 !important; }
.sm-original-timetable { width: 100%; margin: 18px 0; border-radius: 5px; }
.sm-loading { min-height: 65vh; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 18px; text-align: center; padding: 30px; }
.sm-loading > span { font: 65px Georgia, serif; color: var(--sm-muted); }
.sm-loading h2 { font-weight: 400; font-family: Georgia, serif; }
.sm-loading > p { font-size: 13px; color: var(--sm-muted); }
@media (min-width: 1700px) { .sm-main { padding: 0 60px; } .sm-sidebar { padding-left: 28px; padding-right: 28px; } .sm-workspace { grid-template-columns: 260px minmax(0,1fr); } }
@media (max-width: 1200px) { .sm-workspace { grid-template-columns: 205px minmax(0,1fr); } .sm-sidebar { padding: 29px 16px; } .sm-main { padding: 0 25px; } .sm-brand > div { font-size: 12px; } .sm-course-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .sm-stat-grid > div { padding: 0 15px; } .sm-home-grid { gap: 16px; } .sm-panel { padding: 21px; } .sm-hero { padding: 29px; } .sm-week-grid { gap: 8px; } .sm-day > header { padding: 15px 10px; } .sm-agenda-item { padding: 11px 7px; } }
@media (max-width: 1000px) { .sm-home-grid { grid-template-columns: 1fr; } .sm-week-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } .sm-day { min-height: 0; } .sm-course-detail-grid, .sm-planner-grid { grid-template-columns: 1fr; } .sm-detail-aside { grid-template-columns: 1fr 1fr; } .sm-detail-aside > :last-child { grid-column: 1 / -1; } .sm-hero-art { transform: scale(.85); } .sm-hero { grid-template-columns: 1.3fr 1fr; padding: 25px; } .sm-desk-grid { grid-template-columns: 1fr; } .sm-hero h2 { font-size: 31px; } }
@media (max-width: 760px) { .sm-workspace { display: block; } .sm-sidebar { height: auto; position: static; border-right: 0; border-bottom: 1px solid var(--sm-line); padding: 18px 20px 12px; } .sm-brand > span { font-size: 27px; height: 39px; width: 38px; border-radius: 8px; } .sm-brand sup { font-size: 11px; right: 5px; top: 5px; } .sm-brand > div { font-size: 13px; } .sm-brand small { font-size: 11px; margin-top: 2px; } .sm-sidebar-label, .sm-term-mark { display: none; } .sm-sidebar nav { display: flex; gap: 4px; margin-top: 17px; overflow-x: auto; padding-bottom: 4px; } .sm-nav { width: auto; white-space: nowrap; padding: 9px 11px; font-size: 11px; flex-shrink: 0; gap: 6px; } .sm-nav svg { width: 16px; height: 16px; } .sm-sidebar-bottom { padding: 0; margin: 0; position: absolute; top: 25px; right: 20px; } .sm-exit { padding: 0; font-size: 11px; } .sm-exit svg { width: 15px; height: 15px; } .sm-main { padding: 0 20px; } .sm-topline { padding: 19px 0; margin-bottom: 28px; font-size: 11px; } .sm-topline > div { gap: 10px; font-size: 11px; } .sm-page-heading { align-items: flex-start; flex-direction: column; gap: 18px; margin-bottom: 24px; } .sm-subtitle { font-size: 12px; line-height: 1.8; } .sm-hero { grid-template-columns: 1fr 1fr; padding: 25px; } .sm-art-paper { width: 150px; height: 205px; padding: 20px 15px; } .sm-art-paper strong { font-size: 72px; } .sm-art-note { font-size: 12px; padding: 12px; left: -20px; bottom: 10px; } .sm-hero h2 { font-size: 30px; } .sm-hero-label { font-size: 11px; } .sm-hero .sm-button { padding: 10px 13px; font-size: 11px; } .sm-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 23px 0; padding: 20px 0; } .sm-stat-grid > div:nth-child(2) { border-right: 0; } .sm-stat-grid span { font-size: 11px; } .sm-stat-grid small { font-size: 11px; } .sm-stat-grid strong { font-size: 31px; } .sm-detail-aside { grid-template-columns: 1fr; } .sm-week-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; } .sm-week-toolbar { flex-direction: column; align-items: flex-start; } .sm-filter-bar { flex-wrap: wrap; gap: 12px; } .sm-filter-bar label:first-child { flex: 1 0 100%; } .sm-course-heading > .sm-code { margin-top: 23px; } .sm-course-heading h1 { font-size: 29px; } .sm-course-heading { gap: 13px; } .sm-footer { flex-direction: column; gap: 8px; } }
@media (max-width: 460px) { .sm-main { padding: 0 16px; } .sm-sidebar { padding-left: 16px; padding-right: 16px; } .sm-sidebar-bottom { right: 16px; } .sm-exit { font-size: 0; gap: 0; } .sm-exit svg { width: 23px; height: 23px; } .sm-hero { display: block; padding: 28px; } .sm-hero-art { display: none; } .sm-hero h2 { font-size: 37px; } .sm-course-grid { grid-template-columns: 1fr; gap: 13px; } .sm-course-card h3 { min-height: 0; } .sm-panel { padding: 20px; } .sm-week-grid { grid-template-columns: 1fr; } .sm-day > header { display: flex; align-items: center; gap: 15px; padding: 13px 18px; } .sm-day > header > strong { font-size: 25px; margin: 0; order: -1; } .sm-day > header > small { margin-left: auto; } .sm-day > div { padding: 13px; } .sm-agenda-item { padding: 14px; } .sm-agenda-time { font-size: 11px; } .sm-agenda-item h3 { font-size: 13px; } .sm-agenda-item p { font-size: 11px; } .sm-agenda-item small { font-size: 11px; } .sm-condition-row { grid-template-columns: 1fr; gap: 10px; } .sm-form-pair { grid-template-columns: 1fr; gap: 0; } .sm-source-list > div { align-items: flex-start; } .sm-local-tabs { gap: 21px; } .sm-local-tabs button { font-size: 11px; } .sm-course-heading { display: block; } .sm-course-heading > .sm-code { margin: 0 0 17px; padding: 7px 10px; } .sm-requirement > div { flex-wrap: wrap; } .sm-search { display: grid; gap: 8px; } }
@media (prefers-reduced-motion: reduce) { .sm-course-card { transition: none; } }


/* Typography, interaction, and surface roles use the same violet scale. */
.sm-workspace, .sm-dialog, .sm-loading { font-size: 14px; -webkit-font-smoothing: antialiased; }
.sm-sidebar { background: var(--sm-subtle); padding-top: 28px; }
.sm-brand > span { background: var(--sm-purple); color: white; border: 0; width: 44px; height: 44px; border-radius: 12px; font: 600 28px 'Segoe UI', sans-serif; }
.sm-brand sup { font-family: inherit; font-size: 12px; }
.sm-brand small { font-size: 10px; letter-spacing: 1.2px; }
.sm-sidebar-label { margin-top: 38px !important; letter-spacing: 1.2px; }
.sm-nav { font-size: 14px; padding: 12px; color: var(--sm-muted); }
.sm-nav:hover { background: var(--sm-soft); color: var(--sm-purple-hover); }
.sm-nav.active { background: #ebe4ff; color: #5941b1; }
.sm-exit { font-size: 12px; }
.sm-exit:hover { color: var(--sm-purple); }
.sm-topline { letter-spacing: .65px; padding: 24px 0; margin-bottom: 32px; }
.sm-topline b { background: var(--sm-soft); color: #6550b9; }
.sm-workspace h2, .sm-dialog h2 { font-size: 20px; letter-spacing: -.4px; }
.sm-eyebrow { color: var(--sm-purple-hover); letter-spacing: 1.25px; }
.sm-subtitle { font-size: 14px; line-height: 1.7; margin-top: 8px !important; }
.sm-panel, .sm-course-card, .sm-day { background: var(--sm-surface); border-radius: 12px; box-shadow: 0 2px 5px #2f265f03; }
.sm-button, .sm-icon-button { background: var(--sm-surface); color: var(--sm-ink); border-color: var(--sm-line); font-size: 13px; border-radius: 8px; }
.sm-button:hover, .sm-icon-button:hover { background: var(--sm-soft); border-color: var(--sm-accent-border); }
.sm-button.primary { background: var(--sm-purple); border-color: var(--sm-purple); color: white; }
.sm-button.primary:hover { background: var(--sm-purple-hover); }
.sm-text-button, .sm-source, .sm-mini-arrow { color: #6550b9; }
.sm-text-button { font-size: 13px; }
.sm-title-link { font-size: 14px; color: var(--sm-ink); }
.sm-badge, .sm-badge.violet, .sm-badge.green { background: var(--sm-soft); color: #6550b9; }
.sm-badge.orange { background: var(--sm-subtle); color: var(--sm-muted); border: 1px dashed var(--sm-accent-border); }
.sm-badge { font-size: 11px; border-radius: 6px; }
.sm-date-block { background: var(--sm-subtle); border: 1px solid var(--sm-line); width: 50px; min-height: 58px; }
.sm-date-block strong { font: 600 23px/1.3 'Segoe UI', sans-serif; color: #6550b9; }
.sm-date-block span { color: var(--sm-muted); font-size: 10px; }
.sm-event p, .sm-source, .sm-footnote, .sm-footer { font-size: 12px; }
.sm-event .sm-event-note { line-height: 1.7; }
.sm-week-mini strong { color: var(--sm-ink); font-size: 20px; font-weight: 600; }
.sm-week-mini b { font-size: 13px; }
.sm-week-mini small { font-size: 12px; }
.sm-code { background: var(--sm-soft); color: #6550b9; border-color: var(--sm-accent-border); font-size: 11px; }
.sm-course-card:hover { background: white; border-color: var(--sm-accent-border); }
.sm-course-card h3 { font-weight: 600; }
.sm-course-card > p, .sm-card-next { font-size: 12px; }
.sm-card-bottom > span:last-child { color: var(--sm-muted); }
.sm-local-tabs button { font-size: 14px; }
.sm-local-tabs button.active { color: var(--sm-purple); border-bottom-color: var(--sm-purple); }
.sm-fact p { color: var(--sm-muted); font-size: 14px; }
.sm-warning, .sm-information, .sm-notice { background: var(--sm-soft); border-color: var(--sm-accent-border); color: #6550b9; }
.sm-warning p { color: var(--sm-muted); line-height: 1.7; }
.sm-notice.error, .sm-dialog-error { background: #fff3f3; color: #a23d48; border-color: #f0d6da; }
.sm-workspace input, .sm-workspace select, .sm-workspace textarea, .sm-dialog input, .sm-dialog select, .sm-dialog textarea { background: var(--sm-surface); border-color: var(--sm-line); font-size: 13px; color: var(--sm-ink); border-radius: 8px; }
.sm-workspace input:focus, .sm-workspace select:focus, .sm-workspace textarea:focus { outline-color: var(--sm-accent-border); }
.sm-workspace input[type=checkbox] { accent-color: var(--sm-purple); }
.sm-day > header { background: var(--sm-subtle); }
.sm-day > header > strong { font: 600 28px/1.3 'Segoe UI', sans-serif; color: var(--sm-ink); margin: 5px 0; }
.sm-day > header > span { color: var(--sm-ink); font-size: 13px; font-weight: 500; }
.sm-day > header > small { color: var(--sm-muted); font-size: 11px; }
.sm-day.today { border-color: var(--sm-accent-border); }
.sm-day.today > header { background: var(--sm-soft); }
.sm-agenda-item { background: var(--sm-subtle); border-left-color: var(--sm-accent-border); border-radius: 7px; }
.sm-agenda-item:hover { background: var(--sm-soft); outline-color: var(--sm-accent-border); }
.sm-agenda-time { color: #6550b9; font-size: 11px; }
.sm-agenda-item h3 { font-size: 13px; color: var(--sm-ink); }
.sm-agenda-item p, .sm-agenda-item small { color: var(--sm-muted); font-size: 11px; }
.sm-warn-inline { color: #6550b9 !important; }
.sm-filter-bar label { font-size: 12px; }
.sm-tba-grid summary { flex-wrap: wrap; }
.sm-tba-grid summary > span { min-width: 0; flex: 1 1 130px; }
.sm-footer { margin-top: 32px; }
.sm-dialog { background: var(--sm-surface); box-shadow: 0 24px 80px #2f265f22; }
.sm-dialog::backdrop { background: #2f265f55; }
@media (max-width: 760px) {
  .sm-sidebar { padding: 18px 20px 12px; }
  .sm-brand > span { width: 38px; height: 38px; font-size: 25px; }
  .sm-nav { font-size: 12px; padding: 10px 11px; }
  .sm-topline { font-size: 10px; margin-bottom: 24px; padding: 18px 0; }
  .sm-topline > div { font-size: 11px; }
  .sm-subtitle { font-size: 13px; }
  .sm-exit { font-size: 11px; }
  .sm-tba-grid summary > small { font-size: 11px; }
}
@media (max-width: 460px) {
  .sm-sidebar { padding-left: 16px; padding-right: 16px; }
  .sm-exit { font-size: 0; }
  .sm-topline > div > span { display: none; }
  .sm-day > header > strong { margin: 0; font-size: 25px; }
  .sm-event { gap: 12px; }
  .sm-event.compact { gap: 12px; }
  .sm-date-block { width: 44px; }
  .sm-section-heading { flex-wrap: wrap; gap: 8px; }
  .sm-local-tabs button { font-size: 13px; }
}