/*
 * Optik übernommen aus dem MD-Dashboard (Assistance Workspace, --aw-* Tokens).
 * Self-contained: Tokens hier eingebettet, keine externen Fonts.
 */
:root{
  --aw-navy-950:#06152f; --aw-navy-900:#071b3d; --aw-navy-850:#0a234b; --aw-navy-800:#0e2c5d;
  --aw-blue-700:#0b5bd3; --aw-blue-600:#1473e6; --aw-blue-500:#2f88f3; --aw-blue-100:#eaf3ff;
  --aw-green-700:#0a7d55; --aw-green-600:#0f9f6e; --aw-green-100:#e9f8f2;
  --aw-amber-700:#a05b00; --aw-amber-600:#d57b00; --aw-amber-100:#fff4de;
  --aw-red-700:#b23636; --aw-red-800:#8e2727; --aw-red-600:#d64545; --aw-red-100:#ffeded;
  --aw-ink-900:#13213a; --aw-ink-700:#3b4b66; --aw-ink-500:#626e84; --aw-ink-400:#677081;

  --aw-canvas:#f2f5f9; --aw-surface:#fff; --aw-surface-raised:#f7f9fc;
  --aw-border:#dfe5ee; --aw-border-soft:#edf1f6; --aw-border-strong:#838b99;
  --aw-text:var(--aw-ink-900); --aw-text-muted:var(--aw-ink-500); --aw-text-subtle:var(--aw-ink-400);
  --aw-link:var(--aw-blue-700); --aw-primary:var(--aw-blue-600); --aw-primary-hover:var(--aw-blue-700);
  --aw-primary-active:#094aa8; --aw-primary-soft:var(--aw-blue-100); --aw-primary-text:#fff;
  --aw-disabled-surface:#eceff4; --aw-disabled-border:#d3d9e2; --aw-disabled-text:#656d7c;

  --aw-status-info-text:var(--aw-blue-700); --aw-status-success-text:var(--aw-green-700);
  --aw-status-warning-text:var(--aw-amber-700); --aw-status-danger-text:var(--aw-red-700);

  --aw-nav-surface:var(--aw-navy-900); --aw-nav-surface-deep:var(--aw-navy-950); --aw-nav-border:#1d3a6b;
  --aw-nav-text:#d6e4fa; --aw-nav-text-strong:#fff; --aw-nav-text-muted:#a8c2e6;
  --aw-nav-hover-surface:var(--aw-navy-800); --aw-nav-active-surface:#0d63e0; --aw-nav-active-text:#fff;

  --aw-font-sans:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --aw-fs-xs:.75rem; --aw-fs-sm:.8125rem; --aw-fs-md:.875rem; --aw-fs-lg:1rem;
  --aw-fs-h3:1.125rem; --aw-fs-h2:1.375rem; --aw-fs-h1:1.5rem;
  --aw-fw-medium:500; --aw-fw-semibold:600; --aw-fw-bold:700;
  --aw-s1:.25rem; --aw-s2:.5rem; --aw-s3:.75rem; --aw-s4:1rem; --aw-s5:1.5rem; --aw-s6:2rem;
  --aw-h-md:2.25rem; --aw-h-lg:2.5rem;
  --aw-r-sm:.375rem; --aw-r-md:.625rem; --aw-r-lg:.875rem; --aw-r-pill:999px;
  --aw-shadow-sm:0 1px 2px rgba(13,32,66,.05),0 5px 15px rgba(13,32,66,.04);
  --aw-sidebar-w:15rem; --aw-topbar-h:4.25rem;
  --aw-focus:var(--aw-blue-700);
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--aw-font-sans);font-size:var(--aw-fs-md);line-height:1.55;
  color:var(--aw-text);background:var(--aw-canvas);-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;line-height:1.2;font-weight:var(--aw-fw-semibold)}
:focus-visible{outline:2px solid var(--aw-focus);outline-offset:2px}

/* ---------- Shell ---------- */
.shell{min-height:100dvh;display:flex}
.sidebar{width:var(--aw-sidebar-w);flex:0 0 auto;
  background:linear-gradient(180deg,var(--aw-nav-surface),var(--aw-nav-surface-deep));
  color:var(--aw-nav-text);display:flex;flex-direction:column;padding:var(--aw-s4) var(--aw-s3);gap:var(--aw-s5)}
.sidebar .brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:var(--aw-fw-semibold);font-size:var(--aw-fs-lg);padding:var(--aw-s2) var(--aw-s2) 0}
.sidebar .brand .logo{width:34px;height:34px;border-radius:9px;background:var(--aw-blue-600);display:grid;place-items:center;font-weight:700;font-size:14px;color:#fff}
.sidebar .brand small{display:block;color:var(--aw-nav-text-muted);font-weight:400;font-size:var(--aw-fs-xs)}
.navgroup-title{padding:0 var(--aw-s3) var(--aw-s1);font-size:var(--aw-fs-xs);font-weight:var(--aw-fw-bold);
  letter-spacing:.08em;text-transform:uppercase;color:var(--aw-nav-text-muted)}
nav.side{display:flex;flex-direction:column;gap:var(--aw-s1)}
.navitem{display:flex;align-items:center;gap:10px;padding:var(--aw-s2) var(--aw-s3);border-radius:var(--aw-r-md);
  color:var(--aw-nav-text);text-decoration:none;font-size:var(--aw-fs-md);font-weight:var(--aw-fw-medium);position:relative;cursor:pointer}
.navitem .num{width:20px;height:20px;border-radius:6px;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:12px;font-weight:700}
.navitem:hover{background:var(--aw-nav-hover-surface);color:#fff}
.navitem.disabled{opacity:.45;pointer-events:none}
.navitem.active{background:var(--aw-nav-active-surface);color:#fff;font-weight:var(--aw-fw-semibold)}
.navitem.active::before{content:"";position:absolute;left:0;top:50%;translate:0 -50%;width:3px;height:60%;border-radius:0 4px 4px 0;background:#fff}
.sidebar-foot{margin-top:auto;color:var(--aw-nav-text-muted);font-size:var(--aw-fs-xs);padding:var(--aw-s2) var(--aw-s3)}

.col{flex:1;min-width:0;display:flex;flex-direction:column;min-height:100dvh}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--aw-s3);flex-wrap:wrap;
  min-height:var(--aw-topbar-h);padding:var(--aw-s2) var(--aw-s5);background:var(--aw-surface);
  border-bottom:1px solid var(--aw-border);position:sticky;top:0;z-index:100}
.kontext{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.kontext .bereich{font-size:var(--aw-fs-xs);font-weight:var(--aw-fw-semibold);letter-spacing:.06em;text-transform:uppercase;color:var(--aw-text-muted)}
.kontext .seite{font-size:var(--aw-fs-md);font-weight:var(--aw-fw-semibold)}
.content{padding:var(--aw-s5);max-width:78rem;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:var(--aw-s5)}
#step1{max-width:60rem;width:100%}

/* ---------- Split-Layout Schritt 2 ---------- */
.split{display:grid;grid-template-columns:22rem 1fr;gap:var(--aw-s5);align-items:start}
.split-left{display:flex;flex-direction:column;gap:var(--aw-s4);position:sticky;top:calc(var(--aw-topbar-h) + var(--aw-s5))}
.split-right{min-width:0}
@media(max-width:1100px){.split{grid-template-columns:1fr}.split-left{position:static}}

/* Datenkopf */
.datakopf{display:grid;grid-template-columns:auto 1fr;gap:6px var(--aw-s3);margin:0 0 var(--aw-s3)}
.datakopf dt{font-size:var(--aw-fs-xs);color:var(--aw-text-muted);font-weight:var(--aw-fw-semibold);text-transform:uppercase;letter-spacing:.04em;align-self:center}
.datakopf dd{margin:0;font-size:var(--aw-fs-sm);font-weight:var(--aw-fw-semibold);color:var(--aw-text)}

/* ---------- Vorschau (Papier) ---------- */
.preview-card{overflow:hidden}
.preview-head{display:flex;align-items:center;justify-content:space-between;gap:var(--aw-s3)}
.paper{background:var(--aw-surface);border:1px solid var(--aw-border-soft);border-radius:var(--aw-r-md);
  padding:0 0 var(--aw-s5);max-height:78vh;overflow:auto}
.paper-header{background:var(--aw-navy-900);color:#fff;padding:var(--aw-s4) var(--aw-s5)}
.paper-title{font-size:var(--aw-fs-h2);font-weight:var(--aw-fw-bold)}
.paper-sub{font-size:var(--aw-fs-sm);color:#c9d6ea;margin-top:2px}
.paper-info{display:grid;grid-template-columns:1fr 1fr;gap:var(--aw-s2) var(--aw-s4);
  background:var(--aw-primary-soft);padding:var(--aw-s3) var(--aw-s5);margin-bottom:var(--aw-s4)}
.paper-info .pi{display:flex;flex-direction:column;min-width:0}
.paper-info .pi span{font-size:var(--aw-fs-xs);color:var(--aw-text-muted);text-transform:uppercase;letter-spacing:.03em}
.paper-info .pi b{font-size:var(--aw-fs-sm);color:var(--aw-text)}
.paper > .p-topic,.paper > .p-section,.paper > .p-sub,.paper > .p-brick,.paper > .p-note,.paper > .p-empty{margin-left:var(--aw-s5);margin-right:var(--aw-s5)}
.p-topic{font-size:var(--aw-fs-lg);font-weight:var(--aw-fw-bold);color:var(--aw-primary-hover);
  border-bottom:2px solid var(--aw-primary);padding-bottom:5px;margin-top:var(--aw-s5)}
.p-section{font-size:var(--aw-fs-md);font-weight:var(--aw-fw-bold);color:var(--aw-text);margin-top:var(--aw-s4);
  padding-left:10px;border-left:3px solid var(--aw-green-600)}
.p-sub{font-size:var(--aw-fs-sm);font-weight:var(--aw-fw-bold);color:var(--aw-primary-hover);margin-top:var(--aw-s3)}
.p-brick{font-size:var(--aw-fs-sm);color:var(--aw-ink-700);line-height:1.6;margin-top:6px}
.p-brick p{margin:.35em 0}.p-brick a{color:var(--aw-link)}
.p-brick ul{margin:.35em 0;padding-left:1.2em}
.p-brick table{border-collapse:collapse;font-size:var(--aw-fs-xs);margin:.5em 0;width:auto}
.p-brick td,.p-brick th{border:1px solid var(--aw-border);padding:3px 7px}
.p-note{border-left:3px solid var(--aw-primary);background:var(--aw-surface-raised);border-radius:0 8px 8px 0;padding:8px 12px;margin-top:var(--aw-s3)}
.p-note.p1{border-left-color:var(--aw-red-700)}.p-note.p2{border-left-color:var(--aw-amber-700)}.p-note.p3{border-left-color:var(--aw-green-700)}
.p-note-h{font-weight:var(--aw-fw-bold);font-size:var(--aw-fs-sm);margin-bottom:3px}
.p-empty{color:var(--aw-text-muted);font-style:italic;padding:var(--aw-s5);text-align:center}

/* ---------- Card ---------- */
.card{background:var(--aw-surface);border:1px solid var(--aw-border);border-radius:var(--aw-r-lg);box-shadow:var(--aw-shadow-sm)}
.card-head{padding:var(--aw-s5) var(--aw-s5) 0}
.card-title{font-size:var(--aw-fs-h3);font-weight:var(--aw-fw-semibold);display:flex;align-items:center;gap:10px;margin:0}
.card-title .step{width:26px;height:26px;border-radius:7px;background:var(--aw-primary-soft);color:var(--aw-primary-hover);display:grid;place-items:center;font-size:13px;font-weight:700}
.card-desc{color:var(--aw-text-muted);font-size:var(--aw-fs-sm);margin:6px 0 0}
.card-body{padding:var(--aw-s4) var(--aw-s5) var(--aw-s5)}

/* ---------- Form ---------- */
.section-label{font-size:var(--aw-fs-xs);font-weight:var(--aw-fw-bold);text-transform:uppercase;letter-spacing:.06em;
  color:var(--aw-text-muted);margin:var(--aw-s5) 0 var(--aw-s3);padding-bottom:var(--aw-s2);border-bottom:1px solid var(--aw-border-soft)}
.section-label:first-child{margin-top:0}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--aw-s4)}
.field{display:flex;flex-direction:column;gap:var(--aw-s1);min-width:0}
.field.col2{grid-column:1 / -1}
.field .lbl{font-size:var(--aw-fs-sm);font-weight:var(--aw-fw-semibold);color:var(--aw-text)}
input,select{width:100%;min-height:var(--aw-h-lg);padding:0 var(--aw-s3);border:1px solid var(--aw-border-strong);
  border-radius:var(--aw-r-md);background:var(--aw-surface);color:var(--aw-text);font-family:inherit;font-size:var(--aw-fs-md)}
input::placeholder{color:var(--aw-text-subtle)}
input:hover,select:hover{border-color:var(--aw-primary)}
input:focus-visible,select:focus-visible{outline:2px solid var(--aw-focus);outline-offset:2px;border-color:var(--aw-primary)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--aw-s2);min-height:var(--aw-h-lg);
  padding:var(--aw-s2) var(--aw-s4);border:1px solid transparent;border-radius:var(--aw-r-md);font-family:inherit;
  font-size:var(--aw-fs-md);font-weight:var(--aw-fw-semibold);cursor:pointer;line-height:1;transition:background-color .18s,border-color .18s,color .18s}
.btn-primary{background:var(--aw-primary);border-color:var(--aw-primary);color:#fff}
.btn-primary:hover{background:var(--aw-primary-hover);border-color:var(--aw-primary-hover)}
.btn-primary:disabled{background:var(--aw-disabled-surface);border-color:var(--aw-disabled-border);color:var(--aw-disabled-text);cursor:not-allowed}
.btn-secondary{background:var(--aw-surface);border-color:var(--aw-border-strong);color:var(--aw-text)}
.btn-secondary:hover{background:var(--aw-surface-raised);border-color:var(--aw-primary);color:var(--aw-primary-hover)}
.btn-sm{min-height:var(--aw-h-md);padding:var(--aw-s1) var(--aw-s3);font-size:var(--aw-fs-sm)}
.actions{display:flex;align-items:center;gap:var(--aw-s4);margin-top:var(--aw-s5);flex-wrap:wrap}
.msg{font-size:var(--aw-fs-sm);color:var(--aw-text-muted)}
.msg.err{color:var(--aw-status-danger-text)}
.msg.ok{color:var(--aw-status-success-text)}

/* ---------- Toolbar ---------- */
.toolbar{display:flex;align-items:center;gap:var(--aw-s3);flex-wrap:wrap;margin:0 0 var(--aw-s4)}
.pill{font-size:var(--aw-fs-xs);color:var(--aw-status-info-text);background:var(--aw-primary-soft);padding:3px 10px;border-radius:var(--aw-r-pill);font-weight:var(--aw-fw-semibold)}
.linkbtn{background:none;border:none;color:var(--aw-link);font-size:var(--aw-fs-sm);cursor:pointer;font-weight:var(--aw-fw-medium);padding:4px 6px}
.linkbtn:hover{text-decoration:underline}

/* ---------- Topic / Section ---------- */
.topic{margin-bottom:var(--aw-s5);border-radius:var(--aw-r-md)}
.topic.dragging{opacity:.45}
.topic.drop-target{outline:2px dashed var(--aw-primary);outline-offset:4px}
.topic-head{font-size:var(--aw-fs-xs);font-weight:var(--aw-fw-bold);text-transform:uppercase;letter-spacing:.06em;
  color:var(--aw-text-muted);margin:0 0 var(--aw-s3);display:flex;align-items:center;gap:var(--aw-s2)}
.topic-label{white-space:nowrap}
.topic-head::after{content:"";flex:1;height:1px;background:var(--aw-border)}
.drag-handle{cursor:grab;border:none;background:none;color:var(--aw-text-subtle);font-size:15px;line-height:1;
  padding:2px 5px;border-radius:6px;letter-spacing:-2px}
.drag-handle:hover{color:var(--aw-primary);background:var(--aw-primary-soft)}
.drag-handle:active{cursor:grabbing}
.sec{border:1px solid var(--aw-border);border-radius:var(--aw-r-md);margin-bottom:var(--aw-s2);background:var(--aw-surface);overflow:hidden;transition:border-color .15s,box-shadow .15s}
.sec.on{border-color:var(--aw-primary);box-shadow:0 0 0 1px var(--aw-primary) inset}
.sec-head{display:flex;align-items:center;gap:var(--aw-s3);padding:var(--aw-s3)}
.sec-title{flex:1;font-weight:var(--aw-fw-semibold);font-size:var(--aw-fs-md);cursor:pointer}
.sec-count{font-size:var(--aw-fs-xs);font-weight:var(--aw-fw-semibold);color:var(--aw-text-muted);background:var(--aw-surface-raised);border:1px solid var(--aw-border-soft);padding:2px 9px;border-radius:var(--aw-r-pill);white-space:nowrap}
.sec.on .sec-count{background:var(--aw-primary-soft);color:var(--aw-status-info-text);border-color:transparent}
.caret{border:none;background:none;cursor:pointer;color:var(--aw-text-subtle);font-size:13px;padding:4px}
.caret:hover{color:var(--aw-text)}
.switch{position:relative;width:40px;height:22px;border-radius:var(--aw-r-pill);background:#c3ccd9;flex:0 0 auto;cursor:pointer;transition:background .15s;border:none;padding:0}
.sec.on .switch{background:var(--aw-primary)}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.sec.on .switch::after{left:20px}
.sec-body{display:none;padding:2px var(--aw-s4) var(--aw-s3);border-top:1px solid var(--aw-border-soft);background:var(--aw-surface-raised)}
.sec.open .sec-body{display:block}
.sub{margin:var(--aw-s3) 0}
.sub-name{font-size:var(--aw-fs-sm);font-weight:var(--aw-fw-bold);color:var(--aw-primary-hover);margin:0 0 4px}
.brick{font-size:var(--aw-fs-sm);color:var(--aw-ink-700);line-height:1.55}
.brick p{margin:.3em 0}.brick a{color:var(--aw-link)}
.brick table{border-collapse:collapse;font-size:var(--aw-fs-xs);margin:.4em 0}
.brick td,.brick th{border:1px solid var(--aw-border);padding:3px 7px}
.empty{color:var(--aw-text-muted);font-style:italic;padding:var(--aw-s2) 0}

/* ---------- Meldung ---------- */
.note{border-left:3px solid var(--aw-primary);background:var(--aw-surface);border-radius:0 8px 8px 0;padding:var(--aw-s2) var(--aw-s3);margin:var(--aw-s3) 0}
.note.p1{border-left-color:var(--aw-red-700)}.note.p2{border-left-color:var(--aw-amber-700)}.note.p3{border-left-color:var(--aw-green-700)}
.note h5{margin:0 0 3px;font-size:var(--aw-fs-md)}
.note .nmeta{font-size:var(--aw-fs-xs);color:var(--aw-text-muted);margin-bottom:5px}
.note .nbody{font-size:var(--aw-fs-sm);color:var(--aw-ink-700)}

@media(max-width:1023px){.sidebar{display:none}.content{padding:var(--aw-s4)}}
@media(max-width:640px){.grid{grid-template-columns:1fr}}