:root {
  --surface-soft: #f6f6f3;
  --surface-muted: #eeeeea;
  --field: #ffffff;
  --sidebar: #202722;
  --sidebar-hover: #2a342d;
  --sidebar-active: #36483d;
  --sidebar-text: #e8ece9;
  --sidebar-muted: #aeb8b1;
  --successbg: #e4f1e9;
  --noticebg: #edf4f0;
  --noticeborder: #cfdfd6;
  --restrictbg: #f6edeb;
  --restrictborder: #e4cbc5;
  --palette-1: #173d31;
  --palette-2: #255e49;
  --palette-3: #7ca18f;
  --palette-4: #f2f1ed;
  --palette-5: #a72a2a;
}

:root[data-theme="wald-koralle"] {
  --bg: #f2e8cf;
  --paper: #fffdf7;
  --surface-soft: #f7efd9;
  --surface-muted: #e8dec4;
  --green: #386641;
  --green2: #6a994e;
  --sidebar: #2d5335;
  --sidebar-hover: #386641;
  --sidebar-active: #527d44;
  --red: #a9363a;
  --blue: #386641;
  --palette-1: #386641;
  --palette-2: #6a994e;
  --palette-3: #a7c957;
  --palette-4: #f2e8cf;
  --palette-5: #bc4749;
}

:root[data-theme="pflaume-rose"] {
  --bg: #eadcd7;
  --paper: #fffafa;
  --surface-soft: #f4e8e5;
  --surface-muted: #e5d3d3;
  --green: #372549;
  --green2: #774c60;
  --sidebar: #1a1423;
  --sidebar-hover: #372549;
  --sidebar-active: #5a3a50;
  --red: #9c3f51;
  --orange: #9c3f51;
  --blue: #774c60;
  --palette-1: #1a1423;
  --palette-2: #372549;
  --palette-3: #774c60;
  --palette-4: #b75d69;
  --palette-5: #eacdc2;
}

:root[data-theme="wald-limette"] {
  --bg: #ecf39e;
  --paper: #fcfff3;
  --surface-soft: #f2f7ce;
  --surface-muted: #e1e8a8;
  --green: #132a13;
  --green2: #31572c;
  --sidebar: #132a13;
  --sidebar-hover: #274a25;
  --sidebar-active: #31572c;
  --yellow: #657a1c;
  --blue: #4f772d;
  --palette-1: #132a13;
  --palette-2: #31572c;
  --palette-3: #4f772d;
  --palette-4: #90a955;
  --palette-5: #ecf39e;
}

:root[data-theme="marine-orange"] {
  --bg: #eae2b7;
  --paper: #fffdf4;
  --surface-soft: #f5efd2;
  --surface-muted: #e2d9ad;
  --green: #003049;
  --green2: #b41f25;
  --sidebar: #003049;
  --sidebar-hover: #06415e;
  --sidebar-active: #0b5676;
  --red: #b41f25;
  --yellow: #8a5900;
  --orange: #b64e00;
  --blue: #003049;
  --palette-1: #003049;
  --palette-2: #d62828;
  --palette-3: #f77f00;
  --palette-4: #fcbf49;
  --palette-5: #eae2b7;
}

:root[data-mode="dark"] {
  --bg: #101511;
  --paper: #18201b;
  --surface-soft: #202a23;
  --surface-muted: #2b352e;
  --field: #131a16;
  --ink: #edf3ee;
  --muted: #aab5ad;
  --line: #3a463e;
  --line2: #2c3730;
  --sidebar: #0b100d;
  --sidebar-hover: #202a23;
  --sidebar-active: #324238;
  --sidebar-text: #f0f5f1;
  --sidebar-muted: #9caaa0;
  --green: #73bf9a;
  --green2: #73bf9a;
  --red: #ff9696;
  --redbg: #482428;
  --yellow: #f1c86a;
  --yellowbg: #41371f;
  --orange: #ffad7d;
  --orangebg: #43291f;
  --blue: #8fc4e3;
  --bluebg: #1b3441;
  --successbg: #1d392c;
  --noticebg: #1b3026;
  --noticeborder: #355747;
  --restrictbg: #382527;
  --restrictborder: #684144;
  --shadow: 0 10px 30px rgba(0, 0, 0, .3);
}

:root[data-theme="wald-koralle"][data-mode="dark"] { --green: #a7c957; --green2: #8ab45e; --sidebar: #14251a; --sidebar-active: #386641; }
:root[data-theme="pflaume-rose"][data-mode="dark"] { --green: #e4aeb5; --green2: #d28792; --sidebar: #120e18; --sidebar-active: #4b345a; }
:root[data-theme="wald-limette"][data-mode="dark"] { --green: #b6d36a; --green2: #90a955; --sidebar: #091509; --sidebar-active: #31572c; }
:root[data-theme="marine-orange"][data-mode="dark"] { --green: #fcbf49; --green2: #ff8f1f; --sidebar: #001e2e; --sidebar-active: #064765; }

:root[data-mode="dark"] button:not(.secondary):not(.ghost):not(.text-button):not(.icon-button):not(.nav-item) { color: #102017; }

body { background: var(--bg); color: var(--ink); transition: background-color .18s ease, color .18s ease; }
.brand { position: relative; display: flex; min-height: 108px; padding: .55rem .25rem 1rem; overflow: hidden; align-items: center; justify-content: center; }
.brand-logo { display: block; width: 212px; max-width: 100%; height: 76px; object-fit: contain; object-position: center; }
.brand .mobile-close { position: absolute; top: .25rem; right: 0; }
.login-logo { display: block; width: 100%; height: 88px; object-fit: contain; object-position: center; padding: .35rem .8rem; margin-bottom: 1.2rem; border-radius: 8px; background: #25152a; }
.login-panel .password-field { margin-top: 0; }
.login-powered { margin: .12rem 0 1.55rem; color: #943fa2; font-size: .82rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.secondary, .login-panel, .market-detail, .toolbar, .table-wrap, .metric-grid article, .country-focus article, .approval-list article, .report-list > article { background: var(--paper); }
.login-wrap { --green: #943fa2; --green2: #943fa2; background-color: #100d1d; background-image: linear-gradient(110deg, rgba(8,7,17,.32), rgba(20,12,37,.08)), url('/franz1_bg_main.png?v=1.0.11'); background-size: cover; background-position: center; background-repeat: no-repeat; }
.login-wrap .login-panel { background: var(--paper); background: color-mix(in srgb, var(--paper) 92%, transparent); border-color: color-mix(in srgb, var(--line) 70%, rgba(255,255,255,.35)); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 24px 70px rgba(4,3,10,.34); }
.login-panel > button { background: #943fa2; color: #fff; }
.login-panel input:focus-visible, .login-panel > button:focus-visible { outline-color: rgba(148,63,162,.38); }
aside { background: var(--sidebar); color: var(--sidebar-text); transition: background-color .18s ease; }
.brand small, .side-note small { color: var(--sidebar-muted); }
.nav-item:hover { background: var(--sidebar-hover); }
.nav-item.active { background: var(--sidebar-active); }
.pill, .severity { background: var(--surface-muted); color: var(--muted); }
.pill.stabil, .pill.aktiv, .pill.bestanden, .pill.vollstandig, .pill.verbunden, .pill.serverseitig, .pill.aktuell, .pill.uber-worker, .pill.niedrig { background: var(--successbg); }
.system-note, .report-date, .gap-cards div, .no-change, .sku-metrics div, th { background: var(--surface-soft); }
.expansion-grid article { background: var(--surface-soft); border-color: var(--line); }
.notice { background: var(--noticebg); border-color: var(--noticeborder); border-left-color: var(--green2); }
.notice.restrictive { background: var(--restrictbg); border-color: var(--restrictborder); border-left-color: var(--red); }
.notice.restrictive > div:first-child { color: var(--red); }
:root[data-mode="dark"] .source-alert span { color: var(--ink); opacity: .82; }
:root[data-mode="dark"] .source-alert time { color: var(--muted); }
:root[data-mode="dark"] .source-live { background: var(--noticebg); border-color: var(--noticeborder); border-left-color: var(--green2); }
:root[data-mode="dark"] .source-live .source-icon,
:root[data-mode="dark"] .source-live span,
:root[data-mode="dark"] .source-live time { color: var(--green2); }
select, input[type="search"], .login-panel input { background: var(--field); border-color: var(--line); color: var(--ink); }
.search { border-color: var(--line); background: var(--field); }
.mono, th, .eyebrow, .risk small, .metric-grid small { color: var(--muted); }
.focus-row { background: color-mix(in srgb, var(--paper) 88%, var(--yellowbg)); }
dialog { background: var(--paper); }
.welcome-dialog { width: min(560px, calc(100vw - 2rem)); }
.welcome-card { text-align: center; padding: 1.55rem; }
.welcome-card > img { display: block; width: 100%; height: 94px; object-fit: contain; object-position: center; padding: .35rem 1rem; margin: 0 0 1.2rem; border-radius: 8px; background: var(--sidebar); }
.welcome-card .welcome-kicker { margin: .15rem 0 .25rem; color: #a825b5; font-size: 1.05rem; font-weight: 900; letter-spacing: .1em; }
.welcome-card h2 { margin: 0 0 .65rem; font-size: 1.45rem; }
.welcome-card > p:not(.welcome-kicker) { color: var(--muted); font-size: .88rem; line-height: 1.55; }
.welcome-card > button:last-child { width: 100%; margin-top: .45rem; }

.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.topbar-controls, .appearance-controls { display: flex; align-items: center; gap: .42rem; }
.topbar-controls { margin-left: 1rem; }
.appearance-controls { min-height: 40px; padding: .2rem; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); box-shadow: 0 2px 8px rgba(30,38,33,.035); }
.theme-picker { display: block; min-width: 0; }
.theme-picker select { min-width: 194px; height: 32px; padding: .3rem 1.65rem .3rem .45rem; border: 0; background: transparent; font-size: .75rem; font-weight: 680; }
.scheme-swatches { display: flex; width: 70px; height: 9px; margin: 0 .05rem 17px 0; overflow: hidden; border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 0 0 2px var(--paper); }
.scheme-swatches i { flex: 1; }
.scheme-swatches .swatch-1 { background: var(--palette-1); }
.scheme-swatches .swatch-2 { background: var(--palette-2); }
.scheme-swatches .swatch-3 { background: var(--palette-3); }
.scheme-swatches .swatch-4 { background: var(--palette-4); }
.scheme-swatches .swatch-5 { background: var(--palette-5); }
.mode-toggle.icon-only { width: 34px; height: 34px; min-height: 34px; padding: 0; border: 0; border-radius: 7px; background: var(--surface-soft); }
.mode-toggle.icon-only .icon { width: 17px; height: 17px; }
.actions { gap: .42rem; }
.actions button { min-height: 40px; padding: .52rem .72rem; border-radius: 8px; font-size: .78rem; }
.correction-safety { align-items: center; }
.correction-safety > div:nth-child(2) { flex: 1; }
.test-mode-badge, .test-case { display: inline-flex; width: max-content; padding: .25rem .45rem; border-radius: 5px; background: var(--yellowbg); color: var(--yellow); font-size: .64rem; font-weight: 850; letter-spacing: .06em; }
.test-case { display: block; margin-top: .35rem; }
.correction-toolbar { align-items: flex-end; }
.correction-toolbar .filters { flex: 1; }
.correction-toolbar input { min-width: 128px; padding: .48rem .55rem; background: var(--field); border: 1px solid var(--line); border-radius: 6px; color: var(--ink); }
.correction-table table { min-width: 1540px; }
.correction-table th:nth-child(5), .correction-table td:nth-child(5) { width: 260px; }
.correction-table th:last-child, .correction-table td:last-child { width: 230px; }
.correction-table th:last-child, .correction-table td:last-child { position: sticky; right: 0; z-index: 2; background: var(--paper); box-shadow: -10px 0 18px -16px rgba(20,20,25,.55); }
.correction-table th:last-child { z-index: 3; background: var(--surface-soft); }
.message-cell { line-height: 1.45; }
.row-buttons { display: grid; gap: .35rem; }
button.compact { justify-content: flex-start; min-height: 30px; padding: .35rem .5rem; font-size: .68rem; }
#issue-dialog, #draft-dialog, #approval-dialog { width: min(920px,calc(100vw - 2rem)); max-width: min(920px,calc(100vw - 2rem)); }
.workflow-dialog { width: 100%; max-height: 88vh; overflow: auto; }
.workflow-dialog input, .workflow-dialog textarea { width: 100%; padding: .7rem; background: var(--field); border: 1px solid var(--line); border-radius: 7px; color: var(--ink); resize: vertical; }
.issue-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .55rem; margin: 1rem 0; }
.issue-summary > div { min-width: 0; padding: .65rem; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.issue-summary span, .issue-summary strong { display: block; }
.issue-summary span { color: var(--muted); font-size: .66rem; text-transform: uppercase; letter-spacing: .04em; }
.issue-summary strong { margin-top: .18rem; font-size: .78rem; overflow-wrap: anywhere; }
.amazon-message { padding: .85rem; border-left: 3px solid var(--yellow); background: var(--yellowbg); border-radius: 5px; }
.amazon-message p { margin: .3rem 0; font-size: .86rem; }
.amazon-message small { color: var(--muted); }
.draft-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-top: 1rem; }
.draft-comparison article { padding: .75rem; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.draft-comparison h3 { margin: 0 0 .5rem; }
.draft-comparison img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; background: #fff; border: 1px solid var(--line); border-radius: 6px; }
.draft-comparison p, .draft-meta p, .draft-meta li { color: var(--muted); font-size: .76rem; }
.draft-meta { margin: .8rem 0; }
.draft-meta h3 { font-size: .82rem; margin: .75rem 0 .25rem; }
.draft-meta ul { margin: .25rem 0; padding-left: 1.1rem; }
.plan-card { margin-top: 1rem; padding: .85rem; border: 1px solid var(--line); border-radius: 8px; }
.plan-card h3 { margin: 0 0 .6rem; }
.plan-card dl { display: grid; grid-template-columns: 190px 1fr; gap: .4rem .8rem; margin: 0; }
.plan-card dt { color: var(--muted); font-size: .7rem; text-transform: uppercase; }
.plan-card dd { margin: 0; font-size: .78rem; }
.empty.inset { margin-top: 1rem; padding: 1.2rem; background: var(--surface-soft); border-radius: 7px; }
.approval-preview { display: grid; grid-template-columns: 220px 1fr; gap: 1rem; margin: 1rem 0; }
.approval-preview img { width: 100%; aspect-ratio: 1; object-fit: contain; background: #fff; border: 1px solid var(--line); border-radius: 7px; }
.approval-preview p { margin: .25rem 0; font-size: .8rem; }
.confirmation-check { grid-template-columns: auto 1fr !important; align-items: center; }
.confirmation-check input { width: auto; }

@media (max-width: 930px) {
  .topbar { flex-wrap: wrap; gap: .8rem; }
  .topbar-controls { width: 100%; margin-left: 0; justify-content: space-between; }
}

@media (max-width: 700px) {
  .topbar-controls { display: flex; flex-wrap: wrap; gap: .55rem; }
  .appearance-controls { flex: 1 1 245px; }
  .theme-picker { flex: 1; }
  .theme-picker select { width: 100%; min-width: 0; }
  .actions { width: auto; }
}

@media (max-width: 820px) {
  .brand-logo { width: 194px; }
}

@media (max-width: 430px) {
  .appearance-controls { flex-basis: 100%; }
  .actions { width: 100%; grid-template-columns: 1fr 1fr; }
  .welcome-card { padding: 1.1rem; }
  .welcome-card > img { height: 78px; padding-inline: .45rem; }
  .login-wrap { padding: 1rem; background-position: 61% center; }
  .login-panel { padding: 1.35rem; }
  .correction-safety { align-items: flex-start; flex-wrap: wrap; }
  .correction-toolbar .filters { grid-template-columns: 1fr; }
  .issue-summary, .draft-comparison, .approval-preview { grid-template-columns: 1fr; }
  .plan-card dl { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  body, aside { transition: none; }
}