@font-face { font-family: "DM Sans"; src: url("/assets/dm-sans.ttf") format("truetype"); font-style: normal; font-weight: 100 1000; font-display: swap; }
/* Shared renderer design system. Structural variants use these same tokens. */
:root {
  --border:var(--line); --page:var(--canvas); --green:var(--accent); --green-hover:var(--accent-hover); --tint:var(--subtle); --white:var(--surface); --control-radius:10px; --control-height:46px; --control-font-size:14px; --action-height:32px; --action-font-size:13px; --row-space:16px; 
  --font: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ink: #252422;
  --muted: #6f6b66;
  --line: #dedbd6;
  --divider: #eeece8;
  --canvas: #fdfcfb;
  --surface: #fff;
  --accent: #c92954;
  --accent-hover: #ad2045;
  --accent-soft: #fff1f4;
  --subtle: #f7f5f2;
  --header: #faf9f7;
  --hover: #fcfaf7;
  --line-strong: #b8b3ab;
  --on-accent: #ffffff;
  --focus: #c92954;
  --negative: #b42318;
  --negative-soft: #fef3f2;
  --negative-line: #fecdca;
  --positive: #027a48;
  --positive-soft: #ecfdf3;
  --warning: #b54708;
  --warning-soft: #fffaeb;
  --blue: #175cd3;
  --blue-soft: #eff8ff;
  --purple: #6941c6;
  --purple-soft: #f4f3ff;
  --grey: #475467;
  --count-soft: #eaecf0;
  --accent-line: #f3c2cf;
  --accent-soft-hover: #ffe4ec;
  --axis: #98a2b3;
  --backdrop: #18223066;
  --nav-shadow: #2524220a;
  --card-shadow: #25242205;
  --dialog-shadow: #18223026;
  --calendar-blue: #193d77;
  --calendar-soft: #e8eefc;
  --calendar-line: #beccec;
  --calendar-hover: #dce6fb;
  color-scheme: light;
  --radius: 12px;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}
/* APPEARANCE-002: approved light presets. Semantic status tokens stay independent. */
:root[data-palette=ocean] {
  --ink: #202d3d; --muted: #596a7c; --line: #d8e1ea; --divider: #d8e1ea;
  --canvas: #f8fafc; --subtle: #f0f4f8; --header: #f0f4f8; --hover: #f3f7fc;
  --line-strong: #8699b1; --accent: #245eaa; --accent-hover: #1d4c8a;
  --accent-soft: #eaf2fc; --accent-line: #c2d6ef; --accent-soft-hover: #dbe9f9;
  --focus: #245eaa; --nav-shadow: #202d3d0a; --card-shadow: #202d3d05;
}
:root[data-palette=forest] {
  --ink: #253329; --muted: #5e6d60; --line: #d9e1d6; --divider: #d9e1d6;
  --canvas: #fafbf8; --subtle: #f0f4ed; --header: #f0f4ed; --hover: #f3f7ef;
  --line-strong: #8a9e88; --accent: #306b49; --accent-hover: #255339;
  --accent-soft: #eaf3eb; --accent-line: #c2d9c5; --accent-soft-hover: #dbeadd;
  --focus: #306b49; --nav-shadow: #2533290a; --card-shadow: #25332905;
}
:root[data-palette=plum] {
  --ink: #342938; --muted: #716575; --line: #e2dae5; --divider: #e2dae5;
  --canvas: #fcfafc; --subtle: #f5f0f7; --header: #f5f0f7; --hover: #f8f3fa;
  --line-strong: #a493ad; --accent: #794391; --accent-hover: #603573;
  --accent-soft: #f3ebf8; --accent-line: #ddc9e8; --accent-soft-hover: #e9dbf1;
  --focus: #794391; --nav-shadow: #3429380a; --card-shadow: #34293805;
}

/* APPEARANCE-021: management identity never changes an app's chosen palette. */
:root[data-management-theme=lindo]:not(:has(body.app-sign-in)) {
  --ink:#302c40; --muted:#706a7c; --line:#e6e0e7; --divider:#eee8ec;
  --canvas:#fcf8ef; --surface:#fff; --header:#fcf8ef;
  --accent:#6243cc; --accent-hover:#5134b5; --on-accent:#fff;
  --accent-soft:#e7defb; --accent-line:#cfc1ef; --accent-soft-hover:#dbcef5;
  --subtle:#f2edfb; --hover:#f7f3fc; --line-strong:#b7a5d6; --focus:#6243cc;
  --management-lilac:#e7defb; --management-yellow:#fbe8a6; --management-peach:#f8dbca;
  --control-radius:11px;
}

/* APPEARANCE-005: shared brand, type and control foundations. */

* { box-sizing:border-box; }
body { margin:0; }
[hidden] { display:none !important; }
button svg { display:block; flex-shrink:0; }
h1,h2,h3,h4,h5,p { margin:0; }
h1 { font-size:36px; line-height:1.15; font-weight:750; letter-spacing:-1.2px; }
h2 { font-size:21px; line-height:1.35; font-weight:750; letter-spacing:-.5px; }
h3 { font-size:18px; line-height:26px; font-weight:650; }
h4 { font-size:16px; line-height:24px; font-weight:650; }
button,input,select,textarea { font-family:inherit; font-size:var(--control-font-size); line-height:20px; }
button,.button { font-size:var(--control-font-size); line-height:20px; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:var(--control-height); padding:10px 16px; border:1px solid transparent; border-radius:var(--control-radius); background:var(--accent); color:var(--on-accent); font-weight:650; cursor:pointer; text-align:center; }
button:hover,.button:hover { background:var(--accent-hover); }
button:disabled { opacity:.55; cursor:default; }
button.quiet { color:var(--ink); background:transparent; border-color:var(--line); }
button.quiet:hover { background:var(--subtle); border-color:var(--line-strong); }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
label { display:block; font-size:13px; line-height:20px; font-weight:600; color:var(--muted); margin-bottom:8px; }
input,select,textarea { width:100%; padding:10px 14px; border:1px solid var(--line); border-radius:var(--control-radius); color:var(--ink); background:var(--surface); margin-bottom:16px; }
input,select { min-height:var(--control-height); }

.brand,.management-brand,.app-brand { display:inline-flex; align-items:center; gap:12px; color:var(--ink); font-size:32px; line-height:1.2; font-weight:750; letter-spacing:-1.3px; text-decoration:none; }
.app-brand { font-size:24px; letter-spacing:-.7px; min-width:0; }
.app-mark { display:inline-flex; flex:0 0 38px; width:38px; height:38px; color:var(--accent); }
.app-mark svg,.brand>.icon { display:block; width:38px; height:38px; color:var(--accent); flex-shrink:0; }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
table { border-collapse:separate; border-spacing:0; width:100%; text-align:left; color:var(--ink); font-size:14px; line-height:21px; background:var(--surface); }
th { background:var(--surface); color:var(--muted); font-size:12px; line-height:20px; font-weight:500; padding:12px 16px; border-bottom:1px solid var(--line); vertical-align:middle; text-align:left; }
td { padding:var(--row-space) 16px; border-bottom:1px solid var(--line); vertical-align:middle; }
tbody tr:last-child>td { border-bottom:0; }
tbody tr:hover { background:var(--subtle); }
@media(max-width:700px) { h1 { font-size:30px; } .brand,.management-brand { font-size:28px; } .app-brand { font-size:21px; } }

/* Dialog controls use the landing CTA scale; compact rows retain their own density. */
dialog { --icon-height:46px; --control-height:46px; --action-height:46px; --action-font-size:14px; --field-label-size:13px; --section-label-size:16px; }
dialog .record-action-menu { font-weight:650; }
dialog .section-head>button,dialog .favourite-button { min-width:var(--control-height); padding-inline:10px; flex-shrink:0; }

/* APPEARANCE-007: one form and dialog foundation across all executables. */
textarea { min-height:140px; resize:vertical; }
input,select,textarea { font-weight:400; }
input[type=checkbox],input[type=radio] { width:18px; height:18px; min-height:0; padding:0; accent-color:var(--accent); vertical-align:middle; }
select:not([multiple]) {
  appearance: none;
  -webkit-appearance: none;
  padding-inline-end: 34px;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 17px) 50%, calc(100% - 12px) 50%;
  background-size: 5px 5px;
  background-repeat: no-repeat;
}
dialog { width:var(--dialog-width,520px); max-width:calc(100vw - 32px); max-height:85dvh; overflow:auto; padding:var(--dialog-padding,24px); border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--ink); font-family:inherit; font-size:15px; line-height:1.5; box-shadow:0 24px 64px var(--dialog-shadow); }
dialog::backdrop { background:var(--backdrop); }
dialog h2 { font-size:26px; line-height:1.25; font-weight:750; letter-spacing:-.7px; }
dialog>h2 { margin:0 0 24px; }
dialog h3 { font-size:16px; line-height:24px; font-weight:650; letter-spacing:0; }

dialog p { line-height:1.6; }
@media(max-width:600px) { dialog { --dialog-padding:20px; } }
