:root {
  color-scheme: light;
  --bg-page: #f3f5f6;
  --bg-surface: #ffffff;
  --bg-elevated: #ffffff;
  --bg-subtle: #eef1f2;
  --bg-input: #ffffff;
  --bg-table-header: #20272b;
  --bg-table-filter: #293136;
  --bg-row-hover: #f7f0e4;
  --border: #d7dde1;
  --border-muted: #e6eaed;
  --border-strong: #bfc8ce;
  --text: #171b1e;
  --text-secondary: #59646d;
  --text-muted: #76828c;
  --text-on-dark: #f7f8f8;
  --accent: #d69124;
  --accent-hover: #bb7612;
  --accent-soft: #f7ead6;
  --success: #087d5e;
  --success-soft: #e6f3ef;
  --warning: #9a6610;
  --warning-soft: #fbf1dc;
  --danger: #b43a3a;
  --danger-soft: #faeaea;
  --focus: rgb(214 145 36 / 38%);
  --shadow-sm: 0 1px 3px rgb(18 25 29 / 7%);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg-page: #0f1417;
  --bg-surface: #171d21;
  --bg-elevated: #1b2226;
  --bg-subtle: #20282d;
  --bg-input: #242c31;
  --bg-row-hover: #292820;
  --border: #303a40;
  --border-muted: #273137;
  --border-strong: #465159;
  --text: #f1f3f4;
  --text-secondary: #bac2c8;
  --text-muted: #929da5;
  --accent: #dfa03a;
  --accent-hover: #efb24f;
  --accent-soft: #3b3324;
  --success: #34b98f;
  --success-soft: #102c25;
  --warning: #e0aa4c;
  --warning-soft: #342b1c;
  --danger: #ec7474;
  --danger-soft: #351f21;
  --focus: rgb(223 160 58 / 42%);
  --shadow-sm: none;
}

:root { --radius-sm:4px; --radius:6px; --control-h:36px; --header-h:60px; --text-on-accent:#171b1e; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg-page); color:var(--text); font:14px/1.45 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-underline-offset:3px; }
p { margin:8px 0 12px; }
h1 { margin:4px 0; font-size:26px; line-height:1.15; letter-spacing:-.02em; }
h2 { font-size:17px; margin:0 0 12px; }
h3 { font-size:14px; margin:6px 0; }
small,.helper { font-size:11px; color:var(--text-secondary); }
.muted { color:var(--text-secondary); }
.eyebrow { font-size:10px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--text-secondary); }
:focus-visible { outline:3px solid var(--focus); outline-offset:2px; }
.skip { position:absolute; left:8px; top:-100px; z-index:20; background:var(--bg-surface); padding:10px; }
.skip:focus { top:8px; }
.app-header { position:sticky; top:0; z-index:5; min-height:var(--header-h); display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:24px; padding:8px max(24px,env(safe-area-inset-right)) 8px max(24px,env(safe-area-inset-left)); background:var(--bg-surface); border-bottom:1px solid var(--border); box-shadow:var(--shadow-sm); }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; white-space:nowrap; }
.mark { background:var(--bg-table-header); color:var(--text-on-dark); border-left:3px solid var(--accent); padding:8px; font-weight:800; }
.app-header nav { display:flex; gap:12px; overflow:auto; }
.app-header nav a { display:flex; align-items:center; min-height:39px; white-space:nowrap; text-decoration:none; border-bottom:2px solid transparent; }
[aria-current="page"] { border-color:var(--accent)!important; font-weight:700; }
.utilities { display:flex; align-items:center; gap:12px; }
.utilities form { margin:0; }
.page-shell { width:min(100%,1540px); margin-inline:auto; padding:24px max(24px,env(safe-area-inset-right)) 36px max(24px,env(safe-area-inset-left)); }
.page-heading { margin:20px 0 16px; border-left:3px solid var(--accent); padding-left:14px; }
.page-heading p { max-width:850px; }
.workspace-strip,.toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.workspace-strip { color:var(--text-secondary); font-size:12px; }
.workspace-strip .badge { margin-left:auto; }
.card { border:1px solid var(--border); border-radius:var(--radius); background:var(--bg-surface); padding:18px; margin:0 0 16px; min-width:0; box-shadow:var(--shadow-sm); }
.narrow { max-width:480px; }
.stack { display:flex; flex-direction:column; gap:12px; }
label { display:flex; flex-direction:column; gap:5px; font-size:12px; font-weight:600; color:var(--text-secondary); }
input,select,textarea,button,.button { border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg-input); color:var(--text); font:inherit; min-height:var(--control-h); padding:7px 10px; max-width:100%; }
input,select,textarea { width:100%; }
textarea { resize:vertical; }
input:hover,select:hover,textarea:hover { border-color:var(--border-strong); }
input:focus,select:focus,textarea:focus { border-color:var(--accent); }
button,.button { display:inline-flex; align-items:center; justify-content:center; cursor:pointer; font-size:12px; font-weight:700; text-decoration:none; background:var(--bg-subtle); transition:background 140ms; }
button:hover,.button:hover { background:var(--bg-row-hover); }
.primary { background:var(--accent); color:var(--text-on-accent); border-color:var(--accent); }
.primary:hover { background:var(--accent-hover); }
button:disabled { cursor:wait; opacity:.65; }
fieldset { border:1px solid var(--border); padding:12px; display:flex; flex-direction:column; gap:10px; min-width:0; }
legend { font-weight:700; }
.check { display:flex; flex-direction:row; align-items:center; overflow-wrap:anywhere; }
.check input { width:18px; min-height:18px; margin-right:5px; flex-shrink:0; }
.notice { background:var(--bg-subtle); border:1px solid var(--border); border-left:3px solid var(--border-strong); padding:12px 14px; border-radius:var(--radius-sm); overflow-wrap:anywhere; }
.warning { background:var(--warning-soft); border-color:var(--warning); color:var(--text); }
.badge { display:inline-block; border:1px solid var(--border-strong); border-radius:12px; padding:2px 8px; font-size:11px; background:var(--bg-subtle); }
.segments { display:flex; gap:4px; padding:4px; border:1px solid var(--border); border-radius:var(--radius); }
.segments a { min-height:32px; padding:6px 12px; text-decoration:none; border-bottom:2px solid transparent; }
.table-wrap { overflow:auto; border:1px solid var(--border); border-radius:var(--radius); }
table { width:100%; border-collapse:collapse; font-size:13px; }
th { background:var(--bg-table-header); color:var(--text-on-dark); font-weight:650; text-align:left; padding:10px 12px; white-space:nowrap; }
td { padding:10px 12px; border-bottom:1px solid var(--border-muted); background:var(--bg-surface); overflow-wrap:anywhere; min-width:100px; }
tr:hover td { background:var(--bg-row-hover); }
td a { font-weight:600; }
.mobile-tasks { display:none; }
.board { display:flex; overflow:auto; gap:12px; padding-bottom:16px; align-items:flex-start; }
.column { flex:0 0 300px; background:var(--bg-subtle); padding:12px; border-radius:var(--radius); border:1px solid var(--border); }
.column h2 { font-size:14px; }
.task-card { background:var(--bg-surface); padding:12px; border:1px solid var(--border); border-radius:var(--radius); margin-top:10px; overflow-wrap:anywhere; }
.task-card p { font-size:12px; margin:6px 0; }
.admin-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr)); gap:16px; align-items:start; }
.details { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr)); gap:16px; }
dt { color:var(--text-secondary); font-size:12px; }
dd { margin:4px 0; overflow-wrap:anywhere; }
.comment { border-top:1px solid var(--border-muted); padding:12px 0; }
.rich-text { overflow-wrap:anywhere; }
.changes { white-space:pre-wrap; overflow-wrap:anywhere; font:12px/1.5 ui-monospace,monospace; max-height:500px; overflow:auto; }
hr { width:100%; border:0; border-top:1px solid var(--border); margin:20px 0; }
footer { color:var(--text-secondary); font-size:11px; padding:20px 24px; border-top:1px solid var(--border); }
@media(max-width:1180px) { .app-header { gap:12px; grid-template-columns:minmax(0,1fr) auto; } .app-header nav { grid-row:2; grid-column:1/-1; } }
@media(max-width:600px) {
  .app-header { padding:8px max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left)); gap:8px; position:relative; }
  .brand strong { font-size:13px; } .brand strong span { display:none; }
  .utilities { gap:8px; flex-wrap:wrap; justify-content:flex-end; font-size:12px; }
  .app-header nav a,button,.button { min-height:44px; }
  .app-header nav { gap:16px; }
  .page-shell { padding:16px max(12px,env(safe-area-inset-right)) 24px max(12px,env(safe-area-inset-left)); }
  input,select,textarea { font-size:16px; min-height:44px; }
  .card { padding:14px; }
  .desktop-tasks { display:none; } .mobile-tasks { display:block; }
  .mobile-tasks article { border-bottom:1px solid var(--border); padding:14px 0; overflow-wrap:anywhere; }
  .mobile-tasks h2 { margin:5px 0; font-size:16px; } .mobile-tasks p { margin:4px 0; }
  .column { flex-basis:min(88vw,340px); scroll-snap-align:start; } .board { scroll-snap-type:x proximity; }
  .workspace-strip .badge { margin-left:0; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
