:root{
  /* The theme engine sets --moss as the live accent. Many components use
     var(--accent), which was never defined, so they stayed on the hardcoded
     fallback and ignored theme changes. Alias it to --moss so every accent
     follows the selected theme. */
  --accent:var(--moss,#1f6f4a);
  --chs-field-min-height:46px;
  --chs-field-padding:12px 14px;
  --chs-section-padding:22px;
  --chs-card-radius:22px;
  --chs-panel-radius:30px;
  --chs-font-size:15px;
  --chs-body-font-family:Avenir Next, Optima, Candara, Segoe UI, sans-serif;
  --chs-body-font-weight:500;
  --chs-body-font-style:normal;
  --chs-page-bg-start:#eef6ea;
  --chs-page-bg-mid:#faf6ea;
  --chs-page-bg-end:#eaf3ef;
  --chs-page-glow-1:rgba(31,111,74,.18);
  --chs-page-glow-2:rgba(231,191,107,.22);
}

body{
  font-size:var(--chs-font-size);
  font-family:var(--chs-body-font-family);
  font-weight:var(--chs-body-font-weight);
  font-style:var(--chs-body-font-style);
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--chs-page-glow-1) 70%, transparent), transparent 30rem),
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--chs-page-glow-2) 65%, transparent), transparent 22rem),
    linear-gradient(135deg, var(--chs-page-bg-start), var(--chs-page-bg-mid) 55%, var(--chs-page-bg-end))!important;
}

body,
body *,
button,
input,
textarea,
select,
option,
label,
table,
th,
td,
.brand,
.topbar,
.panel,
.item,
.stat,
.chip,
.status-pill,
.notice,
.modal,
.messages-panel,
.row-editor-panel,
.directory-toolbar,
.case-stage,
.subhead{
  font-family:var(--chs-body-font-family)!important;
  font-weight:var(--chs-body-font-weight);
  font-style:var(--chs-body-font-style);
}

body,
main,
.shell,
.topbar,
.panel,
.item,
.stat,
.settings-preview,
.modal,
.messages-panel > .panel,
.row-editor-panel > .panel{
  color:var(--ink)!important;
}

p,
label,
.subhead,
.meta,
.directory-hint,
.brand p,
.item p,
.panel p,
.notice p,
.helper,
.help,
.muted{
  color:var(--muted)!important;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
th,
.brand h1,
.panel h3,
.item h4{
  color:var(--ink)!important;
}

aside{
  background:linear-gradient(180deg,var(--chs-sidebar-bg),color-mix(in srgb,var(--chs-sidebar-bg) 82%,var(--paper)))!important;
  color:var(--chs-sidebar-ink)!important;
}

aside *,
nav button{
  color:var(--chs-sidebar-ink)!important;
}

.topbar,
.panel,
.stat,
.item,
article,
.access-card,
.status-pill,
.settings-preview,
.chs-toast,
.role-visibility-panel,
.messages-panel > .panel,
.row-editor-panel > .panel,
table{
  background:var(--surface)!important;
  background-color:var(--surface)!important;
  border-color:var(--line)!important;
}

input,
textarea,
select,
option{
  background:var(--field)!important;
  border-color:var(--line)!important;
  color:var(--input-ink)!important;
  caret-color:var(--moss);
}

button,
.btn,
.btn-primary-action{
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}

.btn,
.btn-primary-action{
  color:var(--chs-button-ink)!important;
}

.btn.secondary,
.btn-secondary-action{
  color:var(--ink)!important;
}

section,
.section,
[data-section],
.page-section,
.panel,
.item,
.stat{
  animation:chs-section-in .24s ease both;
}

button:hover,
.btn:hover,
nav button:hover,
.item:hover,
.case-stage:hover,
[role="button"]:hover{
  transform:translateY(-1px);
}

button:active,
.btn:active,
nav button:active,
[role="button"]:active{
  transform:translateY(0) scale(.985);
}

input:focus,
textarea:focus,
select:focus,
input:focus-visible,
textarea:focus-visible,
select:focus-visible{
  outline:none!important;
  border-color:var(--moss)!important;
  box-shadow:0 0 0 4px var(--ring), 0 10px 22px rgba(23,52,42,.08)!important;
  background:color-mix(in srgb, var(--field) 92%, var(--moss))!important;
}

@keyframes chs-section-in{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}

:root[data-chs-theme="dark"]{
  --ink:#eef8f1;
  --muted:#aac0b4;
  --line:#365344;
  --paper:#14231d;
  --field:#0f1e18;
  --moss:#6ccf9a;
  --moss-2:#3fae77;
  --sage:#1f3b30;
  --sand:#263c31;
  --warn:#f1b56f;
  --surface:#14231d;
  --surface-strong:#1b3128;
  --ring:rgba(108,207,154,.22);
  --input-ink:#eef8f1;
  --shadow:0 24px 70px rgba(0,0,0,.34);
  --chs-sidebar-bg:#12241c;
}

:root[data-chs-theme="dark"] body{
  background:
    radial-gradient(circle at 16% 8%, color-mix(in srgb, var(--chs-page-glow-1) 70%, transparent), transparent 28rem),
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--chs-page-glow-2) 65%, transparent), transparent 22rem),
    linear-gradient(135deg, var(--chs-page-bg-start), var(--chs-page-bg-mid) 58%, var(--chs-page-bg-end))!important;
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] main,
:root[data-chs-theme="dark"] .shell{
  background:transparent!important;
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] aside{
  background:linear-gradient(180deg,var(--chs-sidebar-bg),color-mix(in srgb,var(--chs-sidebar-bg) 82%,var(--paper)))!important;
  border-right:1px solid var(--line)!important;
  box-shadow:18px 0 48px rgba(0,0,0,.22)!important;
  color:var(--chs-sidebar-ink)!important;
}

:root[data-chs-theme="dark"] .topbar,
:root[data-chs-theme="dark"] .panel,
:root[data-chs-theme="dark"] .stat,
:root[data-chs-theme="dark"] .item,
:root[data-chs-theme="dark"] article,
:root[data-chs-theme="dark"] .access-card,
:root[data-chs-theme="dark"] .status-pill,
:root[data-chs-theme="dark"] .settings-preview,
:root[data-chs-theme="dark"] .chs-toast,
:root[data-chs-theme="dark"] .role-visibility-panel,
:root[data-chs-theme="dark"] .messages-panel > .panel,
:root[data-chs-theme="dark"] .row-editor-panel > .panel{
  background:var(--surface)!important;
  background-color:var(--surface)!important;
  background-image:none!important;
  border-color:var(--line)!important;
  color:var(--ink)!important;
  box-shadow:0 22px 60px rgba(0,0,0,.28)!important;
}

:root[data-chs-theme="dark"] .topbar > *,
:root[data-chs-theme="dark"] .panel > *,
:root[data-chs-theme="dark"] .role-visibility-panel > *,
:root[data-chs-theme="dark"] .panel .panel,
:root[data-chs-theme="dark"] .panel .item,
:root[data-chs-theme="dark"] .list .item,
:root[data-chs-theme="dark"] article.item,
:root[data-chs-theme="dark"] .directory-insert-helper,
:root[data-chs-theme="dark"] .case-stage{
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] .panel .panel,
:root[data-chs-theme="dark"] .panel .item,
:root[data-chs-theme="dark"] .list .item,
:root[data-chs-theme="dark"] article.item,
:root[data-chs-theme="dark"] .directory-insert-helper,
:root[data-chs-theme="dark"] .case-stage{
  background:var(--surface-strong)!important;
  background-color:var(--surface-strong)!important;
  background-image:none!important;
  border-color:var(--line)!important;
}

:root[data-chs-theme="dark"] h1,
:root[data-chs-theme="dark"] h2,
:root[data-chs-theme="dark"] h3,
:root[data-chs-theme="dark"] h4,
:root[data-chs-theme="dark"] .brand h1,
:root[data-chs-theme="dark"] .item h4,
:root[data-chs-theme="dark"] .panel h3{
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] p,
:root[data-chs-theme="dark"] span,
:root[data-chs-theme="dark"] div,
:root[data-chs-theme="dark"] .subhead,
:root[data-chs-theme="dark"] .item p,
:root[data-chs-theme="dark"] label,
:root[data-chs-theme="dark"] .brand p,
:root[data-chs-theme="dark"] .meta,
:root[data-chs-theme="dark"] .directory-hint{
  color:var(--muted)!important;
}

:root[data-chs-theme="dark"] h1,
:root[data-chs-theme="dark"] h2,
:root[data-chs-theme="dark"] h3,
:root[data-chs-theme="dark"] h4,
:root[data-chs-theme="dark"] strong,
:root[data-chs-theme="dark"] button,
:root[data-chs-theme="dark"] .status-pill{
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] input,
:root[data-chs-theme="dark"] textarea,
:root[data-chs-theme="dark"] select{
  background:var(--field)!important;
  border-color:var(--line)!important;
  color:var(--input-ink)!important;
}

:root[data-chs-theme="dark"] input::placeholder,
:root[data-chs-theme="dark"] textarea::placeholder{
  color:color-mix(in srgb, var(--input-ink) 58%, var(--field))!important;
}

:root[data-chs-theme="dark"] .chip,
:root[data-chs-theme="dark"] .eyebrow{
  background:rgba(108,207,154,.14)!important;
  border-color:rgba(108,207,154,.24)!important;
  color:var(--moss)!important;
}

:root[data-chs-theme="dark"] .notice{
  background:rgba(241,181,111,.10)!important;
  color:#f4c995!important;
  border-color:rgba(241,181,111,.26)!important;
}

:root[data-chs-theme="dark"] .notice *{
  color:#f4c995!important;
}

:root[data-chs-theme="dark"] nav button{
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] nav button.active,
:root[data-chs-theme="dark"] nav button:hover{
  background:rgba(108,207,154,.16)!important;
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] .btn,
:root[data-chs-theme="dark"] .btn-primary-action{
  background:linear-gradient(135deg,var(--moss),var(--moss-2))!important;
  color:var(--chs-button-ink)!important;
  font-weight:900!important;
}

:root[data-chs-theme="dark"] .btn.secondary,
:root[data-chs-theme="dark"] .btn-secondary-action{
  background:#263c31!important;
  color:var(--ink)!important;
  border:1px solid var(--line)!important;
}

:root[data-chs-theme="dark"] .btn-danger{
  background:rgba(255,129,112,.12)!important;
  color:#ffb4a8!important;
  border-color:rgba(255,129,112,.26)!important;
}

:root[data-chs-theme="dark"] .chs-language-panel,
:root[data-chs-theme="dark"] .chs-theme-toggle{
  border-color:var(--line)!important;
  color:var(--ink)!important;
}

:root[data-chs-theme="dark"] .chs-language-button{
  color:var(--muted)!important;
}

:root[data-chs-theme="dark"] .chs-language-button.active,
:root[data-chs-theme="dark"] .chs-language-button[aria-pressed="true"],
:root[data-chs-theme="dark"] .chs-theme-toggle[aria-pressed="true"]{
  background:linear-gradient(135deg,var(--moss),var(--moss-2))!important;
  color:#062014!important;
  border-color:transparent!important;
}

.topbar,
.panel,
.stat,
.item,
.access-card,
.status-pill,
.settings-preview{
  border-radius:var(--chs-panel-radius,30px)!important;
}
.item,
.chip,
input,
textarea,
select,
.btn,
nav button{
  border-radius:var(--chs-card-radius,22px)!important;
}
.panel{padding:var(--chs-section-padding,22px)!important;}
input,textarea,select{min-height:var(--chs-field-min-height,46px)!important;padding:var(--chs-field-padding,12px 14px)!important;}

.topbar-actions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:10px;
  margin-left:auto;
  flex-wrap:wrap;
  min-width:0;
}
.topbar-actions .status-pill{
  flex:0 0 auto;
}
.chs-theme-toggle{
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  padding:0!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:var(--paper)!important;
  color:var(--ink)!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(23,52,42,.08);
  transition:background .18s ease, transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
}
.chs-theme-toggle:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 24px rgba(23,52,42,.11);
}
.chs-theme-toggle:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px var(--ring), 0 12px 24px rgba(23,52,42,.11);
}
.chs-theme-toggle[aria-pressed="true"]{
  background:linear-gradient(135deg,var(--moss),var(--moss-2))!important;
  color:white!important;
  border-color:transparent!important;
  box-shadow:0 10px 22px rgba(31,111,74,.22);
}
.chs-theme-toggle span{
  display:block;
  line-height:1;
  font-size:18px;
}
.chs-language-panel{
  display:inline-flex;
  align-items:center;
  padding:4px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--field);
  box-shadow:0 10px 22px rgba(23,52,42,.08);
}
.chs-toggle-group{
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.chs-language-button{
  min-width:34px;
  min-height:30px;
  padding:0 10px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--muted)!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.05em;
  line-height:1;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .18s ease, transform .18s ease, box-shadow .18s ease, color .18s ease;
}
.chs-language-button:hover{
  transform:translateY(-1px);
}
.chs-language-button:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px var(--ring);
}
.chs-language-button.active,
.chs-language-button[aria-pressed="true"]{
  background:linear-gradient(135deg,var(--moss),var(--moss-2))!important;
  color:white!important;
  box-shadow:0 8px 18px rgba(31,111,74,.2);
}

.settings-grid--wide{grid-template-columns:repeat(2,minmax(0,1fr));}
.appearance-scheme-grid,
.appearance-swatch{display:none!important;}
.appearance-preview-sample{
  margin-top:12px;
}
.appearance-preview-surface{
  display:grid;
  gap:10px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--surface-strong);
  color:var(--ink);
  font-family:var(--chs-body-font-family);
  font-style:var(--chs-body-font-style);
  font-weight:var(--chs-body-font-weight);
  font-size:var(--preview-font-size, var(--chs-font-size));
}
.appearance-preview-surface h4,
.appearance-preview-surface p{
  margin:0;
}
.appearance-preview-surface p{
  color:var(--muted);
}
.appearance-preview-surface input{
  background:var(--field);
  color:var(--input-ink);
}
.appearance-preview-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}
.settings-preview--appearance{
  --preview-page:var(--chs-page-bg-start);
  --preview-surface:var(--surface-strong);
  --preview-field:var(--field);
  --preview-accent:var(--moss);
  --preview-text:var(--ink);
  --preview-muted:var(--muted);
  --preview-line:var(--line);
  --preview-input:var(--input-ink);
}
.settings-preview--appearance .appearance-preview-surface{
  background:var(--preview-surface);
  border-color:var(--preview-line);
  color:var(--preview-text);
}
.settings-preview--appearance .appearance-preview-surface p{
  color:var(--preview-muted);
}
.settings-preview--appearance .appearance-preview-surface input{
  background:var(--preview-field);
  color:var(--preview-input);
  border-color:var(--preview-line);
}
.settings-preview--appearance .chip{
  background:color-mix(in srgb, var(--preview-accent) 12%, white)!important;
  color:var(--preview-accent)!important;
}
.settings-actions{justify-content:flex-start;}
.settings-actions .btn{min-width:160px;}
.settings-form{display:grid;gap:0;}
.settings-form .settings-grid{margin-top:0;}
.settings-form .settings-preview{margin-top:14px;}
.settings-form label select,
.settings-form label input[type="range"]{
  margin-top:2px;
}
.appearance-choice-group{display:grid;gap:8px;margin:14px 0;}
.appearance-choice-group strong{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);}
.appearance-choice-group > div{display:flex;gap:8px;flex-wrap:wrap;}
.appearance-choice-group button{
  border:1px solid var(--line);
  background:var(--surface-strong);
  color:var(--ink);
  border-radius:999px;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
}
.appearance-choice-group button[aria-pressed="true"]{
  background:linear-gradient(135deg,var(--moss),var(--moss-2));
  color:#062014;
  border-color:transparent;
}

.actions-enhanced{align-items:center;gap:10px;}
.actions-enhanced .btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;line-height:1.1;}
.actions-enhanced .btn-primary-action{background:linear-gradient(135deg,var(--moss),var(--moss-2))!important;color:white!important;box-shadow:0 12px 26px rgba(31,111,74,.25)!important;}
.actions-enhanced .btn-secondary-action{background:color-mix(in srgb, var(--sand) 75%, white)!important;color:var(--ink)!important;box-shadow:none!important;}
.actions-enhanced .btn-danger{background:rgba(180,35,24,.1)!important;color:#b42318!important;border:1px solid rgba(180,35,24,.22)!important;box-shadow:none!important;}
.form-enhanced label{min-width:0;}
.form-enhanced .field-enhanced{min-height:var(--chs-field-min-height,46px)!important;}

@media (min-width:681px){
  .actions-enhanced .btn-danger{margin-left:auto;}
  .actions-enhanced .btn-danger ~ .btn-danger{margin-left:0;}
}

@media (max-width:680px){
  .topbar-actions{
    gap:8px;
  }
  .chs-language-button{
    min-height:28px;
    padding:0 9px!important;
  }
  .chs-theme-toggle{
    width:32px;
    height:32px;
    min-width:32px;
    min-height:32px;
  }
  .actions-enhanced{display:grid!important;grid-template-columns:1fr;align-items:stretch;}
  .actions-enhanced .btn,
  .actions-enhanced a.btn{width:100%;min-height:46px;text-align:center;}
  .form-enhanced .field-enhanced{min-height:46px;}
  .settings-grid--wide{grid-template-columns:1fr!important;}
}

@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
  }
  button:hover,
  .btn:hover,
  nav button:hover,
  .item:hover,
  .case-stage:hover,
  [role="button"]:hover,
  button:active,
  .btn:active,
  nav button:active,
  [role="button"]:active{
    transform:none!important;
  }
}