:root {
  color-scheme: light;
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bg: hsl(214 33% 95%);
  --surface: hsl(0 0% 100%);
  --side: hsl(212 32% 93%);
  --text: hsl(240 2% 11%);
  --muted: hsl(240 2% 40%);
  --border: hsl(214 12% 48%);
  --control-border: hsl(214 12% 48%);
  --accent: hsl(210 100% 38%);
  --primary-ink: hsl(0 0% 100%);
  --hover: hsl(216 77% 95%);
  --selected: hsl(214 43% 90%);
  --danger: hsl(0 66% 42%);
  --focus: hsl(210 100% 38%);
  --radius: 12px;
  --raised: hsl(0 0% 100%);
  --recessed: hsl(214 33% 92%);
  --field: hsl(210 40% 98%);
  --highlight: hsla(0.000, 0.000%, 100.000%, .85);
  --shadow-control: inset 0 1px 0 var(--highlight), 0 1px 2px hsla(216.316, 46.341%, 16.078%, .10);
  --shadow-card: inset 0 1px 0 var(--highlight), 0 2px 3px hsla(216.316, 46.341%, 16.078%, .06), 0 8px 20px hsla(216.316, 46.341%, 16.078%, .08);
  --shadow-hover: inset 0 1px 0 var(--highlight), 0 3px 5px hsla(216.316, 46.341%, 16.078%, .08), 0 12px 26px hsla(216.316, 46.341%, 16.078%, .12);
  --s-xs: .5rem;
  --s-sm: .75rem;
  --s-md: 1rem;
  --s-lg: 1.5rem;
  --s-xl: 2rem;

  --warning: hsl(35 80% 28%);
  --success: hsl(145 55% 27%);
  --s-1: .25rem;
  --s-5: 1.25rem;
  --s-7: 1.75rem;
  --s-9: 2.25rem;
  --s-10: 2.5rem;
  --s-14: 3.5rem;
  --radius-xs: 5px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-control: 9px;
  --radius-lg: 16px;
  --control-height: 44px;
  --border-width: 1px;
  --focus-width: 3px;
  --focus-offset: 3px;
  --motion-duration: 160ms;
  --sidebar-width: 244px;
  --sidebar-width-compact: 216px;
  --transparent: hsla(0, 0%, 0%, 0);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: hsl(216 14% 8%); --surface: hsl(216 20% 15%); --side: hsl(217 15% 11%);
  --text: hsl(240 5% 96%); --muted: hsl(240 3% 71%); --border: hsl(216 14% 55%);
  --control-border: hsl(216 14% 55%); --accent: hsl(212 100% 69%); --primary-ink: hsl(225 11% 7%);
  --hover: hsl(216 35% 23%); --selected: hsl(216 25% 25%); --danger: hsl(0 100% 75%); --focus: hsl(212 100% 69%);
  --raised: hsl(216 24% 20%); --recessed: hsl(213 35% 10%); --field: hsl(217 28% 13%);
  --highlight: hsla(0.000, 0.000%, 100.000%, .10);
  --shadow-control: inset 0 1px 0 var(--highlight), 0 2px 3px hsla(0.000, 0.000%, 0.000%, .30);
  --shadow-card: inset 0 1px 0 var(--highlight), 0 2px 4px hsla(0.000, 0.000%, 0.000%, .20), 0 8px 20px hsla(0.000, 0.000%, 0.000%, .22);
  --shadow-hover: inset 0 1px 0 var(--highlight), 0 3px 6px hsla(0.000, 0.000%, 0.000%, .26), 0 12px 26px hsla(0.000, 0.000%, 0.000%, .30);

  --warning: hsl(35 85% 70%);
  --success: hsl(145 50% 65%);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; font: 1rem/1.5 var(--font-family); color: var(--text); background: var(--bg); }
a { color: var(--accent); text-underline-offset: .2em; }
button, input, select, textarea { font: inherit; }
button, .button { border: var(--border-width) solid var(--control-border); background: var(--surface); color: var(--text); padding: var(--s-sm) var(--s-md); border-radius: var(--radius-control); cursor: pointer; box-shadow: var(--shadow-control); text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: var(--s-xs); min-height: var(--control-height); line-height: 1.4; }
button:hover, .button:hover { background: var(--selected); }
button:active, .button:active { transform: translateY(1px); }
button:disabled { box-shadow: none; background: var(--side); color: var(--muted); border-color: var(--control-border); cursor: wait; transform: none; }
.primary { background: var(--accent); color: var(--primary-ink); border-color: var(--transparent); }
.primary:not(:disabled):hover { background: var(--accent); text-decoration: underline; }
.danger, .error { color: var(--danger); }
.banner:not(.error)[role=status] { color: var(--success); }
input, select, textarea { background: var(--field); color: var(--text); border: var(--border-width) solid var(--control-border); border-radius: var(--radius-control); padding: var(--s-sm) var(--s-sm); min-height: var(--control-height); min-width: 0; max-width: 100%; caret-color: var(--accent); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
textarea { resize: vertical; }
:focus-visible { outline: var(--focus-width) solid var(--focus); outline-offset: var(--focus-offset); }
::selection { background: var(--accent); color: var(--primary-ink); }
.shell { display: flex; min-height: 100dvh; }
.sidebar { width: var(--sidebar-width); position: fixed; inset: 0 auto 0 0; padding: var(--s-7) var(--s-md) var(--s-5); background: var(--side); border-right: var(--border-width) solid var(--border); display: flex; flex-direction: column; overflow: auto; }
.brand-row { margin: 0 var(--s-xs) var(--s-xl); }
.brand { display: flex; align-items: center; gap: var(--s-sm); color: var(--text); text-decoration: none; font-weight: 650; font-size: 1.125rem; }
.brand-icon { color: var(--accent); flex: none; }
.brand small { display: block; color: var(--muted); font-size: .75rem; font-weight: 400; }
.nav { display: flex; text-decoration: none; padding: var(--s-sm) var(--s-sm); border-radius: var(--radius-md); margin-bottom: var(--s-1); min-height: var(--control-height); color: var(--text); font-size: 1rem; }
.nav:hover { background: var(--hover); }
.nav.active { background: var(--raised); font-weight: 600; box-shadow: var(--shadow-control); }
.side-heading { font-size: .875rem; color: var(--muted); padding: var(--s-lg) var(--s-sm) var(--s-sm); }
.side-bottom { margin-top: auto; padding: var(--s-9) var(--s-sm) 0; }
.nav-toggle { display: none; }
main { margin-left: var(--sidebar-width); min-width: 0; width: calc(100% - var(--sidebar-width)); }
main.auth-main { margin: 0; width: 100%; }
main:focus { outline: none; }
.topbar { min-height: 72px; padding: var(--s-sm) var(--s-10); border-bottom: var(--border-width) solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: var(--s-5); color: var(--muted); font-size: .875rem; }
.topbar button { font-size: .875rem; background: var(--transparent); border-color: var(--transparent); box-shadow: none; }
.workspace { max-width: 1280px; margin: auto; padding: var(--s-9) var(--s-10) var(--s-14); }
.heading { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--s-lg); gap: var(--s-lg); }
.heading .button { flex: none; }
h1 { font-size: 1.75rem; letter-spacing: -.025em; font-weight: 650; margin: 0 0 var(--s-xs); line-height: 1.25; overflow-wrap: anywhere; }
h2 { font-size: 1.125rem; letter-spacing: -.015em; margin: 0 0 var(--s-sm); line-height: 1.4; }
h3 { font-size: 1.125rem; margin: var(--s-7) 0 var(--s-sm); }
p { margin: 0 0 var(--s-md); max-width: 72ch; }
.heading p { margin: 0; }
.muted, small { color: var(--muted); }
small { font-weight: 400; }
.banner { display: flex; gap: var(--s-5); justify-content: space-between; align-items: center; padding: var(--s-5) var(--s-lg); border: var(--border-width) solid var(--border); background: var(--surface); border-radius: var(--radius); margin-bottom: var(--s-lg); }
.banner p { font-size: 1rem; margin: var(--s-xs) 0 0; }
.emergency-link { display: flex; align-items: center; justify-content: space-between; gap: var(--s-lg); padding: var(--s-5) 0; margin-bottom: var(--s-lg); border-block: var(--border-width) solid var(--border); color: var(--text); text-decoration: none; }
.emergency-link strong { display: block; font-size: 1rem; font-weight: 600; }
.emergency-link>span>span:not(.emergency-action) { display: block; color: var(--muted); font-size: 1rem; margin-top: var(--s-1); }
.emergency-action { flex: none; color: var(--accent); font-weight: 500; }
.emergency-link:hover .emergency-action { text-decoration: underline; }
.toolbar { display: flex; gap: var(--s-sm); align-items: center; flex-wrap: wrap; }
.toolbar>input { flex: 1; min-width: 160px; }
.toolbar select { max-width: 240px; }
.toolbar label { margin: 0; flex: 1; min-width: 130px; }
.document-filters { align-items: flex-end; }
.document-filters .search-field { flex: 2; min-width: 190px; }
.result-line { margin: var(--s-lg) 0; color: var(--muted); font-size: .875rem; display: flex; justify-content: space-between; gap: var(--s-md); }
.document-group { margin-bottom: var(--s-7); }
.document-group h2 { display: flex; gap: var(--s-sm); align-items: baseline; font-size: 1rem; margin-bottom: var(--s-sm); }
.group-count { font-size: .875rem; color: var(--muted); font-weight: 400; font-variant-numeric: tabular-nums; }
.document-list { list-style: none; margin: 0; padding: 0 var(--s-5); background: var(--surface); border: var(--border-width) solid var(--border); border-radius: var(--radius); }
.document-list li+li { border-top: var(--border-width) solid var(--border); }
.document-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, .7fr) auto; gap: var(--s-lg); align-items: center; min-height: 88px; padding: var(--s-5) 0; color: var(--text); text-decoration: none; border-radius: var(--radius-xs); }
.document-name { font-weight: 600; overflow-wrap: anywhere; }
.document-name>span { display: block; font-size: .875rem; color: var(--muted); font-weight: 400; margin-top: var(--s-1); }
.document-location { color: var(--muted); font-size: .875rem; }
.document-open { color: var(--accent); font-size: .875rem; white-space: nowrap; }
.document-row:hover .document-name { text-decoration: underline; text-underline-offset: .2em; }
.panel { border: var(--border-width) solid var(--border); background: var(--surface); border-radius: var(--radius); padding: var(--s-lg); }
.empty { padding: var(--s-10) var(--s-lg); }
.empty p { max-width: 62ch; }
.empty .button { margin-top: var(--s-xs); }
.auth-card { max-width: 460px; margin: var(--s-lg) auto; background: var(--surface); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); padding: var(--s-xl); box-shadow: var(--shadow-card); }
.auth-card h1 { font-size: 1.625rem; }
label { display: flex; flex-direction: column; gap: var(--s-xs); font-size: .875rem; font-weight: 500; margin: var(--s-5) 0; }
label input, label select, label textarea { width: 100%; font-size: 1rem; font-weight: 400; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--s-lg); }
.check { min-height: var(--control-height); cursor: pointer; flex-direction: row; align-items: center; font-size: 1rem; gap: var(--s-sm); }
.check input { width: 20px; height: 20px; min-height: 20px; accent-color: var(--accent); }
.full { width: 100%; }
.actions { display: flex; gap: var(--s-sm); align-items: center; flex-wrap: wrap; }
.row { display: flex; justify-content: space-between; align-items: center; gap: var(--s-5); padding: var(--s-5) 0; border-bottom: var(--border-width) solid var(--border); }
.row:last-child { border: 0; }
.row p { font-size: .875rem; color: var(--muted); margin: var(--s-1) 0 0; }
.row form { max-width: 370px; }
.row label { margin: 0; }
.preserve { white-space: pre-wrap; overflow-wrap: anywhere; }
.emergency-guide { margin-top: var(--s-xl); }
.reading { max-width: 72ch; }
.detail-heading { margin-top: var(--s-lg); }
.qr { display: block; width: 240px; height: 240px; max-width: 100%; margin: var(--s-lg) auto; }
.codes { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-md); margin: var(--s-7) 0; }
code { overflow-wrap: anywhere; background: var(--bg); padding: var(--s-1) var(--s-xs); border-radius: var(--radius-sm); }
hr { border: 0; border-top: var(--border-width) solid var(--border); margin: var(--s-lg) 0; }
details { margin-bottom: var(--s-lg); }
summary { cursor: pointer; min-height: var(--control-height); padding-block: var(--s-sm); }
.paperless-result { border-top: var(--border-width) solid var(--border); padding: var(--s-lg) 0; margin-top: var(--s-5); }
.paperless-result>small { display: block; }
dd { margin: var(--s-xs) 0 var(--s-5); }
.skip-link { position: fixed; top: 12px; left: 12px; transform: translateY(-160%); background: var(--surface); border: 2px solid var(--focus); padding: var(--s-sm) var(--s-md); border-radius: var(--radius-md); z-index: 100; }
.skip-link:focus { transform: none; }
@media (prefers-reduced-motion: reduce) {
  button:active, .button:active { transform: none; }
}
@media (prefers-reduced-motion: no-preference) {
  button, .button, .nav { transition: background-color var(--motion-duration) ease-out, border-color var(--motion-duration) ease-out; }
}
@media (max-width: 1050px) {
  .sidebar { width: var(--sidebar-width-compact); }
  main { margin-left: var(--sidebar-width-compact); width: calc(100% - var(--sidebar-width-compact)); }
  .workspace { padding: var(--s-xl) var(--s-lg); }
  .topbar { padding: var(--s-sm) var(--s-lg); }
  .heading, .banner { align-items: flex-start; flex-direction: column; }
  .toolbar select { max-width: 100%; }
  .document-location { display: none; }
  .document-row { grid-template-columns: minmax(0, 1fr) auto; }
}
@media (max-width: 700px) {
  .shell { display: block; }
  .sidebar { position: static; width: 100%; padding: var(--s-5); border-right: 0; border-bottom: var(--border-width) solid var(--border); }
  .brand-row { display: flex; align-items: center; justify-content: space-between; gap: var(--s-md); margin: 0; }
  .sidebar nav { margin-top: var(--s-5); }
  .nav { margin: 0 0 var(--s-1); }
  .sidebar.nav-ready .nav-toggle { display: inline-flex; }
  .sidebar.nav-ready:not(.nav-open) nav, .sidebar.nav-ready:not(.nav-open) .side-bottom { display: none; }
  .side-heading { padding-top: var(--s-md); }
  .side-bottom { display: flex; justify-content: space-between; align-items: center; padding: var(--s-5) var(--s-sm) 0; }
  .side-bottom p { margin: 0; font-size: .875rem; }
  main { width: 100%; margin: 0; }
  .workspace { padding: var(--s-lg) var(--s-5) var(--s-10); }
  .topbar { padding: var(--s-sm) var(--s-5); min-height: 60px; }
  .form-grid { grid-template-columns: 1fr; }
  .row { align-items: flex-start; flex-direction: column; }
  .codes { grid-template-columns: 1fr; }
  .auth-card { padding: var(--s-lg); margin: 0 auto; }
  .toolbar { align-items: stretch; }
  .toolbar input, .toolbar select { width: 100%; }
  .document-filters { display: grid; grid-template-columns: 1fr 1fr; align-items: end; }
  .document-filters .search-field { grid-column: 1 / -1; min-width: 0; }
  .document-filters label { min-width: 0; }
  .document-filters button { grid-column: 1 / -1; }
  .document-row { gap: var(--s-md); }
  .document-list { padding: 0 var(--s-md); }
  .actions { align-items: stretch; }
  .panel { padding: var(--s-5); }
  .banner { padding: var(--s-5); }
  .emergency-link { flex-direction: column; align-items: flex-start; gap: var(--s-sm); }
}

/* Installed web apps retain room for the notch, landscape edges, and Home indicator. */
.sidebar { padding-top: max(var(--s-7), env(safe-area-inset-top)); }
.workspace { padding-bottom: calc(var(--s-14) + env(safe-area-inset-bottom)); }
.topbar { flex-wrap: wrap; }
.topbar button { white-space: normal; text-align: left; }
.app-footer { display: flex; align-items: center; gap: var(--s-xs) var(--s-5); flex-wrap: wrap; border-top: var(--border-width) solid var(--border); margin-top: var(--s-10); padding-top: var(--s-5); color: var(--muted); font-size: .875rem; }
.app-footer a { display: inline-flex; align-items: center; min-height: var(--control-height); }
.version-number { font-variant-numeric: tabular-nums; }
.side-release { display: flex; align-items: center; min-height: var(--control-height); margin-top: var(--s-sm); font-size: .875rem; font-variant-numeric: tabular-nums; }
.install-guide { max-width: 76ch; }
.install-guide ol { margin: var(--s-md) 0 var(--s-5); padding-left: var(--s-lg); }
.install-guide li { padding-left: var(--s-1); margin: var(--s-sm) 0; }
.install-guide p:last-child { margin-bottom: 0; }
.release-history { max-width: 76ch; margin-top: var(--s-9); }
.release { padding: var(--s-7) 0; border-top: var(--border-width) solid var(--border); }
.release-meta { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--s-xs) var(--s-5); }
.release-meta h2 { margin: 0; }
.release-meta>span { font-size: .875rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.release h3 { margin: var(--s-5) 0 var(--s-sm); }
.release ul { margin: 0; padding-left: var(--s-5); }
.release li { margin: var(--s-sm) 0; }
@media (max-width: 700px) {
  .side-bottom { flex-wrap: wrap; gap: var(--s-sm); }
  .side-release { flex-basis: 100%; margin-top: 0; }
  .sidebar { padding-top: calc(var(--s-5) + env(safe-area-inset-top)); padding-left: max(var(--s-5), env(safe-area-inset-left)); padding-right: max(var(--s-5), env(safe-area-inset-right)); }
  .workspace { padding-left: max(var(--s-5), env(safe-area-inset-left)); padding-right: max(var(--s-5), env(safe-area-inset-right)); padding-bottom: calc(var(--s-10) + env(safe-area-inset-bottom)); }
  .topbar { padding-left: max(var(--s-5), env(safe-area-inset-left)); padding-right: max(var(--s-5), env(safe-area-inset-right)); }
  .auth-main .topbar { padding-top: calc(var(--s-sm) + env(safe-area-inset-top)); }
  .form-grid>* { min-width: 0; }
  .actions { max-width: 100%; }
}
@media (min-width: 701px) and (max-width: 1050px) {
  .sidebar { padding-left: max(var(--s-md), env(safe-area-inset-left)); }
  .workspace, .topbar { padding-right: max(var(--s-lg), env(safe-area-inset-right)); }
}
.document-cards { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill,minmax(230px,1fr)); gap: var(--s-lg); }
.document-cards li { min-width: 0; }
.document-card { display: flex; flex-direction: column; height: 100%; color: var(--text); text-decoration: none; border: var(--border-width) solid var(--border); border-radius: var(--radius); background: var(--raised); box-shadow: var(--shadow-card); overflow: hidden; }
.document-card:hover { border-color: var(--control-border); box-shadow: var(--shadow-hover); }
.document-card:hover strong { text-decoration: underline; text-underline-offset: .2em; }
.preview-surface { display: flex; align-items: center; justify-content: center; background: var(--recessed); border-bottom: var(--border-width) solid var(--border); height: 230px; padding: var(--s-md); overflow: hidden; }
.document-thumbnail { width: 100%; height: 100%; object-fit: contain; }
.preview-fallback { font-size: 1rem; color: var(--warning); text-align: center; }
.preview-fallback>span { font-size: .875rem; }
.document-card-body { display: flex; flex-direction: column; gap: var(--s-xs); padding: var(--s-md); flex: 1; }
.document-card-body>strong { font-size: 1rem; line-height: 1.4; overflow-wrap: anywhere; }
.document-card-body>span { color: var(--muted); font-size: .875rem; overflow-wrap: anywhere; }
.document-card-body>.document-card-foot { margin-top: auto; padding-top: var(--s-sm); font-size: .875rem; }
.document-card-foot>span { float: right; color: var(--accent); }
.detail-preview { height: 420px; border: var(--border-width) solid var(--border); border-radius: var(--radius); margin-bottom: var(--s-lg); }
.settings-section { max-width: 900px; margin-bottom: var(--s-7); }
.field-help { font-size: .875rem; margin-top: var(--s-md); }
.sharing-options { border: 0; padding: 0; margin: var(--s-lg) 0; min-width: 0; }
.sharing-options legend { font-weight: 600; margin-bottom: var(--s-sm); }
.sharing-options p { font-size: .875rem; }
.add-options { display: flex; flex-wrap: wrap; gap: var(--s-xs); margin: 0 0 var(--s-lg); padding: var(--s-xs); background: var(--recessed); border-radius: var(--radius); }
.add-options a { min-height: var(--control-height); display: flex; align-items: center; padding: var(--s-sm) var(--s-md); border-radius: var(--radius-md); text-decoration: none; color: var(--muted); }
.delivery-status { display: flex; flex-wrap: wrap; gap: var(--s-sm); font-size: .875rem; margin: var(--s-md) 0; }
@media(max-width:700px) {
  .document-cards { grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap: var(--s-md); }
  .detail-preview { height: 340px; }
  .settings-section .actions { flex-direction: column; align-items: stretch; }
}

.paperless-details { margin-bottom: var(--s-7); }
.imported-details { display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5);margin:0 0 var(--s-lg); }
.imported-details dt { color:var(--muted);font-size:.875rem; }
.imported-details dd { margin:var(--s-xs) 0 0;overflow-wrap:anywhere; }
.extracted-text { max-height:400px;overflow:auto;padding:var(--s-md) 0; }
@media(max-width:700px) { .imported-details { grid-template-columns:1fr; } }

.connection-test { margin-top:var(--s-lg);display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-sm); }
.add-options [aria-current="page"] { color:var(--text);font-weight:600;background:var(--raised);box-shadow:var(--shadow-control); }
.pagination { margin-top:var(--s-lg); }

/* Expiry uses existing theme tokens directly; no root aliases or new colors. */
.expiry-block { margin-bottom: var(--s-lg); }
.expiry-count { display: inline-flex; align-items: center; gap: var(--s-xs); min-height: var(--control-height); padding: var(--s-sm) var(--s-md); background: var(--surface); border: var(--border-width) solid var(--border); border-radius: var(--radius); color: var(--text); text-decoration: none; }
.expiry-count:hover { background: var(--selected); }
.expiry-badge { display: inline-block; padding: var(--s-1) var(--s-xs); background: var(--selected); color: var(--text); border-radius: var(--radius); font-size: .75rem; }
.expiry-group { margin: 0 0 var(--s-xl); }
.expiry-list { margin: 0; padding: 0 var(--s-lg); list-style: none; background: var(--surface); border: var(--border-width) solid var(--border); border-radius: var(--radius); }
.expiry-list li + li { border-top: var(--border-width) solid var(--border); }
.expiry-row { display: flex; align-items: center; justify-content: space-between; gap: var(--s-lg); padding: var(--s-md) 0; min-height: 72px; color: var(--text); text-decoration: none; }
.expiry-row:hover strong { text-decoration: underline; }
.expiry-description { display: block; margin-top: var(--s-1); color: var(--muted); font-size: .875rem; }
.expiry-date { display: flex; flex-direction: column; align-items: flex-end; gap: var(--s-xs); font-variant-numeric: tabular-nums; }
.expiry-row strong { overflow-wrap: anywhere; }
@media (max-width: 700px) {
  .expiry-row { align-items: flex-start; flex-direction: column; gap: var(--s-sm); }
  .expiry-date { flex-direction: row; align-items: center; flex-wrap: wrap; }
}

/* Vault labels use the existing semantic palette and spacing scale. */
.label-field { border: 0; min-width: 0; padding: 0; margin: var(--s-lg) 0; }
.label-field legend, .label-filters>strong { font-weight: 600; margin-bottom: var(--s-xs); }
.label-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-xs); }
.label-chip { display: inline-flex; align-items: center; gap: var(--s-xs); min-height: var(--s-xl); max-width: 100%; padding: var(--s-1) var(--s-xs); border: var(--border-width) solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); font-size: .875rem; white-space: nowrap; text-decoration: none; }
.label-chip>span { overflow: hidden; text-overflow: ellipsis; }
.label-chip button { flex: none; min-height: var(--s-xl); min-width: var(--s-xl); padding: 0; border-color: var(--transparent); box-shadow: none; background: var(--transparent); color: inherit; }
.label-person { background: var(--selected); color: var(--accent); }
.label-chip[aria-current=page] { outline: var(--border-width) solid var(--accent); font-weight: 600; }
.label-add { min-height: var(--s-xl); margin-top: var(--s-xs); }
.label-filters { margin-bottom: var(--s-lg); }
.label-filters>strong { display: block; }
.label-filters .label-chip { display: block; overflow: hidden; text-overflow: ellipsis; }
.people-folders { margin-bottom: var(--s-lg); }
.people-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,180px),1fr)); gap: var(--s-md); margin-bottom: var(--s-md); }
.person-folder { display: flex; flex-direction: column; gap: var(--s-xs); color: var(--text); text-decoration: none; }
.person-folder>span { color: var(--muted); }
.person-folder[aria-current=page] { outline: var(--border-width) solid var(--accent); }