/* Brand: deep violet. Neutral violet surfaces; semantic colors stay distinct. */
:root{
 --color-primary:#291572;--color-primary-hover:#21105e;--color-primary-active:#190c49;
 --color-primary-soft:#eeeafa;--color-primary-subtle:#f7f5fd;--color-primary-border:#d9d1ef;
 --color-ink:#242033;--color-muted:#686276;--color-border:#e2deeb;--color-canvas:#f7f6fa;
 --ui-border:var(--color-border);--ui-muted:var(--color-primary-subtle);--ui-focus:var(--color-primary);
 --color-success:#22603e;--color-success-bg:#edf7f0;--color-success-border:#bfdcc9;
 --color-warning:#80591b;--color-warning-bg:#fff6e4;--color-warning-border:#ead6ac;
 --color-error:#a1362b;--color-error-bg:#fff1ee;--color-error-border:#edc5bd;
}
body{background:var(--color-canvas);color:var(--color-ink)}
h1,h2,h3,.page-title{color:var(--color-ink)}
.workspace .panel,.workspace .stat{border-color:var(--color-border);box-shadow:0 2px 6px #29157204}
.app-layout .sidebar,.auth-story{background:#211055;color:#e8e2f7}
.sidebar .brand,.auth-story .brand{color:#fff}
.sidebar .brand small,.sidebar .nav-label,.sidebar nav .nav-label{color:#c1b5dd}
.sidebar nav a{color:#e8e2f7}
.sidebar nav a:hover,.nav-group>summary:hover{background:#ffffff0d;color:#fff}
.sidebar nav a.active{background:#eee9ff;color:#291572;font-weight:600}
.sidebar .nav-group>summary{color:#c5b9e3}
.sidebar .nav-group-links,.app-layout .sidebar .sidebar-bottom{border-color:#ffffff20}
.sidebar-period{background:#ffffff08;border-color:#ffffff18}
.sidebar-period-label,.sidebar-period-note{color:#c8bde0}
.sidebar-period-label>span{background:#c4b5fd}
.sidebar-period-value>strong{color:#fff}
.sidebar-period-value>span{color:#eee7ff;background:#ffffff0b;border-color:#ffffff28}
.sidebar-logout{color:#eee8f8;border-color:#ffffff30}
.sidebar-logout:hover{background:#ffffff12;border-color:#ffffff60}
.app-layout .sidebar nav{scrollbar-color:#8572b5 transparent}
.sidebar-logout:focus-visible{outline-color:#d8caff}
.nav-backdrop{background:#190c4980}
.app-layout .topbar{background:#fff;border-color:var(--color-border)}
.account-profile{border-color:var(--color-border)}
.account-profile strong,.app-layout .topbar .school-name{color:var(--color-ink)}
.account .account-profile small{color:var(--color-muted)}
.header-period{background:var(--color-primary-subtle);border-color:var(--color-primary-border);color:var(--color-primary)}
.button,.workspace .button{background:var(--color-primary);color:#fff;border-color:transparent}
.button:hover,.workspace .button:hover{background:var(--color-primary-hover)}
.button:active,.workspace .button:active{background:var(--color-primary-active)}
.secondary,.workspace .secondary{background:#fff;color:var(--color-primary);border-color:var(--color-primary-border)}
.secondary:hover,.workspace .secondary:hover{background:var(--color-primary-soft);border-color:#b9a9df}
.text-link,.student-name{color:var(--color-primary)}
.text-link:hover,.student-name:hover{color:var(--color-primary-hover)}
:focus-visible,.workspace :is(.button,.secondary,.danger):focus-visible{outline-color:#9276ce}
.workspace :is(input,select,textarea):focus{outline-color:#7053b1;border-color:#7053b1;box-shadow:0 0 0 3px #eeeafa}
input:focus,select:focus{border-color:#7053b1}
input[type=checkbox],.workspace input[type=checkbox],table[data-followup-grid] input[type=checkbox]{accent-color:var(--color-primary)}
label,legend{color:#51495f}
.workspace input:not([type=checkbox]):not([type=hidden]),.workspace select,.workspace textarea{color:var(--color-ink);border-color:#d9d3e4}
.workspace :is(input,textarea)::placeholder{color:#827b8d}
.workspace :is(input,select,textarea):disabled{background:#f0eef4;color:#797283}
.badge{background:var(--color-primary-soft);color:var(--color-primary)}
.badge.muted{background:#efedf2;color:#716a7c}
.hint,.subtext,.workspace .hint,.workspace .subtext,.empty p{color:var(--color-muted)}
.eyebrow{color:#76668d}
.notice{color:var(--color-success);background:var(--color-success-bg);border-color:var(--color-success-border)}
.error{color:var(--color-error);background:var(--color-error-bg);border-color:var(--color-error-border)}
.workspace :is([data-attendance-status],[data-grade-save-status],[data-uh-save-status]){color:var(--color-primary);background:var(--color-primary-subtle);border-color:var(--color-primary-border)}
.workspace .grade-save-failed{color:var(--color-error);background:var(--color-error-bg);border-color:var(--color-error-border)}
.workspace .panel-head,.workspace details.panel[open]>summary{border-color:#ebe7f1}
.workspace details.panel[open]>summary{background:var(--color-primary-subtle)}
.workspace :is(.attendance-heading,.grade-section-title,.uh-heading,.student-form-section>summary){color:var(--color-primary)}
.workspace :is(.grade-save-actions,.followup-save,.module-save-bar){background:var(--color-primary-subtle);border-color:var(--color-border)}
th,table.dataTable thead>tr>th,.workspace .data-grid-scroll thead th,.workspace table:is([data-grade-grid],[data-uh-grid],[data-attendance-grid]) thead th:nth-child(-n+2){background:#f3f0f9;color:#60566f;border-color:var(--color-border)}
td,table.dataTable tbody>tr>td{border-color:#eeeaf3}
.workspace table.dataTable tbody>tr:hover>td{background:#f8f6fd}
.workspace table tbody tr:focus-within>td{background:#f0ebfc}
.workspace table:is([data-grade-grid],[data-uh-grid],[data-attendance-grid]) :is(th,td):nth-child(2){border-right-color:var(--color-border)}
.workspace .attendance-unrecorded td,.workspace .attendance-unrecorded td:nth-child(-n+2){background:#fffaf0}
.workspace :is(input.grade-score,input.uh-score):placeholder-shown{background:var(--color-warning-bg);border-color:var(--color-warning-border)}
.workspace :is(input.grade-score,input.uh-score)[aria-invalid=true]{background:var(--color-error-bg);border-color:var(--color-error)}
div.dt-container,div.dt-container .dt-search input,div.dt-container .dt-length select{color:var(--color-ink)}
div.dt-container .dt-info{color:var(--color-muted)}
div.dt-container .dt-paging .dt-paging-button{color:var(--color-primary)!important}
div.dt-container .dt-paging .dt-paging-button.current,div.dt-container .dt-paging .dt-paging-button.current:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff!important}
div.dt-container .dt-paging .dt-paging-button:hover{background:var(--color-primary-soft);border-color:var(--color-primary-border);color:var(--color-primary)!important}
.grid-scroll-hint{background:#faf9fd;color:var(--color-muted);border-color:var(--color-border)}
.dash-welcome,.hero{background:#eee9fa;border-color:var(--color-primary-border)}
.dash-welcome h2,.hero h2,.dash-period strong,.dash-stat>strong,.dash-today-item strong,.uh-stats strong,.followup-summary strong,.journal-counts strong,.stat strong{color:var(--color-primary)}
.dash-welcome p:not(.eyebrow),.hero p:not(.eyebrow),.dash-period span,.dash-task p,.dash-guide p,.dash-module-row p,.dash-stat>p,.dash-today-item span,.dash-cell-note{color:var(--color-muted)}
.dash-period{border-color:#cbbde5}
.dash-stat,.stat,.module{border-color:var(--color-border)}
.dash-stat>span,.dash-task p.dash-task-scope,.dash-guide h3,.dash-module-row h3,.module h3{color:#504061}
.dash-guide,.followup-summary>div,.journal-counts>div{background:var(--color-primary-subtle);border-color:var(--color-border)}
.dash-task,.dash-today-item,.dash-module-row{border-color:#ebe7f1}
.dash-task-module,.dash-task-arrow{color:#806b9a}
.dash-task:hover h3{color:var(--color-primary)}
.dash-module-progress strong{color:var(--color-primary)}
.dash-module-progress>div{color:var(--color-muted)}
.dash-module-progress meter::-webkit-meter-bar{background:#eee9f6}
.dash-module-progress meter::-webkit-meter-optimum-value{background:#7b61b4}
.dash-module-progress meter::-moz-meter-bar{background:#7b61b4}
.dash-status.draft{color:var(--color-warning);background:var(--color-warning-bg)}
.dash-status.final{color:var(--color-success);background:var(--color-success-bg)}
.module:hover{border-color:#a48bcf}
.followup-summary span,.journal-counts span{color:var(--color-muted)}
.followup-history pre,.journal-history pre{background:#f5f2fa;color:var(--color-ink)}
table[data-followup-grid] tr[data-selected="true"]{background:#f7f3fe}
.grade-progress{color:var(--color-primary);border-color:var(--color-border)}
.grade-scope,.uh-max{color:var(--color-muted)}
.student-dialog{color:var(--color-ink);border-color:var(--color-primary-border)}
.student-dialog::backdrop{background:#190c49a6}
.student-dialog-head{background:var(--color-primary-soft);border-color:var(--color-primary-border)}
.student-dialog-footer,.student-save-bar{background:var(--color-primary-subtle);border-color:var(--color-border)}
.student-detail-section h3,.student-form-section>h3{color:var(--color-primary)}
.student-detail-grid dt{color:var(--color-muted)}
.record-row{background:#faf9fd;border-color:var(--color-border)}
.auth-story .eyebrow,.auth-story p:not(.eyebrow),.story-foot{color:#c7bae2}
.auth-story h1{color:#fff}
.auth-story{background:#211055}
.footer{border-color:var(--color-border);color:var(--color-muted)}

/* Clean presentation: neutral surfaces, restrained accents, clear primary actions. */
:root{--color-canvas:#f8f9fb;--color-border:#e6e7ed;--ui-radius:10px}
.workspace .panel,.workspace .stat,.workspace .dash-stat{box-shadow:none;border-color:var(--color-border)}
.workspace .panel-head{background:#fff;border-bottom-color:#f0f0f4}
.workspace .panel-head .eyebrow{color:#817b8c;font-weight:500;letter-spacing:.06em}
.workspace .dash-welcome{background:transparent;border:0;border-bottom:1px solid var(--color-border);border-radius:0;padding:4px 0 24px}
.workspace .dash-welcome h2{font-size:clamp(1.4rem,2.3vw,1.875rem);line-height:1.4;margin:10px 0}
.workspace .dash-welcome p:not(.eyebrow){max-width:660px}
.workspace .dash-welcome-actions{margin-top:20px}
.workspace .dash-stat{border-radius:10px}
.workspace .dash-stat>strong{font-size:1.875rem;margin:12px 0 8px}
.workspace .dash-stat>span{color:#696375;font-size:.75rem;font-weight:500}
.workspace .dash-stat>p{font-size:.75rem;line-height:1.65}
.workspace .dash-guide{background:#fff;border:1px solid var(--color-border);border-radius:10px}
.dash-guide>summary{font-size:.8125rem;font-weight:500;color:#625a72;cursor:pointer}
.workspace :is(.followup-summary>div,.journal-counts>div){background:#fafafd;border:1px solid #ededf3;border-radius:8px}
.workspace :is(.grade-save-actions,.followup-save,.module-save-bar){background:#fcfcfe}
.workspace :is([data-attendance-status],[data-grade-save-status],[data-uh-save-status]){background:#faf9fd;border-color:#e8e3f1;font-size:.75rem}
.workspace .grade-save-failed{background:var(--color-error-bg);border-color:var(--color-error-border)}
th,table.dataTable thead>tr>th,.workspace .data-grid-scroll thead th,.workspace table:is([data-grade-grid],[data-uh-grid],[data-attendance-grid]) thead th:nth-child(-n+2){background:#f8f8fb;color:#6a6376}
.workspace table.dataTable tbody>tr:hover>td{background:#faf9fd}
.workspace :is(.button,.secondary,.danger){border-radius:7px;font-weight:500}
.workspace .secondary{border-color:#dfdce8;background:#fff}
.workspace .secondary:hover{background:#f7f5fc;border-color:#bdb1d5}
.text-link{text-decoration:none}
.text-link:hover{text-decoration:underline;text-underline-offset:4px}
.workspace .badge{font-weight:500;border-radius:5px}
.workspace details.panel[open]>summary{background:#fafafd}
.sidebar .brand{letter-spacing:.02em}
.sidebar nav a{border-radius:6px}
.sidebar nav a.active{background:#eae4fc;color:#291572}
.sidebar-period{padding:14px;background:#ffffff08;border:1px solid #ffffff18;border-radius:10px}
.sidebar-period-value{margin-top:10px}
.sidebar-period-note{margin-top:8px}
.sidebar-period-value>span{border:1px solid #ffffff28;background:#ffffff0b}
.sidebar-logout{background:transparent;border-color:#ffffff30}
.footer{font-size:.6875rem;border-color:#e9e8ee}
@media(max-width:767px){.workspace .dash-welcome{padding:0 0 20px}.workspace .dash-stat>strong{font-size:1.625rem}}

/* Dashboard welcome banner. */
.workspace .dash-welcome{background:var(--color-primary);border:0;border-radius:12px;padding:32px}
.workspace .dash-welcome h2{color:#fff}
.workspace .dash-welcome .eyebrow{color:#dcd3f6}
.workspace .dash-welcome p:not(.eyebrow){color:#f0ebfc}
.workspace .dash-welcome .button{background:#fff;color:var(--color-primary);border-color:#fff}
.workspace .dash-welcome .button:hover{background:#f0ebfc;border-color:#f0ebfc}
.workspace .dash-welcome .text-link{color:#fff}
.workspace .dash-welcome .text-link:hover{color:#f0ebfc}
.workspace .dash-welcome :is(a,button):focus-visible{outline-color:#fff;outline-offset:4px}
@media(max-width:767px){.workspace .dash-welcome{padding:24px}}

/* Shared outline icon sizing and alignment. */
.ui-icon{display:inline-block;width:18px;height:18px;flex-shrink:0;vertical-align:-3px;color:inherit}
:is(.button,.secondary,.text-link,.danger){gap:8px}
.text-link:has(.ui-icon){display:inline-flex;align-items:center;flex-wrap:wrap}
.sidebar nav a{gap:10px}
.sidebar nav a>.ui-icon{width:18px;height:18px;opacity:.85}
.sidebar nav a.active>.ui-icon{opacity:1}
.nav-chevron{display:inline-flex;align-items:center;justify-content:center}
.nav-chevron .ui-icon{width:16px;height:16px}
.dash-task-arrow,.dash-module-row>span[aria-hidden]{display:inline-flex;align-items:center;justify-content:center}
.empty-mark .ui-icon{width:28px;height:28px}
@media(max-width:767px){.workspace .ui-icon{width:16px;height:16px}.app-layout .topbar .nav-toggle .ui-icon{width:20px;height:20px}.sidebar nav a>.ui-icon{width:18px;height:18px}}