:root{
  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-display: var(--font-ui);
  --font-12: 12px;
  --font-13: 13px;
  --font-14: 14px;
  --font-16: 16px;
  --font-22: 22px;
  --font-28: 28px;
  --font-badge: 11px;
  --weight-body: 400;
  --weight-strong: 600;
  --radius-control: 6px;
  --radius-card: 8px;
  --radius-pill: 999px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --control-height: 40px;
  --control-small: 32px;
  --disclosure-height: 48px;
  --badge-height: 22px;
  --color-ink: #18263d;
  --color-text: #18263d;
  --color-muted: #60748d;
  --color-subtle: #9aa8ba;
  --color-primary: #356df3;
  --color-primary-deep: #2559d7;
  --color-danger: #a5372e;
  --color-danger-solid: #d70015;
  --color-danger-soft: #fff0ed;
  --color-success: #1f6f34;
  --color-success-soft: #e9f7ec;
  --color-warning: #47617e;
  --color-warning-soft: #edf4fb;
  --color-neutral-soft: #eef1f4;
  --color-line: #e3e8ee;
  --color-line-strong: #bdc9d7;
  --color-control-border: #bdc9d7;
  --color-canvas: #f5f7fa;
  --color-surface: #ffffff;
  --color-surface-soft: #f5f7fb;
  --color-disabled: #9aa8ba;
  --color-disabled-bg: #f5f7fb;
  --color-nav: #eaf1f8;
  --color-nav-deep: #eaf1f8;
  --color-brand-threads: var(--color-primary);
  --sidebar-width: 212px;
  --layer-drawer: 110;
  --shadow-panel: 0 1px 3px rgba(29,56,89,.08);
  --shadow-drawer: -22px 0 54px rgb(31 32 36 / .18);
  --focus-ring: 0 0 0 3px rgb(53 109 243 / .2);
  --workbench-control: var(--control-height);
  --workbench-soft: var(--color-surface-soft);
  --workbench-selected: #eaf0fb;
  --workbench-selected-border: #bdcee6;
  --radius-panel: var(--radius-card);
  --ink: var(--color-ink);
  --ink-2: var(--color-text);
  --text: var(--color-text);
  --muted: var(--color-muted);
  --paper: var(--color-canvas);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface-soft);
  --line: var(--color-line);
  --line-strong: var(--color-line-strong);
  --blue: var(--color-primary);
  --teal: var(--color-primary);
  --teal-hover: var(--color-primary-deep);
  --accent-soft: var(--workbench-selected);
  --accent: var(--color-primary);
  --green: var(--color-success);
  --amber: var(--color-warning);
  --red: var(--color-danger);
  --shadow: var(--shadow-panel);
  --weight-medium: 500;
  --weight-metric: 700;
  --color-row-line: #e7ecf2;
}

*{box-sizing:border-box}html,body{min-height:100%;margin:0;background:var(--color-canvas)}body{color:var(--color-text);font:var(--font-14)/1.55 var(--font-ui)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{font-weight:var(--weight-medium);white-space:nowrap;cursor:pointer}button svg,a svg{flex-shrink:0}button:disabled{cursor:not-allowed;color:var(--color-disabled);background:var(--color-disabled-bg)}a{color:var(--color-primary-deep);text-underline-offset:3px}::selection{background:#d6e5fb;color:var(--color-ink)}:focus-visible{outline:2px solid var(--color-primary-deep);outline-offset:3px}input,textarea{caret-color:var(--color-primary)}*{scrollbar-width:thin;scrollbar-color:#bdc9d7 transparent}svg{vertical-align:middle}h1,h2,h3,p{margin:0}[hidden]{display:none!important}
.ops-shell{display:grid;width:100%;min-height:100vh;grid-template-columns:var(--sidebar-width) minmax(0,1fr)}
.ledger-sidebar{position:sticky;top:0;display:flex;flex-direction:column;height:100vh;height:100dvh;padding:22px 16px 16px;color:var(--color-muted);background:var(--color-nav);border-right:1px solid #d9e3ee}
.sidebar-brand{display:flex;align-items:center;gap:11px;min-height:54px;padding:0 8px 18px;border-bottom:1px solid #d4dfeb}.sidebar-brand-mark{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:8px;color:white;background:var(--color-primary);font-size:16px;font-weight:500}.sidebar-brand>span:last-child{display:grid;min-width:0}.sidebar-brand strong{font-size:16px;font-weight:600;letter-spacing:-.015em;color:var(--color-text);white-space:nowrap}.sidebar-brand small{font-size:12px;color:#526780}
.sidebar-nav{display:grid;gap:5px;margin-top:22px}.sidebar-nav-label{display:block;margin:0 10px 7px;color:#526780;font-size:12px;font-weight:500;letter-spacing:.12em}.sidebar-nav a{display:flex;width:100%;height:40px;gap:11px;align-items:center;padding:0 12px;border:1px solid transparent;border-radius:6px;font-size:14px;line-height:1.25;font-weight:500;text-decoration:none;color:var(--color-muted)}.sidebar-nav a.is-active{color:#1f5fc9;background:#d6e5fb;border-color:#c2d7f3}.sidebar-system{margin-top:auto;padding-top:18px;border-top:1px solid #d4dfeb}.workspace-link{display:flex;align-items:center;gap:10px;padding:8px 10px;color:var(--color-muted);text-decoration:none;border-radius:6px;font-size:13px}.workspace-link:hover{color:#1f5fc9;background:#e1ebf8}.sidebar-account{display:flex;align-items:center;gap:10px;margin-top:14px;padding:10px 11px;border:1px solid #d4dfeb;border-radius:8px;background:#f5f8fc}.sidebar-account>span{display:grid;min-width:0}.sidebar-account strong{color:var(--color-text);font-size:12px;font-weight:600}.sidebar-account small{color:#526780;font-size:12px}
.ledger-stage{min-width:0;padding:22px 28px 64px}.header-title-row{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px;margin:-22px -28px 20px;padding:16px 28px;background:white;border-bottom:1px solid var(--color-line)}.page-heading{min-width:0}.page-heading h1{font-size:28px;font-weight:600;line-height:1.3;letter-spacing:-.5px}.page-heading p{margin-top:5px;color:var(--color-muted);font-size:12px}.header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.btn{display:inline-flex;justify-content:center;align-items:center;gap:7px;height:40px;min-height:40px;padding:0 14px;border:1px solid var(--color-line);border-radius:6px;background:white;color:var(--color-text);font-size:14px;font-weight:500;line-height:1.25;box-shadow:none}.btn:hover{background:var(--workbench-selected);border-color:var(--workbench-selected-border)}.btn.primary{color:white;background:var(--color-primary);border-color:var(--color-primary)}.btn.primary:hover{background:var(--color-primary-deep);border-color:var(--color-primary-deep)}.btn.danger{color:var(--color-danger)}.btn.sm{height:32px;min-height:32px;padding:0 8px;border-color:transparent;background:transparent;font-size:12px}.btn.sm:first-child{color:var(--color-primary-deep)}.btn.sm:hover{background:var(--workbench-selected)}
.metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-bottom:20px;overflow:hidden;border:1px solid var(--color-line);border-radius:8px;background:white}.metric{min-width:0;padding:20px 16px}.metric+.metric{border-left:1px solid var(--color-line)}.metric span{display:block;color:var(--color-muted);font-size:12px}.metric b{display:block;margin-top:5px;color:var(--color-ink);font-size:22px;font-weight:700;line-height:1.4;font-variant-numeric:tabular-nums}
.data-section{display:grid;gap:16px;padding:20px;border:1px solid var(--color-line);border-radius:8px;background:white}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding-bottom:14px;flex-wrap:wrap}.section-heading h2{font-size:16px;font-weight:600;line-height:1.5}.section-heading p,.section-heading>span{color:var(--color-muted);font-size:12px}.section-heading p{margin-top:3px}.toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 156px 180px auto;gap:12px;align-items:end;padding:0 0 16px}.field{display:grid;gap:7px;min-width:0;color:var(--color-muted);font-size:12px;font-weight:400}.search-box{display:flex;gap:8px;align-items:center;height:40px;padding:0 12px;border:1px solid var(--color-control-border);border-radius:6px;background:white;color:var(--color-muted)}input,select,textarea{width:100%;min-width:0;height:40px;padding:9px 10px;border:1px solid var(--color-control-border);border-radius:6px;background:white;color:var(--color-text);font:400 14px/1.5 var(--font-ui)}input::placeholder,textarea::placeholder{color:var(--color-muted);opacity:1}.search-box input{width:100%;height:38px;min-height:0;padding:0;border:0;border-radius:0;background:transparent;outline:none}.search-box:focus-within{outline:2px solid var(--color-primary-deep);outline-offset:3px}.search-box input:focus-visible{outline:0}textarea{min-height:88px;height:88px;resize:vertical}.table-wrap{min-width:0;overflow-x:auto;border-top:1px solid var(--color-line)}table{width:100%;min-width:1040px;border-collapse:collapse;text-align:left;font-size:14px}th,td{padding:12px 16px;vertical-align:middle;border-bottom:1px solid var(--color-row-line)}th{background:var(--workbench-soft);color:var(--color-muted);font-size:12px;font-weight:500;white-space:nowrap}tbody td{background:white}tbody tr:last-child td{border-bottom:0}th:first-child,td.num{width:60px;text-align:right;font-variant-numeric:tabular-nums}td:nth-child(2){white-space:nowrap;font-weight:500;font-variant-numeric:tabular-nums}td:nth-child(3),td:nth-child(4){white-space:nowrap}td:nth-child(5){min-width:140px;max-width:220px;overflow-wrap:anywhere}td:nth-child(6),td:nth-child(7),td:nth-child(8){min-width:105px}th:last-child,td:last-child{white-space:nowrap;text-align:right}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:22px;padding:1px 8px;border:1px solid transparent;border-radius:999px;font-size:11px;line-height:1.5;font-weight:400}.yes{background:var(--color-success-soft);color:var(--color-success)}.no{background:var(--color-neutral-soft);color:var(--color-muted)}.acct{display:block;max-width:160px;margin-top:4px;color:var(--color-muted);font-size:12px;overflow-wrap:anywhere}.note{max-width:200px;overflow-wrap:anywhere;font-size:12px;color:var(--color-muted)}td.empty{text-align:left;padding:16px;color:var(--color-muted);font-size:14px;font-weight:400}.empty-content{padding:12px 0;white-space:normal}.empty-content p+p{margin-top:6px;font-size:12px}.empty-content .btn{margin-top:14px}.record-footer{display:flex;align-items:center;gap:8px;justify-content:space-between;padding-top:14px;border-top:1px solid var(--color-line);font-size:12px;color:var(--color-muted)}.record-footer p{max-width:72ch}.storage-label{display:flex;align-items:center;gap:6px;white-space:nowrap}.storage-dot{width:6px;height:6px;border-radius:50%;background:var(--color-primary)}
.drawer{position:fixed;inset:0 0 0 auto;width:min(760px,100vw);max-width:100vw;height:100vh;height:100dvh;max-height:100dvh;margin:0 0 0 auto;padding:0;overflow:hidden;border:0;border-left:1px solid var(--color-line);border-radius:0;background:#f7f8fc;color:var(--color-text);box-shadow:var(--shadow-drawer)}.drawer::backdrop{background:rgb(9 20 38 / .60);backdrop-filter:blur(2px)}.drawer[open]{animation:drawer-enter 180ms cubic-bezier(.16,1,.3,1)}.drawer form{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%;min-width:0}.drawer-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px 16px;background:white;border-bottom:1px solid var(--color-line)}.drawer-header h2{margin:0;color:var(--color-ink);font-size:22px;font-weight:600;line-height:1.4}.drawer-header p{margin-top:4px;color:var(--color-muted);font-size:12px}.icon-button{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;padding:0;border:1px solid var(--color-line);border-radius:6px;background:white;color:#64748b}.icon-button:hover{background:var(--workbench-selected)}.form-body{display:grid;align-content:start;gap:20px;overflow-y:auto;padding:24px}.form-section{min-width:0;padding:16px;border:1px solid var(--color-line);border-radius:8px;background:white}.form-section h3{margin:0 0 16px;font-size:14px;font-weight:600}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.full{grid-column:1/-1}.required{color:var(--color-danger)}.ph{display:flex;min-width:0}.ph em{display:grid;place-items:center;flex:0 0 58px;padding:0 10px;border:1px solid var(--color-control-border);border-right:0;border-radius:6px 0 0 6px;background:var(--workbench-soft);color:var(--color-muted);font-size:14px;font-style:normal}.ph input{border-radius:0 6px 6px 0}.platform-list{display:grid;gap:16px}.platform-row{display:grid;grid-template-columns:105px 112px minmax(0,1fr);gap:12px;align-items:center}.platform-name{display:flex;align-items:center;min-height:40px;font-size:14px;color:var(--color-text)}.platform-head{display:grid;grid-template-columns:105px 112px minmax(0,1fr);gap:12px;padding-bottom:10px;border-bottom:1px solid var(--color-line);color:var(--color-muted);font-size:12px}.field-hint{margin-top:6px;color:var(--color-muted);font-size:12px}.drawer-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 24px;border-top:1px solid var(--color-line);background:white}.drawer-footer>span{margin-right:auto;color:var(--color-muted);font-size:12px}.drawer-footer .btn{min-width:76px}.skip-link{position:fixed;top:8px;left:8px;z-index:200;transform:translateY(-150%);padding:8px 12px;background:white;border:1px solid var(--color-primary);border-radius:6px}.skip-link:focus{transform:none}@keyframes drawer-enter{from{transform:translateX(32px);opacity:.6}to{transform:none;opacity:1}}
@media(max-width:1100px){.header-title-row{align-items:flex-start;flex-wrap:wrap;gap:16px}.toolbar{grid-template-columns:minmax(200px,1fr) 140px 160px}.toolbar>.btn{grid-column:3;justify-self:end}.header-actions{gap:8px}.header-actions .btn{padding-inline:12px}}
@media(max-width:780px){.ops-shell{grid-template-columns:minmax(0,1fr)}.ledger-sidebar{position:static;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;width:100%;height:auto;min-height:70px;padding:12px 16px;border-right:0;border-bottom:1px solid #d4dfeb}.sidebar-brand{min-height:0;padding:0;border:0}.sidebar-brand strong{font-size:14px}.sidebar-brand small{font-size:12px}.sidebar-nav{display:block;margin:0}.sidebar-nav-label,.sidebar-system{display:none}.sidebar-nav a{width:auto;font-size:13px}.ledger-stage{padding:20px 16px 40px}.header-title-row{margin:-20px -16px 16px;padding:16px;min-height:80px;gap:16px}.page-heading h1{font-size:28px}.header-actions{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr}.header-actions .primary{grid-column:1/-1;grid-row:1}.header-actions .btn{padding-inline:8px;font-size:13px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:16px}.metric{padding:16px}.metric:nth-child(3),.metric:nth-child(5){border-left:0}.metric:nth-child(n+3){border-top:1px solid var(--color-line)}.metric:last-child{grid-column:1/-1}.data-section{padding:16px;gap:12px}.toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-bottom:12px}.toolbar>.field:first-child{grid-column:1/-1}.toolbar>.btn{grid-column:1/-1;justify-self:stretch}.section-heading{padding-bottom:8px;gap:8px}.table-wrap{margin:0 -16px}.record-footer{align-items:flex-start;flex-direction:column;gap:10px}.form-body{padding:16px}.drawer-header{padding:20px 16px 16px}.drawer-footer{padding:16px}.drawer-footer>span{display:none}.platform-row,.platform-head{grid-template-columns:80px 90px minmax(0,1fr);gap:8px}.form-section{padding:16px}.grid{gap:16px}}
@media(max-width:460px){.grid{grid-template-columns:minmax(0,1fr)}.platform-head{display:none}.platform-row{grid-template-columns:minmax(0,1fr) 100px}.platform-row>label:last-child{grid-column:1/-1}.platform-row+.platform-row{padding-top:16px;border-top:1px solid var(--color-line)}.sidebar-brand-mark{flex-basis:34px;height:34px;font-size:14px}.sidebar-brand{gap:8px}.sidebar-nav a{padding-inline:8px;gap:6px}.sidebar-brand strong{font-size:13px}.sidebar-brand small{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:781px){th:last-child,tbody td:last-child:not([colspan]){position:sticky;right:0;z-index:1;box-shadow:-1px 0 0 var(--color-line)}th:last-child{background:var(--workbench-soft)}tbody td:last-child:not([colspan]){background:white}}/* Keep the ledger palette and components; adapt the existing card fields to its narrow layout. */
.ledger-stage,
.data-section,
.section-heading,
.section-heading > *,
.toolbar,
.toolbar > *,
.field,
.header-actions {
  min-width: 0;
}

.section-heading p,
.page-heading p {
  overflow-wrap: anywhere;
}

#filter-toggle {
  display: none;
}

.table-wrap {
  container-type: inline-size;
}

#form-error,
#storage-error {
  padding: 12px 16px;
  border: 1px solid #e8c5bc;
  border-radius: var(--radius-control);
  color: #913d29;
  background: #fff5f1;
  font-size: var(--font-14);
  line-height: 1.6;
  overflow-wrap: anywhere;
}

#storage-error {
  margin-bottom: 16px;
}

#phone-error,
.field-error {
  color: var(--color-danger);
  font-size: var(--font-12);
  line-height: 1.6;
  overflow-wrap: anywhere;
}

input[aria-invalid="true"] {
  border-color: var(--color-danger);
}

#app-notice {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
  padding: 12px 16px;
  border: 1px solid var(--workbench-selected-border);
  border-radius: var(--radius-card);
  color: var(--color-text);
  background: var(--workbench-selected);
  font-size: var(--font-14);
  line-height: 1.6;
}

#notice-text {
  flex: 1 1 180px;
  min-width: 0;
  overflow-wrap: anywhere;
}

#notice-undo,
#app-notice .icon-button {
  flex: 0 0 auto;
  height: var(--control-height);
  min-height: var(--control-height);
}

#trash-count {
  font-size: var(--font-12);
  font-variant-numeric: tabular-nums;
}

.drawer-content {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100%;
  min-width: 0;
  min-height: 0;
}

.drawer-header > div {
  min-width: 0;
}

#trash-message {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid var(--workbench-selected-border);
  border-radius: var(--radius-control);
  background: var(--workbench-selected);
  color: var(--color-text);
  font-size: var(--font-12);
  line-height: 1.6;
  white-space: normal;
  overflow-wrap: anywhere;
}

.trash-list {
  display: grid;
  align-content: start;
  min-width: 0;
  min-height: 0;
  padding: 24px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.trash-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 16px 0;
  border-bottom: 1px solid var(--color-row-line);
}

.trash-item > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.trash-item strong {
  color: var(--color-text);
  font-size: var(--font-14);
  font-weight: var(--weight-medium);
  font-variant-numeric: tabular-nums;
}

.trash-item p,
.trash-item small {
  color: var(--color-muted);
  font-size: var(--font-12);
  line-height: 1.6;
}

.trash-item .btn {
  height: var(--control-height);
  min-height: var(--control-height);
}

.trash-list > .empty,
.trash-list > .trash-empty {
  padding: 16px 0;
  color: var(--color-muted);
  font-size: var(--font-14);
  text-align: left;
  line-height: 1.7;
}

@media (max-width: 1100px) {
  #filter-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #filter-controls > .field:first-child {
    grid-column: 1 / -1;
  }

  #filter-controls > .filter-reset {
    grid-column: 2;
    justify-self: end;
  }
}

@media (max-width: 780px) {
  .header-actions {
    display: flex;
    width: auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
  }

  .header-actions .primary {
    grid-column: auto;
    grid-row: auto;
    order: 1;
  }

  #trash-button {
    order: 0;
  }

  .header-actions .btn,
  .record-actions .btn,
  .drawer-footer .btn {
    height: var(--control-height);
    min-height: var(--control-height);
  }

  .trash-list {
    padding: 16px;
  }
}

@media (max-width: 700px) {
  #filter-controls {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  #filter-controls > .field:first-child {
    grid-column: 1;
    grid-row: 1;
  }

  #filter-toggle {
    display: inline-flex;
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    justify-self: end;
    width: auto;
    padding: 0 8px;
    border-color: transparent;
    background: transparent;
    color: var(--color-primary);
    font-size: var(--font-13);
  }

  #filter-toggle:hover {
    background: var(--workbench-selected);
  }

  #filter-controls:not([data-expanded="true"]) > :is(.advanced-filter, .filter-reset) {
    display: none;
  }

  #filter-controls[data-expanded="true"] > .advanced-filter {
    display: grid;
    grid-column: 1 / -1;
  }

  #filter-controls[data-expanded="true"] > .filter-reset {
    display: inline-flex;
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}

@media (max-width: 460px) {
  .header-actions {
    width: 100%;
  }

  .header-actions .primary {
    flex: 1 1 auto;
  }

  #trash-button {
    flex: 0 0 auto;
  }
}

@container (max-width: 1040px) {
  .table-wrap table,
  .table-wrap tbody {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .table-wrap thead {
    display: none;
  }

  .table-wrap tbody tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 12px 24px;
    min-width: 0;
    min-height: 91px;
    padding: 16px;
    border-bottom: 1px solid var(--color-row-line);
    background: white;
  }

  .table-wrap tbody tr:last-child {
    border-bottom: 0;
  }

  .table-wrap table tbody tr > td:nth-child(n):not(.empty) {
    position: static;
    inset: auto;
    z-index: auto;
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    align-items: start;
    gap: 4px 8px;
    width: auto;
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .table-wrap table tbody tr > td:nth-child(n):not(.empty)::before {
    content: attr(data-label);
    grid-column: 1;
    grid-row: 1 / span 2;
    color: var(--color-muted);
    font-size: var(--font-12);
    font-weight: var(--weight-body);
    line-height: 1.8;
  }

  .table-wrap table tbody tr > td:nth-child(n):not(.empty) > * {
    grid-column: 2;
    min-width: 0;
    max-width: 100%;
  }

  .table-wrap .badge {
    justify-self: start;
  }

  .table-wrap .acct {
    margin-top: 0;
  }

  .table-wrap table tbody tr > td.record-actions:nth-child(n) {
    display: flex;
    grid-column: 1 / -1;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
  }

  .table-wrap table tbody tr > td.record-actions:nth-child(n)::before {
    display: none;
  }

  .table-wrap .record-actions .btn {
    height: var(--control-height);
    min-height: var(--control-height);
    padding: 0 12px;
  }

  .table-wrap table tbody tr > td.empty {
    position: static;
    display: block;
    grid-column: 1 / -1;
    width: auto;
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
    white-space: normal;
  }

  .table-wrap table tbody tr > td.empty::before {
    display: none;
  }
}

@container (max-width: 560px) {
  .table-wrap tbody tr {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .table-wrap table tbody tr > td.record-actions:nth-child(n) {
    justify-content: flex-start;
  }
}

.session-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--color-muted);
  font-size: var(--font-12);
}

#session-user {
  max-width: 24ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-actions .session-logout {
  padding: 0 10px;
  color: var(--color-muted);
  font-size: var(--font-12);
}

.data-error-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

#data-error-text {
  flex: 1 1 220px;
  min-width: 0;
}

.login-shell {
  display: grid;
  min-height: 100vh;
  min-height: 100dvh;
  place-items: center;
  padding: 24px;
}

.login-card {
  width: min(400px, 100%);
  padding: 24px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-surface);
}

.login-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 24px;
  font-size: var(--font-16);
  font-weight: var(--weight-strong);
}

.login-card h1 {
  font-size: var(--font-22);
  font-weight: var(--weight-strong);
  line-height: 1.4;
}

.login-description {
  margin-top: 6px;
  color: var(--color-muted);
  font-size: var(--font-12);
}

#login-form {
  display: grid;
  gap: 20px;
  margin-top: 24px;
}

#login-error {
  padding: 12px 16px;
  border: 1px solid #e8c5bc;
  border-radius: var(--radius-control);
  background: #fff5f1;
  color: #913d29;
  font-size: var(--font-14);
  line-height: 1.6;
  overflow-wrap: anywhere;
}

@media (max-width: 780px) {
  .session-tools {
    flex: 1 1 100%;
    order: 2;
    justify-content: flex-end;
  }
}

@media (max-width: 460px) {
  .login-shell {
    padding: 16px;
  }
}