/* ============================================================
   Retro Nerd Redaktionszentrale – zentrales Stylesheet
   Die Abschnitts-Reihenfolge entspricht der früheren Lade-
   Reihenfolge (externe Datei, dann drei Inline-Blöcke) und
   darf nicht vertauscht werden, da spätere Abschnitte frühere
   gezielt überschreiben (Kaskade).
   1) Pipeline-Board & Edit-Modal
   2) Basis-Layout
   3) Operate-Redesign-Overrides
   4) Einstellungs-Seite
   5) Async-Aktionen (Spinner)
   6) Editor-Dichte (kompakter Detail-Editor)
   7) Inspirationen-Redesign, Toasts, Meme-Editor
   ============================================================ */

/* ---- 1) Pipeline-Board & Edit-Modal ---- */
.pipeline-board-section{margin-top:0}.kanban-board{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:14px;align-items:start;overflow-x:auto;padding:2px 2px 20px;scrollbar-width:thin}.kanban-column{min-width:0;border:1px solid var(--line);border-radius:12px;background:rgba(var(--tint),.018);overflow:hidden}.kanban-column-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--line)}.kanban-column-head h2{margin:0;font-size:15px;font-weight:590;letter-spacing:-.15px}.kanban-column-head p{margin:3px 0 0;color:var(--muted);font-size:12px}.kanban-column-head>span{min-width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:12px}.kanban-stack{display:grid;gap:10px;padding:10px}.kanban-card{display:block;overflow:hidden;border:1px solid var(--line);border-radius:9px;background:rgba(var(--tint),.025);transition:background .16s,border-color .16s,transform .16s}.kanban-card:hover{transform:translateY(-2px);border-color:var(--line2);background:rgba(var(--tint),.045)}.kanban-card:focus-visible{outline:2px solid var(--acid);outline-offset:2px}.kanban-card-media{position:relative;aspect-ratio:16/9;background:var(--sunken);overflow:hidden}.kanban-card-media:after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,rgba(0,0,0,.4));pointer-events:none}.kanban-card-media img{display:block;width:100%;height:100%;object-fit:cover}.kanban-card-media>span{height:100%;display:grid;place-items:center;color:var(--faint);font-size:12px}.kanban-card-body{padding:13px}.kanban-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.kanban-card-top>span{color:var(--faint);font-size:11px}.kanban-card-body>strong{display:block;font-size:15px;font-weight:590;line-height:1.35}.kanban-card-body>p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:5px 0 14px;color:var(--muted);font-size:13px;line-height:1.45}.kanban-card-body footer{display:flex;justify-content:space-between;gap:8px;color:var(--faint);font-size:11px}.kanban-card-body footer span:last-child{color:var(--soft);text-align:right}.kanban-empty{padding:28px 14px;text-align:center;color:var(--faint);font-size:13px}
.edit-modal{width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:clamp(12px,2vw,28px);border:0;background:transparent;color:var(--text);overflow:auto}.edit-modal::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(8px)}.edit-modal-panel{width:min(1180px,100%);margin:auto;border:1px solid var(--line2);border-radius:14px;background:var(--field);box-shadow:0 32px 100px rgba(0,0,0,.65);overflow:hidden}.edit-modal-header{position:sticky;top:0;z-index:4;min-height:78px;display:flex;align-items:center;justify-content:flex-end;gap:18px;padding:16px 20px;border-bottom:1px solid var(--line);background:rgba(16,16,20,.96);backdrop-filter:blur(18px)}.edit-modal-header-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.edit-modal-header-actions form{margin:0}.modal-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:rgba(var(--tint),.03);font-size:24px;line-height:1}.modal-close:hover{background:rgba(var(--tint),.08)}.edit-modal-layout{display:grid;grid-template-columns:minmax(350px,.9fr) minmax(480px,1.1fr);min-height:650px}.edit-modal-media{padding:20px;border-right:1px solid var(--line);background:#0b0b0e}.modal-preview{position:relative;width:100%;margin:0 0 16px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--sunken)}
/* Bild-Menü oben rechts auf der Vorschau: ersetzen oder herunterladen.
   Ersetzen daneben ist absichtlich kein Klick mehr auf das ganze Bild --
   der Text darüber lässt sich jetzt direkt anfassen. */
.preview-menu{position:absolute;top:8px;right:8px;z-index:4}
.preview-menu>summary{width:32px;height:32px;display:grid;place-items:center;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:16px;line-height:1;cursor:pointer;list-style:none;border:1px solid rgba(var(--tint),.35)}
.preview-menu>summary::-webkit-details-marker{display:none}
.preview-menu>summary:hover{background:rgba(0,0,0,.7)}
.preview-menu-body{position:absolute;right:0;top:calc(100% + 6px);min-width:180px;display:grid;padding:5px;border:1px solid var(--line2);border-radius:9px;background:var(--field);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.preview-menu-body .menu-item{text-decoration:none}.modal-preview img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px}.edit-modal-copy{min-width:0;padding:24px;overflow:auto}.modal-copy-intro>span{color:var(--pink);font:600 11px ui-monospace,monospace;letter-spacing:.12em}.modal-copy-intro h3{margin:5px 0 4px;font-size:22px;font-weight:590}.modal-copy-intro p{margin:0;color:var(--muted);font-size:14px}.copy-editor{display:grid;gap:16px;margin-top:22px}.caption-editor{min-height:220px}.hashtags-editor{min-height:86px}.readonly-copy{margin-top:22px;padding:18px;border:1px solid var(--line);border-radius:9px;background:rgba(var(--tint),.02)}.readonly-copy>strong{font-size:17px}.readonly-copy p{white-space:pre-wrap;color:var(--soft);font-size:14px}.modal-disclosure{margin-top:16px;border:1px solid var(--line);border-radius:9px;background:rgba(var(--tint),.018);overflow:hidden}.modal-disclosure>summary{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;list-style:none;cursor:pointer}.modal-disclosure>summary::-webkit-details-marker{display:none}.modal-disclosure>summary strong{display:block;font-size:14px}.modal-disclosure>summary small{display:block;margin-top:2px;color:var(--muted);font-size:12px}.modal-disclosure>summary>span:last-child{color:var(--accent-text);font-size:20px;transition:transform .16s}.modal-disclosure[open]>summary>span:last-child{transform:rotate(90deg)}.modal-disclosure-body{padding:15px;border-top:1px solid var(--line)}.modal-compact-grid{margin:14px 0}.modal-actions{margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}.modal-safety{margin-bottom:14px;padding:13px 15px;border:1px solid var(--line);border-radius:8px;background:rgba(var(--tint),.025)}.modal-safety.warn{border-color:rgba(255,179,46,.35);background:rgba(255,179,46,.06)}
.modal-safety.warn a{color:var(--accent-text)}
.modal-safety.success{border-color:rgba(57,217,138,.25);background:rgba(57,217,138,.05)}.modal-safety strong{font-size:14px}.modal-safety p{margin:3px 0 0;color:var(--muted);font-size:13px}.reject-drawer{flex:1;margin:0!important}.reject-drawer>summary{min-height:44px!important}.edit-modal-copy>.modal-disclosure{margin-top:20px}
body:has(.edit-modal[open]),body:has(.form-modal[open]){overflow:hidden}
@media(max-width:1180px){.kanban-board{grid-template-columns:repeat(4,minmax(270px,1fr))}.edit-modal-layout{grid-template-columns:minmax(310px,.82fr) minmax(430px,1.18fr)}}
@media(max-width:820px){.edit-modal{padding:0}.edit-modal-panel{border-radius:0;border-left:0;border-right:0;min-height:100%}.edit-modal-header{padding:14px 16px}.edit-modal-layout{grid-template-columns:1fr}.edit-modal-media{border-right:0;border-bottom:1px solid var(--line);padding:16px}.edit-modal-copy{padding:20px}.kanban-board{margin-right:-14px;padding-right:14px}}
@media(max-width:520px){.kanban-board{grid-template-columns:repeat(4,minmax(82vw,1fr))}.edit-modal-copy{padding:18px 16px}.form-grid{grid-template-columns:1fr}.caption-editor{min-height:180px}}

.pipeline-tabs{display:flex;gap:6px;margin-bottom:18px;padding:5px;border:1px solid var(--line);border-radius:10px;background:rgba(var(--tint),.018);overflow-x:auto}.pipeline-tabs a{display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:9px 15px;border-radius:7px;color:var(--muted);font-size:14px;font-weight:600;white-space:nowrap}.pipeline-tabs a:hover{background:rgba(var(--tint),.035);color:var(--soft)}.pipeline-tabs a.active{background:var(--raised);color:var(--text);box-shadow:inset 0 -2px var(--acid)}.pipeline-tabs b{min-width:24px;padding:2px 7px;border:1px solid var(--line2);border-radius:999px;color:var(--soft);font-size:11px;text-align:center}.kanban-board{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));overflow:visible}.kanban-empty{grid-column:1/-1;border:1px dashed var(--line);border-radius:10px}
@media(max-width:620px){.pipeline-tabs a{flex:1 0 auto;padding-inline:12px}.kanban-board{grid-template-columns:1fr}.kanban-board{margin-right:0;padding-right:2px}}

/* ---- 2) Basis-Layout ---- */
:root{--bg:#08090a;--side:#0d0e11;--panel:#111216;--raised:#17181d;--hover:#1d1e24;--line:rgba(var(--tint),.075);--line2:rgba(var(--tint),.13);--text:#f7f8f8;--soft:#d0d2d7;--muted:#858993;--faint:#5b5f68;--acid:#c8ff3d;--pink:#ff3b70;--green:#39d98a;--orange:#ffad42;--blue:#73a7ff;--r:10px;--shadow:0 20px 60px rgba(0,0,0,.34)}
*{box-sizing:border-box}html{color-scheme:dark;scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,Avenir,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-feature-settings:"cv01","ss03"}button,input,textarea{font:inherit}button,a,summary{touch-action:manipulation}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin-top:0}button{color:inherit}.shell{display:grid;grid-template-columns:226px minmax(0,1fr);min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;padding:18px 13px;background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:30}.logo{display:flex;align-items:center;gap:11px;padding:5px 8px 21px}.logo-mark{width:35px;height:35px;display:grid;place-items:center;border:2px solid var(--pink);box-shadow:3px 3px 0 var(--acid);font:900 13px Impact,"Arial Black",sans-serif;letter-spacing:.03em}.logo strong{display:block;font-size:13px;letter-spacing:.08em}.logo small{color:var(--muted);font-size:10px}.nav-label{padding:17px 10px 7px;color:var(--faint);font-size:9px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.nav{display:grid;gap:2px}.nav a{display:flex;align-items:center;gap:10px;min-height:39px;padding:8px 10px;border-radius:7px;color:var(--muted);font-size:13px;font-weight:520}.nav a:hover{background:rgba(var(--tint),.035);color:var(--soft)}.nav a.active{background:rgba(200,255,61,.08);color:var(--text)}.nav a.active .ico{color:var(--accent-text)}.ico{width:18px;text-align:center;color:var(--faint);font:12px ui-monospace,monospace}.nav .count{margin-left:auto;min-width:20px;padding:1px 6px;border:1px solid var(--line);border-radius:999px;text-align:center;color:var(--muted);font-size:10px}.account{margin-top:auto;padding:13px 10px;border-top:1px solid var(--line);display:flex;gap:9px;align-items:center}.avatar{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,var(--pink),#7c4dff);font-size:10px;font-weight:800}.account strong{display:block;font-size:11px}.account small{color:var(--muted);font-size:10px}.mobile-toggle{display:none}
.main{min-width:0}.topbar{position:sticky;top:0;z-index:20;height:64px;padding:0 clamp(18px,3vw,40px);display:flex;align-items:center;gap:16px;background:var(--topbar);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.crumb{color:var(--muted);font-size:12px}.crumb b{color:var(--soft);font-weight:550}.top-actions{margin-left:auto;display:flex;align-items:center;gap:9px}.health-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(57,217,138,.1)}.topbar:has(.top-actions:empty){height:0;border:0;background:transparent;backdrop-filter:none}.workspace{max-width:1580px;margin:auto;padding:30px clamp(18px,3vw,40px) 80px}.flash{position:relative;margin-bottom:18px;padding:12px 15px 12px 42px;border:1px solid var(--flash-line);border-radius:8px;background:var(--flash-bg);color:var(--flash-text)}.flash:before{content:"✓";position:absolute;left:15px;color:var(--accent-text);font-weight:800}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:25px}.overline{color:var(--pink);font:700 10px/1 ui-monospace,monospace;letter-spacing:.13em;text-transform:uppercase}.page-head h1{margin:7px 0 4px;font-size:clamp(27px,3vw,38px);line-height:1.04;letter-spacing:-.8px;font-weight:590}.page-head p{margin:0;color:var(--muted);font-size:13px}.date-chip{padding:8px 11px;border:1px solid var(--line);border-radius:7px;color:var(--muted);font:11px ui-monospace,monospace}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:10px;margin-bottom:30px}.kpi{position:relative;overflow:hidden;min-height:112px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:rgba(var(--tint),.018)}.kpi:after{content:"";position:absolute;inset:auto -20px -45px auto;width:100px;height:100px;border-radius:50%;background:var(--glow,var(--acid));opacity:.045;filter:blur(2px)}.kpi-top{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.kpi-icon{font:12px ui-monospace,monospace;color:var(--accent,var(--acid))}.kpi b{display:block;margin-top:14px;font-size:29px;line-height:1;font-weight:550;letter-spacing:-1px}.kpi small{display:block;margin-top:7px;color:var(--faint);font-size:10px}
.section{scroll-margin-top:82px;margin-top:34px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:13px}.section-head h2{margin:0;font-size:17px;font-weight:570;letter-spacing:-.2px}.section-head p{margin:3px 0 0;color:var(--muted);font-size:11px}.panel{border:1px solid var(--line);border-radius:var(--r);background:rgba(var(--tint),.018);overflow:hidden}.panel-head{min-height:54px;padding:11px 14px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line)}.panel-head h3{margin:0;font-size:12px;font-weight:570}.panel-head .spacer{margin-left:auto}.filters{display:flex;gap:5px;overflow:auto}.filter{padding:6px 9px;border:1px solid transparent;border-radius:6px;color:var(--muted);font-size:10px;white-space:nowrap}.filter:hover{color:var(--soft);background:rgba(var(--tint),.03)}.filter.active{border-color:var(--line2);background:rgba(var(--tint),.04);color:var(--text)}
.pipeline-list{display:grid}.post-row{display:grid;grid-template-columns:44px minmax(160px,1.7fr) minmax(100px,.8fr) minmax(120px,.8fr) auto;align-items:center;gap:13px;padding:10px 14px;border-bottom:1px solid var(--line);transition:.15s}.post-row:last-child{border-bottom:0}.post-row:hover,.post-row.selected{background:rgba(var(--tint),.035)}.post-row.selected{box-shadow:inset 2px 0 var(--acid)}.thumb{width:40px;height:50px;border-radius:4px;object-fit:cover;background:var(--sunken)}.post-title{min-width:0}.post-title strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:550}.post-title small,.cell-meta{color:var(--muted);font-size:10px}.status{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:4px 7px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:9px;font-weight:600}.status i{width:5px;height:5px;border-radius:50%;background:currentColor}.status.review{color:var(--orange)}.status.approved{color:var(--green)}.status.scheduled{color:var(--blue)}.status.live{color:var(--accent-text)}.status.rejected{color:var(--pink)}.open-arrow{color:var(--faint);font-size:16px}.empty-row{padding:28px;text-align:center;color:var(--muted)}
.studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,410px);gap:16px;align-items:start}.studio-main{min-width:0}.studio-header{padding:18px 19px;border-bottom:1px solid var(--line)}.studio-header-top{display:flex;gap:12px;justify-content:space-between;align-items:start}.studio-header h2{max-width:820px;margin:6px 0 4px;font-size:clamp(20px,2vw,28px);line-height:1.12;letter-spacing:-.45px;font-weight:570}.meta-line{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:10px}.meta-line span:not(:last-child):after{content:"·";margin-left:8px}.stagebar{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px}.stage{position:relative;padding-top:11px;border-top:2px solid var(--line);color:var(--faint);font-size:9px}.stage.done{border-color:var(--accent-text);color:var(--soft)}.stage.current{border-color:var(--pink);color:var(--text)}.stage:before{content:"";position:absolute;top:-5px;left:0;width:8px;height:8px;border-radius:50%;background:var(--panel);border:2px solid currentColor}
.studio-block{padding:18px 19px;border-bottom:1px solid var(--line)}.studio-block:last-child{border-bottom:0}.block-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}.block-head h3{margin:0;font-size:12px;font-weight:570}.hint{color:var(--muted);font-size:10px}
details.drawer{margin-top:11px;border:1px solid var(--line);border-radius:7px;background:rgba(var(--tint),.015)}details.drawer>summary{display:flex;justify-content:space-between;align-items:center;min-height:42px;padding:9px 12px;list-style:none;cursor:pointer;font-size:11px;font-weight:550}details.drawer>summary::-webkit-details-marker{display:none}details.drawer>summary:after{content:"+";color:var(--accent-text);font-size:17px}details.drawer[open]>summary:after{content:"−"}.drawer-body{padding:13px;border-top:1px solid var(--line)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field{display:grid;gap:5px}.field.full{grid-column:1/-1}.field[hidden]{display:none}label{color:var(--muted);font-size:10px}input[type=text],input[type=url],input[type=datetime-local],textarea,select{width:100%;border:1px solid var(--line);border-radius:6px;background:var(--field);color:var(--text);padding:9px 10px;outline:0}input:focus,textarea:focus,select:focus{border-color:rgba(200,255,61,.65);box-shadow:0 0 0 3px rgba(200,255,61,.06)}textarea{min-height:82px;resize:vertical}input[type=file]{max-width:100%;color:var(--muted);font-size:10px}input[type=range]{width:100%;accent-color:var(--accent-text)}.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}.image-swap-summary{cursor:pointer}.rights-check{display:flex;gap:8px;align-items:flex-start;margin:10px 0;color:var(--soft);font-size:10px}.btn{min-height:38px;padding:8px 12px;border:1px solid transparent;border-radius:6px;background:var(--acid);color:var(--on-accent);font-size:10px;font-weight:700;cursor:pointer}.btn:hover{filter:brightness(1.06)}.btn.secondary{background:rgba(var(--tint),.035);border-color:var(--line2);color:var(--soft)}.btn.danger{background:rgba(255,59,112,.09);border-color:rgba(255,59,112,.28);color:#ff7a9c}.btn.publish{background:var(--pink);color:#fff}.btn.full{width:100%}.btn:disabled{opacity:.35;cursor:not-allowed}.button-row{display:flex;flex-wrap:wrap;gap:8px}.render-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:end}.risk{margin-top:9px;padding:10px;border:1px solid rgba(255,173,66,.28);border-radius:6px;background:rgba(255,173,66,.06);color:var(--muted);font-size:10px;white-space:pre-wrap}
details.studio-disclosure{border-bottom:1px solid var(--line)}details.studio-disclosure>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:58px;padding:14px 19px;list-style:none;cursor:pointer}details.studio-disclosure>summary::-webkit-details-marker{display:none}details.studio-disclosure>summary:after{content:"+";margin-left:8px;color:var(--accent-text);font-size:18px}details.studio-disclosure[open]>summary:after{content:"−"}details.studio-disclosure>summary strong{font-size:12px}details.studio-disclosure>summary small{display:block;margin-top:2px;color:var(--muted);font-size:9px}.disclosure-body{padding:0 19px 18px}.disclosure-state{margin-left:auto;color:var(--green);font-size:9px;white-space:nowrap}
.preview-panel{position:sticky;top:80px}.preview-head{height:48px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.preview-head h3{margin:0;font-size:11px}.ratio{color:var(--accent-text);font:9px ui-monospace,monospace}.preview-wrap{padding:10px;background:var(--sunken)}.preview-wrap img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px}.action-box{padding:13px;border-top:1px solid var(--line)}.action-box p{margin:3px 0 10px;color:var(--muted);font-size:9px}.action-box form+form{margin-top:8px}.schedule-current{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 10px;margin-bottom:9px;border:1px solid rgba(115,167,255,.22);border-radius:6px;background:rgba(115,167,255,.05);color:var(--blue);font-size:9px}.confirmation{display:flex;gap:7px;align-items:flex-start;margin:9px 0;color:var(--muted);font-size:9px}.copy-preview{padding:0 13px 13px}.copy-preview summary{padding:10px 0;cursor:pointer;color:var(--soft);font-size:10px}.copy-preview p{color:var(--muted);font-size:10px;white-space:pre-wrap}.hashtags{color:var(--accent-text)!important}
.focus-grid{display:grid;grid-template-columns:1fr;gap:14px}.focus-list{display:grid}.focus-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px;padding:11px 14px;border-bottom:1px solid var(--line)}.focus-item:last-child{border-bottom:0}.focus-item:hover{background:rgba(var(--tint),.025)}.focus-copy{min-width:0}.focus-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}.focus-copy small{color:var(--muted);font-size:9px}.focus-icon{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;color:var(--accent-text);font:14px ui-monospace,monospace}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:13px}.quick-action{min-height:92px;padding:13px;border:1px solid var(--line);border-radius:7px;background:rgba(var(--tint),.015)}.quick-action:hover{border-color:var(--line2);background:rgba(var(--tint),.03)}.quick-action b{display:block;margin-bottom:5px;font-size:11px}.quick-action small{color:var(--muted);font-size:9px}.quick-action .ico{display:block;margin-bottom:10px;color:var(--accent-text);text-align:left}.view-only{animation:reveal .18s ease-out}@keyframes reveal{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}
.lower-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:14px}.schedule-list,.source-list{display:grid}.schedule-item,.source-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}.schedule-item:last-child,.source-item:last-child:last-child{border-bottom:0}.calendar-date{width:44px;padding:5px;border:1px solid var(--line);border-radius:6px;text-align:center}.calendar-date b{display:block;font-size:15px}.calendar-date small{color:var(--muted);font-size:8px}.item-main{min-width:0}.item-main strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}.item-main small{color:var(--muted);font-size:9px}.item-actions{display:flex;gap:5px}.mini{min-height:29px;padding:5px 8px;font-size:9px}.inspiration-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:0}.source-column{border-right:1px solid var(--line)}.idea-list{max-height:410px;overflow:auto}.idea{display:block;padding:11px 13px;border-bottom:1px solid var(--line)}.idea:hover{background:rgba(var(--tint),.025)}.idea strong{display:block;font-size:10px;font-weight:520}.idea small{display:block;margin-top:3px;color:var(--muted);font-size:9px}.system-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}.system-item{padding:15px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.system-item:nth-child(3n){border-right:0}.system-item b{display:flex;align-items:center;gap:7px;font-size:10px}.system-item p{margin:5px 0 0;color:var(--muted);font-size:9px}.signal{width:7px;height:7px;border-radius:50%;background:var(--green)}.signal.warn{background:var(--orange)}.signal.off{background:var(--pink)}.external{color:var(--accent-text);font-size:9px}.footer-note{margin-top:28px;text-align:center;color:var(--faint);font-size:9px}
@media(max-width:1180px){.kpis{grid-template-columns:repeat(3,1fr)}.focus-grid{grid-template-columns:1fr}.studio{grid-template-columns:minmax(0,1fr) 350px}.post-row{grid-template-columns:44px minmax(150px,1fr) minmax(100px,.6fr) auto}.post-row .hide-md{display:none}.lower-grid{grid-template-columns:1fr}}
@media(max-width:900px){.shell{grid-template-columns:1fr}.topbar:has(.top-actions:empty){height:64px;background:var(--topbar);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.sidebar{position:fixed;inset:0 auto 0 0;width:226px;transform:translateX(-100%);transition:.2s;box-shadow:var(--shadow)}body.menu-open .sidebar{transform:none}.mobile-toggle{display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--line);border-radius:6px;background:var(--panel)}.studio{grid-template-columns:1fr}.preview-panel{position:relative;top:auto;max-width:520px;grid-row:1}.system-grid{grid-template-columns:repeat(2,1fr)}.system-item:nth-child(3n){border-right:1px solid var(--line)}.system-item:nth-child(2n){border-right:0}}
@media(max-width:650px){.workspace{padding:22px 13px 60px}.topbar{padding:0 13px}.page-head{align-items:start;flex-direction:column}.date-chip{display:none}.kpis{grid-template-columns:1fr 1fr}.kpi{min-height:98px}.kpi:last-child{grid-column:1/-1}.post-row{grid-template-columns:40px minmax(0,1fr) auto;padding:9px}.post-row .cell-meta,.post-row .hide-mobile{display:none}.studio-header,.studio-block{padding:15px}.form-grid,.render-grid{grid-template-columns:1fr}.inspiration-grid{grid-template-columns:1fr}.source-column{border-right:0;border-bottom:1px solid var(--line)}.system-grid{grid-template-columns:1fr}.system-item,.system-item:nth-child(3n){border-right:0}.top-actions .health-label{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* ---- 3) Operate-Redesign-Overrides ---- */
:root{--font-body:16px;--font-small:14px;--font-caption:12px;--bg:#09090b;--side:#0d0d10;--panel:#111114;--raised:#18181d;--hover:#202026;--line:rgba(var(--tint),.08);--line2:rgba(var(--tint),.14);--text:#f5f5f6;--soft:#d5d5d8;--muted:#9a9aa2;--faint:#70717a;--r:10px}
body{font-size:var(--font-body);line-height:1.55}.shell{grid-template-columns:248px minmax(0,1fr)}
.sidebar{padding:22px 16px}.logo{gap:13px;padding:4px 8px 28px}.logo-mark{width:42px;height:42px;font-size:15px}.logo strong{font-size:14px}.logo small,.account small{font-size:12px}.nav-label{padding:20px 12px 8px;font-size:var(--font-caption)}.nav a{min-height:46px;padding:10px 12px;font-size:var(--font-small)}.nav .count{min-width:24px;font-size:12px}.account{padding:16px 10px 4px}.account strong{font-size:14px}.avatar{width:36px;height:36px}
.topbar{height:68px;padding:0 clamp(20px,3vw,48px)}.workspace{max-width:1480px;padding:42px clamp(20px,3vw,48px) 96px}.flash{padding:15px 18px;font-size:var(--font-small)}.page-head{margin-bottom:32px}.page-head h1{font-size:clamp(32px,4vw,46px);letter-spacing:-1.1px}.page-head p{font-size:var(--font-body)}.section{margin-top:38px}.section-head{margin-bottom:16px}.section-head h2{font-size:24px}.section-head p{margin-top:6px;font-size:var(--font-small);max-width:740px}.panel-head{min-height:62px;padding:14px 18px}.panel-head h3{font-size:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;font-size:var(--font-small);border-radius:7px}.btn.secondary{background:rgba(var(--tint),.04)}.btn.danger{background:transparent;color:#ff8fab}.mini{min-height:40px;padding:8px 11px;font-size:13px}.filter{min-height:40px;padding:9px 12px;font-size:var(--font-small)}.status{padding:6px 9px;font-size:12px}.empty-row{padding:38px 24px;font-size:var(--font-small)}
.work-queue{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(290px,.72fr);gap:18px}.work-primary{min-width:0}.work-aside{display:grid;align-content:start;gap:14px}.work-summary{display:grid;padding:10px}.summary-chip{display:flex;align-items:center;gap:10px;min-height:48px;padding:9px 10px;border-radius:7px;color:var(--muted);font-size:var(--font-small)}.summary-chip:hover{background:rgba(var(--tint),.035);color:var(--soft)}.summary-chip b{min-width:28px;color:var(--text);font-size:19px}.focus-item{grid-template-columns:64px minmax(0,1fr) auto;gap:16px;min-height:94px;padding:14px 18px}.focus-copy strong{font-size:16px}.focus-copy small{font-size:var(--font-small)}
.post-row{grid-template-columns:64px minmax(220px,1.35fr) minmax(125px,.5fr) minmax(130px,.5fr) auto;gap:16px;min-height:96px;padding:14px 18px}.thumb{width:58px;height:72px;border-radius:6px}.post-title strong{font-size:16px;white-space:normal;line-height:1.35}.post-title small,.cell-meta{display:block;margin-top:4px;font-size:var(--font-small)}.post-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.post-row-actions form{margin:0}.row-more{position:relative}.row-more>summary{list-style:none}.row-more>summary::-webkit-details-marker{display:none}.row-popover{position:absolute;right:0;top:calc(100% + 8px);z-index:12;width:330px;padding:16px;border:1px solid var(--line2);border-radius:10px;background:var(--raised);box-shadow:0 24px 70px rgba(0,0,0,.48)}.row-popover form+form{margin-top:12px}
.studio{grid-template-columns:minmax(0,1fr) minmax(360px,430px);gap:22px}.studio-header{padding:24px 26px}.studio-header h2{font-size:clamp(25px,3vw,34px)}.meta-line{font-size:var(--font-small)}.stagebar{display:flex;gap:8px;margin-top:20px}.stage{padding:7px 10px;border:1px solid var(--line);border-radius:999px;font-size:12px}.stage:before{display:none}.studio-block{padding:24px 26px}.block-head h3{font-size:18px}.hint{font-size:var(--font-small)}details.studio-disclosure>summary{min-height:68px;padding:16px 26px}details.studio-disclosure>summary strong{font-size:16px}details.studio-disclosure>summary small{font-size:var(--font-small)}.disclosure-body{padding:0 26px 24px}.disclosure-state{font-size:13px}.form-grid{gap:14px}.field{gap:7px}label{font-size:var(--font-small);color:var(--soft)}input[type=text],input[type=url],input[type=datetime-local],textarea,select{min-height:46px;padding:11px 12px;font-size:var(--font-body)}textarea{min-height:112px}input[type=file],.rights-check,.confirmation,.risk{font-size:var(--font-small)}.preview-head{height:58px;padding:0 16px}.preview-head h3{font-size:16px}.ratio{font-size:12px}.preview-wrap{padding:14px}.action-box{padding:18px}.action-box p,.schedule-current,.copy-preview summary,.copy-preview p{font-size:var(--font-small)}
.schedule-item,.source-item{gap:16px;padding:16px 18px}.calendar-date{width:54px;padding:8px}.calendar-date b{font-size:20px}.calendar-date small{font-size:12px}.item-main strong{font-size:15px}.item-main small{font-size:var(--font-small)}.item-actions{display:flex;gap:8px;flex-wrap:wrap}.inspiration-intro{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;margin-bottom:18px;padding:18px;border:1px solid rgba(200,255,61,.2);border-radius:10px;background:rgba(200,255,61,.045)}.inspiration-intro b{font-size:16px}.inspiration-intro p{margin:4px 0 0;font-size:var(--font-small);color:var(--muted)}.inspiration-intro code{color:var(--accent-text)}.inspiration-grid{grid-template-columns:minmax(340px,.85fr) minmax(0,1.15fr)}.idea-list{max-height:560px}.idea{padding:16px 18px}.idea strong{font-size:15px}.idea small{font-size:var(--font-small)}.system-grid{grid-template-columns:repeat(2,1fr)}.system-item:nth-child(3n){border-right:1px solid var(--line)}.system-item:nth-child(2n){border-right:0}.system-item{padding:20px}.system-item b{font-size:15px}.system-item p{font-size:var(--font-small)}.topic-composer{margin-bottom:18px}.composer-body{padding:16px 18px}.composer-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.idea-title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.manual-badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;border:1px solid rgba(200,255,61,.35);background:rgba(200,255,61,.08);color:var(--accent-text);font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap}.idea-note{font-style:italic}
.automation-promise{margin:14px 0 0;color:var(--muted);font-size:var(--font-small);line-height:1.55}
.automation-promise code{color:var(--accent-text)}
@media(max-width:1180px){.work-queue{grid-template-columns:1fr}.post-row{grid-template-columns:64px minmax(180px,1fr) minmax(120px,.5fr) auto}.post-row .hide-md{display:none}.inspiration-grid{grid-template-columns:1fr}.source-column{border-right:0;border-bottom:1px solid var(--line)}}
@media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{width:248px}.studio{grid-template-columns:1fr}.post-row{grid-template-columns:58px minmax(0,1fr) auto}.post-row .cell-meta,.post-row>.hide-mobile{display:none}.post-row-actions{grid-column:2/-1;justify-content:flex-start}.row-popover{position:fixed;left:14px;right:14px;top:auto;bottom:14px;width:auto}.system-grid{grid-template-columns:1fr}.system-item{border-right:0!important}}
@media(max-width:650px){.workspace{padding:28px 14px 72px}.topbar{padding:0 14px}.page-head h1{font-size:32px}.panel-head{align-items:flex-start;flex-direction:column}.panel-head .spacer{display:none}.post-row{padding:14px;gap:12px}.post-row-actions .btn{flex:1}.studio-header,.studio-block{padding:20px}details.studio-disclosure>summary{padding:16px 20px}.disclosure-body{padding:0 20px 20px}.source-item,.schedule-item{grid-template-columns:auto minmax(0,1fr)}.item-actions{grid-column:1/-1;justify-content:flex-start}}

/* ---- 4) Einstellungs-Seite ---- */
.logo-mark{object-fit:contain}.settings-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr)}.settings-block{padding:24px}.settings-block+.settings-block{border-left:1px solid var(--line)}.settings-block h3{font-size:18px}.settings-help{color:var(--muted);font-size:14px}.settings-grid input[type=password]{width:100%;min-height:46px;border:1px solid var(--line);border-radius:6px;background:var(--field);color:var(--text);padding:11px 12px;outline:0}.secret-state{color:var(--green);font-size:12px}.brand-preview{display:grid;place-items:center;min-height:180px;margin:16px 0;border:1px dashed var(--line2);border-radius:8px;background:var(--field)}.brand-preview img{max-width:220px;max-height:130px;object-fit:contain}@media(max-width:800px){.settings-grid{grid-template-columns:1fr}.settings-block+.settings-block{border-left:0;border-top:1px solid var(--line)}}

/* ---- 5) Async-Aktionen (Spinner für langlaufende Requests) ---- */
.btn.is-busy{opacity:.75;cursor:progress;pointer-events:none}
.btn.is-busy:after{content:"";display:inline-block;width:12px;height:12px;margin-left:8px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:btn-spin .7s linear infinite}
@keyframes btn-spin{to{transform:rotate(1turn)}}

/* Bild-Austausch im Editor: Vorschau/Ersatzblock ist klickbar */
.image-swap > summary.image-swap-summary { list-style: none; cursor: pointer; padding: 0; }
.image-swap > summary.image-swap-summary::-webkit-details-marker { display: none; }
.image-swap .modal-preview { position: relative; }
.image-swap-hint {
  position: absolute; right: 10px; bottom: 10px;
  background: rgba(0,0,0,0.65); color: #fff;
  font-size: 12px; padding: 4px 8px; border-radius: 6px;
  opacity: 0; transition: opacity .15s ease;
}
.image-swap:hover .image-swap-hint,
.image-swap[open] .image-swap-hint { opacity: 1; }
.kanban-empty.image-missing { display: flex; flex-direction: column; gap: 4px; align-items: center; justify-content: center; text-align: center; padding: 24px; }
.kanban-empty.image-missing strong { color: #d98b00; }
.kanban-empty.image-missing small { opacity: 0.7; }
.card-image-missing { color: #d98b00; font-weight: 600; }

/* ---- 6) Editor-Dichte ----
   Alles hier ist auf .edit-modal gescoped: Der Rest der App behält den
   großzügigen Maßstab aus Abschnitt 3, nur der Detail-Editor wird dichter,
   damit Caption, Hashtags und Alt-Text ohne Scrollen erreichbar sind. */
.edit-modal-panel{width:min(1100px,100%)}
.edit-modal-layout{min-height:0}
.edit-modal-header{min-height:56px;padding:10px 16px;gap:14px}
.edit-modal-header-actions{gap:8px}

.edit-modal .btn{min-height:34px;padding:7px 11px;font-size:13px}
.edit-modal input[type=text],.edit-modal input[type=url],.edit-modal input[type=datetime-local],
.edit-modal select,.edit-modal textarea{min-height:36px;padding:7px 10px;font-size:14px;border-radius:6px}
.edit-modal textarea{min-height:64px;line-height:1.5;resize:vertical;overflow:hidden}
.edit-modal .caption-editor{min-height:150px}
.edit-modal .hashtags-editor{min-height:64px}
.edit-modal input[type=file]{font-size:12px}
.edit-modal label{display:flex;align-items:baseline;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}
/* Felder behalten ihre Inhaltshöhe – sonst dehnt das Grid sie auf die
   Zeilenhöhe und die mitwachsenden Textfelder messen diese Dehnung mit. */
.edit-modal .field{gap:4px;align-content:start}
.edit-modal .copy-editor{gap:12px;margin:0;align-content:start}
.copy-row,.design-grid{align-items:start}
.copy-row{display:grid;gap:12px;grid-template-columns:minmax(0,2fr) minmax(150px,1fr)}
.copy-row.even{grid-template-columns:1fr 1fr}
.design-grid{display:grid;gap:10px;grid-template-columns:1fr 1fr;margin-top:10px}

.field-count{flex:none;color:var(--faint);font:11px ui-monospace,monospace;font-variant-numeric:tabular-nums}
.field-count.over{color:var(--pink)}
.save-state{color:var(--faint);font-size:12px;white-space:nowrap;opacity:1;transition:opacity .6s ease}.save-state.faded{opacity:0}
.save-state.dirty{color:var(--orange)}
.save-state.saved{color:var(--green)}
.save-state.error{color:var(--pink);white-space:normal;max-width:280px;text-align:right}

.edit-modal .modal-disclosure{margin-top:12px;border-radius:8px}
.edit-modal .modal-disclosure>summary{min-height:44px;padding:9px 12px}
.edit-modal .modal-disclosure>summary strong{font-size:13px}
.edit-modal .modal-disclosure>summary small{font-size:11px}
.edit-modal .modal-disclosure-body{padding:12px}
.edit-modal-copy>.modal-disclosure{margin-top:14px}
.edit-modal-media{padding:16px}
.edit-modal-copy{padding:18px}
.modal-preview{width:100%;margin-bottom:0;padding:6px;border-radius:8px}
.design-disclosure{margin-top:14px}

@media(max-width:820px){.copy-row,.copy-row.even,.design-grid{grid-template-columns:1fr}
  .edit-modal-header-actions{gap:6px}.save-state.error{max-width:none;text-align:left}}

.edit-modal label small{margin-left:4px;font-weight:400;color:var(--faint)}
.field-input-icon{position:relative}
.field-input-icon input{padding-right:36px}
.field-input-icon .icon-btn{position:absolute;top:50%;right:4px;transform:translateY(-50%);width:26px;height:26px;padding:0;display:grid;place-items:center;border:1px solid var(--line2);border-radius:6px;background:rgba(var(--tint),.04);color:var(--soft);font-size:15px;line-height:1;cursor:pointer}
.field-input-icon .icon-btn:hover{background:rgba(var(--tint),.08);color:var(--text)}
.field-input-icon .icon-btn.is-busy{opacity:.5;cursor:progress;pointer-events:none}
.teaser-suggestions{display:grid;gap:6px;margin-bottom:14px;padding:10px;border:1px solid var(--line);border-radius:8px;background:rgba(var(--tint),.02)}
.teaser-suggestions[hidden]{display:none}
.teaser-suggestion{display:block;width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:rgba(var(--tint),.02);color:var(--soft);font-size:13px;line-height:1.4;text-align:left;cursor:pointer}
.teaser-suggestion:hover{border-color:var(--line2);background:rgba(var(--tint),.05);color:var(--text)}
.carousel-widget{margin-bottom:16px}
.carousel-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.carousel-tab{padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(var(--tint),.02);color:var(--muted);font-size:12px;cursor:pointer;text-transform:uppercase;letter-spacing:.04em}
.carousel-tab:hover{color:var(--soft);background:rgba(var(--tint),.04)}
.carousel-tab.active{border-color:var(--line2);background:rgba(var(--tint),.06);color:var(--text)}
.carousel-tab-add{display:grid;place-items:center;width:32px;height:32px;padding:0;border-radius:999px;font-size:16px;line-height:1;border-style:dashed;list-style:none;cursor:pointer}
.carousel-tab-add::-webkit-details-marker{display:none}
/* Pfeile zum Umsortieren: nur an der angeklickten (aktiven) Slide sichtbar,
   sonst stünden zehn Pfeilpaare nebeneinander in der Leiste. */
.carousel-tab-group{display:inline-flex;align-items:center;gap:2px}
.carousel-tab-group form{margin:0;display:contents}
.carousel-tab-arrow{display:none;width:22px;height:22px;padding:0;border:1px solid var(--line2);border-radius:999px;background:rgba(var(--tint),.04);color:var(--soft);font-size:10px;line-height:1;cursor:pointer;align-items:center;justify-content:center}
.carousel-tab-arrow:hover{background:rgba(var(--tint),.09);color:var(--text)}
.carousel-tab-group:has(.carousel-tab.active) .carousel-tab-arrow{display:inline-flex}
/* "+"-Menü: Datei-Upload oder Link, siehe carousel_add_menu-Makro. */
.carousel-add-menu{position:relative}
.carousel-add-menu>summary{list-style:none;cursor:pointer}
.carousel-add-menu>summary::-webkit-details-marker{display:none}
.carousel-add-menu-standalone{display:inline-block;margin-top:10px}
.carousel-add-menu-body{position:absolute;left:0;top:calc(100% + 6px);z-index:5;width:260px;display:grid;gap:4px;padding:6px;border:1px solid var(--line2);border-radius:9px;background:var(--field);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.carousel-add-link-form{display:flex;gap:6px;padding:4px;align-items:center}
.carousel-add-link-form input[type=url]{flex:1;min-width:0;padding:7px 9px;font-size:11px}
.carousel-add-link-form .menu-item{width:auto;white-space:nowrap}
.carousel-panels{position:relative}
.carousel-slide{display:none;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--sunken)}
.carousel-slide.active{display:block}
/* Werkzeugleiste an der Slide: sichtbar bleibt, was man wirklich tut
   (zuschneiden); Reihenfolge und Loeschen liegen hinter dem Menue. */
.slide-bar{display:flex;align-items:center;gap:6px;margin-top:8px}
.slide-bar .spacer{flex:1}
.slide-bar form{margin:0}
.slide-tool{min-height:32px;padding:6px 12px;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line2);border-radius:999px;background:rgba(var(--tint),.03);color:var(--soft);font-size:11px;font-weight:550;cursor:pointer;list-style:none}
.slide-tool::-webkit-details-marker{display:none}
.slide-tool:hover{color:var(--text);background:rgba(var(--tint),.07)}
.slide-menu{position:relative}
.slide-menu>summary{justify-content:center;min-width:36px}
.slide-menu-body{position:absolute;right:0;bottom:calc(100% + 6px);z-index:5;min-width:180px;display:grid;padding:5px;border:1px solid var(--line2);border-radius:9px;background:var(--field);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.menu-item{width:100%;min-height:36px;padding:8px 10px;display:flex;align-items:center;border:0;border-radius:6px;background:0 0;color:var(--soft);font-size:12px;text-align:left;cursor:pointer}
.menu-item:hover:not(:disabled){background:rgba(var(--tint),.07);color:var(--text)}
.menu-item:disabled{opacity:.35;cursor:not-allowed}
.menu-item.is-danger{color:var(--pink)}
.menu-item.is-danger:hover:not(:disabled){background:rgba(255,59,112,.1)}
/* Der Zuschnitt sitzt an der Stelle der Slide, nicht darunter. */
.clip-panel{padding:8px;border:1px solid var(--line2);border-radius:8px;background:var(--sunken)}
.clip-actions{display:grid;grid-template-columns:auto 1fr;gap:8px;margin-top:10px}
.carousel-slide>video,.carousel-slide>img{display:block;width:100%;max-height:420px;object-fit:contain;border-radius:6px;background:#000}
/* Ohne color-scheme rendert Safari die native Bedienleiste hell/weiß auf dem
   sonst durchgängig dunklen Hintergrund -- das sah wie ein Darstellungsfehler
   (weißer Balken) statt wie Videosteuerung aus. */
.carousel-slide>video{color-scheme:dark}
.carousel-slide>video::-webkit-media-controls-panel{background-color:rgba(10,10,14,.86)}
.kanban-card-media video{display:block;width:100%;height:100%;object-fit:cover}
.clip-editor{margin-bottom:12px}
.clip-source{display:block;width:100%;max-height:260px;object-fit:contain;border-radius:6px;background:#000;margin-bottom:10px}
.clip-fields{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px;align-items:end;margin-bottom:8px}
.clip-fields label{display:grid;gap:4px;font-size:12px;color:var(--muted)}
.clip-fields input{width:100%}
.clip-hint{display:block;color:var(--muted);margin-bottom:8px}

/* ---- 7) Inspirationen-Redesign, Toasts, Meme-Editor ----
   Muss nach Abschnitt 3 stehen: dort definierte Inspirationen-Regeln
   (Grid, Composer, Source-Rows) werden hier gezielt ersetzt. */
/* Untereinander statt nebeneinander: Die Quellen stehen oben, weil sie die
   Warteschlange darunter füllen. */
.inspiration-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.source-column{border-right:0}
.composer{margin-bottom:18px}
/* Formular-Dialoge (Composer, neue Quelle) – gleicher Aufbau wie der Editor,
   nur schmaler: hier steht ein Formular, kein Bild daneben. */
.pipeline-tabs{position:relative}
.form-modal{width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:clamp(12px,2vw,28px);border:0;background:transparent;color:var(--text);overflow:hidden}
.form-modal::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(8px)}
/* Kopf und Aktionen stehen fest, gescrollt wird nur das Formular dazwischen –
   sonst rutschen die Knöpfe aus dem Bild und der Dialog wirkt abgeschnitten. */
.form-modal-panel{display:flex;flex-direction:column;width:min(680px,100%);max-height:100%;margin:auto;border:1px solid var(--line2);border-radius:14px;background:var(--field);box-shadow:0 32px 100px rgba(0,0,0,.65);overflow:hidden}
.form-modal-header{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:15px 20px;border-bottom:1px solid var(--line)}
.form-modal-header h2{margin:0;margin-right:auto;font-size:17px;font-weight:590;letter-spacing:-.15px}
.form-modal-header .status{flex:0 0 auto}
.form-modal .modal-close{flex:0 0 auto;width:32px;height:32px;font-size:19px;cursor:pointer;color:inherit}
.form-modal .composer-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:auto;padding:16px 20px 0}
.form-modal .composer-body[hidden]{display:none}
/* Dichte wie im Editor: kleine Labels, flache Felder, enge Reihen. */
.form-modal .form-grid{gap:12px}
.form-modal .field{gap:5px}
.form-modal label{color:var(--muted);font-size:12px}
.form-modal input[type=text],.form-modal input[type=url],.form-modal select,.form-modal textarea{min-height:38px;padding:8px 11px;font-size:14px;border-radius:7px}
.form-modal textarea{min-height:76px;line-height:1.5;resize:vertical}
.form-modal .dropzone{min-height:112px}
.form-modal .platform-choice{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}
.form-modal .platform-option{font-size:12px}
.form-modal .platform-option .status{white-space:nowrap}
.form-modal .settings-help{font-size:12px}
/* Aktionsleiste klebt am unteren Rand des Dialogs, nicht am Ende des Textes. */
.form-modal .composer-actions{position:sticky;bottom:0;z-index:2;margin:18px -20px 0;padding:13px 20px;border-top:1px solid var(--line);background:var(--field)}
.form-modal .composer-hint{font-size:12px}
@media(max-width:820px){.form-modal{padding:0}.form-modal-panel{width:100%;max-height:100%;border-radius:0;border-left:0;border-right:0}}
.composer-body{padding:16px 18px 18px}
.composer-body[hidden]{display:none}
.composer-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.composer-hint{flex:1 1 220px;min-width:180px;color:var(--muted);font-size:var(--font-caption)}
.dropzone{display:grid;place-items:center;gap:8px;min-height:132px;padding:16px;border:1px dashed var(--line2);border-radius:9px;background:rgba(var(--tint),.02);color:var(--muted);font-size:var(--font-small);text-align:center;cursor:pointer}
.dropzone:hover,.dropzone.is-hovered{border-color:var(--accent-text);color:var(--soft);background:rgba(200,255,61,.05)}
.dropzone-preview{max-height:190px;max-width:100%;border-radius:7px}
.composer-or{display:flex;align-items:center;gap:10px;margin:2px 0;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.04em}
.composer-or:before,.composer-or:after{content:"";flex:1 1 auto;height:1px;background:var(--line)}
.idea-list{max-height:none}
.idea{display:grid;gap:7px;padding:16px 18px}
.idea:last-child{border-bottom:0}
.idea-meta{display:flex;flex-wrap:wrap;gap:4px 10px;color:var(--muted)}
.idea-note{color:var(--soft);font-style:italic}
.source-item{align-items:start}
.source-item .item-main{display:grid;gap:3px;min-width:0}
.source-url{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--faint)}
.source-more{position:relative}
.source-more>summary{list-style:none;cursor:pointer}
.source-more>summary::-webkit-details-marker{display:none}
.source-more-body{position:absolute;right:0;top:calc(100% + 6px);z-index:14;display:grid;gap:10px;width:230px;padding:14px;border:1px solid var(--line2);border-radius:9px;background:var(--raised);box-shadow:0 20px 50px rgba(0,0,0,.5)}
.source-more-body .btn.full{width:100%}

.btn.is-armed{border-color:var(--pink);background:rgba(255,59,112,.16);color:#ffd7e1}

.toast-stack{position:fixed;right:18px;bottom:18px;z-index:2147483000;display:grid;gap:10px;width:min(390px,calc(100vw - 36px))}
.toast{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid var(--line2);border-radius:9px;background:var(--raised);color:var(--text);font-size:var(--font-small);line-height:1.4;box-shadow:0 18px 46px rgba(0,0,0,.55);animation:toast-in .18s ease-out}
.toast span{flex:1;min-width:0}
.toast.error{border-color:rgba(255,59,112,.5);background:#2a1119}
.toast.leaving{opacity:0;transform:translateY(6px);transition:.2s}
.toast-undo{padding:6px 10px;border:1px solid var(--line2);border-radius:6px;background:rgba(var(--tint),.05);color:var(--accent-text);font-size:13px;cursor:pointer;white-space:nowrap}
.toast-undo:hover{background:rgba(var(--tint),.1)}
.toast-close{padding:0 4px;border:0;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer}
.toast-close:hover{color:var(--text)}
@keyframes toast-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.youtube-guide{margin-top:4px}
.youtube-steps{margin:0;padding-left:20px;display:grid;gap:9px;color:var(--soft);font-size:13px;line-height:1.5}
.youtube-steps em{color:var(--text);font-style:normal;font-weight:560}

/* render.FONT_IMPACT (Anton) für die Live-Textebene im Slide-Editor --
   dieselbe Datei, die Pillow für den echten Render nutzt
   (siehe web/static/fonts/Anton-Regular.ttf), damit die Vorschau nicht auf
   eine Browser-Systemschrift ausweicht, die anders aussieht. */
@font-face{font-family:'Retro Nerd Anton';src:url('fonts/Anton-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}

.slide-editor{display:grid;gap:8px;margin-bottom:16px}
.slide-stage{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--sunken);touch-action:none}
.slide-stage-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.slide-element{position:absolute;transform:translate(-50%,-50%);min-width:24px;min-height:20px;border:1px dashed rgba(var(--tint),.4);border-radius:4px;cursor:grab}
.slide-element.is-auto-height{height:auto}
.slide-element.is-selected{border-color:var(--acid);box-shadow:0 0 0 1px var(--acid)}
.slide-element-body{display:block;width:100%;height:100%;overflow:hidden;color:var(--accent-text);font-size:13px;line-height:1.3;text-align:center;padding:4px;box-sizing:border-box}
/* Unausgewählt soll nur das Motiv zu sehen sein, keine Bearbeitungsfläche
   darüber -- Rahmen, Abdunklung und Griffe blenden erst beim Hovern/
   Auswählen/Bearbeiten ein. Gilt für Text immer, für ein randfüllendes
   Bild/Video (is-full-bleed) genauso -- das ist ja der Hintergrund selbst.
   Ein verkleinertes Bild/Video behält seinen Rahmen. */
.slide-element-text,.slide-element.is-full-bleed,.slide-element-fade{border-color:transparent}
.slide-element-fade{cursor:default}
.slide-element-fade:hover:not(.is-selected){border-color:rgba(var(--tint),.4)}
.slide-element-fade .slide-element-body{padding:0}
.slide-element-fade .slide-element-grip,.slide-element-fade .slide-element-resize{display:none}
.slide-element-text:hover:not(.is-selected),.slide-element.is-full-bleed:hover:not(.is-selected){border-color:rgba(var(--tint),.4)}
.slide-element-text .slide-element-body{padding:0;background:transparent;white-space:pre-wrap;overflow-wrap:break-word;transition:background .12s}
.slide-element-text:hover .slide-element-body,.slide-element-text.is-selected .slide-element-body,.slide-element-text.is-editing .slide-element-body{background:rgba(0,0,0,.35)}
/* Vorschau und Renderer nutzen dieselbe gespeicherte Schriftrolle; vorhandene Vorlagen behalten sie. */
.slide-element-text .slide-element-body[data-font=impact]{font-family:'Retro Nerd Anton','Anton',Impact,sans-serif;font-weight:400;letter-spacing:.01em}
.slide-element-text .slide-element-body[data-font=bold]{font-family:Arial,sans-serif;font-weight:700;letter-spacing:0}
.slide-element-text .slide-element-body[data-font=black]{font-family:'Arial Black',Arial,sans-serif;font-weight:900;letter-spacing:0}
/* "Fett" heißt bei einer einschnittigen Schrift wie Impact: die kräftige
   schwarze Kontur an (siehe render._draw_meme_text/style_preset
   meme_stroke), nicht ein anderer Schriftschnitt. */
.slide-element-body[data-style=meme_stroke]{-webkit-text-stroke:1.5px #000;text-shadow:0 0 3px #000;text-transform:uppercase}
.slide-element-body[data-outline=true]{-webkit-text-stroke:1px #000;text-shadow:0 0 2px #000}.slide-element.is-editing{cursor:text}.slide-element.is-editing .slide-element-body{cursor:text;outline:2px solid var(--acid)}
.slide-element-image .slide-element-body,.slide-element-video .slide-element-body{object-fit:contain;padding:0}
.slide-element-grip{position:absolute;top:-11px;left:-11px;width:22px;height:22px;display:grid;place-items:center;border:1px solid var(--line2);border-radius:50%;background:var(--field);color:var(--text);font-size:12px;cursor:grab;touch-action:none}
.slide-element-grip:active{cursor:grabbing}
.slide-element-resize{position:absolute;right:-6px;bottom:-6px;width:14px;height:14px;border-radius:50%;background:var(--acid);cursor:nwse-resize;touch-action:none}
.slide-element-text .slide-element-resize{bottom:50%;transform:translateY(50%);cursor:ew-resize}
.slide-element-text .slide-element-grip,.slide-element-text .slide-element-resize,.slide-element.is-full-bleed .slide-element-grip,.slide-element.is-full-bleed .slide-element-resize{opacity:0;pointer-events:none;transition:opacity .12s}
.slide-element-text:hover .slide-element-grip,.slide-element-text.is-selected .slide-element-grip,.slide-element-text.is-editing .slide-element-grip,.slide-element.is-full-bleed:hover .slide-element-grip,.slide-element.is-full-bleed.is-selected .slide-element-grip,
.slide-element-text:hover .slide-element-resize,.slide-element-text.is-selected .slide-element-resize,.slide-element-text.is-editing .slide-element-resize,.slide-element.is-full-bleed:hover .slide-element-resize,.slide-element.is-full-bleed.is-selected .slide-element-resize{opacity:1;pointer-events:auto}
.slide-element-toolbar{position:absolute;top:-34px;left:50%;transform:translateX(-50%);display:flex;gap:2px;padding:3px;border:1px solid var(--line2);border-radius:8px;background:var(--field);box-shadow:0 12px 32px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .12s;white-space:nowrap}
.slide-element:hover .slide-element-toolbar,.slide-element.is-selected .slide-element-toolbar{opacity:1;pointer-events:auto}
.slide-element-toolbar button,.slide-element-swap{width:24px;height:24px;display:grid;place-items:center;border:0;border-radius:5px;background:transparent;color:var(--text);font-size:13px;cursor:pointer}
.slide-element-toolbar button:hover,.slide-element-swap:hover{background:rgba(var(--tint),.08)}
.slide-element-color{width:24px;height:24px;padding:2px;border:0;border-radius:5px;background:transparent;cursor:pointer}
.slide-element-color::-webkit-color-swatch-wrapper{padding:2px}
.slide-element-color::-webkit-color-swatch{border:1px solid var(--line2);border-radius:3px}
.slide-element-color::-moz-color-swatch{border:1px solid var(--line2);border-radius:3px}
.slide-element-bold{font-weight:700}
.slide-editor-toolbar{padding-left:8px}
.slide-editor-state{color:var(--muted);font-size:var(--font-caption);min-height:16px}
/* Cluster aus "+", Raster-Umschalter und Vorlage-Speichern blendet gemeinsam
   ein. Solide Feld-Farbe statt der sonst hier üblichen Tint-Transparenz:
   darunter liegt ein beliebiges Foto, kein gleichmäßig dunkler Hintergrund,
   und ein 4%-Tint verschwand auf hellem Bildhintergrund fast vollständig. */
.slide-stage .slide-stage-tools{position:absolute;top:8px;left:8px;z-index:3;display:flex;align-items:center;gap:8px;opacity:0;pointer-events:none;transition:opacity .12s}
.slide-stage:hover .slide-stage-tools,.slide-stage-tools:has(.slide-add-menu[open]){opacity:1;pointer-events:auto}
.slide-stage-tools .icon-btn,.slide-add-menu>summary{list-style:none;width:34px;height:34px;padding:0;display:grid;place-items:center;border:1px solid var(--line2);border-radius:8px;background:var(--field);box-shadow:0 8px 20px rgba(0,0,0,.35);color:var(--soft);font-size:18px;line-height:1;cursor:pointer}
.slide-stage-tools .icon-btn:hover,.slide-add-menu>summary:hover{background:var(--hover);color:var(--text)}
.slide-element-bold[aria-pressed=true],.slide-element-outline[aria-pressed=true],[data-slide-grid-toggle][aria-pressed=true],[data-slide-media-fit-toggle][aria-pressed=true]{background:rgba(var(--tint),.16);color:var(--acid)}
.slide-add-menu>summary::-webkit-details-marker{display:none}
.slide-add-menu-body{position:absolute;top:calc(100% + 6px);left:0;z-index:2;display:grid;min-width:160px;padding:6px;border:1px solid var(--line2);border-radius:8px;background:var(--field);box-shadow:0 12px 32px rgba(0,0,0,.45)}
.slide-add-menu-body .menu-item{display:block;width:100%;padding:8px 10px;border:0;border-radius:6px;background:transparent;color:var(--text);font-size:13px;text-align:left;cursor:pointer}
.slide-add-menu-body .menu-item:hover{background:rgba(var(--tint),.08)}
.slide-add-upload{cursor:pointer}

.slide-template-picker{position:relative;width:100%;aspect-ratio:4/5;display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--sunken)}
.slide-template-picker[hidden]{display:none}
.slide-template-picker-header{display:flex;align-items:center;justify-content:space-between}
.template-strip{flex:1;display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}
.template-strip-item{flex:0 0 auto;width:140px;display:grid;gap:6px;padding:8px;border:1px solid var(--line2);border-radius:8px;background:var(--field);scroll-snap-align:start}
.template-strip-item img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px;background:var(--sunken)}
.template-strip-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.slide-template-modal{padding:18px;width:min(360px,90vw);border:1px solid var(--line2);border-radius:10px;background:var(--field);color:var(--text)}
.slide-template-modal::backdrop{background:rgba(0,0,0,.6)}
.slide-template-modal label{display:grid;gap:6px;color:var(--muted);font-size:var(--font-caption)}
.slide-template-modal input[type=text]{min-height:38px;padding:7px 9px}
.slide-template-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}

.field label .icon-btn{margin-left:8px;width:24px;height:24px;padding:0;border:1px solid var(--line2);border-radius:6px;background:rgba(var(--tint),.04);color:var(--soft);font-size:13px;line-height:1;cursor:pointer}
.field label .icon-btn:hover{background:rgba(var(--tint),.08);color:var(--text)}
.field label .icon-btn.is-busy{opacity:.5;cursor:progress;pointer-events:none}

@media(max-width:1180px){.inspiration-grid{grid-template-columns:1fr}}
@media(max-width:650px){.toast-stack{right:12px;left:12px;bottom:12px;width:auto}.composer-actions .btn{flex:1 1 100%}.composer-hint{flex-basis:100%}}

/* Branding-Bilder: die Flaeche selbst ist der Datei-Dialog. */
.brand-swap{position:relative;cursor:pointer;gap:10px;transition:.15s}
.brand-swap:hover,.brand-swap:focus-within{border-color:var(--accent-text);background:rgba(200,255,61,.04)}
.brand-swap-hint{color:var(--muted);font-size:var(--font-caption);letter-spacing:.04em;text-transform:uppercase}
.brand-swap:hover .brand-swap-hint,.brand-swap:focus-within .brand-swap-hint{color:var(--accent-text)}
.settings-block.is-busy{opacity:.6;pointer-events:none}
.settings-block.is-busy .brand-swap-hint:after{content:" · lädt"}

/* ---- Einstellungen: Zugaenge als Zeilen, Branding als zwei Kacheln ---- */
.settings-grid{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr)}
.settings-block{padding:0}
.settings-block>.panel-head{padding:18px 22px 0;border:0}
.settings-block>.settings-help{margin:6px 22px 0}
.settings-help{color:var(--muted);font-size:var(--font-small);line-height:1.5}
/* Offizielle Wortmarken vor dem Plattformnamen -- überall, wo eine
   Veröffentlichungsplattform oder ein Link-Import benannt wird. currentColor
   statt Markenfarbe, damit das Icon dem Zustand (offen/veröffentlicht/
   fehlgeschlagen …) der jeweiligen Stelle folgt statt ihn zu überstrahlen. */
.platform-icon{display:inline-flex;width:13px;height:13px;margin-right:5px;vertical-align:-2px;flex:0 0 auto}
.platform-icon svg{width:100%;height:100%;display:block;fill:currentColor}
/* Plattformen: Chips auf den Karten, Auswahl im Editor und im Composer. */
.platform-pills{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.platform-pill{display:inline-flex;align-items:center;padding:2px 8px;border:1px solid var(--line);border-radius:999px;font-size:11px;line-height:1.6;color:var(--muted);white-space:nowrap}
.platform-pill.is-published{border-color:rgba(80,220,150,.4);color:#7fe3b0}
.platform-pill.is-failed{border-color:rgba(255,120,120,.45);color:#ff9d9d}
.platform-pill.is-publishing{border-color:rgba(255,200,90,.45);color:#ffd27f}
.platform-choice{display:flex;flex-wrap:wrap;gap:8px}
.platform-option{display:flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid var(--line);border-radius:8px;background:rgba(var(--tint),.015);cursor:pointer;font-size:13px}
.platform-option input{margin:0}
.platform-option.is-locked{cursor:default;opacity:.75}
.platform-choice-field .platform-choice{margin-top:2px}
.checkbox-line{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px}
.checkbox-line input{margin:0}
.ai-text-context{display:grid;gap:5px;margin-top:9px}
.platform-detail{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding-top:10px;font-size:13px}
.platform-detail strong{font-weight:560}
.platform-detail small{color:var(--faint)}
.platform-targets .modal-disclosure-body>form{margin-bottom:4px}
.platform-targets .btn.mini{margin-top:10px}
.platform-copy .field+.field{margin-top:12px}
.delete-form{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.credential-note{color:var(--faint);font-size:var(--font-caption);line-height:1.5}
.credential-note code{padding:1px 5px;border-radius:4px;background:rgba(var(--tint),.06);color:var(--soft);font-size:11px}
.branding-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px 22px 22px}
.branding-grid h4{margin:0;font-size:14px;font-weight:570}
.branding-grid .settings-help{margin:5px 0 0;font-size:var(--font-caption)}
.branding-grid .brand-preview{min-height:150px}
.branding-grid .btn.full{width:100%}
@media(max-width:1180px){.settings-grid{grid-template-columns:1fr}.settings-block{border-left:0}}
@media(max-width:650px){.branding-grid{grid-template-columns:1fr}}

/* Fragezeichen-Hinweis: Erklaertext erst beim Hovern/Fokussieren. */
.hint{position:relative;display:inline-grid;place-items:center;width:17px;height:17px;flex:0 0 auto;border:1px solid var(--line2);border-radius:50%;color:var(--muted);font-size:10px;font-weight:600;line-height:1;cursor:help;vertical-align:middle}
.hint:hover,.hint:focus-visible{border-color:var(--accent-text);color:var(--accent-text);outline:none}
.hint:after{content:attr(data-hint);position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);z-index:60;width:max-content;max-width:250px;padding:9px 11px;border:1px solid var(--line2);border-radius:7px;background:var(--raised);color:var(--soft);font-size:12px;font-weight:400;line-height:1.5;text-align:left;text-transform:none;letter-spacing:normal;box-shadow:0 16px 40px rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .12s}
.hint:hover:after,.hint:focus-visible:after{opacity:1;visibility:visible}
.panel-head .hint{margin-left:8px}
.branding-grid h4 .hint{margin-left:5px}
@media(max-width:650px){.hint:after{left:0;transform:none;max-width:70vw}}

/* ---- 8) Ruhigerer Seitenkopf ----
   Der Seitentitel benennt nur noch, wo man ist; Untertitel gibt es keine mehr.
   Die Kopfleiste trägt außer dem Menüknopf nichts – auf dem Desktop, wo der
   Knopf ausgeblendet ist, entfällt sie deshalb ganz. */
.page-head{margin-bottom:20px}
.page-head h1{margin:0;font-size:23px;letter-spacing:-.3px;line-height:1.2}
.topbar{display:none}
@media(max-width:900px){.topbar{display:flex}}

/* ---- 9) Zugänge als Liste plus Dialog ----
   Oben das Branding, darunter eine Zeile je hinterlegtem Zugang. Eingetragen
   wird im Dialog: erst die Auswahl, dann deren Felder. */
.settings-grid{grid-template-columns:minmax(0,1fr)}
.settings-block{padding:0;border-left:0}
.settings-block+.settings-block{border-top:1px solid var(--line)}
.settings-credentials .panel-head,.settings-branding .panel-head{padding:16px 22px}
.branding-grid{padding:0 22px 22px}
.settings-credentials .credential-list{display:grid}
.credential-row{display:flex;align-items:center;gap:16px;padding:14px 22px;border-top:1px solid var(--line)}
.credential-row .item-main{flex:1 1 auto}
.credential-row.is-incomplete .item-main small{color:var(--orange)}
.credential-row .item-actions form{margin:0}
.settings-credentials .credential-note{padding:0 22px 14px}
.credential-options{display:grid;gap:8px}
.credential-option{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:9px;background:rgba(var(--tint),.02);color:inherit;text-align:left;cursor:pointer}
.credential-option:hover:not(:disabled){border-color:var(--line2);background:rgba(var(--tint),.05)}
.credential-option:disabled{opacity:.45;cursor:not-allowed}
.credential-option .item-main{flex:1 1 auto;min-width:0}
.credential-option small{display:block;margin-top:2px;color:var(--muted);font-size:12px;white-space:normal}
.credential-picker{padding-bottom:18px}
.modal-back{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:rgba(var(--tint),.03);color:inherit;font-size:19px;line-height:1;cursor:pointer}
.modal-back:hover{background:rgba(var(--tint),.08)}
.modal-back[hidden]{display:none}

/* ---- 9) Anmeldung, Einladung, Konto ---- */
/* Eigene, schlanke Huelle: Diese Seiten haben weder Seitenleiste noch
   gewaehlte Brand, weil es beides ohne Anmeldung noch nicht gibt. */
.auth-body{display:block}
.auth-shell{display:grid;place-items:center;min-height:100vh;padding:24px 16px}
.auth-card{width:100%;max-width:420px;padding:28px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);box-shadow:var(--shadow)}
.auth-brand{display:flex;align-items:center;gap:11px;padding-bottom:22px}
.auth-brand strong{display:block;font-size:13px;letter-spacing:.08em}
.auth-brand small{color:var(--muted);font-size:10px}
.auth-title{margin-bottom:18px;font-size:22px}
.auth-form{display:grid;gap:7px;padding-bottom:6px}
.auth-form+.auth-form{margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}
.auth-form label{color:var(--soft);font-size:var(--font-caption);letter-spacing:.02em}
.auth-form input,.auth-form select{width:100%;min-height:46px;padding:11px 12px;border:1px solid var(--line2);border-radius:6px;background:var(--field);color:var(--text);outline:0}
.auth-form input:focus,.auth-form select:focus{border-color:var(--accent-text)}
.auth-form .btn{margin-top:11px}
.auth-form .settings-help{margin:-2px 0 4px}
.auth-foot{margin:14px 0 0;color:var(--muted);font-size:var(--font-small)}
.auth-foot a{color:var(--accent-text);text-decoration:underline}
@media(max-width:520px){.auth-shell{padding:0}.auth-card{max-width:none;min-height:100vh;border:0;border-radius:0;box-shadow:none;padding:24px 18px}}
/* Brand-Auswahl, Team-Liste */
.account-switch{margin-top:auto}
.account-switch>summary{list-style:none;cursor:pointer}
.account-switch>summary::-webkit-details-marker{display:none}
.account-menu{display:grid;gap:2px;padding:6px;margin-top:6px;border:1px solid var(--line);border-radius:8px;background:var(--raised)}
.account-menu a,.account-menu button{display:block;width:100%;padding:9px 10px;border:0;border-radius:6px;background:0;color:var(--soft);font-size:var(--font-small);text-align:left;cursor:pointer}
.account-menu a:hover,.account-menu button:hover{background:var(--hover);color:var(--text)}
.brand-list{display:grid;gap:8px;margin:0 0 22px;padding:0;list-style:none}
.brand-list-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--raised)}
.brand-list-item small{display:block;color:var(--muted);font-size:var(--font-caption)}
.brand-list-item form{margin:0}
.member-actions{display:flex;align-items:center;gap:8px}
.member-actions select{min-height:38px;padding:6px 8px;border:1px solid var(--line2);border-radius:6px;background:var(--field);color:var(--text)}
.linklike{border:0;background:0;color:var(--accent-text);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
@media(max-width:520px){.brand-list-item{flex-wrap:wrap}.member-actions{width:100%}}

/* ---- 10) Hell und Dunkel ---- */
/* Dunkel bleibt die Grundeinstellung -- oben stehen die Werte dafuer. Hier
   kommen nur die Namen dazu, die der Themenwechsel braucht: `--tint` ist die
   Farbe, mit der Flaechen sich vom Untergrund abheben (auf Dunkel heller, auf
   Hell dunkler), `--accent-text` die lesbare Variante des Akzents.
   Aufgeloest wird "wie das Geraet" im Kopf der Seite, bevor gezeichnet wird --
   deshalb braucht es hier genau einen Hell-Block und keine Verdopplung in
   einer Media-Query. */
:root{--tint:255,255,255;--accent-text:var(--acid);--on-accent:#08090a;--field:#0b0c0f;--sunken:#050506;--topbar:rgba(8,9,10,.91);--flash-bg:rgba(200,255,61,.06);--flash-line:rgba(200,255,61,.28);--flash-text:#eaffbc}

:root[data-theme=light]{
  color-scheme:light;
  --bg:#f4f4f6;--side:#fff;--panel:#fff;--raised:#fafafb;--hover:#ececed;
  --line:rgba(0,0,0,.1);--line2:rgba(0,0,0,.17);
  --text:#131316;--soft:#3d3e45;--muted:#65666f;--faint:#8b8c95;
  --tint:0,0,0;
  /* Der Akzent bleibt die Fuellfarbe der Schaltflaechen (dunkle Schrift
     darauf traegt auf Hell genauso). Als Textfarbe braucht es ein Gruen,
     das auf Weiss lesbar ist. */
  --accent-text:#4a7a06;
  --field:#fff;--sunken:#ececee;--topbar:rgba(255,255,255,.92);
  --flash-bg:#f2fadb;--flash-line:#c3dd7a;--flash-text:#3d5a00;
  --shadow:0 12px 34px rgba(0,0,0,.1)
}
/* Auf Hell sind die Marken-Farben als Text zu blass -- abgedunkelte Varianten. */
:root[data-theme=light] .status.live i,:root[data-theme=light] .health-dot{background:#2f9d68}
:root[data-theme=light] .btn.danger{background:#fdeaee;border-color:#f3b6c4;color:#b3123c}
:root[data-theme=light] .logo-mark{box-shadow:3px 3px 0 #a8d92b}
.theme-choice{display:flex;gap:2px;padding:6px 4px 2px}
.theme-choice button{flex:1;padding:7px 4px;border:1px solid var(--line);border-radius:6px;background:0;color:var(--muted);font-size:var(--font-caption);cursor:pointer}
.theme-choice button[aria-current]{border-color:var(--acid);color:var(--text);background:rgba(var(--tint),.05)}
/* Die Signalfarben sind fuer dunklen Grund gemischt (Pastell). Auf Weiss
   waeren ausgerechnet die wichtigsten Zustaende -- fehlgeschlagen, Bild fehlt,
   gefaehrliche Aktion -- am schlechtesten zu lesen. */
:root[data-theme=light]{--pink:#d11149;--green:#1f8a56;--orange:#a35c00;--blue:#2a5db0}
:root[data-theme=light] .btn.is-armed{background:#fdeaee;color:#a30f38}
:root[data-theme=light] .platform-pill.is-failed{border-color:#e8a3a3;color:#b32020}
:root[data-theme=light] .platform-pill.is-publishing{border-color:#e0bd76;color:#8a5800}
:root[data-theme=light] .kanban-empty.image-missing strong,
:root[data-theme=light] .card-image-missing{color:#8a5800}
/* Auf dem Telefon sind die neuen Bedienelemente die engsten: Rollenwahl,
   Brand-Wechsler, Themenschalter. 44px ist die Groesse, die sich mit dem
   Daumen sicher treffen laesst. */
@media(max-width:650px){
  .account-menu a,.account-menu button{min-height:44px;display:flex;align-items:center}
  .theme-choice button{min-height:40px}
  .member-actions select,.member-actions .btn{min-height:44px}
  .brand-list-item{padding:14px}
  .auth-form input,.auth-form select{min-height:48px}
}

/* ============================================================
   Videozuschnitt (Composer und Editor)
   Ein Filmstreifen statt zweier Sekundenfelder: Der Ausschnitt
   ist der helle Bereich, alles Weggeschnittene liegt sichtbar
   abgedunkelt daneben -- so bleibt erkennbar, was fehlt.
   ============================================================ */
.trim{display:grid;gap:9px}
.trim-stage{position:relative;border-radius:9px;background:#000;overflow:hidden}
.trim-stage video{display:block;width:100%;max-height:240px;object-fit:contain;background:#000}
.trim:not(.is-ready) .trim-stage{min-height:120px}
/* Zentriert und groß statt als kleine Pille unten -- die stand auf dem
   schwarzen Standbild sonst kaum sichtbar zwischen "Video" und "Standbild". */
.trim-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:56px;display:grid;place-items:center;border:0;border-radius:99px;background:rgba(0,0,0,.62);color:#fff;font-size:19px;cursor:pointer;backdrop-filter:blur(8px);transition:background .15s}
.trim-play:hover{background:rgba(0,0,0,.8)}
.trim.is-playing .trim-play{width:44px;height:44px;font-size:15px;left:auto;top:auto;right:10px;bottom:10px;transform:none}
.trim-track{position:relative;height:56px;border-radius:8px;background:#0b0b0e;overflow:hidden;touch-action:none;cursor:crosshair}
.trim-strip{display:block;width:100%;height:56px}
/* Der Schlagschatten färbt alles außerhalb des Fensters ein -- zwei
   zusätzliche Blenden-Elemente wären dasselbe mit mehr Markup. */
.trim-window{position:absolute;top:0;bottom:0;box-sizing:border-box;border:2px solid var(--acid);border-radius:7px;box-shadow:0 0 0 9999px rgba(0,0,0,.62);cursor:grab}
.trim.is-dragging .trim-window{cursor:grabbing}
.trim.is-short .trim-window{border-color:var(--pink)}
.trim-grip{position:absolute;top:-2px;bottom:-2px;width:16px;display:grid;place-items:center;background:var(--acid);cursor:ew-resize;touch-action:none}
.trim-grip:before{content:"";width:2px;height:18px;border-radius:2px;background:rgba(0,0,0,.5);box-shadow:3px 0 0 rgba(0,0,0,.5),-3px 0 0 rgba(0,0,0,.5)}
.trim-grip:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.trim-grip.is-start{left:-2px;border-radius:7px 0 0 7px}
.trim-grip.is-end{right:-2px;border-radius:0 7px 7px 0}
.trim.is-short .trim-grip{background:var(--pink)}
.trim-head{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.8);pointer-events:none}
.trim-head:before{content:"";position:absolute;top:-1px;left:-3px;width:8px;height:8px;border-radius:50%;background:#fff}
.trim-readout{display:flex;align-items:center;justify-content:space-between;gap:10px;font:600 11px ui-monospace,monospace;color:var(--muted)}
.trim-length{padding:3px 9px;border-radius:99px;background:rgba(200,255,61,.12);color:var(--accent-text);font-size:11px}
.trim.is-short .trim-length{background:rgba(255,59,112,.12);color:var(--pink)}
/* Titelbild-Modus: derselbe Streifen, aber kein Fenster -- nur der Marker,
   der deshalb groesser und anfassbar ist. */
.trim.is-cover .trim-track{cursor:pointer}
.trim.is-cover .trim-head{width:3px;margin-left:-1.5px;background:var(--acid);box-shadow:0 0 0 1px rgba(0,0,0,.55)}
.trim.is-cover .trim-head:before{top:-4px;left:-5px;width:13px;height:13px;background:var(--acid);box-shadow:0 0 0 1px rgba(0,0,0,.55)}
.trim.is-cover.is-dragging .trim-track{cursor:grabbing}