/* Canonical UI tokens: DESIGN.md. Brand files and licenses: docs/brand/README.md. */
@font-face { font-family: Raleway; src: url("/assets/brand/fonts/raleway-variable.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("/assets/brand/fonts/cormorant-garamond-variable.ttf") format("truetype"); font-weight: 300 700; font-style: normal; font-display: swap; }
:root {
--impact-gold: #76613c;
--serenity-blue: #c2e6e8;
--horizon-blue: #86b3c8;
--heritage-gold: #9e7f3c;
--sandstone-beige: #f4dba3;
--thin-grey: #f5f7f5;
--sacred-sand: #fcf5e2;
--impact-terracotta: #874b4b;
--night: #2d2b2a;
--bg: var(--thin-grey);
--surface: #ffffff;
--text: var(--night);
--muted: #625b52;
--border: #deded5;
--border-strong: #82796c;
--accent: var(--impact-gold);
--accent-hover: #5d4b2e;
--accent-tint: var(--sacred-sand);
--secondary: #30586b;
--secondary-tint: var(--serenity-blue);
--error: var(--impact-terracotta);
--error-tint: #f8ece8;
--event-draft: #625b52;
--event-draft-bg: #efeee8;
--event-published: #30586b;
--event-published-bg: var(--serenity-blue);
--event-closed: var(--impact-gold);
--event-closed-bg: var(--sacred-sand);
--space-sm: 0.5rem;
--space-md: 0.75rem;
--space-lg: 1.25rem;
--space-xl: 2rem;
}
* { box-sizing: border-box; }
input, select, textarea, button { font-family: inherit; }
input, select, textarea { color: var(--text); border-color: var(--border-strong); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.brand-statement { font-family: "Cormorant Garamond", Georgia, serif; }
body {
margin: 0;
font-size: 1rem;
font-variant-numeric: lining-nums;
font-family: Raleway, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
background: var(--bg);
color: var(--text);
line-height: 1.5;
min-height: 100vh;
}
a { color: var(--accent); }
main {
max-width: 42rem;
margin: 0 auto;
padding: 2rem 1rem 3rem;
}
h1 {
font-size: 1.5rem;
font-weight: 600;
margin: 0 0 0.35rem;
}
.lede {
color: var(--muted);
margin: 0 0 1.5rem;
font-size: 0.95rem;
}
.panel {
background: var(--surface);
border: 1px solid var(--border);
border-radius: 0.75rem;
padding: 1.25rem;
}
label {
display: block;
font-size: 0.85rem;
font-weight: 600;
margin-bottom: 0.4rem;
}
.field-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); margin-bottom: 0.35rem; }
.field-label-row label { margin: 0; }
.field-inline-link { font-size: 0.875rem; color: var(--accent); text-decoration: none; }
.field-inline-link:hover { color: var(--accent-hover); text-decoration: underline; }
.password-field__control { position: relative; }
.password-field__control input[type="password"],
.password-field__control input[type="text"] {
width: 100%;
padding-right: 3.25rem;
}
.password-field__toggle {
position: absolute;
right: 0.25rem;
top: 50%;
transform: translateY(-50%);
display: flex;
align-items: center;
justify-content: center;
width: 2.75rem;
height: 2.75rem;
padding: 0;
border: none;
border-radius: 0.375rem;
background: transparent;
color: var(--muted);
cursor: pointer;
}
.password-field__toggle:hover { color: var(--accent-hover); }
.password-field__icon {
width: 1.125rem;
height: 1.125rem;
}
.password-field__icon--hide { display: none; }
.password-field__toggle[aria-pressed="true"] .password-field__icon--show { display: none; }
.password-field__toggle[aria-pressed="true"] .password-field__icon--hide { display: block; }
input[type="search"], input[type="email"], input[type="password"], input[type="text"], input[type="url"] {
width: 100%;
min-height: 2.75rem;
padding: 0.65rem 0.85rem;
border: 1px solid var(--border-strong);
border-radius: 0.5rem;
font: inherit;
font-size: 1rem;
background: var(--surface);
color: var(--text);
}
input:focus-visible {
outline: 2px solid var(--accent);
border-color: var(--accent);
}
.list {
list-style: none;
margin: 1rem 0 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.list li {
border: 1px solid var(--border);
border-radius: 0.5rem;
padding: 0.75rem 0.9rem;
background: var(--bg);
}
.list strong { display: block; }
.list span { color: var(--muted); font-size: 0.875rem; }
.empty {
margin: 1rem 0 0;
color: var(--muted);
font-size: 0.95rem;
}
.meta {
margin-top: 1.5rem;
font-size: 0.8rem;
color: var(--muted);
}
.page-header {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
gap: 0.75rem 1rem;
margin-bottom: 0.35rem;
}
.page-header h1 { margin: 0; }
.page-header--event { align-items: center; margin-bottom: var(--space-md); }
.event-subpage-intro { display: flex; flex-direction: column; gap: 0.35rem; }
.event-subpage-title { display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--space-xl); row-gap: var(--space-md); }
.event-subpage-title h1 { margin: 0; min-width: 0; margin-inline-end: var(--space-sm); }
.event-subpage-title .chip,
.event-subpage-title .event-chip { flex-shrink: 0; }
.event-row-title { display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--space-xl); row-gap: var(--space-sm); min-width: 0; }
.event-row-title .admin-user-link { min-width: 0; overflow-wrap: anywhere; }
.event-row-title .chip,
.event-row-title .event-chip { flex-shrink: 0; }
.event-subpage-meta { margin: 0 0 var(--space-lg); margin-left: 0; }
.event-title-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md) var(--space-lg); margin-left: auto; }
.event-title-meta > .chip,
.event-title-meta > .event-chip { flex-shrink: 0; }
.locale-switcher {
display: inline-flex;
align-items: center;
gap: 0.15rem;
margin: 0;
}
.locale-switcher__btn {
min-height: 2.75rem;
min-width: 2.75rem;
padding: 0.25rem 0.5rem;
border: none;
background: transparent;
font: inherit;
font-size: 0.875rem;
font-weight: 500;
color: var(--muted);
cursor: pointer;
border-radius: 0.375rem;
}
.locale-switcher__btn:hover { color: var(--accent); }
.locale-switcher__btn--active {
font-weight: 600;
color: var(--accent);
}
.locale-switcher__sep {
color: var(--border);
user-select: none;
}
h2 { font-size: 1.25rem; font-weight: 500; margin: 0; }
p { overflow-wrap: anywhere; }
.brand-header { padding: 0 1rem; display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); border-bottom: 1px solid var(--border); background: var(--surface); }
.brand-lockup { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; padding: 26px; }
.brand-logo { display: block; width: 140px; min-width: 140px; height: auto; }
.brand-context { color: var(--muted); font-size: 0.8125rem; font-weight: 400; margin: 0; }
.app-header { position: relative; z-index: 40; flex-wrap: wrap; column-gap: var(--space-md); }
.brand-link { text-decoration: none; }
.app-nav { display: flex; flex: 1 1 20rem; min-width: 0; max-width: 100%; flex-wrap: nowrap; align-items: center; gap: 0.25rem; overflow: visible; padding: 6px; }
.app-nav-scroll { display: flex; flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; align-items: center; gap: 0.25rem; overflow-x: auto; padding: 0; scroll-padding-inline: 6px; scrollbar-width: thin; }
.app-nav-link { display: inline-flex; flex: 0 0 auto; align-items: center; min-height: 2.75rem; padding: 0.5rem 0.75rem; border-bottom: 2px solid transparent; color: var(--muted); font-size: 0.875rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.app-nav-link:hover { color: var(--text); background: var(--bg); }
.app-nav-link[aria-current="page"] { color: var(--accent); border-bottom-color: var(--accent); background: var(--accent-tint); }

.app-nav-dropdown { position: relative; flex: 0 0 auto; }
.app-nav-dropdown-trigger { cursor: pointer; list-style: none; gap: 0.15rem; }
.app-nav-dropdown-trigger::-webkit-details-marker { display: none; }
.app-nav-dropdown-trigger--active { color: var(--accent); border-bottom-color: var(--accent); background: var(--accent-tint); }
.app-nav-dropdown-chevron { flex-shrink: 0; color: var(--muted); }
.app-nav-dropdown[open] .app-nav-dropdown-chevron { transform: rotate(180deg); }
.app-nav-dropdown-panel { position: absolute; top: calc(100% + 2px); left: 0; z-index: 20; min-width: 11rem; max-width: calc(100vw - 2rem); padding: 0.35rem; border: 1px solid var(--border-strong); border-radius: 0.75rem; background: var(--surface); box-shadow: 0 4px 16px -2px rgba(31, 33, 36, 0.06); }
.app-nav-dropdown-link { display: flex; align-items: center; min-height: 2.75rem; padding: 0.75rem; border-radius: 0.5rem; color: var(--text); font-size: 0.875rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.app-nav-dropdown-link:hover { background: var(--bg); }
.app-nav-dropdown-link[aria-current="page"] { background: var(--accent-tint); color: var(--accent); }

.app-header-actions { display: flex; flex: 0 0 auto; align-items: center; gap: var(--space-sm); margin-left: auto; }
.account-menu { position: relative; }
.account-menu-trigger { display: flex; align-items: center; gap: var(--space-sm); min-height: 2.75rem; padding: 0.25rem 0.75rem 0.25rem 0.25rem; border: 1px solid var(--border-strong); border-radius: 9999px; background: var(--surface); cursor: pointer; list-style: none; font-size: 0.875rem; }
.account-menu-trigger::-webkit-details-marker { display: none; }
.account-menu-trigger:hover, .account-menu[open] .account-menu-trigger { background: var(--bg); }
.account-menu-trigger--active { border-color: var(--accent); }
.account-menu-trigger:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.account-avatar { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; flex-shrink: 0; border-radius: 9999px; background: var(--accent-tint); color: var(--accent); font-size: 0.75rem; font-weight: 600; }
.account-menu-name { max-width: 10rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-menu-chevron { flex-shrink: 0; color: var(--muted); }
.account-menu[open] .account-menu-chevron { transform: rotate(180deg); }
.account-menu-panel { position: absolute; top: calc(100% + var(--space-sm)); right: 0; z-index: 20; width: 15rem; max-width: calc(100vw - 2rem); padding: 0.35rem; border: 1px solid var(--border-strong); border-radius: 0.75rem; background: var(--surface); box-shadow: 0 4px 16px -2px rgba(31, 33, 36, 0.06); }
.account-menu-link { display: flex; align-items: center; gap: var(--space-md); min-height: 2.75rem; padding: 0.75rem; border-radius: 0.5rem; color: var(--text); font-size: 0.875rem; text-decoration: none; }
.account-menu-link svg { flex-shrink: 0; color: var(--muted); }
.account-menu-link:hover { background: var(--bg); }
.account-menu-link[aria-current="page"] { background: var(--accent-tint); color: var(--accent); font-weight: 500; }
.account-menu-logout { margin: 0.35rem 0 0; padding-top: 0.35rem; border-top: 1px solid var(--border); }
.account-menu-logout button { width: 100%; border: 0; background: transparent; font: inherit; font-size: 0.875rem; text-align: left; cursor: pointer; }
.account-menu-logout button:hover { background: var(--bg); }
@media (max-width: 1100px) {
.app-header { padding: 0 0.75rem; gap: 0 var(--space-sm); }
.app-nav { order: 3; flex-basis: 100%; margin-bottom: var(--space-sm); gap: 0.25rem; }
.app-nav-link { padding: 0.5rem; }
.app-header-actions { gap: var(--space-sm); }
.account-menu-name, .account-menu-chevron { display: none; }
.account-menu-trigger { justify-content: center; min-width: 2.75rem; padding: 0.25rem; }
}
.auth-page { display: flex; justify-content: center; align-items: center; min-height: calc(100svh - 4.5rem); max-width: 42rem; padding-top: 3rem; padding-bottom: 3rem; }
.auth-card { width: 100%; max-width: 36rem; padding: var(--space-xl); }
.auth-card--login { max-width: 28rem; }
.auth-card .page-header { align-items: center; margin-bottom: var(--space-lg); }
.form-stack { display: flex; flex-direction: column; gap: var(--space-lg); }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { width: 100%; padding: 0 0 var(--space-md); margin-bottom: var(--space-md); border-bottom: 1px solid var(--border); font-size: 0.8125rem; font-weight: 600; }
.form-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.field-hint { font-size: 0.8125rem; color: var(--muted); margin: var(--space-sm) 0 0; }
.checkbox-row { display: flex; align-items: flex-start; gap: var(--space-sm); margin: 0 0 var(--space-md); font-size: 0.875rem; font-weight: 400; cursor: pointer; }
.checkbox-row input[type="checkbox"] { margin: 0.2rem 0 0; flex-shrink: 0; width: 1.125rem; height: 1.125rem; min-height: auto; accent-color: var(--accent); }
.form-stack input[type="file"] { display: block; width: 100%; min-height: 2.75rem; padding: 0.5rem 0.85rem; border: 1px solid var(--border-strong); border-radius: 0.5rem; font: inherit; font-size: 0.875rem; background: var(--surface); color: var(--text); }
.form-stack input[type="file"]:focus-visible { outline: 2px solid var(--accent); border-color: var(--accent); }
.form-stack input[type="date"], .form-stack select { width: 100%; min-height: 2.75rem; padding: 0.65rem 0.85rem; border: 1px solid var(--border-strong); border-radius: 0.5rem; font: inherit; font-size: 1rem; background: var(--surface); color: var(--text); }
.form-stack input[type="date"]:focus-visible, .form-stack select:focus-visible { outline: 2px solid var(--accent); border-color: var(--accent); }
.student-directory-filters { display: flex; flex-wrap: nowrap; align-items: flex-end; gap: 0.75rem; overflow-x: auto; margin-bottom: var(--space-sm); padding-bottom: 0.25rem; }
.student-directory-filters label { display: flex; flex-direction: column; gap: 0.25rem; margin: 0; flex: 0 0 auto; min-width: 0; }
.student-directory-filters label:first-child { flex: 1 0 12rem; }
.student-directory-filters .field-label { margin: 0; white-space: nowrap; }
.student-directory-filters input[type="search"], .student-directory-filters select, .student-directory-filters .button { min-height: 2.75rem; }
.student-directory-filters select, .student-directory-filters input[type="search"] { border: 1px solid var(--border-strong); border-radius: 0.5rem; padding: 0.5rem 0.75rem; font: inherit; font-size: 0.875rem; background: var(--surface); color: var(--text); }
.student-directory-filters select:focus-visible, .student-directory-filters input:focus-visible { outline: 2px solid var(--accent); border-color: var(--accent); }
.admin-table.student-directory-table { table-layout: fixed; min-width: 52rem; font-size: 0.8125rem; }
.student-directory-table th { white-space: nowrap; }
.student-directory-table td { overflow-wrap: break-word; }
.student-directory-table th:nth-child(1), .student-directory-table td:nth-child(1) { width: 34%; }
.student-directory-table th:nth-child(2), .student-directory-table td:nth-child(2) { width: 22%; }
.student-directory-table th:nth-child(3), .student-directory-table td:nth-child(3) { width: 10%; white-space: nowrap; }
.student-directory-table th:nth-child(4), .student-directory-table td:nth-child(4) { width: 18%; white-space: nowrap; }
.student-directory-table th:nth-child(5), .student-directory-table td:nth-child(5) { width: 16%; }
.admin-table.users-table { table-layout: fixed; min-width: 72rem; font-size: 0.8125rem; }
.users-table .admin-table__name { position: static; }
.users-table th { white-space: nowrap; }
.users-table td { overflow-wrap: break-word; }
.users-table th:nth-child(1), .users-table td:nth-child(1) { width: 20%; }
.users-table th:nth-child(2), .users-table td:nth-child(2) { width: 12%; }
.users-table th:nth-child(3), .users-table td:nth-child(3) { width: 24%; }
.users-table th:nth-child(4), .users-table td:nth-child(4) { width: 14%; }
.users-table th:nth-child(5), .users-table td:nth-child(5) { width: 10%; white-space: nowrap; }
.users-table th:nth-child(6), .users-table td:nth-child(6) { width: 20%; }
.users-table .button, .users-table .chip { white-space: nowrap; }
.student-sort-link { white-space: nowrap; color: inherit; font-weight: 500; text-decoration: none; }
.student-sort-link:hover { text-decoration: underline; }
.field-label { font-size: 0.8125rem; font-weight: 500; color: var(--muted); margin: 0 0 var(--space-sm); }
.read-only-field { margin-bottom: var(--space-lg); }
.read-only-field p { margin: 0 0 var(--space-sm); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; padding: 0.65rem 1rem; border: 1px solid var(--border-strong); border-radius: 0.5rem; background: var(--surface); color: var(--text); font: inherit; font-size: 0.875rem; font-weight: 600; text-decoration: none; cursor: pointer; }
.button:hover { background: var(--bg); }
.button--primary { background: var(--accent); color: var(--surface); border-color: var(--accent); }
.button--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.button:disabled, .button[disabled] { opacity: 0.55; cursor: not-allowed; }
.button--primary:disabled, .button--primary[disabled] { background: var(--accent); border-color: var(--accent); }
.button--primary:disabled:hover, .button--primary[disabled]:hover { background: var(--accent); border-color: var(--accent); }
button:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.auth-alert, .success-banner, .notice { border: 1px solid var(--border); border-radius: 0.5rem; padding: var(--space-md) 1rem; font-size: 0.875rem; margin: 0 0 var(--space-lg); }
.auth-alert { background: var(--error-tint); color: var(--error); border-color: var(--error); }
.success-banner { background: var(--secondary-tint); color: var(--secondary); border-color: var(--secondary); }
.notice { background: var(--accent-tint); color: var(--muted); margin: 0; }
.home-banner { margin-bottom: var(--space-lg); }
.home-page { max-width: 60rem; }
.home-agenda { margin-top: var(--space-xl); }
.home-agenda__header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-sm); margin-bottom:var(--space-md); }
.home-agenda__header h2 { margin:0; font-size:1.125rem; font-weight:500; }
.home-agenda__controls { display:flex; flex-wrap:wrap; gap:var(--space-sm); }
.home-agenda__list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--space-md); }
.home-agenda-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:0; }
.home-agenda-card__media { display:flex; align-items:center; justify-content:center; min-width:0; padding:var(--space-lg); background:var(--bg); border-radius:0.75rem 0 0 0.75rem; }
.home-agenda-card__poster { display:block; width:100%; height:auto; max-height:26rem; object-fit:contain; }
.home-agenda-card__placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-md); min-height:16rem; color:var(--muted); font-size:0.875rem; }
.home-agenda-card__media [hidden] { display:none; }
.home-agenda-card__body { min-width:0; padding:var(--space-xl); align-self:center; }
.home-agenda-card__body > .chip,
.home-agenda-card__body > .event-chip { margin-bottom:var(--space-sm); }
.home-agenda-card__title { margin:var(--space-md) 0 var(--space-lg); font-size:1.5rem; font-weight:600; line-height:1.3; overflow-wrap:anywhere; }
.home-agenda-card__title a { color:var(--text); text-decoration:none; }
.home-agenda-card__title a:hover { color:var(--accent); text-decoration:underline; }
.home-agenda-card__schedule p { margin:0; }
.home-agenda-card__schedule .home-agenda-card__time { margin-top:0.25rem; color:var(--muted); font-size:0.875rem; }
.home-agenda-card__place, .home-agenda-card__meet { margin:var(--space-sm) 0 0; overflow-wrap:anywhere; }
.home-agenda-card__meet { font-size:0.875rem; }
.home-agenda-card__status { display:flex; flex-direction:column; gap:0.25rem; border-top:1px solid var(--border); padding-top:var(--space-lg); margin-top:var(--space-lg); font-size:0.875rem; }
.home-agenda-card__status .field-label { margin:0; }
.home-agenda-card__actions { display:flex; flex-wrap:wrap; gap:var(--space-sm); margin-top:var(--space-md); }
.home-agenda-card__actions:empty { display:none; }
@media (max-width: 42rem) {
  .home-agenda-card { grid-template-columns:minmax(0,1fr); }
  .home-agenda-card__media { border-radius:0.75rem 0.75rem 0 0; padding:var(--space-md); }
  .home-agenda-card__poster { max-height:18rem; }
  .home-agenda-card__placeholder { min-height:8rem; }
  .home-agenda-card__body { padding:var(--space-lg); }
  .home-agenda-card__title { font-size:1.375rem; }
}
.auth-footer { border-top: 1px solid var(--border); padding-top: var(--space-lg); margin: var(--space-lg) 0 0; text-align: center; font-size: 0.875rem; color: var(--muted); }
.auth-google { display: flex; flex-direction: column; gap: var(--space-lg); margin-top: var(--space-lg); }
.auth-divider { display: flex; align-items: center; gap: var(--space-md); margin: 0; color: var(--muted); font-size: 0.8125rem; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.auth-google .button { width: 100%; }
.button--google { gap: 0.75rem; font-weight: 600; }
.button--google:hover { border-color: var(--accent); }
.button--google__icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }
.home-user-name { font-size: 1.25rem; font-weight: 600; margin: 0; }
.home-user-email { margin: var(--space-sm) 0 var(--space-lg); color: var(--muted); }
main.admin-main { max-width: 68rem; }
.admin-breadcrumb { font-size: 0.875rem; color: var(--muted); margin-bottom: var(--space-md); }
.admin-filters { display: grid; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto; gap: var(--space-md); align-items: end; margin-bottom: var(--space-lg); }
.admin-filters label { display: flex; flex-direction: column; gap: var(--space-sm); min-width: 0; margin: 0; }
.admin-filters .field-label { margin: 0; }
.admin-filters input[type="search"], .admin-filters select { width: 100%; height: 2.75rem; min-height: 2.75rem; border: 1px solid var(--border-strong); border-radius: 0.5rem; padding: 0.5rem 0.75rem; font: inherit; font-size: 0.875rem; font-weight: 400; background: var(--surface); color: var(--text); }
.admin-filters > .button { height: 2.75rem; padding: 0.5rem 1rem; }
.admin-filters select:focus-visible { outline: 2px solid var(--accent); border-color: var(--accent); }
@media (max-width: 767px) {
.admin-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-filters label:first-child, .admin-filters > .button { grid-column: 1 / -1; }
}
.admin-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 0.75rem; background: var(--surface); }
.admin-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.admin-table th, .admin-table td { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.admin-table th { font-size: 0.75rem; font-weight: 500; color: var(--muted); background: var(--bg); }
.admin-table tbody tr:last-child td { border-bottom: 0; }
.leaderboard-row--own td { background: color-mix(in srgb, var(--accent) 12%, var(--surface)); }
.leaderboard-table-wrap, .history-table-wrap { margin-top: var(--space-md); }
.admin-table.leaderboard-table { table-layout: auto; width: max-content; min-width: 100%; font-size: 0.8125rem; }
.leaderboard-table th, .leaderboard-table td { width: auto; white-space: nowrap; overflow-wrap: normal; }
.leaderboard-table th:first-child, .leaderboard-table td:first-child { width: 1%; text-align: right; white-space: nowrap; }
.leaderboard-table th:nth-child(2), .leaderboard-table td:nth-child(2) { min-width: 12rem; max-width: 18rem; white-space: normal; overflow-wrap: break-word; }
.leaderboard-table .event-numbers { text-align: right; }
.leaderboard-table .field-hint { display: block; white-space: nowrap; }
.leaderboard-chooser-table { table-layout: fixed; min-width: 48rem; font-size: 0.8125rem; }
.leaderboard-chooser-table .admin-table__name { position: static; }
.leaderboard-chooser-table th { white-space: nowrap; }
.leaderboard-chooser-table td { overflow-wrap: break-word; }
.leaderboard-chooser-table th:first-child, .leaderboard-chooser-table td:first-child { width: 68%; }
.leaderboard-chooser-table th:nth-child(2), .leaderboard-chooser-table td:nth-child(2) { width: 32%; white-space: nowrap; }
.leaderboard-chooser-table.leaderboard-chooser-table--scores { min-width: 70rem; }
.leaderboard-chooser-table--scores th:nth-child(1), .leaderboard-chooser-table--scores td:nth-child(1) { width: 28%; white-space: normal; }
.leaderboard-chooser-table--scores th:nth-child(2), .leaderboard-chooser-table--scores td:nth-child(2) { width: 16%; white-space: nowrap; }
.leaderboard-chooser-table--scores th:nth-child(3), .leaderboard-chooser-table--scores td:nth-child(3) { width: 16%; white-space: nowrap; }
.leaderboard-chooser-table--scores th:nth-child(4), .leaderboard-chooser-table--scores td:nth-child(4) { width: 12%; white-space: nowrap; }
.leaderboard-chooser-table--scores th:nth-child(5), .leaderboard-chooser-table--scores td:nth-child(5) { width: 12%; white-space: nowrap; }
.leaderboard-chooser-table--scores th:nth-child(6), .leaderboard-chooser-table--scores td:nth-child(6) { width: 16%; white-space: nowrap; }
.leaderboard-chooser-table .field-hint { display: block; white-space: nowrap; }
.leaderboard-chooser .admin-pager { margin-top: var(--space-md); }
.leaderboard-board-lede { margin: var(--space-sm) 0 0; max-width: 42rem; line-height: 1.45; }
.leaderboard-board-meta { display: flex; flex-direction: column; gap: var(--space-md); margin-bottom: var(--space-md); }
.leaderboard-board-stats { margin: 0; }
.chip--leaderboard-metric { gap: 0.35rem; padding: 0.3rem 0.7rem; font-size: 0.8125rem; background: var(--accent-tint); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 22%, transparent); }
.chip--leaderboard-metric__value { font-weight: 700; font-variant-numeric: tabular-nums; }
.chip--leaderboard-own { gap: 0.35rem; padding: 0.3rem 0.7rem; font-size: 0.8125rem; background: var(--secondary-tint); color: var(--secondary); border-color: color-mix(in srgb, var(--secondary) 22%, transparent); }
.chip--leaderboard-own__score { font-weight: 600; }
.leaderboard-board-footnotes { display: flex; flex-direction: column; gap: 0.25rem; margin: 0; font-size: 0.8125rem; color: var(--muted); line-height: 1.45; }
.leaderboard-board-footnotes p { margin: 0; }
.admin-table__name { position: sticky; left: 0; background: var(--surface); min-width: 10rem; }
.admin-table__meta { display: block; color: var(--muted); font-size: 0.75rem; margin-top: 0.15rem; }
.admin-user-link { font-weight: 600; text-decoration: none; }
.admin-user-link:hover { text-decoration: underline; }
.admin-profile h2 { font-size: 1rem; font-weight: 600; }
.admin-profile-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg) var(--space-xl); margin: var(--space-lg) 0 0; }
.admin-profile-fields dt { margin-bottom: var(--space-sm); color: var(--muted); font-size: 0.8125rem; }
.admin-profile-fields dd { margin: 0; overflow-wrap: anywhere; font-size: 0.875rem; }
.admin-detail-back { margin-top: var(--space-lg); font-size: 0.875rem; }
@media (max-width: 767px) {
.admin-profile-fields { grid-template-columns: 1fr; }
}
.admin-table__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.admin-inline-form { display: inline-flex; margin: 0; }
.button--compact { min-height: 2.75rem; padding: 0.25rem 0.65rem; font-size: 0.8125rem; }
.chip-row { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.chip { display: inline-flex; align-items: center; padding: 0.3rem 0.75rem; border-radius: 999px; font-size: 0.75rem; font-weight: 600; line-height: 1.25; border: 1px solid transparent; flex-shrink: 0; }
.chip--admin { background: var(--surface); color: var(--text); border-color: var(--border-strong); }
.chip--ops { background: var(--accent-tint); color: var(--accent); }
.chip--mentor { background: var(--secondary-tint); color: var(--secondary); }
.chip--student { background: var(--bg); color: var(--muted); border-color: var(--border); }
.chip--active { background: var(--secondary-tint); color: var(--secondary); }
.chip--inactive { background: var(--bg); color: var(--muted); border-color: var(--border); }
.admin-counter { font-size: 0.875rem; color: var(--muted); margin: 0 0 var(--space-md); }
.admin-pager { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-lg); margin: var(--space-lg) 0; font-size: 0.875rem; }
.admin-footer-counts, .admin-footer-note { font-size: 0.8125rem; color: var(--muted); margin: var(--space-lg) 0 0; }
.admin-empty { padding: var(--space-xl); text-align: center; color: var(--muted); }
.admin-roles-form .admin-role-option { display: flex; gap: 0.5rem; align-items: flex-start; margin-bottom: var(--space-md); }
.admin-roles-actions { display: flex; gap: var(--space-md); margin-top: var(--space-lg); }
@media (max-width: 480px) {
.brand-header { padding: 0 0.75rem; }
.brand-header > .brand-context { max-width: 7rem; text-align: right; }
.auth-page { padding-top: var(--space-lg); align-items: flex-start; }
.auth-card { padding: var(--space-lg); }
.form-columns { grid-template-columns: 1fr; }
h1 { font-size: 1.375rem; }
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
}
main.event-main { max-width: 68rem; }
.event-filter-strip { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-lg); margin-bottom:var(--space-lg); padding:var(--space-md); }
.event-filter-strip .event-filter-count { margin:0; flex:1 1 12rem; align-self:center; }
.event-filter-strip .event-search { flex:1 1 16rem; max-width:24rem; margin-left:auto; }
.event-tabs { display:flex; flex:0 1 auto; min-width:0; max-width:100%; flex-wrap:nowrap; gap:0.25rem; overflow-x:auto; padding:6px; scroll-padding-inline:6px; scrollbar-width:thin; }
.event-tabs .button { flex:0 0 auto; white-space:nowrap; }
.event-tabs .button { border-color:transparent; background:transparent; font-weight:500; }
.event-tabs [aria-current="page"] { background:var(--event-draft-bg); }
.event-tab-count { font-variant-numeric:tabular-nums; margin-left:0.5rem; padding:0 0.3rem; background:var(--bg); border-radius:0.25rem; }
.event-search { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--space-sm); align-items:center; min-width:16rem; margin:0; }
.event-table { table-layout:fixed; min-width:48rem; font-size:0.8125rem; }
.event-table .admin-table__name { position:static; }
.event-table th:first-child, .event-table td:first-child { width:38%; }
.event-table th:nth-child(2) { width:28%; }
.event-table th:nth-child(3) { width:34%; }
.event-table td { overflow-wrap:anywhere; padding:0.5rem 0.75rem; }
.event-numbers { font-variant-numeric:tabular-nums; }
.event-chip { display:inline-flex; align-items:center; padding:0.35rem 0.9rem; border-radius:6px; font-size:0.75rem; font-weight:500; line-height:1.25; white-space:nowrap; flex-shrink:0; }
.event-chip--draft { color:var(--event-draft); background:var(--event-draft-bg); }
.event-chip--published { color:var(--event-published); background:var(--event-published-bg); }
.event-chip--closed { color:var(--event-closed); background:var(--event-closed-bg); }
input[type="datetime-local"], textarea { width:100%; min-height:2.75rem; padding:0.65rem 0.85rem; border:1px solid var(--border-strong); border-radius:0.5rem; font:inherit; font-size:1rem; background:var(--surface); color:var(--text); }
.event-time-row select { font-variant-numeric:tabular-nums; }
textarea { resize:vertical; }
textarea:focus-visible { outline:2px solid var(--accent); border-color:var(--accent); }
[aria-invalid="true"] { border-color:var(--error); }
.event-field-error { color:var(--error); font-size:0.8125rem; margin:var(--space-sm) 0 0; }
.attendance-recap-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(5rem,1fr)); gap:var(--space-md); margin:0; }
.attendance-recap-grid dt { font-size:0.75rem; color:var(--muted); margin:0 0 0.15rem; }
.attendance-recap-grid dd { margin:0; font-variant-numeric:tabular-nums; font-weight:600; }
.attendance-table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:0.75rem; background:var(--surface); margin-bottom:var(--space-lg); }
.attendance-table { table-layout:fixed; min-width:60rem; font-size:0.8125rem; }
.attendance-table th:nth-child(1), .attendance-table td:nth-child(1) { width:3rem; }
.attendance-table th:nth-child(2), .attendance-table td:nth-child(2) { width:11rem; }
.attendance-table th:nth-child(3), .attendance-table td:nth-child(3) { width:8rem; }
.attendance-table th:nth-child(4), .attendance-table td:nth-child(4) { width:16rem; }
.attendance-table th:nth-child(5), .attendance-table td:nth-child(5) { width:12rem; }
.attendance-table th:nth-child(6), .attendance-table td:nth-child(6) { width:10rem; }
.attendance-table th { white-space:nowrap; }
.attendance-table td:first-child, .attendance-table th:first-child { position:sticky; left:0; z-index:1; }
.attendance-table th:first-child { background:var(--bg); z-index:2; }
.attendance-table td:first-child { background:var(--surface); }
.attendance-status-group { position:relative; border:0; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:0.35rem 0.65rem; }
.attendance-status-option { display:inline-flex; align-items:center; gap:0.35rem; font-size:0.8125rem; flex:0 0 auto; white-space:nowrap; }
.attendance-meta { font-size:0.8125rem; color:var(--muted); }
.attendance-meta span { display:block; }
.attendance-notes-field { position:relative; display:block; margin:0; }
.attendance-notes-field textarea { width:100%; min-width:0; max-width:none; font:inherit; resize:vertical; }
.attendance-notes-readonly { max-width:none; white-space:pre-wrap; font-size:0.8125rem; }
.student-attendance-table { table-layout:fixed; min-width:68rem; font-size:0.8125rem; }
.student-attendance-table th:nth-child(1), .student-attendance-table td:nth-child(1) { width:18%; }
.student-attendance-table th:nth-child(2), .student-attendance-table td:nth-child(2) { width:16%; }
.student-attendance-table th:nth-child(3), .student-attendance-table td:nth-child(3) { width:16%; white-space:nowrap; }
.student-attendance-table th:nth-child(4), .student-attendance-table td:nth-child(4) { width:8%; white-space:nowrap; }
.student-attendance-table th:nth-child(5), .student-attendance-table td:nth-child(5) { width:15%; }
.student-attendance-table th:nth-child(6), .student-attendance-table td:nth-child(6) { width:14%; }
.student-attendance-table th:nth-child(7), .student-attendance-table td:nth-child(7) { width:13%; white-space:nowrap; }
.student-attendance-table th { white-space:nowrap; }
.student-attendance-table .field-hint { display:block; white-space:normal; }
.student-attendance-table .button { white-space:nowrap; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; border:0; }
.event-actions { display:flex; flex-wrap:wrap; gap:var(--space-md); align-items:center; margin:var(--space-lg) 0; }
.event-actions form { margin:0; }
.event-toolbar { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:var(--space-md) var(--space-lg); margin:0 0 var(--space-lg); }
.event-toolbar__end { display:flex; flex-direction:column; align-items:flex-end; gap:var(--space-sm); margin-left:auto; max-width:100%; }
.event-toolbar__actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:var(--space-md); }
.event-toolbar form { margin:0; }
.event-toolbar__hint { margin:0; max-width:22rem; text-align:right; }
@media (max-width:767px) {
.event-toolbar__end { align-items:flex-start; margin-left:0; }
.event-toolbar__actions { justify-content:flex-start; }
.event-toolbar__hint { text-align:left; }
.event-title-meta { margin-left:0; }
}
.event-notes { white-space:pre-wrap; }
.event-external-link { color:var(--accent); font-weight:600; text-decoration:none; }
.event-external-link:hover { color:var(--accent-hover); text-decoration:underline; }
.event-poster-preview { margin:0 0 var(--space-md); }
.event-poster-preview img { display:block; max-width:100%; height:auto; border-radius:0.5rem; border:1px solid var(--border); }
.event-poster-preview--detail { margin:0 0 var(--space-lg); }
.event-confirm { display:flex; align-items:flex-start; gap:var(--space-sm); margin-top:var(--space-lg); }
.event-confirm input { margin-top:0.3rem; }
.button--danger { background:var(--error); border-color:var(--error); color:var(--surface); }
.button--danger:hover { background:var(--error); opacity:0.9; }
.page-header__actions { display:flex; flex-wrap:wrap; gap:var(--space-sm); }
.user-delete-dialog { box-sizing:border-box; width:min(36rem, calc(100% - 2rem)); max-height:calc(100dvh - 2rem); overflow-y:auto; padding:var(--space-lg); border:1px solid var(--border-strong); border-radius:0.75rem; background:var(--surface); color:var(--text); font:inherit; overflow-wrap:anywhere; }
.user-delete-dialog:not([open]) { display:none; }
.user-delete-dialog::backdrop { background:rgb(45 43 42 / 55%); }
.user-delete-dialog h2 { margin:0 0 var(--space-md); font-size:1.25rem; line-height:1.4; text-wrap:balance; }
.user-delete-dialog p { margin:0 0 var(--space-md); }
.user-delete-subject { font-weight:600; }
.user-delete-list { margin:0 0 var(--space-md); padding-left:1.25rem; }
.user-delete-list li + li { margin-top:var(--space-sm); }
.user-delete-dialog__actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:var(--space-sm); margin-top:var(--space-lg); }
.user-delete-dialog form { margin:0; }
.worksheet-summary { display:flex; flex-direction:column; gap:var(--space-md); }
.worksheet-summary__head { display:flex; flex-wrap:wrap; align-items:center; column-gap:var(--space-xl); row-gap:var(--space-sm); }
.worksheet-summary__title { margin:0; margin-inline-end:var(--space-sm); font-size:1rem; font-weight:600; }
.worksheet-summary__notice { margin:0; padding:var(--space-md); font-size:0.8125rem; line-height:1.45; color:var(--muted); background:var(--secondary-tint); border:1px solid color-mix(in srgb, var(--secondary) 14%, var(--border)); border-radius:0.5rem; }
.worksheet-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-md) var(--space-lg); margin:0; padding:var(--space-md) 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.worksheet-summary-grid dt { font-size:0.75rem; color:var(--muted); margin:0 0 0.2rem; font-weight:500; }
.worksheet-summary-grid dd { margin:0; font-size:1.125rem; font-weight:600; line-height:1.2; }
.worksheet-summary-grid__total { grid-column:1 / -1; display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-md); padding-top:var(--space-sm); border-top:1px dashed var(--border); }
.worksheet-summary-grid__total dt { margin:0; font-size:0.8125rem; }
.worksheet-summary-grid__total dd { font-size:1.25rem; }
.worksheet-summary__meta { display:grid; gap:0.25rem; }
.worksheet-summary__meta p { margin:0; font-size:0.8125rem; }
.worksheet-summary__actions { display:flex; flex-direction:column; gap:var(--space-sm); margin-top:var(--space-sm); }
.worksheet-summary__actions-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-sm); }
.worksheet-summary__actions .button { width:100%; justify-content:center; text-align:center; }
.worksheet-summary__actions form { margin:0; }
.worksheet-summary__actions form .button { width:100%; }
.worksheet-summary__hint { margin:0; text-align:center; font-size:0.8125rem; }
.worksheet-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(14rem,20rem); gap:var(--space-lg); align-items:start; }
.worksheet-main { display:grid; gap:var(--space-lg); }
.worksheet-actions { display:flex; flex-wrap:wrap; gap:var(--space-md); }
.worksheet-import { display:grid; gap:var(--space-lg); min-width:0; }
.worksheet-import input[type="file"] { display:block; width:100%; max-width:100%; min-height:2.75rem; }
.worksheet-import-errors { margin:0; padding-left:1.25rem; }
.worksheet-import-errors li { overflow-wrap:anywhere; margin:0 0 var(--space-sm); }
.worksheet-import-path { font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:0.8125rem; }
.worksheet-item-card__head { display:flex; flex-wrap:wrap; gap:var(--space-sm) var(--space-md); align-items:center; margin-bottom:var(--space-md); }
.worksheet-item-card__index { font-size:1.5rem; font-weight:700; line-height:1; color:var(--text); letter-spacing:-0.02em; }
.worksheet-item-card__question { white-space:pre-wrap; margin:0 0 var(--space-md); }
.worksheet-option-list { margin:0 0 var(--space-md); padding-left:1.25rem; }
.worksheet-item-card__actions { display:flex; flex-wrap:wrap; gap:var(--space-sm) var(--space-md); align-items:center; margin-top:var(--space-md); }
.submission-form { display:grid; gap:var(--space-lg); margin:0; }
.submission-save-status { font-size:0.875rem; color:var(--muted); }
.submission-footer { display:grid; gap:var(--space-md); }
.submission-footer .submission-ack { margin-top:0; }
.submission-actions { display:flex; flex-wrap:wrap; gap:var(--space-md); }
.submission-summary-standalone { max-width:24rem; }
.submission-mcq legend { font-size:0.8125rem; font-weight:600; }
.submission-mcq .submission-choice { font-weight:400; margin-top:0; }
.submission-essay-field { margin-top:0; }
.submission-choice { display:flex; gap:var(--space-sm); align-items:flex-start; padding:var(--space-sm) 0; }
.submission-choice input { margin-top:0.2rem; }
.submission-essay { width:100%; min-height:8rem; font-size:1rem; }
.submission-ack { display:flex; gap:var(--space-sm); align-items:flex-start; margin-top:var(--space-md); }
.submission-stale-copy__items { margin:var(--space-lg) 0; }
.submission-readonly-text { white-space:pre-wrap; margin:0; font-family:inherit; }
.submission-stale-copy__block { margin-top:var(--space-md); }
.field-error { color:var(--error); font-size:0.8125rem; margin:var(--space-sm) 0 0; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.worksheet-move-form { display:contents; }
.worksheet-points-form { display:flex; flex-wrap:wrap; gap:var(--space-sm); align-items:flex-end; border-top:1px solid var(--border); padding-top:var(--space-md); margin-top:var(--space-md); }
.points-field { display:inline-block; max-width:100%; }
.points-field__control { display:inline-flex; align-items:stretch; width:min(100%,10.5rem); border:1px solid var(--border-strong); border-radius:0.5rem; background:var(--surface); overflow:hidden; transition:border-color 0.15s ease; }
.points-field__control:focus-within { outline:2px solid var(--accent); border-color:var(--accent); }
.points-field__control[aria-invalid="true"], .points-field__control:has([aria-invalid="true"]) { border-color:var(--error); }
.points-field__step { flex:0 0 2.75rem; min-width:2.75rem; min-height:2.75rem; margin:0; padding:0; border:none; border-right:1px solid var(--border); background:var(--bg); color:var(--text); font:inherit; font-size:1.125rem; font-weight:600; line-height:1; cursor:pointer; }
.points-field__step:last-of-type { border-right:none; border-left:1px solid var(--border); }
.points-field__step:hover { background:var(--accent-tint); color:var(--accent); }
.points-field__step:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; z-index:1; }
.points-field__input { flex:1 1 auto; min-width:3rem; width:100%; margin:0; padding:0.65rem 0.35rem; border:none; background:transparent; text-align:center; font:inherit; font-size:1rem; font-weight:600; font-variant-numeric:tabular-nums; color:var(--text); min-height:2.75rem; -moz-appearance:textfield; appearance:textfield; }
.points-field__input:focus-visible { outline:none; }
.points-field__input::-webkit-outer-spin-button, .points-field__input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.grading-submissions__head { margin-bottom:var(--space-lg); }
.grading-submissions__head h1 { margin:0 0 var(--space-sm); font-size:1.25rem; }
.grading-submissions-table { min-width:36rem; }
.grading-submissions-table th.grading-submissions-table__score,
.grading-submissions-table td.grading-submissions-table__score { text-align:right; width:7.5rem; font-weight:600; }
.grading-submissions-table__submitted { color:var(--muted); font-size:0.8125rem; white-space:nowrap; }
.grading-score-row { margin-top:var(--space-md); }
.grading-score-row__label { display:block; margin-bottom:var(--space-sm); font-weight:500; }
.grading-score-row__control { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-sm); }
.grading-score-row__max { font-size:1rem; font-weight:600; color:var(--muted); }
.worksheet-item-form label { display:block; margin-top:var(--space-md); font-weight:500; }
.worksheet-item-form .grading-score-row__label { margin-top:0; }
.worksheet-option-row { border:1px solid var(--border); border-radius:0.5rem; padding:var(--space-md); margin:var(--space-md) 0 0; }
.grading-key-form .worksheet-option-row { margin-top:0; }
.grading-key-fieldset legend { font-size:0.8125rem; font-weight:600; }
.grading-key-form .submission-choice { font-weight:400; margin-top:0; }
.grading-section-heading { margin:0; font-size:1rem; font-weight:600; }
.grading-essay-overview { display:grid; gap:var(--space-lg); padding-top:var(--space-md); border-top:1px solid var(--border); }
.grading-summary-stats { display:grid; gap:var(--space-md); }
.grading-summary-stats__block { padding:var(--space-md); border-radius:0.5rem; border:1px solid var(--border); }
.grading-summary-stats__block--coverage { background:var(--secondary-tint); border-color:color-mix(in srgb, var(--secondary) 18%, var(--border)); }
.grading-summary-stats__block--worksheet { background:var(--accent-tint); border-color:color-mix(in srgb, var(--accent) 16%, var(--border)); }
.grading-summary-stats__heading { margin:0 0 var(--space-sm); font-size:0.6875rem; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--muted); }
.grading-summary-stats__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-md) var(--space-lg); margin:0; }
.grading-summary-stats__grid dt { font-size:0.75rem; color:var(--muted); margin:0 0 0.2rem; font-weight:500; }
.grading-summary-stats__grid dd { margin:0; font-size:1.125rem; font-weight:600; line-height:1.2; }
.grading-essay-nav-wrap { margin-top:var(--space-md); padding-top:var(--space-md); border-top:1px solid var(--border); }
.grading-essay-nav__title { margin:0 0 var(--space-sm); font-size:0.8125rem; font-weight:600; color:var(--muted); }
.grading-essay-nav { list-style:none; margin:0; padding:0; display:grid; gap:var(--space-sm); }
.grading-essay-nav a, .grading-essay-nav__current { display:block; padding:var(--space-sm) var(--space-md); border-radius:0.5rem; font-size:0.875rem; line-height:1.45; text-decoration:none; color:var(--text); border:1px solid transparent; }
.grading-essay-nav a:hover { background:var(--secondary-tint); border-color:color-mix(in srgb, var(--secondary) 14%, var(--border)); }
.grading-essay-nav__current { background:var(--accent-tint); border-color:color-mix(in srgb, var(--accent) 20%, var(--border)); font-weight:600; }
.grading-essay-page { display:grid; gap:var(--space-lg); max-width:42rem; }
.grading-essay-hero__footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-md); margin-top:var(--space-md); padding-top:var(--space-md); border-top:1px solid var(--border); }
.grading-essay-hero__progress { margin:0; }
.grading-essay-switcher { display:grid; gap:var(--space-sm); }
.grading-essay-switcher .grading-section-heading { margin-bottom:var(--space-sm); }
.grading-essay-nav__index { display:inline-block; min-width:1.5rem; margin-right:var(--space-sm); font-weight:700; }
.grading-essay-filters { margin:0; padding:0; border:none; background:transparent; box-shadow:none; }
.grading-detail-hero h1 { margin:0 0 var(--space-sm); }
.grading-detail-hero__score { font-size:1.125rem; font-weight:600; }
.grading-detail-answers { margin-top:var(--space-lg); }
.submission-answer { margin:0 0 var(--space-md); }
@media (max-width:767px) { .worksheet-layout { grid-template-columns:1fr; } }
@media (max-width:767px) { .event-search { width:100%; min-width:0; } .event-table .admin-table__name { position:static; width:12rem; max-width:12rem; } .attendance-table td:first-child, .attendance-table th:first-child { position:static; } .form-columns { grid-template-columns:1fr; } }

.admin-pager a { display: inline-flex; align-items: center; min-height: 2.75rem; }
main, .panel, .page-header > *, .event-toolbar > * { min-width: 0; }
h1, .lede, .home-user-name, .home-user-email { overflow-wrap: anywhere; }
.admin-table td { overflow-wrap: anywhere; }
.student-directory-table td,
.users-table td,
.leaderboard-chooser-table td,
.leaderboard-table td:nth-child(2) { overflow-wrap: break-word; }
.admin-table:not(.event-table):not(.leaderboard-chooser-table):not(.leaderboard-table):not(.attendance-table):not(.student-attendance-table):not(.student-directory-table):not(.users-table) { width: auto; min-width: 100%; }
.attendance-table td, .student-attendance-table td { overflow-wrap: break-word; }
.attendance-status-option { min-height: 2.75rem; }
.app-nav:focus-visible, .event-tabs:focus-visible, .admin-table-wrap:focus-visible, .attendance-table-wrap:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (min-width: 768px) and (max-width: 1100px) { .account-menu-name { max-width: 5rem; } }
@media (max-width: 480px) {
.app-header { padding: 0 6px; column-gap: 4px; }
.app-header-actions { gap: 4px; }
}
@media (max-width: 359px) { .app-header-actions { gap: 0; } }

.app-nav-link, .event-tabs .button { scroll-margin-inline: 6px; }
@media (max-width: 767px) { .admin-table__actions > a { display: inline-flex; align-items: center; min-height: 2.75rem; } }

.worksheet-message-dialog h2 { margin: 0 0 var(--space-md); font-size: 1.25rem; line-height: 1.4; text-wrap: balance; }
.worksheet-message-dialog p { margin: 0 0 var(--space-md); }
.worksheet-message-dialog blockquote { margin: var(--space-lg) 0; padding-left: var(--space-md); border-left: 3px solid var(--accent); }
.worksheet-message-dialog cite { font-size: 0.875rem; font-style: normal; color: var(--muted); }
.worksheet-message-dialog { box-sizing: border-box; width: min(32rem, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); overflow-y: auto; padding: var(--space-lg); border: 1px solid var(--border-strong); border-radius: 0.75rem; background: var(--surface); color: var(--text); font: inherit; overflow-wrap: anywhere; }
.worksheet-message-dialog:not([open]) { display: none; }
.worksheet-message-dialog::backdrop { background: rgb(45 43 42 / 55%); }
.worksheet-message-dialog form { margin-top: var(--space-lg); }
.worksheet-message-dialog .button { width: 100%; }

/* Report filters reuse create-event field layout (form-stack + form-columns). */
.report-filters.form-stack { flex:1 1 100%; width:100%; min-width:0; max-width:none; margin:0; }
.event-filter-strip .student-attendance-export { display:flex; flex-direction:column; align-items:flex-end; gap:var(--space-xs); max-width:20rem; }
.event-filter-strip .student-attendance-export .field-hint { margin:0; text-align:right; }
.event-filter-strip .report-filters.form-stack { flex-basis:100%; }
.report-filters.form-stack .button { align-self:flex-start; }