/* ============================================================
   SEGMENTE: ÜBERSICHT (so-*) — Einstieg über die Leiste, wie „Neue Unterhaltung“ im Chat.
   Regeln: Liste links, Vorschau rechts. Überfahren oder Fokus zeigt die Vorschau sofort,
   Klick wählt aus (Vorschau bleibt), Doppelklick oder „Laden“ öffnet das Segment im Segment-Builder.
   Die Vorschau zeigt Bedingungen in Worten, Kundenzahl, Zusammensetzung (alle Merkmale untereinander
   in einem eigenen Scroll-Bereich: zuerst die Merkmale der Filter, markiert mit „Filter“, mit ihren Ausprägungen bzw. Wertebändern, dann Kundentyp, Region,
   Kaufkanal, Gebäudeart, Umsatz, höchstens 6; der Bereich füllt die freie Höhe und scrollt selbst;
   ist ein Filter-Merkmal auf eine Ausprägung festgelegt, steht nur ein Hinweis), Ersteller, Datum und Verwendung.
   Aktionen „Laden“ und „Im Chat fragen“ stehen immer fest ganz unten in der Vorschau.
   ============================================================ */
.so-screen.active{display:flex;height:100%}
.so-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px;padding:16px;min-height:0}
.so-head{display:flex;align-items:center;gap:8px}
.so-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.so-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:12px}
.so-list{overflow:auto;min-height:0;display:block}
.so-hd,.so-row{flex:none}
.so-hd,.so-row{display:grid;grid-template-columns:minmax(0,1fr) 96px 92px;align-items:center;gap:10px;padding:0 14px}
.so-hd{position:sticky;top:0;z-index:1;height:36px;background:var(--gray-50);border-bottom:1px solid var(--border-2);font:var(--fw-semibold) var(--fs-12)/1 var(--font-sans);color:var(--text-2)}
.so-hd .num,.so-row .num{text-align:right}
.so-row{min-height:52px;border-bottom:1px solid var(--border-1);cursor:pointer}
.so-row:hover,.so-row.is-hover{background:var(--surface-hover)}
.so-row[aria-selected="true"]{background:var(--surface-selected);box-shadow:inset 3px 0 0 var(--blue-500)}
.so-row:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--blue-400)}
.so-n{display:flex;flex-direction:column;gap:3px;min-width:0}
.so-n b{font:var(--fw-medium) var(--fs-13)/1.3 var(--font-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.so-n span{font:var(--type-small);color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.so-row .num{font:var(--fw-regular) var(--fs-12)/1 var(--font-mono);font-variant-numeric:tabular-nums}
.so-row .date{font:var(--type-small);color:var(--text-3);text-align:right}
.so-prev{display:flex;flex-direction:column;overflow:hidden;min-height:0}
.so-prev > .so-prev__sec{flex:none}
.so-prev > .so-prev__grow{flex:1;min-height:0}
.so-prev__grow .so-comp{flex:1;min-height:0;max-height:none}
.so-prev > .so-prev__foot{margin-top:auto;border-top:1px solid var(--border-1);background:var(--gray-50)}
.so-prev__mode{font:var(--type-label-caps);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-3)}
.so-prev__sec{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border-1)}
.so-prev__sec:last-child{border-bottom:0}
.so-prev__title{font:var(--type-heading)}
.so-prev__meta{font:var(--type-small);color:var(--text-3)}
.so-conds{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.so-conds li{display:flex;gap:8px;align-items:flex-start;font:var(--type-body);color:var(--text-1)}
.so-conds li .sg-ic{margin-top:1px}
.so-stack{display:flex;gap:2px;height:14px}
.so-stack i{display:block;height:100%}
.so-stack i:first-child{border-radius:2px 0 0 2px}
.so-stack i:last-child{border-radius:0 4px 4px 0}
.so-leg{display:grid;grid-template-columns:auto 1fr auto auto;gap:4px 8px;align-items:center;font:var(--type-small);color:var(--text-2)}
.so-leg b{font:var(--fw-regular) 12px/1 var(--font-mono);color:var(--text-1);text-align:right;font-variant-numeric:tabular-nums}
.so-leg em{font-style:normal;color:var(--text-3);text-align:right;min-width:40px}
.so-actions{display:flex;gap:6px;flex-wrap:wrap}
.so-comp{max-height:340px;min-height:120px;overflow:auto;display:flex;flex-direction:column;border-radius:var(--radius-3);box-shadow:inset 0 0 0 1px var(--border-1)}
.so-comp__blk{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-top:1px solid var(--border-1)}
.so-comp__blk:first-child{border-top:0}
.so-comp__hd{display:flex;align-items:center;gap:6px;font:var(--type-card-title);color:var(--text-1)}
.so-comp__tag{height:16px;font-size:11px}
.so-empty{padding:40px 16px;text-align:center;color:var(--text-3)}
@media (max-width:1100px){.so-body{grid-template-columns:1fr}.so-prev{overflow:visible}.so-prev__grow .so-comp{max-height:340px}}
.ax-toast{position:fixed;right:24px;top:56px;z-index:50;display:flex;align-items:center;gap:10px;max-width:min(440px,calc(100vw - 32px));padding:10px 10px 10px 12px;border-radius:var(--radius-3);background:var(--gray-950);color:#fff;box-shadow:var(--elev-3);font:var(--type-body);transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.ax-toast.is-open{opacity:1;transform:none;pointer-events:auto}
.ax-toast svg{color:var(--green-400)}
.ax-toast .ax-btn{color:#fff;background:rgba(255,255,255,.1);box-shadow:none}
.ax-toast .ax-btn:hover{background:rgba(255,255,255,.2)}

@media (max-width:720px){#chatPanel{display:none!important}.crumb-dim,.user>span{display:none}.grid-2,.grid-4{grid-template-columns:1fr}}