/* Gemeinsamer Produktrahmen. Die feste NOWIK-Ausgabe bleibt unverändert. */
:root {
  color-scheme: light;
  --sw-bg:#f8f6ef; --sw-panel:#fffdf8; --sw-raised:#eeeee4;
  --sw-text:#203c31; --sw-muted:#52675b; --sw-line:#d7ddd0;
  --sw-accent:#22563f; --sw-on-accent:#fff; --sw-focus:#2268a6;
  --sw-cover:#e5ebdc; --sw-shadow:0 16px 44px #203c3112;
}
:root[data-theme="dark"] {
  color-scheme:dark;
  --sw-bg:#101412; --sw-panel:#19201b; --sw-raised:#252e27;
  --sw-text:#f1f4eb; --sw-muted:#b7c3b5; --sw-line:#3b493d;
  --sw-accent:#c4e4b6; --sw-on-accent:#17251b; --sw-focus:#b2d6ff;
  --sw-cover:#222c25; --sw-shadow:0 16px 44px #0003;
}
.sw-header { font-family:var(--sans,Inter,ui-sans-serif,system-ui,sans-serif); }
.sw-header-inner { width:100%; display:flex; flex-wrap:wrap; align-items:center; gap:16px 30px; }
.sw-brand { display:inline-flex; gap:12px; align-items:center; text-decoration:none; color:var(--sw-text); white-space:nowrap; }
.sw-brand img { width:32px; height:32px; object-fit:contain; filter:brightness(0); }
[data-theme="dark"] .sw-brand img { filter:none; }
.sw-brand strong { font-size:22px; font-weight:750; letter-spacing:-.6px; }
.sw-brand small { display:block; margin-top:2px; font-size:11px; font-weight:500; color:var(--sw-muted); letter-spacing:.1px; }
.sw-nav { display:flex; align-items:center; gap:24px; }
.sw-nav a { display:inline-flex; min-height:44px; align-items:center; text-decoration:none; font-size:14px; font-weight:650; color:var(--sw-muted); border-bottom:2px solid transparent; }
.sw-nav a[aria-current="page"] { color:var(--sw-text); border-color:currentColor; }
.sw-tools { margin-left:auto; display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.sw-appearance { display:flex; align-items:center; gap:8px; margin:0; color:var(--sw-muted); font-size:12px; }
.sw-appearance select { min-height:44px; max-width:145px; padding:8px 28px 8px 12px; border:1px solid var(--sw-line); border-radius:10px; background:var(--sw-panel); color:var(--sw-text); font:inherit; font-size:13px; cursor:pointer; }
.sw-account { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 16px; border-radius:10px; background:var(--sw-accent); color:var(--sw-on-accent); font-size:14px; font-weight:650; text-decoration:none; }
.sw-header a:focus-visible,.sw-appearance select:focus-visible { outline:3px solid var(--sw-focus); outline-offset:3px; }
@media(max-width:720px) {
  .sw-header-inner { gap:10px 16px; }
  .sw-brand strong { font-size:20px; }
  .sw-brand small { display:none; }
  .sw-nav { order:3; width:100%; gap:24px; }
  .sw-tools { gap:8px; }
  .sw-appearance > span { display:none; }
  .sw-appearance select { max-width:132px; font-size:12px; padding-left:9px; }
  .sw-account { padding-inline:12px; font-size:13px; }
}
@media(max-width:520px) {
  .sw-header-inner { gap:8px; }
  .sw-brand { gap:7px; }
  .sw-brand img { width:24px; height:24px; }
  .sw-brand strong { font-size:18px; }
  .sw-appearance select { max-width:110px; padding-right:18px; }
  .sw-account { padding-inline:9px; }
}
/* Die Schreibwerkstatt verwendet dieselbe Schale mit neutralen Arbeitsfarben. */
html[data-area="writer"] {
  --sw-bg:#f5f5f6; --sw-panel:#fff; --sw-raised:#eaeaec; --sw-text:#161619;
  --sw-muted:#55555e; --sw-line:#d2d2d8; --sw-accent:#17171a; --sw-on-accent:#fff;
}
html[data-area="writer"][data-theme="dark"] {
  --sw-bg:#090909; --sw-panel:#141414; --sw-raised:#202020; --sw-text:#f5f5f5;
  --sw-muted:#b0b0b0; --sw-line:#363636; --sw-accent:#fff; --sw-on-accent:#101010;
}
html[data-area="writer"]:root, html[data-area="writer"] dialog.gespraech {
  color-scheme:light;
  --gw-schwarz:var(--sw-bg); --gw-oberflaeche:var(--sw-panel); --gw-erhoeht:var(--sw-raised);
  --gw-rand:var(--sw-line); --gw-rand-aktiv:#9a9aa3; --gw-text:var(--sw-text); --gw-gedaempft:var(--sw-muted);
  --gw-weiss:var(--sw-accent); --gw-weiss-hover:#35353c; --gw-auf-weiss:var(--sw-on-accent);
  --gw-geprueft:#28613e; --gw-fehler:#a42d28; --gw-aktiv:#235f99; --gw-entscheidung:#795300;
  --marke-zeichen:var(--sw-text);
}
html[data-area="writer"][data-theme="dark"]:root, html[data-area="writer"][data-theme="dark"] dialog.gespraech {
  color-scheme:dark; --gw-rand-aktiv:#606060; --gw-weiss-hover:#dedede;
  --gw-geprueft:#a3d3b0; --gw-fehler:#e4a29b; --gw-aktiv:#a8c6e2; --gw-entscheidung:#dfc286;
}
.nw .kopf.sw-header { background:var(--sw-bg); border-bottom:1px solid var(--sw-line); }
.nw .kopf-innen.sw-header-inner { height:auto; min-height:84px; padding-block:12px; }
.nw .sw-brand { color:var(--sw-text); }
.nw .sw-tools .konto-knopf { width:44px; height:44px; }
.nw .sw-nav a { font-size:14px; }
.nw .anmeldung { min-height:calc(100dvh - 85px); padding:32px var(--rand); }
.nw .anmeldung-kopf { margin-bottom:24px; }
.nw .anmeldung-kopf h1 { font-size:clamp(27px,5vw,34px); color:var(--sw-text); line-height:1.15; }
.nw .anmeldung-kopf p { font-size:16px; line-height:1.5; margin-top:10px; }
.nw .anmeldung-kopf .anmeldung-kicker { margin:0 0 10px; font-size:12px; font-weight:700; }
.nw .anmeldung-fuss { margin-top:16px; }
.nw .fuss { background:var(--sw-bg); }
.nw dialog.profil-dialog { background:var(--sw-panel); color:var(--sw-text); border-color:var(--sw-line); }
.nw :is(.profil-hilfe,.profil-login>span) { color:var(--sw-muted); }
.nw :is(.profil-login,.profil-avatarinhalt,.profil-upload) { border-color:var(--sw-line); }
.nw .profil-avatarinhalt { background:var(--sw-raised); }
.nw .profil-leseschrift input { accent-color:var(--sw-accent); }
.nw .profil-bild { background:var(--sw-accent); color:var(--sw-on-accent); }
html[data-area="writer"][data-theme="light"] .nw :is(.marke-kern,.marke-zeichen) { fill:currentColor; color:var(--sw-text); }
@media(max-width:720px) { .nw .kopf-innen.sw-header-inner { min-height:112px; padding-block:8px; } }
.nw .profil-fuss { background:var(--sw-panel); border-color:var(--sw-line); }
.nw .profil-leseschrift small { color:var(--sw-muted); }

html[data-area="writer"][data-theme="light"] {
  --nw-color-canvas:var(--sw-bg); --nw-color-surface:var(--sw-panel);
  --nw-color-surface-raised:var(--sw-raised); --nw-color-surface-active:#dfdfe5;
  --nw-color-text:var(--sw-text); --nw-color-text-secondary:var(--sw-muted); --nw-color-text-muted:var(--sw-muted);
  --nw-color-border:var(--sw-line); --nw-color-border-interactive:#8b8b95;
  --nw-color-inverse:var(--sw-accent); --nw-color-on-inverse:var(--sw-on-accent);
  --nw-color-on-inverse-secondary:#dddddf; --nw-color-inverse-hover:#35353c; --nw-color-focus:#235f99;
}
html[data-area="writer"] body.nw { color:var(--sw-text); color-scheme:inherit; }
@media(max-width:720px) { .nw .anmeldung { min-height:calc(100dvh - 113px); } }