/* Simba's school — shared light/dark design system. */
:root {
  color-scheme:light;
  --brand:#2883bf;
  --accent:#176fa8;
  --accent-hover:#125d90;
  --accent-soft:#eaf3fa;
  --bg:#f5f5f5;
  --paper:#fff;
  --surface:#fafafa;
  --hover:#f0f3f5;
  --ink:#202428;
  --muted:#65717c;
  --line:#e1e4e8;
  --line-strong:#c5ccd3;
  --good:#277044;
  --good-bg:#eaf5ee;
  --orange:#9a511c;
  --warn-bg:#fff1e6;
  --red:#b03939;
  --red-bg:#fceeee;
  --focus:#2883bf;
  --shadow:0 8px 28px #10182812;
  --green:var(--accent);
  --green2:var(--accent-soft);
  --nav:var(--paper);
  --radius:8px;
  font-family:Montserrat,Arial,sans-serif;
  font-variant-numeric:tabular-nums;
}
:root[data-theme=dark] {
  color-scheme:dark;
  --brand:#2883bf;
  --accent:#79bdeb;
  --accent-hover:#a9d6f6;
  --accent-soft:#172c3a;
  --bg:#101010;
  --paper:#18191b;
  --surface:#202124;
  --hover:#27292c;
  --ink:#ededee;
  --muted:#a0a7b1;
  --line:#303236;
  --line-strong:#4b5056;
  --good:#8aceaa;
  --good-bg:#1b3025;
  --orange:#efb284;
  --warn-bg:#38291d;
  --red:#f29b9b;
  --red-bg:#3c2226;
  --focus:#79bdeb;
  --shadow:0 8px 28px #0005;
}
* {
  box-sizing:border-box
}
html {
  scrollbar-color:var(--line-strong) transparent
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:400 14px/1.5 Montserrat,Arial,sans-serif
}
button,input,select,textarea {
  font:inherit;
  color:inherit
}
button {
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none
}
button:disabled {
  opacity:.45;
  cursor:not-allowed
}
a {
  color:inherit;
  text-decoration:none
}
button,a,input,select,textarea {
  touch-action:manipulation
}
button,a {
  transition:background-color .12s,border-color .12s,color .12s
}
button:focus-visible,a:focus-visible,summary:focus-visible {
  outline:2px solid var(--focus);
  outline-offset:3px
}
input:focus,select:focus,textarea:focus {
  outline:2px solid color-mix(in srgb,var(--focus) 23%,transparent);
  border-color:var(--focus)
}
input,select,textarea {
  accent-color:var(--brand)
}
input:not([type=checkbox]):not([type=radio]),select,textarea {
  background:var(--paper);
  border:1px solid var(--line-strong);
  border-radius:6px;
  min-height:36px;
  padding:7px 10px;
  max-width:100%;
  min-width:0;
  font-size:13px
}
input[type=checkbox],input[type=radio] {
  width:16px;
  height:16px;
  flex:none
}
textarea {
  resize:vertical;
  min-height:84px
}
h1,h2,h3,p {
  overflow-wrap:break-word
}
h2 {
  font-size:17px;
  letter-spacing:-.3px
}
h3 {
  font-size:14px
}
pre {
  white-space:pre-wrap;
  overflow-wrap:anywhere
}
small {
  font-size:12px
}
[hidden] {
  display:none!important
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0)
}
.muted {
  color:var(--muted)
}
.boot {
  padding:32px
}
.ui-icon {
  flex:none;
  vertical-align:middle
}
.icon-button {
  border:1px solid var(--line);
  background:var(--paper);
  border-radius:6px;
  display:inline-grid;
  place-items:center;
  width:36px;
  height:36px;
  flex:none
}
.icon-button:hover {
  background:var(--hover);
  border-color:var(--line-strong)
}
/* Navigation and page frame */
.shell {
  display:grid;
  grid-template-columns:224px minmax(0,1fr);
  min-height:100vh
}
.sidebar {
  background:var(--nav);
  border-right:1px solid var(--line);
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
  padding:0 12px 16px;
  z-index:20
}
.brand {
  display:flex;
  align-items:center;
  gap:10px;
  height:76px;
  flex:none;
  padding:0 10px
}
.brand-wordmark {
  width:178px;
  height:auto;
  display:block
}
.brand-night,.brand-symbol {
  display:none
}
[data-theme=dark] .brand-day {
  display:none
}
[data-theme=dark] .brand-night {
  display:block
}
.nav-label {
  font-size:10px;
  font-weight:600;
  letter-spacing:.8px;
  color:var(--muted);
  padding:16px 12px 6px
}
.nav {
  display:flex;
  flex-direction:column;
  gap:3px
}
.nav button {
  border:1px solid transparent;
  background:transparent;
  color:var(--muted);
  width:100%;
  text-align:left;
  display:flex;
  align-items:center;
  gap:11px;
  padding:8px 11px;
  min-height:38px;
  border-radius:6px;
  font-size:12px;
  font-weight:500
}
.nav button:hover {
  background:var(--hover);
  color:var(--ink)
}
.nav button.active {
  color:var(--accent);
  background:var(--accent-soft);
  font-weight:600
}
.nav .ico {
  display:flex;
  align-items:center
}
.sidebar-footer {
  margin-top:auto;
  padding:16px 8px 0;
  border-top:1px solid var(--line)
}
.sidebar-footer small {
  display:block;
  font-size:10px;
  color:var(--muted);
  margin-top:6px
}
.profile {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px
}
.profile span:last-child {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.avatar,.initial {
  display:grid;
  place-items:center;
  flex:none;
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:600;
  border-radius:7px;
  width:28px;
  height:28px
}
.main {
  min-width:0
}
.topbar {
  height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:0 20px;
  background:var(--paper);
  border-bottom:1px solid var(--line)
}
.top-actions {
  display:flex;
  gap:8px;
  align-items:center;
  flex:none
}
.test-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:10px;
  color:var(--muted);
  border:1px solid var(--line);
  padding:3px 7px;
  border-radius:5px;
  white-space:nowrap
}
.test-pill:before {
  content:'';
  width:5px;
  height:5px;
  background:var(--good);
  border-radius:50%
}
.text-btn {
  border:0;
  background:transparent;
  color:var(--muted);
  padding:7px;
  font-size:12px;
  font-weight:500
}
.text-btn:hover {
  color:var(--ink);
  background:var(--hover);
  border-radius:5px
}
.logout-button {
  display:flex;
  gap:7px;
  align-items:center
}
.mobile-menu {
  display:none
}
.content {
  padding:20px 20px 48px;
  max-width:1800px;
  margin:auto
}
.page-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px
}
.page-head h1 {
  font:700 24px/1.3 Montserrat,Arial,sans-serif;
  letter-spacing:-.8px;
  margin:0 0 4px
}
.eyebrow {
  display:block;
  font-size:10px;
  font-weight:600;
  letter-spacing:1px;
  color:var(--muted);
  text-transform:uppercase;
  margin-bottom:5px
}
.eyebrow:empty {
  display:none
}
.sub {
  color:var(--muted);
  font-size:12px;
  margin:0;
  line-height:1.5
}
.actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px
}
.primary,.secondary,.danger {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:36px;
  border:1px solid var(--line-strong);
  padding:7px 12px;
  border-radius:6px;
  white-space:nowrap;
  font-size:12px;
  font-weight:600
}
.primary {
  background:var(--accent);
  border-color:var(--accent);
  color:#fff
}
.primary:hover {
  background:var(--accent-hover);
  border-color:var(--accent-hover)
}
[data-theme=dark] .primary {
  background:#2176ae;
  border-color:#2176ae;
  color:#fff
}
[data-theme=dark] .primary:hover {
  background:#2276ae
}
.secondary {
  background:var(--paper);
  color:var(--ink)
}
.secondary:hover {
  background:var(--hover);
  border-color:var(--line-strong)
}
.danger {
  color:var(--red);
  background:var(--red-bg);
  border-color:color-mix(in srgb,var(--red) 30%,var(--line))
}
.section-title {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:20px 0 10px
}
.section-title h2 {
  font-size:15px;
  font-weight:600;
  margin:0
}
.section-heading {
  font-size:15px;
  margin:20px 0 10px
}
.divider {
  height:1px;
  background:var(--line);
  margin:16px 0
}
.panel {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden
}
.panel-pad {
  padding:16px
}
.panel-pad>h2:first-child {
  margin-top:0
}
.panel-pad>p:last-child {
  margin-bottom:0
}
.stats {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:16px 0 20px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--paper);
  overflow:hidden
}
.stat {
  padding:12px 16px;
  min-width:0;
  border-right:1px solid var(--line)
}
.stat:last-child {
  border-right:0
}
.stat span {
  font-size:11px;
  color:var(--muted)
}
.stat strong {
  display:block;
  font-size:24px;
  line-height:1.4;
  letter-spacing:-.8px;
  font-weight:600;
  margin-top:4px;
  overflow-wrap:anywhere
}
.stat strong.stat-label {
  font-size:16px;
  letter-spacing:0
}
.stat em {
  font-style:normal;
  color:var(--orange)
}
.links-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px
}
.link-card {
  border:1px solid var(--line);
  background:var(--paper);
  border-radius:8px;
  padding:14px 16px;
  text-align:left
}
.link-card:hover {
  border-color:var(--brand);
  background:var(--accent-soft)
}
.link-card strong {
  display:block;
  font-size:14px;
  font-weight:600;
  margin-bottom:3px
}
.link-card small {
  color:var(--muted);
  font-size:12px
}
/* Data tables, filters and controls */
.table-wrap {
  overflow:auto;
  max-height:72vh;
  overscroll-behavior-x:contain
}
.data-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:720px;
  font-size:13px
}
.data-table th {
  text-align:left;
  font-size:11px;
  font-weight:600;
  color:var(--muted);
  background:var(--surface);
  border-bottom:1px solid var(--line);
  padding:8px 12px;
  white-space:nowrap;
  position:sticky;
  top:0;
  z-index:2
}
.data-table td {
  padding:9px 12px;
  border-bottom:1px solid var(--line);
  white-space:nowrap;
  max-width:300px;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.5
}
.data-table tbody tr:last-child td {
  border-bottom:0
}
.data-table tbody tr:hover {
  background:var(--hover)
}
.data-table td:first-child {
  font-weight:500
}
.data-table .numeric {
  text-align:right
}
.data-table .numeric .column-sort,.data-table .numeric .column-heading {
  justify-content:flex-end;
  width:100%
}
.pill {
  display:inline-block;
  white-space:nowrap;
  font-size:10px;
  font-weight:600;
  border-radius:4px;
  line-height:1.5;
  padding:2px 6px;
  background:var(--hover);
  color:var(--muted)
}
.pill.good {
  color:var(--good);
  background:var(--good-bg)
}
.pill.warn {
  color:var(--orange);
  background:var(--warn-bg)
}
.pill.bad {
  color:var(--red);
  background:var(--red-bg)
}
.toolbar,.filter-bar {
  display:flex;
  align-items:flex-end;
  gap:8px;
  padding:12px;
  border-bottom:1px solid var(--line);
  flex-wrap:wrap
}
.toolbar .count {
  margin-left:auto;
  color:var(--muted);
  font-size:12px
}
.search {
  min-width:220px
}
.filter-bar label {
  display:flex;
  flex-direction:column;
  gap:4px;
  flex:1;
  min-width:120px
}
.filter-bar label span {
  color:var(--muted);
  font-size:11px;
  font-weight:500
}
.filter-search {
  min-width:200px!important;
  flex:1.5!important
}
.filter-chips {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  padding:8px 12px;
  border-bottom:1px solid var(--line);
  font-size:12px
}
.filter-chips>.muted {
  margin-left:auto
}
.chip,.search-filter {
  border:1px solid var(--line);
  background:var(--paper);
  color:var(--muted);
  border-radius:5px;
  padding:5px 9px;
  font-size:12px
}
.chip:hover,.search-filter:hover {
  background:var(--hover);
  border-color:var(--line-strong)
}
.chip.selected {
  border-color:color-mix(in srgb,var(--accent) 35%,var(--line));
  background:var(--accent-soft);
  color:var(--accent)
}
.view-toolbar {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:10px;
  font-size:12px;
  color:var(--muted)
}
.view-toolbar label {
  display:flex;
  gap:6px;
  align-items:center
}
.sort-control {
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
  font-size:12px;
  color:var(--muted)
}
.sort-control select {
  max-width:300px;
  font-size:12px
}
.column-picker {
  position:relative
}
.column-picker summary {
  cursor:pointer;
  padding:6px;
  color:var(--accent)
}
.column-picker[open] {
  padding:8px;
  border:1px solid var(--line);
  border-radius:6px;
  background:var(--paper)
}
.column-picker label {
  display:flex;
  gap:8px;
  padding:4px
}
.column-heading {
  display:flex;
  align-items:center;
  gap:6px
}
.column-sort {
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:0;
  background:transparent;
  padding:0;
  color:inherit;
  font:inherit;
  white-space:nowrap;
  min-height:22px
}
.column-sort span {
  font-size:13px;
  color:var(--muted)
}
.column-sort:hover,.column-sort.selected,.column-sort.selected span {
  color:var(--accent)
}
.column-sort.sort-icon {
  padding:2px 6px;
  border-radius:4px
}
.column-sort.sort-icon:hover {
  background:var(--accent-soft)
}
.data-table th[aria-sort=ascending],.data-table th[aria-sort=descending] {
  color:var(--accent);
  background:var(--accent-soft)
}
.pagination {
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-top:1px solid var(--line);
  font-size:12px;
  color:var(--muted)
}
.pagination>span {
  margin-right:auto
}
.pagination button {
  min-height:30px;
  padding:3px 9px
}
.empty {
  padding:24px!important;
  text-align:center!important;
  color:var(--muted);
  font-weight:400!important
}
.student-name {
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0;
  text-align:left;
  font-weight:600;
  color:var(--ink)
}
.student-name:hover {
  color:var(--accent)
}
.student-name small {
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:400;
  margin-top:2px
}
.cell-edit {
  border:0;
  background:transparent;
  color:var(--ink);
  padding:2px 0;
  text-align:left
}
.cell-edit span {
  color:var(--muted);
  margin-left:6px
}
.cell-edit:hover {
  color:var(--accent);
  text-decoration:underline
}
.inline-form {
  min-width:200px;
  display:grid;
  grid-template-columns:1fr 30px 30px;
  gap:4px
}
.inline-form input {
  width:100%;
  min-height:30px
}
.inline-form button {
  border:1px solid var(--line);
  border-radius:4px;
  background:var(--paper)
}
.inline-form small {
  grid-column:1/-1;
  font-size:11px;
  color:var(--muted);
  white-space:normal
}
.inline,button.inline {
  border:0;
  background:transparent;
  color:var(--accent);
  font-weight:600;
  font-size:12px;
  padding:0
}
.inline:hover {
  text-decoration:underline
}
.compact-pay {
  padding:4px 9px;
  min-height:30px
}
.debt,.debt-value {
  color:var(--orange)
}
main[data-sorting=true] {
  pointer-events:none;
  cursor:progress
}
main[data-sorting=true] .table-wrap {
  opacity:.55
}
/* Student profile and overviews */
.back-link {
  border:0;
  background:transparent;
  color:var(--accent);
  padding:0;
  margin-bottom:12px;
  font-size:12px
}
.student-summary {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 28px;
  padding:8px 0 16px
}
.student-summary>span {
  font-size:12px;
  color:var(--muted)
}
.student-summary strong {
  display:block;
  font-size:21px;
  font-weight:600;
  color:var(--ink);
  margin-top:3px
}
.student-summary .debt {
  color:var(--orange)
}
.tabs {
  display:flex;
  gap:20px;
  border-bottom:1px solid var(--line);
  margin-bottom:16px;
  overflow:auto
}
.tabs button {
  border:0;
  border-bottom:2px solid transparent;
  padding:9px 0;
  background:transparent;
  color:var(--muted);
  white-space:nowrap;
  font-size:12px;
  font-weight:500
}
.tabs button.selected {
  border-bottom-color:var(--accent);
  color:var(--accent);
  font-weight:600
}
.detail-grid,.settings-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  min-width:0
}
.detail-grid { align-items:start; }
.detail-grid h2 {
  font-size:15px;
  margin:0 0 12px
}
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1.3fr;
  align-items:center;
  gap:12px;
  font-size:13px;
  margin:12px 0 0
}
.contact-grid dt {
  color:var(--muted)
}
.contact-grid dd {
  margin:0;
  min-width:0;
  overflow-wrap:anywhere
}
.learning-row {
  padding:8px 0
}
.learning-row p {
  color:var(--muted);
  font-size:12px
}
.footnote {
  font-size:12px;
  line-height:1.6
}
.timeline details {
  padding:12px 16px;
  border-bottom:1px solid var(--line)
}
.timeline summary {
  cursor:pointer;
  line-height:1.6;
  font-size:13px
}
.timeline summary span {
  color:var(--muted);
  margin-right:12px
}
.timeline summary small {
  display:block;
  color:var(--muted);
  margin-left:16px
}
.history-diff {
  display:grid;
  grid-template-columns:140px 1fr;
  gap:8px;
  font-size:12px
}
.history-diff dd {
  margin:0;
  overflow-wrap:anywhere
}
.report-filters {
  display:flex;
  align-items:end;
  gap:10px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px
}
.report-filters label {
  display:flex;
  align-items:center;
  gap:6px
}
.today-lesson {
  display:flex;
  align-items:center;
  gap:20px;
  padding:12px 16px;
  border-bottom:1px solid var(--line)
}
.today-lesson:last-child {
  border:0
}
.today-lesson time {
  font-size:18px;
  font-weight:600;
  color:var(--accent)
}
.today-lesson time small {
  display:block;
  font-size:11px;
  font-weight:400;
  color:var(--muted);
  margin-top:3px
}
.today-lesson p {
  font-size:12px;
  color:var(--muted);
  margin:3px 0 0
}
.today-lesson button {
  margin-left:auto
}
.switch-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
  font-size:13px
}
/* Search */
.global-search {
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:680px;
  flex:1;
  border:1px solid var(--line);
  border-radius:6px;
  background:var(--surface);
  padding:0 10px;
  height:36px;
  color:var(--muted)
}
.global-search input {
  width:100%;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none;
  padding:7px 0!important;
  min-height:0!important;
  font-size:12px!important;
  color:var(--ink)
}
.global-search:focus-within {
  border-color:var(--brand);
  box-shadow:0 0 0 2px var(--accent-soft)
}
kbd {
  white-space:nowrap;
  font:11px Montserrat,sans-serif;
  border:1px solid var(--line);
  border-radius:4px;
  padding:1px 4px;
  color:var(--muted)
}
.search-results {
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  background:var(--paper);
  border:1px solid var(--line-strong);
  border-radius:8px;
  box-shadow:var(--shadow);
  z-index:40;
  padding:6px;
  max-height:65vh;
  overflow:auto
}
.search-results h3 {
  font-size:10px;
  color:var(--muted);
  letter-spacing:.8px;
  text-transform:uppercase;
  margin:10px
}
.search-results>button {
  display:block;
  border:0;
  background:transparent;
  color:var(--ink);
  width:100%;
  text-align:left;
  padding:10px;
  border-radius:5px;
  font-size:12px
}
.search-results>button:hover,.search-results>button:focus,.search-results button[aria-selected=true] {
  background:var(--accent-soft)
}
.search-results button[aria-selected=true] {
  outline:2px solid var(--accent);
  outline-offset:-2px
}
.search-results .search-command {
  background:var(--accent-soft);
  border:1px solid var(--line)
}
.search-results small {
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-top:3px
}
.search-results p {
  padding:8px
}
.search-results strong,.search-results small {
  overflow-wrap:anywhere
}
.search-caption,.search-hint,.search-correction {
  font-size:11px;
  color:var(--muted);
  padding:8px
}
.search-hint {
  border-top:1px solid var(--line);
  margin-top:6px
}
.search-context {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px;
  margin-bottom:14px
}
.scope-label {
  padding:5px 9px;
  background:var(--accent-soft);
  color:var(--accent);
  border:1px solid var(--line);
  border-radius:5px
}
.search-total {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:400
}
.search-total span {
  font-size:24px;
  font-weight:600;
  color:var(--orange);
  letter-spacing:-.5px
}
.search-filters,.search-filter-bar {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:12px
}
.search-filters .inline {
  margin-left:5px
}
.search-notice,.schedule-notice {
  background:var(--warn-bg);
  color:var(--orange);
  border:1px solid color-mix(in srgb,var(--orange) 25%,var(--line));
  border-radius:6px;
  padding:10px 12px;
  font-size:12px;
  line-height:1.6;
  margin-bottom:12px
}
.search-empty {
  padding:28px 20px;
  text-align:center
}
.search-empty h2 {
  font-size:18px;
  margin:8px 0
}
.search-empty p {
  color:var(--muted);
  font-size:13px
}
.empty-search-icon {
  font-size:32px;
  color:var(--accent)
}
.search-guide {
  margin-top:16px;
  font-size:12px;
  line-height:1.8;
  color:var(--muted)
}
.search-guide summary {
  cursor:pointer;
  color:var(--accent);
  font-weight:600;
  width:fit-content
}
.search-examples {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  max-width:950px
}
.search-page-number {
  margin-right:0!important
}
.search-modes {
  margin-bottom:14px
}
.search-modes button span {
  display:inline-block;
  font-size:10px;
  margin-left:5px;
  background:var(--hover);
  border-radius:4px;
  padding:1px 5px
}
.record-layout {
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  gap:16px;
  align-items:start
}
.record-facets {
  display:flex;
  flex-direction:column;
  gap:3px
}
.record-facets button {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border:1px solid transparent;
  border-radius:5px;
  background:transparent;
  color:var(--muted);
  font-size:12px;
  text-align:left;
  padding:7px 9px
}
.record-facets button span {
  font-size:11px
}
.record-facets button.selected {
  background:var(--accent-soft);
  border-color:var(--line);
  color:var(--accent);
  font-weight:600
}
.record-facets button:hover {
  background:var(--hover)
}
.record-hit {
  padding:12px 16px;
  border-bottom:1px solid var(--line)
}
.record-hit:last-child {
  border:0
}
.record-hit-meta {
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--muted);
  font-size:11px;
  margin-bottom:4px
}
.record-hit-meta>span {
  color:var(--accent);
  font-weight:500
}
.record-hit-meta small {
  font-size:10px
}
.record-title {
  display:block;
  border:0;
  background:transparent;
  padding:0;
  color:var(--ink);
  font-size:14px;
  font-weight:600;
  line-height:1.5;
  text-align:left;
  overflow-wrap:anywhere
}
.record-title>span {
  color:var(--accent);
  margin-left:6px
}
.record-title:hover {
  color:var(--accent);
  text-decoration:underline
}
.record-context,.record-match {
  font-size:12px;
  color:var(--muted);
  margin:4px 0 0;
  line-height:1.6;
  overflow-wrap:anywhere
}
.record-context:empty {
  display:none
}
.record-match {
  white-space:pre-wrap
}
.record-hit mark {
  background:var(--warn-bg);
  color:var(--orange);
  border-radius:2px;
  padding:1px 2px
}
.record-details {
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:12px;
  font-size:13px
}
.record-details dt {
  color:var(--muted)
}
.record-details dd {
  margin:0;
  overflow-wrap:anywhere
}
.record-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:16px 0
}
.record-technical {
  border-top:1px solid var(--line);
  padding-top:12px;
  margin-top:16px;
  font-size:12px;
  color:var(--muted)
}
.record-technical summary {
  cursor:pointer
}
.filter-pair {
  display:inline-flex;
  align-items:stretch;
  border:1px solid var(--line);
  border-radius:5px;
  overflow:hidden
}
.filter-pair .search-filter {
  border:0;
  border-radius:0
}
.filter-remove {
  border:0;
  border-left:1px solid var(--line);
  background:transparent;
  color:inherit;
  min-width:28px;
  padding:2px 7px;
  font-size:16px
}
.filter-remove:hover {
  background:var(--hover)
}
.debt-filter {
  color:var(--orange);
  border-color:color-mix(in srgb,var(--orange) 30%,var(--line));
  background:var(--warn-bg);
  font-size:12px
}
.debt-filter>span {
  padding:5px 9px
}
.search-filter-heading {
  border:0;
  background:transparent;
  color:var(--accent);
  font:inherit;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0
}
.search-filter-heading span {
  font-size:14px
}
.search-entity-link {
  border:0;
  background:transparent;
  color:var(--accent);
  text-align:left;
  padding:2px 0;
  text-decoration:underline;
  text-decoration-color:color-mix(in srgb,var(--accent) 35%,transparent);
  text-underline-offset:3px;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.5
}
.search-entity-link:hover {
  text-decoration-color:var(--accent)
}
.search-entity-links {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px
}
.search-filter-menu {
  position:fixed;
  z-index:60;
  background:var(--paper);
  border:1px solid var(--line-strong);
  border-radius:8px;
  padding:12px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:10px;
  overflow:hidden
}
.filter-menu-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px
}
.search-filter-menu .search {
  width:100%;
  min-width:0;
  flex:none
}
.filter-menu-options {
  overflow:auto;
  min-height:0;
  overscroll-behavior:contain
}
.filter-menu-options button {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border:0;
  border-radius:5px;
  background:transparent;
  width:100%;
  text-align:left;
  padding:8px;
  font-size:12px;
  line-height:1.5;
  overflow-wrap:anywhere
}
.filter-menu-options button small {
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-top:3px
}
.filter-menu-options button:hover,.filter-menu-options button[aria-pressed=true] {
  background:var(--accent-soft);
  color:var(--accent)
}
.filter-menu-options p {
  font-size:12px;
  padding:0 8px
}
.search-entity-overview {
  padding:14px 16px;
  margin-bottom:14px
}
.entity-overview-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap
}
.entity-overview-head h2 {
  font-size:15px;
  margin:0
}
.entity-overview-head .secondary {
  min-height:30px;
  padding:4px 9px
}
.search-entity-overview dl {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px 20px;
  margin:12px 0 0
}
.search-entity-overview dt {
  font-size:11px;
  color:var(--muted);
  margin-bottom:3px
}
.search-entity-overview dd {
  margin:0;
  font-size:13px;
  overflow-wrap:anywhere
}
.entity-overview-groups {
  border-top:1px solid var(--line);
  padding-top:10px;
  margin-top:12px;
  font-size:12px
}
.entity-overview-groups>div {
  display:flex;
  gap:6px 16px;
  flex-wrap:wrap;
  margin-top:4px
}
.search-sort-toolbar {
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:12px
}
.search-sort-toolbar .search-filter-bar {
  margin-bottom:0
}
/* Journal */
.journal-toolbar {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:12px
}
.journal-table {
  border-collapse:separate;
  border-spacing:0;
  width:100%;
  min-width:850px;
  font-size:12px
}
.journal-table th,.journal-table td {
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:6px 8px;
  text-align:center;
  white-space:nowrap
}
.journal-table th {
  background:var(--surface);
  color:var(--muted);
  font-size:11px;
  position:sticky;
  top:0;
  z-index:3
}
.journal-table th:first-child,.journal-table td:first-child {
  position:sticky;
  left:0;
  background:var(--paper);
  text-align:left;
  min-width:190px;
  z-index:2;
  font-weight:600
}
.journal-table th:first-child {
  background:var(--surface);
  z-index:4
}
.journal-table td:last-child,.journal-table th:last-child {
  min-width:110px
}
.journal-table .column-heading {
  justify-content:center
}
.journal-table th:first-child .column-heading {
  justify-content:flex-start
}
.mark-btn {
  min-width:34px;
  height:28px;
  padding:0 5px;
  border:1px solid var(--line-strong);
  border-radius:4px;
  background:var(--paper);
  color:var(--muted);
  font-weight:600;
  font-size:12px
}
.mark-btn:hover {
  border-color:var(--accent)
}
.mark-btn.present {
  background:var(--good-bg);
  color:var(--good)
}
.mark-btn.covered {
  background:var(--accent-soft);
  color:var(--accent)
}
.mark-btn.absent {
  background:var(--warn-bg);
  color:var(--orange)
}
.mark-btn.neutral {
  background:var(--hover);
  color:var(--muted)
}
.legend {
  display:flex;
  gap:5px 14px;
  flex-wrap:wrap;
  padding:10px 12px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:11px
}
.legend b {
  color:var(--ink)
}
.popover {
  position:fixed;
  z-index:40;
  background:var(--paper);
  border:1px solid var(--line-strong);
  border-radius:8px;
  box-shadow:var(--shadow);
  padding:8px;
  width:240px
}
.popover-title {
  font-size:12px;
  font-weight:600;
  padding:5px 2px 8px
}
.mark-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:5px
}
.mark-grid button {
  border:1px solid var(--line);
  background:var(--paper);
  border-radius:4px;
  padding:7px 2px;
  font-size:12px;
  font-weight:600
}
.mark-grid button:hover {
  background:var(--accent-soft);
  border-color:var(--accent)
}
.compact-journal .journal-table th,.compact-journal .journal-table td {
  padding:4px 6px
}
.compact-journal .mark-btn {
  height:25px;
  min-width:30px
}
.hide-finance .journal-table th:last-child,.hide-finance .journal-table td:last-child,.hide-finance .nav button[data-nav="table:payments"] {
  display:none
}
/* Form pages, feedback and login */
.editor-page {
  max-width:1000px;
  margin:0 auto;
  min-width:0
}
.editor-page.editor-short {
  max-width:620px
}
.editor-breadcrumb {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
  font-size:12px;
  color:var(--muted)
}
.editor-breadcrumb .back-link {
  margin:0;
  flex:none
}
.editor-breadcrumb>span {
  padding-left:14px;
  border-left:1px solid var(--line);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.drawer {
  padding:20px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:8px;
  min-width:0
}
.drawer-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-bottom:16px;
  margin-bottom:16px;
  border-bottom:1px solid var(--line)
}
.drawer-head :is(h1,h2) {
  font:600 22px/1.35 Montserrat,Arial,sans-serif;
  letter-spacing:-.5px;
  margin:0
}
.drawer-head :is(h1,h2):focus {
  outline:none
}
.drawer-head small {
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-bottom:4px
}
.drawer>p {
  font-size:13px
}
.drawer fieldset {
  border:0;
  padding:0;
  margin:0;
  min-width:0
}
.field {
  display:block;
  min-width:0;
  margin:14px 0
}
.field span {
  display:block;
  font-size:12px;
  font-weight:500;
  color:var(--muted);
  margin-bottom:5px
}
.field :is(input,select,textarea) {
  width:100%
}
.drawer-actions {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line)
}
.close {
  border:1px solid var(--line);
  background:var(--surface);
  border-radius:5px;
  width:28px;
  height:28px;
  font-size:18px
}
.editor-page .field {
  margin:0
}
.editor-page form {
  display:grid;
  gap:14px
}
.editor-page :is(#entry-form,#account-form,#schedule-group-form),.editor-page #schedule-form>fieldset {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}
.editor-page #schedule-form>fieldset>:is(button,p,small,.schedule-check,.schedule-form-grid,#schedule-repeat),.editor-page :is(#entry-form,#account-form,#schedule-group-form)>:is(p,button,.drawer-actions) {
  grid-column:1/-1;
  margin:0
}
.editor-page .drawer-actions {
  margin:0
}
.editor-page form>button {
  justify-self:start
}
.editor-page .form-error:empty,.editor-page #schedule-preview:empty {
  display:none
}
.editor-page .drawer:has(.schedule-roster-form) {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px
}
.editor-page .drawer:has(.schedule-roster-form)>.drawer-head,.editor-page .drawer:has(.schedule-roster-form)>p {
  grid-column:1/-1;
  margin:0
}
.error-text,.form-error {
  color:var(--red);
  font-size:12px;
  line-height:1.6;
  white-space:normal
}
.error-note {
  background:var(--red-bg);
  color:var(--red);
  padding:10px 12px;
  border-radius:6px;
  margin-top:10px;
  font-size:12px
}
#toast {
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:100;
  border:1px solid var(--line-strong);
  border-radius:7px;
  background:var(--paper);
  color:var(--ink);
  padding:10px 14px;
  box-shadow:var(--shadow);
  max-width:min(380px,calc(100vw - 32px));
  font-size:12px;
  display:none
}
#toast.show {
  display:block
}
#toast.bad {
  background:var(--red-bg);
  color:var(--red);
  border-color:var(--red)
}
.loading-skeleton {
  padding:12px 0
}
.loading-skeleton h1 {
  font-size:18px;
  color:var(--muted);
  font-weight:500
}
.loading-skeleton span {
  display:block;
  height:38px;
  margin-top:8px;
  background:var(--hover);
  border-radius:5px;
  animation:loading-pulse 1.2s ease-in-out infinite alternate
}
@keyframes loading-pulse {
  to {
    opacity:.45
  }
}
.login-page {
  min-height:100vh;
  display:grid;
  grid-template-columns:minmax(320px,44%) 1fr;
  background:var(--bg)
}
.login-art {
  background:#101820;
  color:#f5f5f5;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:36px;
  position:relative;
  overflow:hidden;
  border-right:1px solid #2c3339
}
.login-art .brand {
  padding:0;
  height:auto
}
.login-art .brand-day {
  display:none
}
.login-art .brand-night {
  display:block;
  width:260px
}
.login-art:after {
  content:'';
  position:absolute;
  bottom:-8%;
  right:-12%;
  width:88%;
  height:68%;
  background:url("/assets/brand/mark-light.svg?v=8512ae44a76620d0c9b1") center/contain no-repeat;
  opacity:.035;
  pointer-events:none
}
.login-art>* {
  position:relative;
  z-index:1
}
.login-art h1 {
  font-size:clamp(28px,3vw,42px);
  font-weight:600;
  letter-spacing:-1.4px;
  line-height:1.2;
  max-width:420px
}
.login-art p {
  font-size:14px;
  line-height:1.8;
  color:#afbbc5;
  max-width:400px
}
.login-art-footer {
  font-size:11px;
  color:#afbbc5
}
.login-box {
  position:relative;
  display:grid;
  place-items:center;
  padding:32px
}
.login-box>.icon-button {
  position:absolute;
  top:20px;
  right:20px
}
.login-form {
  width:min(360px,100%)
}
.login-form h2 {
  font-size:24px;
  letter-spacing:-.8px;
  margin:0 0 6px
}
.login-form p {
  font-size:12px;
  color:var(--muted);
  line-height:1.6
}
.login-form .primary {
  width:100%;
  margin-top:6px
}
.login-note {
  font-size:11px;
  color:var(--muted);
  margin-top:16px;
  line-height:1.7
}
.login-form .field {
  margin:16px 0
}
/* Manager timetable */
.schedule-workspace {
  min-width:0
}
.schedule-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:12px
}
.segmented {
  display:flex;
  gap:2px;
  padding:3px;
  background:var(--hover);
  border:1px solid var(--line);
  border-radius:6px;
  margin-right:auto
}
.segmented button {
  border:0;
  background:transparent;
  color:var(--muted);
  border-radius:4px;
  padding:5px 12px;
  font-size:12px;
  white-space:nowrap
}
.segmented button.selected {
  background:var(--paper);
  color:var(--ink);
  box-shadow:0 1px 3px #0001
}
.schedule-week {
  display:flex;
  align-items:center;
  gap:6px
}
.schedule-week input {
  width:150px
}
.schedule-filters {
  display:flex;
  align-items:flex-end;
  gap:8px;
  flex-wrap:wrap;
  padding:12px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:8px
}
.schedule-filters label {
  min-width:120px;
  flex:1
}
.schedule-filters label:first-child {
  flex:1.2;
  min-width:160px
}
.schedule-filters .schedule-search {
  flex:1.5;
  min-width:200px
}
.schedule-filters label>span {
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-bottom:4px
}
.schedule-filters input,.schedule-filters select {
  width:100%;
  font-size:12px
}
.schedule-meta {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:10px 0;
  color:var(--muted);
  font-size:11px
}
.schedule-meta>span {
  margin-right:auto
}
.schedule-meta label,.schedule-check {
  display:flex;
  align-items:center;
  gap:6px
}
.schedule-legend {
  display:flex;
  align-items:center;
  gap:8px 16px;
  flex-wrap:wrap;
  font-size:11px;
  color:var(--muted);
  margin:10px 0
}
.schedule-legend>span {
  display:flex;
  align-items:center;
  gap:6px
}
.schedule-legend i {
  width:12px;
  height:12px;
  border:1px solid var(--event-edge);
  border-radius:3px
}
.category-individual {
  --event-bg:#e5f1fc;
  --event-edge:#8ab7df;
  --event-ink:#244968
}
.category-recruiting {
  --event-bg:#c9e5f9;
  --event-edge:#2883bf;
  --event-ink:#164f78
}
.category-group {
  --event-bg:#fae4d1;
  --event-edge:#d2935b;
  --event-ink:#703d18
}
.category-ielts {
  --event-bg:#eadcf7;
  --event-edge:#aa7acf;
  --event-ink:#643d82
}
.category-booking {
  --event-bg:#eceef1;
  --event-edge:#adb3bd;
  --event-ink:#4c5766
}
[data-theme=dark] .category-individual {
  --event-bg:#213746;
  --event-edge:#88b6dc;
  --event-ink:#c2e2fc
}
[data-theme=dark] .category-recruiting {
  --event-bg:#173e5a;
  --event-edge:#389bda;
  --event-ink:#c4e5fc
}
[data-theme=dark] .category-group {
  --event-bg:#422d1e;
  --event-edge:#d99259;
  --event-ink:#f7cba6
}
[data-theme=dark] .category-ielts {
  --event-bg:#372642;
  --event-edge:#b285d3;
  --event-ink:#e4c6fb
}
[data-theme=dark] .category-booking {
  --event-bg:#2c3037;
  --event-edge:#969faa;
  --event-ink:#d2d8e1
}
[class*=category-] {
  background:var(--event-bg);
  color:var(--event-ink)
}
.schedule-scroll {
  overflow:auto;
  max-height:74vh;
  border:1px solid var(--line-strong);
  border-radius:7px;
  background:var(--paper);
  overscroll-behavior:contain;
  scrollbar-gutter:stable
}
.schedule-table {
  min-width:1400px
}
.schedule-section+.schedule-section {
  border-top:8px solid var(--bg)
}
.schedule-section-title {
  display:flex;
  align-items:baseline;
  gap:12px;
  padding:9px 12px;
  background:var(--surface);
  border-bottom:1px solid var(--line-strong);
  font-size:12px
}
.schedule-section-title strong {
  font-size:13px
}
.schedule-section-title span {
  font-size:11px;
  color:var(--muted)
}
.schedule-axis {
  display:grid;
  grid-template-columns:146px 1fr;
  position:sticky;
  top:0;
  z-index:5;
  min-height:30px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  font-size:10px;
  font-weight:500;
  color:var(--muted)
}
.schedule-axis-label {
  padding:7px 12px;
  position:sticky;
  left:0;
  background:var(--surface);
  z-index:6;
  border-right:1px solid var(--line)
}
.schedule-hours {
  display:grid;
  grid-template-columns:repeat(12,1fr);
  position:relative
}
.schedule-hours>span {
  padding:7px 0 7px 5px;
  border-right:1px solid var(--line)
}
.schedule-hours>.schedule-hour-end {
  position:absolute;
  right:3px;
  top:0;
  border:0;
  font-size:9px
}
.schedule-row {
  display:grid;
  grid-template-columns:146px 1fr;
  min-height:var(--row-height);
  border-bottom:1px solid var(--line)
}
.schedule-row:last-child {
  border-bottom:0
}
.schedule-row-label {
  padding:10px 12px;
  background:var(--surface);
  border-right:1px solid var(--line);
  position:sticky;
  left:0;
  z-index:3;
  display:flex;
  flex-direction:column;
  justify-content:center;
  font-size:12px;
  line-height:1.5
}
.schedule-row-label small {
  font-size:10px;
  font-weight:400;
  color:var(--muted);
  margin-top:2px
}
.schedule-row-label.is-today {
  background:var(--accent-soft);
  box-shadow:inset 3px 0 var(--brand)
}
.schedule-track {
  position:relative;
  min-height:var(--row-height);
  background:repeating-linear-gradient(to right,transparent,transparent calc(100% / 12 - 1px),var(--line) calc(100% / 12 - 1px),var(--line) calc(100% / 12))
}
.schedule-empty {
  position:absolute;
  inset:0;
  border:0;
  background:transparent;
  cursor:crosshair;
  width:100%;
  height:100%;
  border-radius:0
}
.schedule-empty:hover {
  background:color-mix(in srgb,var(--accent) 3%,transparent)
}
.schedule-empty:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:-3px;
  background:var(--accent-soft)
}
.schedule-position {
  position:absolute;
  height:100px;
  padding:0 3px;
  min-width:0;
  z-index:1
}
.schedule-event {
  width:100%;
  height:100%;
  border:1px solid color-mix(in srgb,var(--event-edge) 45%,transparent);
  border-left:3px solid var(--event-edge);
  border-radius:4px;
  padding:6px 7px;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:3px;
  font-size:10px;
  line-height:1.25;
  overflow:hidden;
  background:var(--event-bg);
  color:var(--event-ink)
}
.schedule-event[draggable=true] {
  cursor:grab
}
.schedule-event:hover {
  filter:brightness(.96)
}
.schedule-event strong {
  font-size:11px;
  font-weight:600;
  line-height:1.3;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden
}
.schedule-event-time {
  font-size:10px;
  font-weight:600;
  white-space:nowrap
}
.schedule-event-detail {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px
}
.schedule-event-state {
  font-size:9px;
  margin-top:auto
}
.schedule-event.is-cancelled {
  opacity:.5;
  border-style:dashed
}
.schedule-event.is-cancelled strong {
  text-decoration:line-through
}
.schedule-event.is-dragging {
  opacity:.35
}
.schedule-event-detail.needs-teacher {
  font-weight:700;
  text-decoration:underline dotted;
  text-underline-offset:2px
}
.schedule-track.is-drop-target {
  background-color:var(--accent-soft);
  box-shadow:inset 0 0 0 2px var(--accent)
}
.schedule-footnote,.schedule-help {
  font-size:11px;
  color:var(--muted);
  line-height:1.7;
  margin:10px 0
}
.schedule-move {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  padding:12px;
  margin-bottom:12px;
  background:var(--accent-soft);
  border:1px solid var(--line-strong);
  border-radius:7px
}
.schedule-move>div {
  flex:1;
  min-width:200px;
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px
}
.schedule-move small {
  color:var(--muted);
  font-size:11px
}
.schedule-move .form-error:empty {
  display:none
}
.schedule-move .form-error {
  flex-basis:100%;
  margin:0
}
.schedule-form-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}
.schedule-availability {
  font-size:12px;
  color:var(--muted);
  line-height:1.6;
  margin:0
}
.schedule-check {
  font-size:12px;
  line-height:1.5;
  margin:10px 0
}
.schedule-repeat-box,.editor-page #schedule-repeat:not([hidden]) {
  display:grid;
  gap:12px;
  padding:14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:6px;
  font-size:12px
}
.schedule-repeat-box small {
  display:block;
  color:var(--muted);
  line-height:1.6
}
.schedule-day-pickers {
  display:flex;
  gap:5px;
  margin-top:8px
}
.schedule-day-pickers label {
  flex:1;
  position:relative
}
.schedule-day-pickers input {
  position:absolute;
  opacity:0
}
.schedule-day-pickers span {
  display:block;
  text-align:center;
  padding:7px 3px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:5px;
  cursor:pointer;
  font-size:11px
}
.schedule-day-pickers input:checked+span {
  background:var(--accent-soft);
  border-color:var(--accent);
  color:var(--accent);
  font-weight:600
}
.schedule-day-pickers input:focus-visible+span {
  outline:2px solid var(--accent);
  outline-offset:2px
}
.schedule-presets {
  display:flex;
  gap:12px;
  margin-top:4px
}
.schedule-presets button {
  font-size:11px;
  padding:4px 0
}
.schedule-preview {
  padding:12px;
  background:var(--good-bg);
  border:1px solid color-mix(in srgb,var(--good) 25%,var(--line));
  border-radius:6px;
  font-size:12px;
  line-height:1.7;
  overflow-wrap:anywhere
}
.schedule-preview.has-errors {
  background:var(--warn-bg);
  border-color:var(--orange)
}
.schedule-preview ul {
  padding-left:18px;
  max-height:220px;
  overflow:auto
}
.schedule-preview details {
  margin-top:8px
}
.schedule-series-link {
  margin-top:14px
}
.schedule-roster-form {
  border:1px solid var(--line);
  border-radius:6px;
  padding:14px;
  font-size:13px
}
.schedule-roster-form>small {
  color:var(--muted)
}
/* Teacher calendar */
.calendar-controls {
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px;
  border-bottom:1px solid var(--line);
  flex-wrap:wrap
}
.calendar-scroll {
  overflow:auto;
  max-height:76vh
}
.calendar-grid {
  display:grid;
  grid-template-columns:56px repeat(var(--lanes),minmax(145px,1fr));
  min-width:max(100%,calc(56px + var(--lanes)*145px))
}
.calendar-corner,.calendar-lane-title {
  padding:10px 8px;
  text-align:center;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);
  font-weight:500;
  font-size:12px;
  position:sticky;
  top:0;
  z-index:3
}
.calendar-lane-title.today {
  color:var(--accent);
  background:var(--accent-soft)
}
.time-axis {
  position:relative;
  background:var(--surface)
}
.time-axis span {
  position:absolute;
  font-size:10px;
  right:8px;
  color:var(--muted)
}
.calendar-lane {
  position:relative;
  border-left:1px solid var(--line);
  background:repeating-linear-gradient(to bottom,var(--paper) 0,var(--paper) 59px,var(--line) 59px,var(--line) 60px)
}
.slot-grid {
  position:absolute;
  inset:0;
  display:grid;
  grid-auto-rows:30px
}
.calendar-slot {
  border:0;
  border-radius:0;
  background:transparent
}
.calendar-slot:hover {
  background:var(--accent-soft)
}
.positioned-event {
  position:absolute;
  min-width:0
}
.calendar-event {
  display:flex;
  flex-direction:column;
  gap:4px;
  border:1px solid var(--line-strong);
  border-left:3px solid var(--accent);
  background:var(--accent-soft);
  border-radius:5px;
  padding:7px;
  text-align:left;
  overflow:hidden;
  width:100%;
  height:100%;
  color:var(--ink)
}
.calendar-event span {
  font-size:10px;
  white-space:nowrap
}
.calendar-event strong {
  font-size:12px;
  line-height:1.35
}
.calendar-event small {
  font-size:10px;
  color:var(--muted);
  line-height:1.4
}
.calendar-event.booking {
  border-left-color:var(--muted);
  background:var(--hover)
}
.calendar-event.cancelled {
  opacity:.55;
  border-style:dashed;
  text-decoration:line-through
}
.calendar-list {
  padding:12px;
  display:grid;
  gap:8px
}
.calendar-list .calendar-event {
  min-height:76px
}
.calendar-legend {
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  padding:10px 12px;
  font-size:11px;
  color:var(--muted);
  border-top:1px solid var(--line)
}
.unassigned {
  padding:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
.unassigned .calendar-event {
  max-width:240px;
  min-height:76px
}
/* Audit */
.audit-controls {
  padding:10px;
  margin-bottom:12px
}
.audit-filter-grid {
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:10px
}
.audit-controls label {
  display:block;
  min-width:0
}
.audit-controls label>span {
  display:block;
  margin-bottom:4px;
  font-size:11px;
  font-weight:500;
  color:var(--muted)
}
.audit-controls :is(input,select) {
  width:100%;
  font-size:12px
}
.audit-period {
  display:flex;
  align-items:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px
}
.audit-period label {
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  max-width:280px;
  min-width:220px
}
.audit-period label>span {
  margin:0;
  flex:none
}
.audit-period input {
  flex:1
}
.audit-presets {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px;
  min-height:36px
}
.audit-presets .chip {
  font-size:11px;
  padding:5px 8px
}
.audit-advanced {
  margin-top:10px
}
.audit-advanced>summary {
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--accent);
  font-size:12px;
  font-weight:500;
  list-style:none
}
.audit-advanced>summary:before {
  content:'+';
  font-size:16px
}
.audit-advanced[open]>summary:before {
  content:'−'
}
.audit-advanced>summary span {
  display:inline-grid;
  place-items:center;
  min-width:18px;
  height:18px;
  border-radius:4px;
  background:var(--accent-soft);
  font-size:10px
}
.audit-advanced .audit-filter-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--line)
}
.audit-filter-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin-top:-27px;
  pointer-events:none
}
.audit-filter-actions button {
  pointer-events:auto;
  min-height:30px;
  padding:4px 9px;
  font-size:11px
}
.audit-advanced[open]+.audit-filter-actions {
  margin-top:10px
}
.audit-results {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:8px 0
}
.audit-results>strong {
  font-weight:500;
  font-size:12px;
  margin-right:auto
}
.audit-results .sort-control {
  font-size:11px
}
.audit-results select {
  min-height:30px;
  font-size:11px;
  padding:4px 7px
}
.audit-active {
  padding:0 0 10px;
  border:0
}
.audit-active .chip {
  white-space:normal;
  text-align:left;
  font-size:11px
}
.audit-table .data-table {
  min-width:1060px
}
.audit-table .data-table td {
  white-space:normal;
  vertical-align:top;
  line-height:1.5;
  padding:10px 12px;
  max-width:240px;
  overflow-wrap:anywhere
}
.audit-table .data-table td:first-child {
  min-width:153px;
  font-weight:400;
  white-space:nowrap
}
.audit-table :is(strong,small,.audit-entity) {
  display:block
}
.audit-table strong {
  font-size:12px;
  font-weight:500
}
.audit-table small {
  color:var(--muted);
  font-size:10px;
  margin-top:2px
}
.audit-table .audit-entity {
  font-size:10px;
  color:var(--accent);
  margin-bottom:2px
}
.audit-table .audit-changes {
  font-size:11px;
  color:var(--muted);
  min-width:140px
}
.audit-table td:last-child {
  white-space:nowrap
}
.audit-table td:last-child button {
  font-size:11px
}
.audit-event-meta {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin:0 0 20px
}
.audit-event-meta dt {
  font-size:11px;
  color:var(--muted);
  margin-bottom:4px
}
.audit-event-meta dd {
  font-size:13px;
  margin:0;
  font-weight:500;
  overflow-wrap:anywhere
}
.audit-event-meta small {
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:400;
  margin-top:3px
}
.audit-diff .data-table {
  min-width:0;
  table-layout:fixed
}
.audit-diff .data-table :is(td,th) {
  white-space:normal;
  overflow-wrap:anywhere;
  vertical-align:top;
  line-height:1.6
}
.audit-diff .data-table td {
  font-weight:400
}
.audit-diff .data-table th {
  width:26%
}
.audit-diff .data-table td:last-child {
  background:var(--good-bg)
}
.audit-history-note {
  font-size:12px;
  color:var(--muted);
  margin:16px 0 0
}
/* Responsive: preserve data density on desktop and touch targets on phones. */
@media(max-width:1100px) {
  .shell {
    grid-template-columns:190px minmax(0,1fr)
  }
  .brand-wordmark {
    width:154px
  }
  .brand {
    padding:0 5px
  }
  .sidebar {
    padding-inline:10px
  }
  .top-actions .test-pill {
    display:none
  }
  .audit-filter-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .detail-grid {
    grid-template-columns:1fr
  }
  .links-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .schedule-toolbar .segmented {
    margin-right:0
  }
  .record-layout {
    grid-template-columns:150px minmax(0,1fr)
  }
}
@media(max-width:760px) {
  .shell {
    display:flex;
    flex-direction:column
  }
  .sidebar {
    display:none;
    position:static;
    height:auto;
    order:1;
    border-right:0;
    border-bottom:1px solid var(--line);
    padding:10px 12px
  }
  .menu-open .sidebar {
    display:flex
  }
  .sidebar .brand {
    display:none
  }
  .nav {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:4px
  }
  .nav button {
    min-height:44px;
    font-size:12px
  }
  .sidebar-footer {
    padding:12px 0 0;
    margin-top:8px
  }
  .sidebar-footer small {
    font-size:11px
  }
  .main {
    display:contents
  }
  .topbar {
    order:0;
    gap:8px;
    padding:8px 12px;
    height:auto;
    min-height:60px
  }
  .content {
    order:2;
    width:100%;
    padding:16px 12px 36px
  }
  .mobile-menu {
    display:grid
  }
  .top-actions {
    gap:6px
  }
  .logout-button span {
    display:none
  }
  .logout-button {
    display:grid;
    place-items:center;
    padding:0;
    width:44px;
    height:44px;
    border:1px solid var(--line);
    border-radius:6px
  }
  .top-actions .test-pill,.global-search kbd {
    display:none
  }
  .icon-button {
    width:44px;
    height:44px
  }
  .global-search {
    height:44px;
    min-width:0;
    padding:0 8px
  }
  .global-search>.ui-icon {
    width:16px
  }
  .global-search input {
    font-size:12px!important
  }
  .page-head {
    align-items:flex-start;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:14px
  }
  .page-head h1 {
    font-size:22px
  }
  .page-head>.actions {
    gap:6px
  }
  .primary,.secondary,.danger,.chip,.search-filter,.text-btn {
    min-height:44px
  }
  .primary,.secondary,.danger {
    padding:9px 11px
  }
  .stats {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .stat {
    padding:10px 12px
  }
  .stat:nth-child(2) {
    border-right:0
  }
  .stat:nth-child(-n+2) {
    border-bottom:1px solid var(--line)
  }
  .stat strong {
    font-size:21px
  }
  .settings-grid,.detail-grid {
    grid-template-columns:1fr
  }
  .panel-pad {
    padding:14px
  }
  .links-grid {
    gap:8px
  }
  .link-card {
    padding:12px
  }
  .link-card strong {
    font-size:13px
  }
  .link-card small {
    font-size:11px
  }
  .filter-bar {
    gap:8px;
    padding:10px
  }
  .filter-bar label {
    min-width:calc(50% - 8px)
  }
  .filter-search {
    flex-basis:100%!important
  }
  .filter-chips {
    padding:8px 10px
  }
  .view-toolbar {
    gap:8px
  }
  .sort-control {
    margin-left:0;
    flex-wrap:wrap
  }
  .sort-control select {
    max-width:100%
  }
  input:not([type=checkbox]):not([type=radio]),select,textarea {
    min-height:44px
  }
  .table-wrap {
    max-height:70vh
  }
  .data-table td {
    padding-block:11px
  }
  .data-table .inline,.student-name,.cell-edit,.column-sort,.search-filter-heading,.search-entity-link {
    min-height:44px
  }
  .column-sort {
    padding-block:7px
  }
  .data-table th {
    padding-block:4px
  }
  .pagination {
    flex-wrap:wrap;
    padding:8px 10px
  }
  .pagination button {
    min-width:44px;
    min-height:44px
  }
  .student-summary {
    gap:14px 24px
  }
  .student-summary strong {
    font-size:20px
  }
  .tabs {
    gap:18px
  }
  .tabs button {
    min-height:44px
  }
  .contact-grid {
    grid-template-columns:1fr 1.2fr;
    font-size:12px
  }
  .today-lesson {
    padding:12px;
    gap:12px;
    flex-wrap:wrap
  }
  .today-lesson time {
    font-size:16px
  }
  .today-lesson button {
    font-size:11px
  }
  .search-results {
    position:fixed;
    top:62px;
    left:12px;
    right:12px;
    max-height:65vh
  }
  .search-results>button {
    min-height:44px
  }
  .search-total {
    margin-left:0;
    width:100%;
    justify-content:space-between
  }
  .search-context {
    gap:8px
  }
  .search-sort-toolbar>.sort-control,.search-context .sort-control {
    width:100%;
    justify-content:space-between
  }
  .search-sort-toolbar .sort-control select {
    max-width:75%;
    flex:1
  }
  .search-filter-menu {
    max-width:calc(100vw - 24px)
  }
  .filter-menu-options button {
    min-height:44px
  }
  .filter-remove {
    min-width:44px
  }
  .record-layout {
    grid-template-columns:1fr;
    gap:10px
  }
  .record-facets {
    flex-direction:row;
    overflow:auto
  }
  .record-facets button {
    flex:none;
    min-height:44px
  }
  .search-entity-overview {
    padding:12px
  }
  .search-entity-overview dl {
    grid-template-columns:1fr 1fr
  }
  .record-title {
    min-height:44px
  }
  .editor-page .drawer {
    padding:16px
  }
  .editor-page .drawer-head :is(h1,h2) {
    font-size:20px
  }
  .editor-breadcrumb {
    margin-bottom:10px
  }
  .editor-breadcrumb .back-link {
    min-height:44px
  }
  .editor-page :is(#entry-form,#account-form,#schedule-group-form),.editor-page #schedule-form>fieldset,.editor-page .drawer:has(.schedule-roster-form) {
    grid-template-columns:1fr
  }
  .editor-page .record-details {
    grid-template-columns:1fr;
    gap:5px
  }
  .editor-page .record-details dd {
    margin-bottom:9px
  }
  .schedule-form-grid {
    grid-template-columns:1fr
  }
  .drawer-actions {
    gap:8px
  }
  .schedule-toolbar {
    align-items:stretch
  }
  .schedule-toolbar .segmented {
    width:100%
  }
  .segmented button {
    min-height:44px;
    flex:1;
    padding:8px 6px;
    font-size:11px
  }
  .schedule-week {
    width:100%;
    justify-content:space-between;
    gap:5px
  }
  .schedule-week .secondary {
    padding:8px 9px;
    font-size:11px
  }
  .schedule-week input {
    flex:1;
    max-width:160px;
    min-width:100px
  }
  .schedule-filters {
    padding:10px;
    gap:8px
  }
  .schedule-filters label,.schedule-filters label:first-child {
    min-width:120px;
    flex:1 1 42%
  }
  .schedule-filters .schedule-search {
    flex:1 1 100%;
    min-width:0;
    order:-1
  }
  .schedule-legend {
    gap:8px 12px
  }
  .schedule-scroll {
    max-height:68vh
  }
  .schedule-meta>span {
    flex-basis:100%
  }
  .schedule-meta label {
    min-height:36px
  }
  .schedule-row,.schedule-axis {
    grid-template-columns:122px 1fr
  }
  .schedule-row-label {
    padding:9px;
    font-size:11px
  }
  .schedule-move>div {
    flex-basis:100%
  }
  .schedule-day-pickers span {
    min-height:44px;
    padding:12px 3px
  }
  .calendar-controls {
    padding:10px;
    gap:7px
  }
  .calendar-controls .segmented {
    width:100%;
    margin-right:0
  }
  .calendar-controls input {
    max-width:145px
  }
  .report-filters label {
    flex-wrap:wrap
  }
  .audit-controls {
    padding:10px
  }
  .audit-filter-grid,.audit-advanced .audit-filter-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px
  }
  .audit-search {
    grid-column:1/-1
  }
  .audit-period {
    gap:8px;
    margin-top:8px
  }
  .audit-period label {
    max-width:none;
    flex:1 1 100%;
    min-width:0
  }
  .audit-presets {
    gap:5px
  }
  .audit-presets .chip {
    min-height:44px;
    padding:6px 8px
  }
  .audit-advanced {
    margin-top:8px
  }
  .audit-advanced>summary {
    min-height:44px
  }
  .audit-filter-actions {
    margin:4px 0 0;
    justify-content:flex-start;
    pointer-events:auto
  }
  .audit-filter-actions button {
    min-height:44px;
    font-size:12px
  }
  .audit-results {
    gap:8px
  }
  .audit-results .sort-control {
    width:100%;
    justify-content:space-between
  }
  .audit-results select {
    min-height:44px;
    max-width:76%
  }
  .audit-event-meta {
    grid-template-columns:1fr
  }
  .audit-diff .data-table :is(th,td) {
    padding:8px;
    font-size:12px
  }
  .audit-diff .data-table th {
    width:30%
  }
  .journal-table :is(th,td) {
    padding:5px
  }
  .journal-table .mark-btn,.compact-journal .mark-btn {
    min-width:44px;
    height:44px
  }
  .mark-grid button {
    min-height:44px
  }
  .login-page {
    display:block
  }
  .login-art {
    padding:24px;
    min-height:205px
  }
  .login-art .brand-night {
    width:220px
  }
  .login-art h1 {
    font-size:25px;
    letter-spacing:-.7px;
    margin:24px 0 8px
  }
  .login-art p {
    font-size:12px;
    margin:0
  }
  .login-art-footer {
    display:none
  }
  .login-box {
    padding:64px 24px 32px
  }
  .login-box>.icon-button {
    top:12px;
    right:12px
  }
  .login-form {
    width:min(400px,100%)
  }
}
@media(max-width:380px) {
  .topbar {
    gap:5px;
    padding-inline:8px
  }
  .top-actions {
    gap:4px
  }
  .logout-button {
    display:none
  }
  .links-grid {
    grid-template-columns:1fr
  }
  .audit-filter-grid,.audit-advanced .audit-filter-grid {
    grid-template-columns:1fr
  }
  .search-entity-overview dl {
    grid-template-columns:1fr
  }
  .schedule-week {
    flex-wrap:wrap
  }
  .schedule-week input {
    max-width:none
  }
  .global-search input {
    font-size:11px!important
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    scroll-behavior:auto!important;
    animation:none!important;
    transition:none!important
  }
}

/* Profile forms and permanent, compact registration actions. */
.quick-people { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.quick-people button { font-size:12px; padding-inline:10px; white-space:nowrap; }
.quick-people-mobile { display:none; position:relative; }
.quick-people-mobile summary { list-style:none; cursor:pointer; border:1px solid var(--line); border-radius:6px; padding:8px 10px; background:var(--paper); white-space:nowrap; }
.quick-people-mobile summary::-webkit-details-marker { display:none; }
.quick-people-mobile>div { position:absolute; top:48px; right:0; z-index:60; padding:6px; background:var(--paper); border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow); min-width:185px; }
.quick-people-mobile button { display:block; text-align:left; width:100%; padding:10px; border:0; background:none; color:var(--ink); }
.person-link { color:var(--accent); text-decoration:underline; text-decoration-color:color-mix(in srgb,var(--accent) 35%,transparent); text-underline-offset:3px; font-weight:600; }
.person-link:hover { text-decoration-color:currentColor; }
.profile-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; }
.profile-form-grid .field { min-width:0; margin:0; }
.profile-form-section { border-top:1px solid var(--line); margin-top:20px; padding-top:16px; }
.profile-form-section h2 { font-size:15px; margin:0 0 12px; }
.profile-wide { grid-column:1/-1; margin:0; }
.profile-payment-summary { background:var(--accent-soft); color:var(--accent); border:1px solid var(--line); border-radius:6px; padding:10px 12px; margin-top:12px; }
#profile-form .check-row { display:flex; align-items:center; gap:8px; font-weight:600; }
#profile-form .check-row input { width:18px; height:18px; min-height:18px; }
#initial-payment[hidden] { display:none; }
#teacher-rate-form { max-width:400px; }
@media(max-width:1150px) {
  .quick-people { display:none; }
  .quick-people-mobile { display:block; }
}
@media(max-width:600px) {
  .profile-form-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
  .quick-people-mobile summary { min-width:44px; min-height:44px; display:grid; place-items:center; font-size:20px; padding:4px; }
  .quick-people-mobile summary span { display:none; }
  .topbar { gap:6px; }
  .top-actions { gap:4px; }
  .profile-form-section { margin-top:16px; padding-top:12px; }
}

/* Shift ledger: compact report tables and full-page reconciliation. */
.shift-status{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.shift-top-button{white-space:nowrap;font-size:12px;flex-shrink:0}
.shift-notice{display:flex;flex-wrap:wrap;gap:8px 14px;padding:12px 16px;border-left:3px solid var(--brand);background:var(--accent-soft);margin:12px 0;line-height:1.6;overflow-wrap:anywhere}
.shift-alerts{margin-top:18px;padding:14px 16px}
.shift-alerts summary,.shift-more summary{cursor:pointer;font-weight:600;padding:6px}
.shift-channel-row{display:grid;grid-template-columns:minmax(160px,2fr) minmax(130px,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.shift-confirm{display:flex;gap:8px;align-items:flex-start;margin:20px 0;line-height:1.6}
.shift-confirm input{flex:0 0 auto;margin-top:3px}
#shift-form{grid-template-columns:minmax(0,1fr);min-width:0}
#shift-form>*{min-width:0}
#shift-form .table-wrap{width:100%;overflow:auto}
#shift-form .data-table{min-width:520px}
#shift-form [data-close-channels]{display:contents}
#shift-form [data-reconciliation]{margin:16px 0}
#shift-filters{align-items:end;gap:12px}
#shift-filters .field{margin:0;min-width:130px;flex:1}
#shift-filters .shift-more{flex-basis:100%;order:10}
#shift-filters .shift-more[open]>.filter-bar{padding:12px 0 0}
.payment-shift-fields{margin:8px 0 16px}
.payment-shift-fields>p{margin:0 0 10px}
.data-table td>small{display:block;color:var(--muted);font-size:11px;line-height:1.5;max-width:32em;overflow-wrap:anywhere}
#shift-form input,#shift-form select,#shift-form textarea{max-width:100%}
@media(max-width:650px){.shift-channel-row{grid-template-columns:1fr}.shift-top-button{font-size:11px;padding:0 8px}.top-actions{gap:4px}.shift-notice{padding:10px 12px}#shift-filters .field{flex-basis:100%}}

/* Searchable subscription selector and explicit local payment time. */
.subscription-field,.payment-date-row{min-width:0}
.field>label{display:block;color:var(--muted);font-size:12px;font-weight:500;margin-bottom:5px}
.subscription-combobox{position:relative;min-width:0}
.subscription-input-row{position:relative;display:flex;align-items:center}
.subscription-input-row>.ui-icon{position:absolute;left:10px;color:var(--muted);pointer-events:none}
.subscription-field .subscription-input-row>input{width:100%;min-width:0;padding-left:34px;padding-right:36px;text-overflow:ellipsis}
.subscription-toggle{position:absolute;right:1px;top:1px;bottom:1px;width:34px;min-height:0;display:grid;place-items:center;background:transparent;border:0;color:var(--muted);border-radius:5px;padding:0}
.subscription-toggle:hover{background:var(--hover);color:var(--ink)}
.subscription-popup{position:absolute;z-index:80;top:calc(100% + 5px);left:0;right:0;background:var(--paper);border:1px solid var(--line-strong);border-radius:8px;box-shadow:var(--shadow);overflow:hidden}
.subscription-popup[hidden],.subscription-retry[hidden]{display:none}
.subscription-popup [role=listbox]{max-height:320px;overflow-y:auto;overscroll-behavior:contain}
.subscription-option{padding:10px 12px;cursor:pointer;line-height:1.5;color:var(--ink);font-size:12px;overflow-wrap:anywhere;border-bottom:1px solid var(--line)}
.subscription-option:hover,.subscription-option[aria-selected=true]{background:var(--accent-soft)}
.subscription-option[aria-selected=true]{box-shadow:inset 3px 0 var(--brand)}
.subscription-option>strong{display:flex;gap:8px;justify-content:space-between;font-size:13px;font-weight:600;margin-bottom:3px}
.subscription-option>strong>span{color:var(--muted);font-size:11px;font-weight:500;flex-shrink:0;margin:0}
.subscription-option>span,.subscription-option>small{display:block}
.subscription-option>span{color:var(--ink);font-weight:400;margin:0}
.subscription-option>small{color:var(--muted);font-size:11px;margin-top:3px}
.subscription-feedback{padding:9px 12px;color:var(--muted);font-size:11px;line-height:1.5}
.subscription-retry{margin:0 12px 10px}
.subscription-field>small{display:block;margin-top:6px;font-size:11px;line-height:1.5;overflow-wrap:anywhere}
.subscription-selection:empty{display:none}
.payment-date-row{display:flex;align-items:center;gap:8px}
.payment-date-row>input{flex:1;min-width:0;width:0;max-width:100%}
.payment-date-row>button{flex:none;white-space:nowrap}
@media(max-width:600px){.subscription-toggle{width:42px}.subscription-field .subscription-input-row>input{padding-right:44px}.subscription-popup [role=listbox]{max-height:280px}.subscription-option{padding:12px}.payment-date-row{gap:6px}.payment-date-row>button{padding:0 10px}}

/* Branch pages retain the same panels and tokens as the operational workspace. */
.branch-shift-status { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 16px 0; }
.branch-shift-status h2 { margin: 0; font-size: 16px; }
.branch-shift-status p { margin: 0; }
.branch-accounting-stats { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.branch-accounting-stats .stat strong { font-size: clamp(18px, 1.8vw, 26px); overflow-wrap: anywhere; }
@media (max-width: 1100px) { .branch-accounting-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .branch-accounting-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .branch-shift-status { gap: 10px; } }

/* Reconciliation is the primary historical fact; live custody is secondary. */
.reconciliation-report{margin:0 0 24px;background:var(--paper);border:1px solid var(--line-strong);border-top:3px solid var(--brand);border-radius:8px;overflow:hidden}
.reconciliation-report.has-discrepancy{border-top-color:var(--red)}
.reconciliation-report>header{padding:18px 20px 8px}
.reconciliation-report h2{font-size:18px;margin:0 0 6px;letter-spacing:-.3px}
.reconciliation-report header p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
.reconciliation-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:14px 20px 20px;gap:20px}
.reconciliation-totals>div{min-width:0}
.reconciliation-totals>div>span{display:block;color:var(--muted);font-size:12px;margin-bottom:8px}
.reconciliation-totals strong{font-size:28px;letter-spacing:-.6px;line-height:1.25;font-weight:650;overflow-wrap:anywhere}
.reconciliation-totals strong small{display:block;font-size:12px;font-weight:500;letter-spacing:0;margin-top:5px}
.reconciliation-difference{color:var(--red)!important}
.reconciliation-difference>small{display:block;color:inherit;font-size:11px;font-weight:500}
.reconciliation-breakdown{display:flex;gap:12px 24px;flex-wrap:wrap;align-items:center;padding:12px 20px;background:var(--surface);border-top:1px solid var(--line);font-size:12px}
.reconciliation-breakdown b{margin-left:6px}
.reconciliation-report .data-table{min-width:580px}
.reconciliation-report .numeric{white-space:nowrap}
.reconciliation-cash{background:var(--accent-soft)}
.reconciliation-opening{border-top:1px solid var(--line);padding:12px 20px;display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 20px;font-size:12px}
.reconciliation-opening>strong{flex-basis:100%}
.reconciliation-opening small{display:inline;margin-left:4px}
.reconciliation-opening p{flex-basis:100%;margin:0;color:var(--muted)}
.shift-current-cash{padding:16px 0;margin:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.shift-current-cash h2{margin:0;font-size:15px}
.shift-current-cash p{font-size:12px;line-height:1.6;max-width:850px}
.shift-current-cash .student-summary{margin:0}
.shift-current-cash .student-summary strong{font-size:20px}
.discrepancy-section{margin:24px 0}
.discrepancy-section>.section-title{margin:0;flex-wrap:wrap;gap:10px}
.discrepancy-section>p{font-size:12px;line-height:1.6}
.discrepancy-summary{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:16px 0}
.discrepancy-summary>span{font-size:12px;color:var(--muted)}
.discrepancy-summary strong{display:block;font-size:20px;font-weight:650;color:var(--ink);margin-top:6px}
.discrepancy-summary small{font-size:11px}
.discrepancy-history{margin-top:14px}
.discrepancy-history summary{cursor:pointer;padding:10px 0;font-size:13px}
.discrepancy-event{padding:14px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.discrepancy-event p{margin:6px 0;line-height:1.6;font-size:13px}
.discrepancy-event small{color:var(--muted);font-size:11px}
.discrepancy-event strong{font-size:14px}
#discrepancy-form [data-discrepancy-fields]{display:grid;gap:12px}
#discrepancy-form p{line-height:1.6;font-size:12px}
#discrepancy-list-form{display:flex;gap:10px;flex-wrap:wrap;align-items:end;margin-bottom:16px}
#discrepancy-list-form .field{flex:1;min-width:170px}
@media(max-width:650px){.reconciliation-totals{grid-template-columns:1fr;gap:14px;padding:12px 16px}.reconciliation-totals>div{padding-bottom:12px;border-bottom:1px solid var(--line)}.reconciliation-totals>div:last-child{padding:0;border:0}.reconciliation-totals strong{font-size:26px}.reconciliation-report>header{padding:16px 16px 8px}.reconciliation-breakdown,.reconciliation-opening{padding:12px 16px}.discrepancy-summary{gap:16px}.discrepancy-section .section-title button{width:100%}.discrepancy-event{padding:12px 0}.shift-current-cash .student-summary{gap:16px}}

.category-options{display:flex;flex-wrap:wrap;gap:8px}.student-category{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:8px;font-size:13px;font-weight:600;border:1px solid currentColor}.category-picker{border:0;padding:0;margin:10px 0}.category-picker legend{font-size:14px;margin-bottom:10px}.category-picker label{cursor:pointer}.category-picker input{width:16px;height:16px;accent-color:currentColor}.category-0{color:#be3442;background:#ffe8ec}.category-1{color:#167147;background:#e4f5eb}.category-2{color:#385bc1;background:#e9eeff}.category-3{color:#8052ad;background:#f2e9fb}.category-4{color:#976415;background:#fff2d6}.category-5{color:#b45221;background:#ffecdf}.category-6{color:#177b87;background:#e0f4f6}

/* Case investigation: compact evidence first, then the conversation and decision. */
.assistant-views,.assistant-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.assistant-filters{display:flex;align-items:end;flex-wrap:wrap;gap:10px}
.assistant-filters>.field{flex:1 1 175px;min-width:0}
.assistant-more{width:100%;border-block:1px solid var(--line);padding:10px 0}
.assistant-more summary,.assistant-later summary,.assistant-question summary,.assistant-hint summary{cursor:pointer;font-weight:600;font-size:12px;padding:6px 0}
.assistant-filter-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:10px}
.assistant-queue-summary{padding-block:12px;border-block:1px solid var(--line)}
.assistant-hints,.assistant-operations,.assistant-discussion{margin:24px 0}
.assistant-hints h2,.assistant-operations h2,.assistant-discussion h2{font-size:17px;margin-bottom:8px}
.assistant-hints>p,.assistant-operations>p{font-size:12px;line-height:1.6}
.assistant-hint{padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:6px;margin-top:10px;background:var(--paper)}
.assistant-hint h3{font-size:14px;margin:0 0 6px}
.assistant-hint p{font-size:13px;line-height:1.6;margin:6px 0}
.assistant-empty{padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:6px;font-size:13px;line-height:1.6}
.assistant-payments{max-height:320px;overflow:auto}
.assistant-payments>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding:10px 0}
.assistant-payments>div>span{flex:1;font-size:12px}
.assistant-payments small{display:block;color:var(--muted);margin-top:4px}
.assistant-hint .assistant-actions:empty{display:none}
.assistant-operations .data-table{min-width:640px}
.assistant-operations .pagination{padding:10px}
.assistant-operations .link-btn{white-space:normal;text-align:left;height:auto}
.assistant-later{margin-top:16px}
.assistant-question{padding:12px 0;border-block:1px solid var(--line);margin:16px 0}
.assistant-question form{max-width:820px;margin-top:12px}
.assistant-discussion #discrepancy-form{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.discrepancy-event .pill{margin-left:12px}
.assistant-discussion h3{font-size:14px}
.assistant-filters .form-error:empty{display:none}
@media(max-width:900px){.assistant-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.assistant-filter-grid{grid-template-columns:1fr}.assistant-views{display:grid;grid-template-columns:1fr 1fr}.assistant-views button{white-space:normal;font-size:12px;line-height:1.4}.assistant-filters>.field{flex-basis:100%}.assistant-actions button{width:100%}.assistant-hint{padding:12px}.assistant-payments>div{align-items:start}.assistant-payments>div>span{flex-basis:60%}.assistant-queue-summary>span{flex-basis:100%}.assistant-hints,.assistant-operations,.assistant-discussion{margin:20px 0}.discrepancy-event .pill{margin:8px 0;display:table}}

.assistant-hints .link-btn,.assistant-operations .link-btn{color:var(--accent);border:0;background:transparent;padding:2px 0;font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:24px}
.assistant-hints .link-btn:hover,.assistant-operations .link-btn:hover{color:var(--ink)}
@media(max-width:650px){.assistant-hints .link-btn,.assistant-operations .link-btn{min-height:44px}}