/* V17: extrahiert aus index.html (unverändert). Dialoge/AI/Konto */
.plans-modal.wide{max-width:860px}
.plans-sub{text-align:center;color:var(--text-muted);font-size:13px;margin:2px 0 4px}
.billing{display:flex;justify-content:center;margin:18px 0 22px;position:relative}
.seg2{position:relative;display:inline-flex;background:var(--surface-1);border:1px solid var(--border);border-radius:999px;padding:4px}
.seg2 button{position:relative;z-index:2;border:0;background:transparent;color:var(--text-muted);font-size:12.5px;font-weight:600;padding:8px 18px;border-radius:999px;cursor:pointer;transition:color .2s;white-space:nowrap}
.seg2 button.on{color:var(--text)}
.knob2{position:absolute;z-index:1;top:4px;bottom:4px;border-radius:999px;background:transparent;border:1.5px solid var(--accent);box-sizing:border-box;transition:left .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1)}
.save-badge{position:absolute;top:-13px;right:calc(50% - 148px);background:var(--accent);color:#160a02;font-size:10px;font-weight:800;letter-spacing:.02em;padding:3px 9px;border-radius:999px;box-shadow:0 4px 14px rgba(255,106,26,.35);z-index:3}
.plans2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.plans2.solo{grid-template-columns:minmax(0,400px);justify-content:center;max-width:420px;margin:0 auto}
.plan2{position:relative;background:var(--surface-1);border:1px solid var(--border);border-radius:16px;padding:22px 20px;display:flex;flex-direction:column}
.plan2.pro{border-color:rgba(255,106,26,.5);box-shadow:0 0 0 1px rgba(255,106,26,.22),0 16px 44px -20px rgba(255,106,26,.45)}
.p2coins{margin:8px 0 12px;font-size:13.5px;color:var(--accent);font-weight:700;display:flex;align-items:center;gap:6px}
.p2coins b{color:var(--accent)}
.plan2 .ribbon{position:absolute;top:-11px;right:16px;display:inline-flex;align-items:center;gap:5px;background:var(--accent);color:#160a02;font-size:10.5px;font-weight:800;letter-spacing:.04em;padding:5px 12px;border-radius:999px;white-space:nowrap}
.plan2 .ribbon svg{width:12px;height:12px;fill:#160a02}
.p2head{display:flex;align-items:center;gap:11px}
.p2ico{position:relative;width:38px;height:38px;flex:none;display:grid;place-items:center}
.p2ico svg{width:38px;height:38px;stroke:var(--accent);fill:var(--accent-soft)}
.p2ico b{position:absolute;font-size:15px;font-weight:800;color:var(--accent)}
.plan2 .p2name{font-size:17px;font-weight:800}
.plan2 .p2tag{color:var(--text-muted);font-size:12px;margin-top:4px;min-height:16px;line-height:1.35}
.plan2 .p2price-row{display:flex;align-items:baseline;gap:8px;margin-top:16px;flex-wrap:wrap}
.plan2 .p2price{font-size:36px;font-weight:800;letter-spacing:-.02em;line-height:1}
.plan2 .p2per{color:var(--text-muted);font-size:13px;font-weight:500}
.plan2 .p2old{color:var(--text-muted);opacity:.6;text-decoration:line-through;font-size:15px;font-weight:600}
.plan2 .p2sub{min-height:17px;margin-top:8px;font-size:12px;color:var(--accent);font-weight:600}
.plan2 .p2cta{margin-top:18px;height:44px;border-radius:10px;border:0;font-size:13.5px;font-weight:700;cursor:pointer;width:100%;transition:transform .1s,background .2s}
.plan2 .p2cta:active{transform:translateY(1px)}
.plan2 .p2cta.buy{background:var(--accent);color:#0a1a06}
.plan2 .p2cta.buy:hover{background:var(--accent-hover)}
.plan2 .p2cta.ghost{background:transparent;border:1px solid var(--border-strong);color:var(--text-primary)}
.plan2 .p2cta.cur{background:var(--surface-2);border:1px solid var(--border);color:var(--text-muted);cursor:default}
.plan2 .p2sec{margin-top:20px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:700}
.plan2 ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.plan2 li{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;line-height:1.4}
.plan2 li svg{width:16px;height:16px;flex:none;margin-top:1px;stroke:var(--accent)}
.plan2 li.off{color:var(--text-muted);opacity:.7}
.plan2 li.off svg{stroke:var(--text-muted)}
/* Vergleichstabelle */
.plans-compare{margin-top:26px}
.pc-title{text-align:center;font-size:15px;font-weight:800;color:var(--text);margin-bottom:14px}
.pc-grid{display:grid;grid-template-columns:1fr 120px 120px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface-1)}
.pc-grid>div{padding:12px 16px;font-size:12.5px;display:flex;align-items:center;border-top:1px solid var(--border);min-height:20px}
.pc-grid .pc-c{justify-content:center;text-align:center}
.pc-grid .pc-h{border-top:0;color:var(--text-muted);font-weight:700;font-size:12px;text-transform:none}
.pc-grid .pc-h.pc-pro{color:var(--accent)}
.pc-grid .pc-feat{gap:10px;color:var(--text)}
.pc-ico{width:16px;height:16px;flex:none;stroke:var(--text-muted);fill:none}
.pc-check{width:17px;height:17px;stroke:var(--accent);fill:none}
.pc-val-pro{color:var(--accent);font-weight:700}
/* Vertrauens-Zeile (4 Punkte mit Icon) */
.trust{margin-top:26px}
.tgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:var(--surface-1);border:1px solid var(--border);border-radius:14px;padding:16px}
.titem{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text-muted);line-height:1.35}
.titem b{color:var(--text);font-weight:700}
.titem svg{width:22px;height:22px;flex:none;stroke:var(--accent)}
.pays{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:18px}
.pay{background:#fff;border:1px solid var(--border);border-radius:8px;padding:7px 13px;font-size:11.5px;font-weight:800;color:#1a1d21;letter-spacing:.02em;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.tnote{text-align:center;color:var(--text-muted);opacity:.8;font-size:11px;margin-top:16px;line-height:1.5}
@media(max-width:680px){ .plans2{grid-template-columns:1fr} .plans-modal.wide{max-width:460px} .save-badge{right:calc(50% - 140px)}
  .tgrid{grid-template-columns:1fr 1fr} .pc-grid{grid-template-columns:1fr 70px 70px} .pc-grid>div{padding:10px 12px;font-size:12px} }
#manageBody{display:flex;flex-direction:column;gap:14px}
.mng-flash{background:var(--accent-soft);border:1px solid var(--accent);color:var(--text-primary);border-radius:10px;padding:11px 14px;font-size:13px;line-height:1.45}
.mng-card{border:1px solid var(--border,#2a2a2a);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.mng-card.cur{border-color:var(--accent);background:rgba(255,106,26,.06)}
.mng-top{display:flex;align-items:center;gap:10px}
.mng-name{font-weight:700;font-size:15px}
.mng-badge{margin-left:auto;background:var(--accent,#6bff46);color:#0a0a0a;font-size:10.5px;font-weight:800;letter-spacing:.03em;padding:3px 9px;border-radius:999px;text-transform:uppercase}
.mng-price{font-size:13px;color:var(--muted,#8a8a8a)}
.mng-meta{font-size:12.5px;color:var(--muted,#8a8a8a)}
.mng-meta.warn{color:#e0a03a}
.mng-up{border:1px dashed var(--border,#2a2a2a);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.mng-up .t{font-weight:700;font-size:13.5px}
.mng-up .s{font-size:12px;color:var(--muted,#8a8a8a)}
.mng-up button{align-self:flex-start;background:var(--accent,#6bff46);color:#0a0a0a;border:none;border-radius:8px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer}
.mng-up button:disabled{opacity:.6;cursor:default}
.mng-switch{border:1px solid var(--border,#2a2a2a);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.mng-switch-h{font-weight:700;font-size:13.5px}
.mng-bill2{display:inline-flex;align-self:flex-start;background:var(--surface-1);border:1px solid var(--border);border-radius:999px;padding:3px}
.mng-bill2 button{border:0;background:transparent;color:var(--text-muted);font-size:12px;font-weight:600;padding:6px 14px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:.15s}
.mng-bill2 button.on{background:var(--accent);color:#160a02}
.mng-switch-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mng-plan2{display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:var(--surface-1);border:1px solid var(--border);border-radius:10px;padding:12px 14px;cursor:pointer;transition:.15s;text-align:left}
.mng-plan2:hover{border-color:var(--accent)}
.mng-plan2.cur{border-color:var(--accent);opacity:.7;cursor:default}
.mng-plan2 .mp-name{font-weight:700;font-size:14px;color:var(--text)}
.mng-plan2 .mp-price{font-size:12px;color:var(--text-muted)}
.mng-plan2 .mp-go{margin-top:6px;font-size:11.5px;font-weight:700;color:var(--accent)}
.mng-plan2.cur .mp-go{color:var(--text-muted)}
.mng-switch-note{font-size:11.5px;color:var(--text-muted);line-height:1.4}
.mng-actions{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.mng-cancel{background:none;border:1px solid var(--border,#2a2a2a);color:#e06a5a;border-radius:8px;padding:10px;font-size:13px;font-weight:600;cursor:pointer}
.mng-cancel:disabled{opacity:.6;cursor:default}
.mng-resume{background:var(--accent,#6bff46);color:#0a0a0a;border:none;border-radius:8px;padding:10px;font-size:13px;font-weight:700;cursor:pointer}
.mng-portal{background:none;border:none;color:var(--muted,#8a8a8a);font-size:12px;text-decoration:underline;cursor:pointer;padding:4px;align-self:center}
#invoicesList{display:flex;flex-direction:column;gap:8px}
.inv-empty{color:var(--muted,#8a8a8a);font-size:13px;padding:16px 0;text-align:center}
.inv-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--border,#2a2a2a);border-radius:8px}
.inv-main{display:flex;flex-direction:column;flex:1;min-width:0}
.inv-num{font-weight:600;font-size:13px}
.inv-date{font-size:12px;color:var(--muted,#8a8a8a)}
.inv-amt{font-variant-numeric:tabular-nums;font-size:13px;white-space:nowrap}
.inv-dl{background:var(--accent,#6bff46);color:#0a0a0a;border:none;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;cursor:pointer}
.inv-dl:disabled{opacity:.6;cursor:default}

/* V18D.1-A2: Dokumentwechsel-Fenster. Dunkel wie die uebrigen Refloxy-Dialoge; die Farben kommen
   ausschliesslich aus den Tokens, damit der Kontrast derselbe ist wie in den geprueften Dialogen. */
.doc-modal .modal{max-width:420px}
.doc-modal .mb{color:var(--text-primary)}
.doc-modal .dm-text{margin:0;font-size:13px;line-height:1.6;color:var(--text-secondary)}
.doc-modal .dm-doc{display:block;margin-top:8px;font-weight:600;color:var(--text-primary);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-modal .dm-field{margin-top:14px;display:flex;flex-direction:column;gap:6px;min-width:0}
/* V18D.2: Ohne diese Zeile ueberschreibt `display:flex` das `hidden`-Attribut. Das Namensfeld
   gehoert NUR zur Namensstufe; auf der Stufe „Ungespeicherte Aenderungen" stand es sichtbar da,
   obwohl `_stufeDirty()` es ausblendet – die zweite Stufe wirkte dadurch wie eine Wiederholung.
   Dieselbe Falle ist in app.css bei `.line-hud[hidden]` schon einmal aufgetreten. */
.doc-modal .dm-field[hidden]{display:none}
.doc-modal .dm-field label{font-size:12px;color:var(--text-secondary)}
.doc-modal .dm-field input{height:34px;min-width:0;width:100%;box-sizing:border-box;padding:0 10px;
  border-radius:8px;border:1px solid var(--border-strong);background:var(--surface-1);
  color:var(--text-primary);font-size:13.5px}
.doc-modal .dm-field input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.doc-modal .dm-field input.bad{border-color:var(--danger)}
.doc-modal .dm-msg{margin:10px 0 0;font-size:12.5px;color:var(--danger);line-height:1.5}
/* V18D.3-2: Die mitbetroffenen Schritte in der Rueckfrage – dieselbe Liste, die die Zeitleiste
   rot markiert. Lange Historien bleiben erreichbar, das Fenster waechst nicht ins Uferlose. */
.doc-modal .dm-list{margin:12px 0 0;padding:0 0 0 18px;max-height:180px;overflow-y:auto;
  font-size:12.5px;line-height:1.7;color:var(--text-primary)}
.doc-modal .dm-list[hidden]{display:none}
.doc-modal .dm-list li::marker{color:var(--danger)}
.doc-modal .mf{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;
  padding:14px 18px;border-top:1px solid var(--border)}
.doc-modal .mf button{height:34px;padding:0 14px;border-radius:8px;font-size:13px;font-weight:600;
  border:1px solid var(--border-strong);background:var(--surface-1);color:var(--text-primary);cursor:pointer}
.doc-modal .mf button:hover{background:var(--surface-hover)}
.doc-modal .mf button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.doc-modal .mf button.primary{background:var(--accent);border-color:var(--accent);color:#160a02}
.doc-modal .mf button.primary:hover{filter:brightness(1.08)}

/* =====================================================================
   V20: EXPORT-DIALOG („Als Netz speichern" + „Speichern unter").
   Aufbau und Reihenfolge folgen dem Bedienweg aus dem Video vom 31.08:
   erst WAS und WIE FEIN, dann WOHIN. Die Zeilen sind bewusst gleich
   aufgebaut wie im Extrusions-/Drehdialog (Beschriftung links, Wert rechts).
   ===================================================================== */
.modal-wide{max-width:520px}
.ex-sec{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--text-muted);margin:16px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.ex-sec:first-child{margin-top:0}
.ex-row{display:flex;align-items:center;gap:12px;padding:7px 0;min-height:32px}
.ex-row>label{flex:0 0 145px;color:var(--text-secondary);font-size:12.5px}
.ex-row .ep-sel{flex:1;min-width:0}
.ex-row.ex-col{flex-direction:column;align-items:stretch;gap:5px}
.ex-row.ex-col>label{flex:none}
.ex-val{flex:1;color:var(--text-primary);font-variant-numeric:tabular-nums;font-weight:600}
.ex-text{width:100%;box-sizing:border-box;background:var(--surface-1);border:1px solid var(--border-strong);
  border-radius:7px;color:var(--text-primary);padding:7px 9px;font-size:12.5px}
.ex-text[readonly]{color:var(--text-muted)}
.ex-slider{flex:1;display:grid;grid-template-columns:78px 22px 1fr;align-items:center;gap:6px;min-width:0}
.ex-slider input[type=number]{background:var(--surface-1);border:1px solid var(--border-strong);border-radius:7px;
  color:var(--text-primary);padding:6px 8px;font-size:12.5px;width:100%;box-sizing:border-box;
  font-variant-numeric:tabular-nums}
.ex-slider .ex-unit{color:var(--text-muted);font-size:12px}
.ex-slider input[type=range]{width:100%}
.ex-objs{flex:1;max-height:118px;overflow-y:auto;border:1px solid var(--border);border-radius:8px;padding:6px 8px}
.ex-objs label{display:flex;align-items:center;gap:8px;padding:3px 0;color:var(--text-primary);font-size:12.5px}
.ex-objs .ex-leer{color:var(--text-muted);font-size:12px;padding:3px 0}
.ex-hint{color:var(--text-muted);font-size:11.5px;line-height:1.5;margin:10px 0 0}
.ex-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}
.ex-actions button{border-radius:8px;padding:8px 16px;font-size:12.5px;font-weight:600;cursor:pointer;border:1px solid var(--border-strong)}
.ex-actions .btn-ghost{background:var(--surface-1);color:var(--text-secondary)}
.ex-actions .btn-ghost:hover{background:var(--surface-2);color:var(--text-primary)}
.ex-actions .btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
.ex-actions .btn-primary:hover{filter:brightness(1.08)}
.ex-actions .btn-primary:disabled{opacity:.45;cursor:default;filter:none}