:root {
  --bg:#f2f0e9; --paper:#fcfaf5; --stripe:#f4f5ee; --head:#e9ece1; --draft:#e5eee3;
  --ink:#182e2b; --muted:#4f625e; --soft:#58706a; --border:#d8ddd1; --line:#e4e7dc;
  --side:#102f2e; --side-ink:#eff6ee; --side-sub:#bdd5cb; --accent:#1b654f; --hover:#154f41; --mint:#dbeade;
  --warn:#79491a; --warn-bg:#f7e8cb; --bad:#8f3933; --bad-bg:#f7e5e0; --blue:#315674; --blue-bg:#e2eaf2;
  --focus:#267b62; --small:.79rem; --radius:10px;
  color-scheme:light; background:var(--bg); color:var(--ink);
  font:14px/1.45 "Noto Sans", "Segoe UI", system-ui, sans-serif;
  font-variant-numeric:tabular-nums; scrollbar-color:#9cac9f var(--bg); caret-color:var(--accent);
}
* {box-sizing:border-box}
body,h1,h2,h3,p,dl,dd {margin:0}
a {color:inherit}
button,input,select,textarea {font:inherit}
button,select,input[type="checkbox"],input[type="radio"] {cursor:pointer}
input:is([type="text"],[type="tel"],[type="date"],[type="month"]),select,textarea {
  color:var(--ink); background:#fffefa; border:1px solid #cbd3c8; border-radius:5px;
  min-height:37px; padding:7px 9px; min-width:0; max-width:100%;
}
input::placeholder,textarea::placeholder {color:#64736d; opacity:1}
input[type="checkbox"],input[type="radio"] {accent-color:var(--accent); width:16px; height:16px; flex:none}
input:disabled {background:#f0f1ea; color:#59665e; cursor:not-allowed}
:focus-visible {outline:2px solid var(--focus); outline-offset:3px}
:focus:not(:focus-visible) {outline:none}
::selection {background:#c8e8d2; color:#15382c}
[hidden] {display:none !important}
.skip {position:fixed; left:15px; top:10px; z-index:5; transform:translateY(-150%); padding:9px 12px; background:var(--paper); border:1px solid var(--accent); border-radius:5px}
.skip:focus {transform:none}
.icon {width:17px; height:17px; flex:none; display:inline-block; vertical-align:middle}
.initial {padding:32px; max-width:600px}
.shell {min-height:100vh; display:grid; grid-template-columns:224px minmax(0,1fr)}
.rail {position:sticky; top:0; height:100dvh; min-height:420px; display:flex; flex-direction:column; overflow-y:auto; padding:23px 14px 18px; background:var(--side); color:var(--side-ink)}
.brand {display:flex; align-items:center; gap:10px; min-width:0; color:inherit; text-decoration:none; padding:0 6px}
.brand-mark,.avatar {display:grid; place-items:center; width:35px; height:35px; flex:none; border-radius:7px; background:#e0ebdb; color:#285449}
.brand-mark .icon {width:22px; height:22px}
.brand strong,.brand small {display:block; white-space:nowrap}
.brand strong {font-size:1.01rem; font-weight:740; letter-spacing:-.02em; line-height:1.2}
.brand small {margin-top:4px; font-size:.64rem; letter-spacing:.13em; color:var(--side-sub); font-weight:710; text-transform:uppercase}
.nav-label {margin:31px 8px 7px; color:var(--side-sub); font-size:.68rem; font-weight:730; letter-spacing:.13em; text-transform:uppercase}
.rail nav {display:grid; align-content:start; gap:4px}
.nav-link {display:flex; align-items:center; min-height:39px; gap:9px; padding:8px 9px; text-decoration:none; font-size:.91rem; font-weight:650; border-radius:6px; color:#e4f0e9; position:relative}
.nav-link .icon {width:16px; height:16px; color:#c2d9ce}
.nav-link:hover {background:#20413e}
.nav-link[aria-current="page"] {background:#dceadf; color:#1c513f}
.nav-link[aria-current="page"] .icon {color:#1c654f}
.nav-link[aria-current="page"]::after {content:""; width:5px; height:5px; border-radius:50%; background:#276c52; margin-left:auto}
.rail :focus-visible {outline-color:#c7e5cf}
.rail-end {margin-top:auto; border-top:1px solid #315251; padding:11px 7px 0; display:grid; gap:2px}
.rail-end span {font-size:.77rem; color:var(--side-sub)}
.rail-end strong {font-size:.88rem}
.stage {display:flex; flex-direction:column; min-width:0}
.appbar {min-height:66px; padding:11px 26px; display:flex; justify-content:space-between; gap:12px; align-items:center; border-bottom:1px solid var(--line); background:#faf8f2}
.crumb {display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.84rem; font-weight:620}
.crumb i {font-style:normal; color:#677b71; font-weight:400}
.crumb strong {color:var(--ink)}
.profile {display:flex; align-items:center; gap:10px; min-width:0}
.profile .avatar {width:31px; height:31px; font-size:.70rem; font-weight:780; background:#e0eadc}
.profile strong,.profile small {display:block; white-space:nowrap}
.profile strong {font-size:.84rem}
.profile small {font-size:.72rem; color:var(--muted)}
.profile .button {margin-left:2px; min-height:31px; font-size:.76rem}
.workspace {padding:27px 26px 20px; width:100%; max-width:1660px; align-self:center}
.heading {margin-bottom:20px; display:flex; align-items:flex-start; justify-content:space-between; gap:15px}
.heading p {margin-top:5px; color:var(--muted); font-size:.98rem; max-width:70ch}
h1 {font-size:2.44rem; line-height:1.14; font-weight:740; letter-spacing:-.036em; text-wrap:balance}
h2 {font-size:1.22rem; line-height:1.24; font-weight:730; letter-spacing:-.022em}
h3 {font-size:1rem; line-height:1.3; letter-spacing:-.015em}
.heading-action {padding-top:5px; display:flex; flex-wrap:wrap; gap:8px; justify-content:end}
.sheet {background:var(--paper); border:1px solid var(--border); border-radius:var(--radius); min-width:0}
.sheet+.sheet {margin-top:15px}
.sheet-head {padding:15px 17px 11px; display:flex; justify-content:space-between; gap:11px; align-items:flex-start}
.sheet-head p {margin-top:3px; font-size:.84rem; color:var(--muted); max-width:70ch}
.sheet-foot {padding:11px 17px; border-top:1px solid var(--line); color:var(--muted); font-size:.80rem}
.sheet-pad {padding:14px 17px 17px}
.sheet-head+.sheet-pad {border-top:1px solid var(--line)}
.sheet-pad>form {display:grid; gap:11px}
.sheet-pad>.callout {margin-top:13px}
.controls {display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:end}
.controls input,.controls select,.heading-action select {min-height:34px; font-size:.82rem}
.control-group {display:flex; flex-wrap:wrap; gap:7px; align-items:center}
.period {display:flex; gap:6px; align-items:center}
.period select {padding-left:28px}
.period .icon {position:absolute; left:7px; color:#38594f; width:15px}
.period-select {position:relative; display:flex; align-items:center}
.button {display:inline-flex; justify-content:center; align-items:center; gap:7px; color:var(--ink); min-height:35px; padding:6px 11px; background:#fbfaf5; border:1px solid #cbd3c8; border-radius:5px; white-space:nowrap; font-size:.84rem; text-decoration:none; font-weight:695; line-height:1.35; transition:background-color .16s,color .16s,border-color .16s}
.button .icon {width:15px; height:15px}
.button:hover {background:#eef2e9; border-color:#9db1a0}
.button:active:not(:disabled) {transform:translateY(1px)}
.button.primary {background:var(--accent); color:#fff; border-color:var(--accent)}
.button.primary:hover {background:var(--hover); border-color:var(--hover)}
.button.secondary {color:#165c48; border-color:#abc2b3}
.button.danger {color:var(--bad); border-color:#d9b9b3}
.button.danger:hover {background:var(--bad-bg)}
.button:disabled {cursor:not-allowed; color:#52665b; border-color:var(--border); background:#e9ece4}
.button.small-btn {min-height:30px; padding:4px 8px; font-size:.77rem}
.button.block {width:100%}
.segment {display:flex; align-items:stretch; background:#eeeee6; border:1px solid #dce2d5; border-radius:6px; padding:2px; gap:2px}
.segment button,.radio-bar label {background:transparent; border:0; color:#44625a; padding:5px 10px; font-size:.8rem; font-weight:675; border-radius:4px; min-height:29px; white-space:nowrap}
.segment button:hover,.radio-bar label:hover {background:#e2e9de}
.segment button[aria-pressed="true"],.radio-bar label:has(:checked) {background:#dceadf; color:#22523e}
.radio-bar {display:flex; flex-wrap:wrap; gap:4px}
.radio-bar label {position:relative; background:#eeeee6; cursor:pointer}
.radio-bar input {position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0}
.radio-bar label:has(:focus-visible) {outline:2px solid var(--focus); outline-offset:2px}
.table-scroll {overflow:auto; width:100%; scrollbar-width:thin}
table {width:100%; border-collapse:collapse; table-layout:auto; font-size:.86rem}
th,td {text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:middle; min-width:63px; overflow-wrap:anywhere}
th:first-child,td:first-child {padding-left:17px}
th:last-child,td:last-child {padding-right:17px}
th {background:var(--head); font-size:.7rem; font-weight:750; letter-spacing:.055em; color:#3d5750; text-transform:uppercase; white-space:nowrap}
tbody tr:nth-child(even) {background:var(--stripe)}
tbody tr:last-child td {border-bottom:0}
tbody tr.selected td {background:#e4ede1}
tbody tr.draft td {background:var(--draft); border-color:#d6e0d3; border-bottom:1px solid #d6e0d3; padding-top:7px; padding-bottom:7px}
tbody tr.draft td+td {border-left:1px solid #d6e0d3}
.draft input,.draft select {width:100%; min-width:85px; font-size:.84rem; min-height:35px}
.draft input[name="date"] {min-width:125px}
.draft input[name="student"] {min-width:160px}
.draft input[name="payee"],.draft input[name="purpose"] {min-width:150px}
.draft input[name="amount"] {text-align:right}
.numeric {text-align:right; white-space:nowrap; font-weight:720}
thead .numeric {font-weight:750}
.cell-note {display:block; color:var(--muted); font-size:.77rem; margin-top:2px}
.cell-ref {font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.81rem}
.table-pick {padding:2px 0; text-align:left; background:none; color:var(--accent); border:0; font-weight:700; text-decoration:underline; text-decoration-color:#86a899; text-underline-offset:2px}
.table-pick:hover {text-decoration-color:var(--accent)}
.empty-row td {padding:25px 17px; color:var(--muted)}
tfoot td {background:#eef2e8; border-bottom:0; border-top:1px solid var(--border); font-weight:720}
.badge {display:inline-flex; align-items:center; white-space:nowrap; gap:5px; border-radius:4px; padding:3px 7px; background:#eceee6; color:#46574f; font-size:.73rem; font-weight:720; line-height:1.1}
.badge::before {content:""; width:5px; height:5px; border-radius:50%; background:currentColor}
.badge.warn {background:var(--warn-bg); color:var(--warn)}
.badge.good {background:var(--mint); color:#215840}
.badge.bad {background:var(--bad-bg); color:var(--bad)}
.badge.blue {background:var(--blue-bg); color:var(--blue)}
.split {display:grid; grid-template-columns:minmax(0,2.12fr) minmax(270px,1fr); gap:17px; align-items:start}
.split.wide {grid-template-columns:minmax(0,2.45fr) minmax(255px,1fr)}
.split+.sheet,.band+.sheet,.band+.split,.sheet+.band {margin-top:16px}
.band {display:flex; align-items:center; gap:0; padding:13px 17px; border:1px solid #d7dfcf; border-radius:var(--radius); background:#eaf0e5}
.band-item {flex:1; padding:0 16px; min-width:0}
.band-item:first-child {padding-left:0}
.band-item+.band-item {border-left:1px solid #d4ded0}
.band-item span,.band-item strong,.band-item small {display:block}
.band-item span {color:#385e53; font-size:.82rem; font-weight:700}
.band-item strong {margin-top:1px; font-size:1.55rem; line-height:1.25; font-weight:760; letter-spacing:-.02em}
.band-item small,.band>p {color:var(--muted); font-size:.76rem}
.band>p {padding-left:14px; text-align:right; max-width:31ch}
.callout {display:flex; align-items:flex-start; gap:9px; background:#eaf0e5; color:#285b4f; border-radius:6px; padding:9px 10px; font-size:.81rem}
.callout p {margin-top:2px; color:#45635a; max-width:70ch}
.callout .icon {width:15px; height:15px; margin-top:1px}
.callout.no-bg {padding:0; background:none}
.facts {display:grid; gap:6px; margin-bottom:12px; font-size:.82rem}
.facts div {display:flex; justify-content:space-between; gap:12px}
.facts dt {color:var(--muted)}
.facts dd {color:var(--ink); text-align:right; font-weight:700; overflow-wrap:anywhere}
.facts .big {font-size:1.4rem}
.field {display:grid; gap:4px; align-content:start; font-size:.82rem; font-weight:680; min-width:0}
.field :is(input,select,textarea) {width:100%; font-weight:400; font-size:.88rem}
.form-grid {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
.form-grid.three {grid-template-columns:minmax(140px,1fr) minmax(155px,1.35fr) minmax(104px,.55fr)}
.form-grid .wide-field {grid-column:1/-1}
.checkbox {display:flex; gap:7px; align-items:center; color:#284b40; font-size:.83rem; font-weight:630}
.form-actions {display:flex; justify-content:flex-end; align-items:center; gap:8px; flex-wrap:wrap}
.form-error {background:var(--bad-bg); color:var(--bad); padding:8px 10px; margin:0; border-radius:5px; font-size:.83rem}
.form-error.outside {margin:8px 17px}
.quiet {color:var(--muted)}
.error-ink {color:var(--bad)}
.warning-ink {color:var(--warn)}
.strong {font-weight:725}
.balance-line {display:flex; justify-content:space-between; gap:8px; align-items:center; border-top:1px solid var(--line); padding:10px 0; margin-top:3px; font-weight:700}
.balance-line strong {font-size:1.5rem; letter-spacing:-.02em}
.inline-tools {margin:11px 17px; display:flex; align-items:center; flex-wrap:wrap; gap:10px; justify-content:space-between}
.inline-tools p {color:var(--muted); font-size:.82rem}
.appfoot {display:flex; justify-content:space-between; padding:17px 26px 19px; color:var(--muted); font-size:.76rem; margin-top:auto}
.login {min-height:100vh; display:grid; grid-template-columns:minmax(280px,.9fr) minmax(360px,1.1fr)}
.login-brand {background:var(--side); color:var(--side-ink); padding:35px 37px 28px; display:flex; flex-direction:column; min-width:0}
.login-brand>div:nth-child(2) {margin:auto 0; padding:75px 5px 85px}
.login-brand h2 {font-size:3.45rem; max-width:8ch; line-height:1.02; font-weight:740; letter-spacing:-.037em}
.login-brand p {margin:14px 0 0; color:var(--side-sub); font-size:.98rem; max-width:27ch}
.login-brand>small {color:var(--side-sub); font-size:.76rem}
.login-panel {display:grid; align-content:center; justify-content:center; padding:33px 24px}
.login-inner {width:min(100%,390px)}
.login-inner h1 {font-size:2.1rem}
.login-inner>p {color:var(--muted); margin:7px 0 17px; max-width:52ch}
.login-inner form {display:grid; gap:12px}
.login-inner form .form-actions {justify-content:flex-start}
.login-inner .demo {margin-top:23px; border-top:1px solid var(--border); padding-top:13px; display:grid; gap:7px}
.login-inner .demo p {font-size:.83rem; color:var(--muted)}
.notice {position:fixed; right:22px; bottom:22px; z-index:4; max-width:min(380px,calc(100vw - 44px)); color:#fff; background:#215b4a; border-radius:7px; padding:10px 13px; font-size:.88rem; box-shadow:0 5px 17px #173c322b}
.notice:empty {display:none}
dialog {border:1px solid var(--border); border-radius:var(--radius); background:var(--paper); color:var(--ink); width:min(450px,calc(100% - 30px)); padding:20px; box-shadow:0 18px 36px #112c283f}
dialog::backdrop {background:#0c251f6a}
dialog p {margin-top:9px; color:var(--muted)}
dialog .form-actions {margin-top:15px}
.loading-surface {height:184px; padding:15px 17px}
.loading-surface p {color:var(--muted)}
.loading-surface i {display:block; background:#eaeee5; height:12px; border-radius:4px; margin-top:13px; width:var(--w)}
@media (max-width:1160px) {
  .rail {padding-left:10px;padding-right:10px}
  .shell {grid-template-columns:198px minmax(0,1fr)}
  .workspace,.appbar,.appfoot {padding-left:20px; padding-right:20px}
  th,td {padding-left:9px;padding-right:9px}
  th:first-child,td:first-child {padding-left:12px}
  th:last-child,td:last-child {padding-right:12px}
  .split,.split.wide {gap:13px; grid-template-columns:minmax(0,1fr) minmax(235px,.48fr)}
  .form-grid.three {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px) {
  .split,.split.wide {grid-template-columns:minmax(0,1fr)}
  .heading {flex-wrap:wrap}
  .heading-action {justify-content:start; padding-top:0}
  .sheet-head {flex-wrap:wrap}
  .controls {justify-content:start}
}
@media (max-width:650px) {
  .shell {display:block}
  .rail {position:static;height:auto;min-height:0;gap:11px;overflow:visible;padding:10px 12px}
  .brand {padding-left:0}
  .brand-mark {width:30px;height:30px}
  .rail nav {display:flex;align-items:center;overflow:auto;gap:4px}
  .nav-label,.rail-end,.crumb {display:none}
  .nav-link {white-space:nowrap; min-height:35px;padding:6px 8px;font-size:.84rem}
  .nav-link[aria-current="page"]::after {display:none}
  .appbar {justify-content:flex-end;min-height:49px;padding-top:6px;padding-bottom:6px}
  .workspace,.appbar,.appfoot {padding-left:13px; padding-right:13px}
  .workspace {padding-top:19px}
  h1 {font-size:2rem}
  .heading p {font-size:.89rem}
  .band {flex-wrap:wrap; row-gap:9px; padding:10px}
  .band-item {min-width:32%; padding:0 8px}
  .band-item strong {font-size:1.25rem}
  .band>p {width:100%; max-width:none; padding-left:0; text-align:left}
  .login {grid-template-columns:1fr;min-height:100vh;align-content:start}
  .login-brand {padding:17px 17px 21px}
  .login-brand>div:nth-child(2) {padding:28px 1px 0}
  .login-brand h2 {font-size:2rem;max-width:none}
  .login-brand p {max-width:none}
  .login-brand>small {display:none}
  .login-panel {padding:23px 17px}
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {transition:none !important;scroll-behavior:auto !important}
}
.stacked {display:grid;gap:11px}
.stacked .facts {margin:0}
.choice {margin:0;padding:0;border:0;min-width:0}
.choice legend {margin-bottom:5px;color:var(--ink);font-size:.82rem;font-weight:680}
.split.insets {margin-top:16px}
.icon-text {font-weight:670}
.icon-text .icon {width:15px;height:15px;margin-right:3px}
.demo-badge {display:inline-flex;background:var(--warn-bg);color:var(--warn);padding:2px 6px;border-radius:4px;font-size:.72rem;font-weight:700;white-space:nowrap}
@media(max-width:420px){.profile {gap:7px}.profile .button .icon{display:none}.period {flex-wrap:wrap}.band-item {min-width:47%}.demo-badge {display:none}}
.loading-surface i:nth-of-type(1){width:52%}
.loading-surface i:nth-of-type(2){width:74%}
.loading-surface i:nth-of-type(3){width:63%}