/* Each palette supplies surfaces, text, accents and navigation in both modes. */
:root {
  --p50:#edf2e6;--p200:#bfcea9;--p600:#526d3e;--p800:#3d562d;--focus:#6a894d;
  --chrome:#1d231f;--chrome2:#2a322c;--chrome-border:#414b3e;--chrome-muted:#b6c1af;
  --highlight:#d9ebba;--highlight-ink:#25351b;--hero-start:#202921;--hero-end:#354630;
  --action-bg:#293b22;--action-fg:#fff;
}
.dm {--p50:#2b3525;--p200:#516246;--p600:#587345;--p800:#cfdfb8;--focus:#adc78b;--action-bg:#d9ebba;--action-fg:#25351b;}
:root[data-palette="onyx"] {
  --bg:#fff;--bg2:#f5f5f7;--bg3:#ebecf0;--text:#23252b;--text2:#626571;--text3:#707480;--border:#e1e3e9;--border2:#c9ccd5;
  --p50:#edeef4;--p200:#c5c9db;--p600:#545e80;--p800:#414b6e;--focus:#7784af;
  --chrome:#18191c;--chrome2:#25272d;--chrome-border:#41444e;--chrome-muted:#b7bbc8;
  --highlight:#e3e5eb;--highlight-ink:#262932;--hero-start:#202126;--hero-end:#383c48;--action-bg:#292c35;--action-fg:#fff;
}
:root[data-palette="onyx"] .dm {
  --bg:#202125;--bg2:#141518;--bg3:#2b2d33;--text:#f2f3f6;--text2:#b9bdc8;--text3:#9b9fac;--border:#34363f;--border2:#4e5260;
  --p50:#2d3140;--p200:#525c78;--p600:#637098;--p800:#c9d1ed;--focus:#aab6dc;--action-bg:#e3e5eb;--action-fg:#262932;
}
:root[data-palette="iris"] {
  --bg:#fff;--bg2:#f7f5fa;--bg3:#efeaf5;--text:#2b2436;--text2:#696075;--text3:#7a7185;--border:#e6dfed;--border2:#cfc3dc;
  --p50:#f0eafa;--p200:#cdb9e8;--p600:#7553a5;--p800:#5e3f8b;--focus:#9673c5;
  --chrome:#211c30;--chrome2:#30283e;--chrome-border:#50435f;--chrome-muted:#c3b6d2;
  --highlight:#d9cbff;--highlight-ink:#35204e;--hero-start:#292134;--hero-end:#4c3a5f;--action-bg:#64448e;--action-fg:#fff;
}
:root[data-palette="iris"] .dm {
  --bg:#27222f;--bg2:#1a161f;--bg3:#332b3e;--text:#f5f0fc;--text2:#c5b9d2;--text3:#aa9eb8;--border:#40354d;--border2:#5c4d6c;
  --p50:#362a49;--p200:#665180;--p600:#8460b2;--p800:#d8bff4;--focus:#c5a3ed;--action-bg:#d9cbff;--action-fg:#35204e;
}
:root[data-palette="tide"] {
  --bg:#fff;--bg2:#f3f7f9;--bg3:#e6eef2;--text:#23343e;--text2:#5c707c;--text3:#6b7e89;--border:#dce6eb;--border2:#bfcfd9;
  --p50:#e5f1f8;--p200:#aacfe2;--p600:#326b8d;--p800:#265571;--focus:#518fae;
  --chrome:#14232e;--chrome2:#223642;--chrome-border:#3a5464;--chrome-muted:#b0c6d3;
  --highlight:#b9dfee;--highlight-ink:#173d50;--hero-start:#1b2c38;--hero-end:#315b6b;--action-bg:#285b77;--action-fg:#fff;
}
:root[data-palette="tide"] .dm {
  --bg:#1d2a33;--bg2:#131e26;--bg3:#283a46;--text:#edf5fa;--text2:#b5c8d3;--text3:#97afbd;--border:#324955;--border2:#496571;
  --p50:#243e50;--p200:#3e6279;--p600:#3d7698;--p800:#a9d7ef;--focus:#85c1de;--action-bg:#b9dfee;--action-fg:#173d50;
}
:root[data-palette="sandstone"] {
  --bg:#fffdfa;--bg2:#f8f5ef;--bg3:#efe9df;--text:#372d24;--text2:#756759;--text3:#837568;--border:#e7dfd3;--border2:#d2c4b2;
  --p50:#f4eadb;--p200:#d9c09c;--p600:#876138;--p800:#71502d;--focus:#a58051;
  --chrome:#2c241e;--chrome2:#3b3027;--chrome-border:#5e4d3d;--chrome-muted:#cfc0ad;
  --highlight:#eed6b4;--highlight-ink:#46301d;--hero-start:#33291f;--hero-end:#5a4832;--action-bg:#775733;--action-fg:#fff;
}
:root[data-palette="sandstone"] .dm {
  --bg:#302820;--bg2:#201b16;--bg3:#3c3228;--text:#f6f0e7;--text2:#d0c2b0;--text3:#b6a590;--border:#493c30;--border2:#675440;
  --p50:#433526;--p200:#776044;--p600:#946e42;--p800:#e3c39a;--focus:#d3b084;--action-bg:#eed6b4;--action-fg:#46301d;
}

/* Consistent surfaces replace the original fixed green and lavender colors. */
body {color-scheme:light;--surface-shadow:0 1px 2px #10182004,0 8px 28px #10182004;}
body.dm {color-scheme:dark;--surface-shadow:inset 0 1px 0 #ffffff03,0 4px 20px #0000000c;}
::selection {background:var(--highlight);color:var(--highlight-ink);}
a,.task-open-hint,.studio-eyebrow {color:var(--p800);}
#app-navigation {background:var(--chrome);border-color:var(--chrome-border);scrollbar-width:thin;scrollbar-color:var(--chrome-border) var(--chrome);}
.studio-brand small,.workspace-picker label,#app-navigation .tab,.studio-nav-footer,.studio-nav-footer strong {color:var(--chrome-muted);}
.studio-mark,.home-logo-icon,#app-navigation .tab.active {background:var(--highlight);color:var(--highlight-ink);}
#app-navigation .tab>i {color:inherit;}
#app-navigation .tab.active>i {color:inherit;}
.workspace-picker select,#app-navigation .nav-close {background:var(--chrome2);border-color:var(--chrome-border);color:#f7f8fa;}
.studio-footer-icon {color:var(--highlight);}
.studio-overview {
  background:radial-gradient(ellipse at 100% 0%,var(--hero-end),transparent 72%),var(--hero-start);
  border-color:color-mix(in srgb,var(--highlight) 18%,var(--hero-start));
  border-radius:22px;
  min-height:216px;
  padding:34px;
  box-shadow:inset 0 1px 0 #ffffff0a,0 12px 32px #00000006;
}
.studio-overview::before {background:none;inset:9px;border:1px solid #ffffff09;border-radius:15px;}
.studio-overview .studio-page-title,.login-heading h1 {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400!important;
  letter-spacing:-1.6px;
}
.studio-overview .studio-page-title {font-size:clamp(34px,3vw,46px)!important;line-height:1.1!important;}
.studio-overview .studio-eyebrow {color:var(--highlight);font-size:10px;font-weight:600;letter-spacing:2px;}
.studio-overview .studio-page-subtitle {color:#e0e4dda8;max-width:450px;}
.studio-overview .btn-pri {background:var(--highlight);color:var(--highlight-ink);border-radius:100px;}
.studio-overview .btn-pri:hover {background:color-mix(in srgb,var(--highlight),white 12%);color:var(--highlight-ink);}
.studio-overview .cc-nav,.studio-overview .cc-nav-btn,.studio-overview .cc-today-btn {border-color:#ffffff30;}
.studio-overview .cc-nav {border-radius:100px;overflow:hidden;}
.studio-overview .cc-nav-btn {border:0;}
.dash-section-title .dash-add-btn {background:var(--bg)!important;border-color:var(--border2)!important;color:var(--text)!important;}
:is(.btn-pri,.cr-add-btn,.car-start-btn,.car-sb-new) {border-radius:100px;box-shadow:inset 0 1px 0 #ffffff1f,0 2px 5px #0000000d;}
.dash-review-banner .btn-pri {border-radius:100px;}
.dash-stat .ds-val {font-weight:500;letter-spacing:-1.5px;}
.dash-stat .ds-icon {background:var(--p50);color:var(--p800);}
.dash-stat:nth-child(3) .ds-icon {background:var(--a50);color:var(--a600);}
.dash-stat:nth-child(n+5) .ds-icon {background:var(--t50);color:var(--t600);}
.dash-section-title {padding-bottom:12px;border-bottom:1px solid var(--border);font-weight:600;}
.dash-section-title>span:first-child {line-height:1.5;}
.model-card .mc-photo,.model-card:nth-child(n) .mc-photo,.dm .model-card:nth-child(n) .mc-photo {
  background:radial-gradient(ellipse at 100% 0%,var(--p50),transparent),var(--bg3);
  color:var(--p800);
}
.model-card .mc-photo>span {font-family:Georgia,'Times New Roman',serif;letter-spacing:-2px;font-size:40px!important;}
.model-card .mc-photo:has(img) {background:var(--bg3);}
.model-card,.dash-emp-card,.mw-card,.cc-card,.car-card {box-shadow:var(--surface-shadow);}
.model-card:hover,.mw-card:hover {box-shadow:0 6px 24px #0000000a;}
.modal-box,.account-popover {box-shadow:0 24px 80px #00000026,inset 0 1px 0 #ffffff06;}
#home-page {background:radial-gradient(ellipse at 50% 0%,var(--p50),transparent 65%),var(--bg2);}
.login-heading h1 {font-size:34px;}
.studio-appearance-trigger {display:flex;align-items:center;gap:10px;width:100%;padding:12px;border:1px solid var(--chrome-border);border-radius:12px;background:var(--chrome2);color:#f7f8fa;cursor:pointer;text-align:left;min-height:56px;margin-bottom:10px;}
.studio-appearance-trigger>i:first-child {font-size:19px;color:var(--highlight);}
.studio-appearance-trigger>i:last-child {margin-left:auto;color:var(--chrome-muted);}
.studio-appearance-trigger span {font-size:12px;font-weight:600;}
.studio-appearance-trigger small {display:block;font-size:11px;font-weight:400;color:var(--chrome-muted);margin-top:3px;}
.studio-appearance-trigger:hover {border-color:var(--highlight);}

/* Reports use one quiet table surface; worker colors are only identifiers. */
.studio-table-wrap {contain:layout inline-size;overflow-x:auto;border:1px solid var(--border)!important;border-radius:16px!important;background:var(--bg)!important;scrollbar-width:thin;scrollbar-color:var(--border2) var(--bg);}
.content .studio-data-table {display:table;width:100%;border-collapse:separate!important;border-spacing:0;min-width:520px!important;background:var(--bg);font-variant-numeric:tabular-nums;}
.content .studio-data-table thead {display:table-header-group;}
.content .studio-data-table tbody {display:table-row-group;}
.content .studio-data-table tr {display:table-row;background:transparent!important;border:0!important;box-shadow:none;padding:0;margin:0;}
.content .studio-data-table :is(th,td) {display:table-cell;float:none;width:auto;max-width:none;padding:12px 18px!important;border:0!important;border-bottom:1px solid var(--border)!important;color:var(--text)!important;background:var(--bg)!important;vertical-align:middle;line-height:1.5;}
.content .studio-data-table td::before {display:none;}
.content .studio-data-table th {background:var(--bg2)!important;color:var(--text2)!important;text-transform:uppercase;letter-spacing:.7px;font-size:11px!important;font-weight:600!important;white-space:nowrap;}
.content .studio-data-table td {font-size:13px!important;font-weight:500!important;}
.content .studio-data-table tbody tr:hover td {background:var(--bg2)!important;}
.content .studio-data-table .studio-metric.has-value {background:color-mix(in srgb,var(--p50) 65%,var(--bg))!important;color:var(--p800)!important;font-weight:650!important;}
.content .studio-data-table tbody tr:last-child td {background:var(--bg2)!important;border-bottom:0!important;font-weight:700!important;}
.content .studio-data-table :is(th,td):first-child {position:sticky;left:0;z-index:1;box-shadow:1px 0 0 var(--border);}
.studio-worker-dot {display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--worker-color);margin-right:8px;}
.dm .studio-worker-dot {background:color-mix(in srgb,var(--worker-color) 60%,white);}
.studio-report-toolbar {flex-wrap:wrap;gap:12px!important;margin:28px 0 14px!important;font-size:15px!important;}
.studio-report-toolbar>i {color:var(--p800)!important;}
.studio-report-toolbar>span {gap:8px!important;}
.studio-report-toolbar button {min-height:36px;padding:8px 12px!important;background:var(--bg)!important;border:1px solid var(--border2)!important;color:var(--text2)!important;border-radius:9px!important;font-weight:500!important;}
.studio-report-toolbar button:hover {background:var(--bg3)!important;color:var(--text)!important;}
.content .studio-payout-table .studio-payout-period {color:var(--text2)!important;}
.studio-piece-count {display:inline-flex;justify-content:center;align-items:center;min-width:44px;min-height:38px;padding:4px 12px;border-radius:8px;border:1px solid var(--p200);background:var(--p50);color:var(--p800);font-size:17px;font-weight:650;cursor:pointer;}
.studio-piece-count:hover {border-color:var(--p800);}
.studio-payout-action {background:var(--action-bg)!important;color:var(--action-fg)!important;border:1px solid transparent!important;border-radius:100px!important;min-height:36px;padding:8px 16px!important;white-space:nowrap;text-align:center;}
.content .studio-data-table .studio-payout-total {color:var(--p800)!important;font-size:18px!important;}
.studio-report-caption {color:var(--text2);font-size:12px;margin:10px 2px;}
.dash-emp-card .gauge-inp[onclick^="reset"] {background:var(--action-bg)!important;color:var(--action-fg)!important;border-radius:8px;}
.dash-emp-card .mw-tag[title="Last payout date"] {background:var(--p50)!important;color:var(--p800)!important;}

/* Appearance dialog: native radios support keyboard and touch without custom widgets. */
.studio-appearance-box {width:660px;}
.studio-appearance-box .modal-title {font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:32px;letter-spacing:-1px;}
.appearance-fieldset {border:0;padding:0;margin:24px 0;min-width:0;}
.appearance-fieldset legend {font-size:12px;font-weight:650;margin-bottom:12px;letter-spacing:.1px;}
.appearance-modes {display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:5px;background:var(--bg2);border:1px solid var(--border);border-radius:13px;}
.appearance-modes label,.appearance-palette {position:relative;cursor:pointer;min-width:0;}
.appearance-modes input,.appearance-palette input {position:absolute;width:1px!important;height:1px!important;min-height:0!important;opacity:0;}
.appearance-modes label>span {display:flex;gap:8px;align-items:center;justify-content:center;min-height:44px;border-radius:9px;border:1px solid transparent;color:var(--text2);font-weight:500;font-size:13px;}
.appearance-modes input:checked+span {background:var(--bg);border-color:var(--border);color:var(--text);box-shadow:0 2px 5px #00000008;}
.appearance-palettes {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.appearance-card {display:block;border:1px solid var(--border);border-radius:13px;overflow:hidden;box-shadow:var(--surface-shadow);transition:border-color .15s;}
.appearance-preview {display:flex;gap:8px;height:92px;padding:10px;background:var(--preview-paper);}
.preview-rail {width:24%;border-radius:4px;background:var(--preview-ink);position:relative;}
.preview-rail::after {content:'';position:absolute;left:4px;right:4px;top:12px;height:5px;border-radius:2px;background:var(--preview-accent);box-shadow:0 11px 0 #ffffff20,0 22px 0 #ffffff15;}
.preview-main {flex:1;display:flex;flex-direction:column;gap:7px;}
.preview-hero {height:36px;border-radius:5px;background:linear-gradient(120deg,var(--preview-ink),color-mix(in srgb,var(--preview-ink) 80%,var(--preview-accent)));}
.preview-tiles {display:flex;gap:5px;flex:1;}
.preview-tiles i {flex:1;border-radius:4px;background:#fff;border:1px solid #00000008;}
.dm .appearance-preview {background:color-mix(in srgb,var(--preview-ink) 90%,black);}
.dm .preview-tiles i {background:color-mix(in srgb,var(--preview-ink) 86%,white);border-color:#ffffff08;}
.appearance-card-label {display:grid;grid-template-columns:1fr auto;gap:3px 6px;padding:12px;background:var(--bg);}
.appearance-card-label strong {font-size:13px;font-weight:600;}
.appearance-card-label small {grid-column:1/-1;font-size:11px;color:var(--text2);}
.appearance-card-label i {visibility:hidden;color:var(--p800);}
.appearance-palette input:checked+.appearance-card {border-color:var(--p800);box-shadow:0 0 0 1px var(--p800);}
.appearance-palette input:checked+.appearance-card .appearance-card-label i {visibility:visible;}
.appearance-palette:hover .appearance-card {border-color:var(--p200);}
.appearance-modes input:focus-visible+span,.appearance-palette input:focus-visible+.appearance-card {outline:3px solid var(--focus);outline-offset:3px;}
.appearance-footer {display:flex;gap:16px;align-items:center;justify-content:space-between;padding-top:18px;border-top:1px solid var(--border);}
.appearance-footer>span {font-size:12px;color:var(--text2);}
.appearance-footer button {flex:0 0 auto;min-width:100px;width:auto;}
@media(max-width:768px) {
  .studio-report-toolbar>span {margin-left:0!important;width:100%;}
  .studio-table-wrap {max-width:100%;}
  .content .studio-data-table :is(th,td) {padding:12px!important;}
  .studio-payout-table {min-width:520px!important;}
}
@media(max-width:560px) {
  .studio-overview {padding:24px 20px;min-height:0;}
  .studio-overview .studio-page-title {font-size:36px!important;max-width:300px;}
  .studio-overview .studio-page-subtitle {font-size:13px!important;}
  .studio-overview .cc-nav {width:100%;}
  .studio-overview .btn-pri {min-height:46px;}
  .appearance-palettes {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .appearance-preview {height:76px;padding:8px;}
  .appearance-card-label {padding:10px;}
  .studio-appearance-box .modal-title {font-size:28px;}
  .appearance-footer {position:sticky;bottom:-22px;background:var(--bg);padding-block:14px 8px;}
  .appearance-footer>span {max-width:170px;line-height:1.5;}
  .studio-report-toolbar button {min-height:44px;}
  .studio-piece-count,.studio-payout-action {min-height:44px;}
  .content .studio-payout-table {display:block;min-width:0!important;}
  .content .studio-payout-table thead {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
  .content .studio-payout-table tbody {display:block;}
  .content .studio-payout-table tbody tr {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;padding:16px;border-bottom:1px solid var(--border)!important;}
  .content .studio-payout-table tbody td {display:block;position:static;box-shadow:none;border:0!important;padding:0!important;background:transparent!important;}
  .content .studio-payout-table tbody td:first-child {grid-column:1;grid-row:1;font-size:14px!important;align-self:end;}
  .content .studio-payout-table tbody td:nth-child(2) {grid-column:2;grid-row:1/3;align-self:center;}
  .content .studio-payout-table tbody td:nth-child(2)::before {content:'Pieces';display:block;position:static;width:auto;border:0;padding:0;float:none;font-size:11px;color:var(--text2);font-weight:400;margin-bottom:4px;text-align:center;}
  .content .studio-payout-table tbody td:nth-child(3) {grid-column:1;grid-row:2;align-self:start;}
  .content .studio-payout-table tbody td:nth-child(4) {grid-column:1/-1;grid-row:3;margin-top:10px;}
  .content .studio-payout-table .studio-payout-action {width:100%;}
  .content .studio-payout-table tbody tr:last-child {border-bottom:0!important;background:var(--bg2)!important;}
  .content .studio-payout-table tbody tr:last-child td {align-self:center;}
  .content .studio-payout-table tbody tr:last-child td[colspan] {display:none;}
}
