/* RV Studio – Studio im exakten Design der Startseite (gleiche Werte wie bestand.css).
   Blau für Abschnittssymbole, Orange nur für aktive Auswahl und Hauptaktion, Weiß für Werte, Grün für Gewinne. */
:is(#steps.sx-head, .sx, #nav.sx-nav, #editor) {
  --sx-text:#eef4ff; --sx-title:#f3f5f9; --sx-sub:#c3cad6; --sx-lbl:#d4d9e2; --sx-dim:#8c959b; --sx-muted:#a9b8d4;
  --sx-blue:#2e9bff; --sx-green:#2ee0a0; --sx-orange-hi:#ffc98a;
  --sx-panel:linear-gradient(180deg, rgba(150,175,210,.10), rgba(80,100,135,.04) 60%, rgba(70,90,120,.06)) padding-box,
    linear-gradient(180deg, rgba(16,24,36,.78), rgba(12,18,28,.84)) padding-box,
    linear-gradient(165deg, rgba(255,255,255,.55), rgba(255,255,255,.14) 25%, rgba(255,255,255,.05) 60%, rgba(255,255,255,.30)) border-box;
  --sx-tile:linear-gradient(180deg, rgba(185,205,230,.14), rgba(120,140,170,.06) 55%, rgba(90,110,140,.08)) padding-box,
    linear-gradient(180deg, rgba(18,26,40,.70), rgba(14,20,32,.76)) padding-box,
    linear-gradient(165deg, rgba(255,255,255,.55), rgba(255,255,255,.14) 30%, rgba(255,255,255,.06) 65%, rgba(255,255,255,.28)) border-box;
  --sx-card:linear-gradient(180deg, rgba(185,205,230,.16), rgba(120,140,170,.07) 55%, rgba(90,110,140,.10)) padding-box,
    linear-gradient(180deg, rgba(20,30,46,.35), rgba(20,30,46,.35)) padding-box,
    linear-gradient(165deg, rgba(255,255,255,.55), rgba(255,255,255,.14) 30%, rgba(255,255,255,.06) 65%, rgba(255,255,255,.28)) border-box;
  --sx-panel-sh:inset 0 0 60px -20px rgba(255,150,70,.25), inset 0 1px 0 rgba(255,255,255,.2), 0 16px 40px rgba(0,0,0,.45);
  --sx-card-sh:inset 0 1px 0 rgba(255,255,255,.22), inset 0 -10px 18px -14px rgba(200,220,255,.35), 0 6px 18px rgba(0,0,0,.3);
  --sx-hover-sh:0 0 0 1px rgba(140,200,255,.55), 0 0 18px rgba(70,150,255,.45), 0 10px 22px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.25);
  --sx-active-sh:0 0 0 1px rgba(160,210,255,.8), 0 0 24px rgba(70,150,255,.7), inset 0 0 18px rgba(90,170,255,.35);
  --sx-on-bg:radial-gradient(ellipse at 50% 0, rgba(255,160,80,.30), rgba(60,30,12,.35));
  --sx-on-sh:inset 0 0 0 1.5px #ffb060, 0 0 10px rgba(255,150,60,.55), 0 0 22px rgba(255,140,50,.25);
  --sx-font:'Segoe UI','Inter','Roboto','Helvetica Neue',system-ui,-apple-system,sans-serif;
  font-family:var(--sx-font); color:var(--sx-text);
}
:is(#steps.sx-head, .sx, #nav.sx-nav) * { font-family:var(--sx-font) !important; box-sizing:border-box; }
body:has(#steps:not(.hidden)) main.wrap { max-width:1000px !important; padding:22px 16px 128px !important; position:relative; z-index:1; }
body:has(#steps:not(.hidden)) .cc-bokeh { display:block; }
.sx-ico { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none; }
:is(.sx, #steps.sx-head, #nav.sx-nav) button { -webkit-tap-highlight-color:transparent; cursor:pointer; font:inherit; }
:is(.sx, #steps.sx-head, #nav.sx-nav) :focus-visible { outline:2px solid #8fd4ff; outline-offset:2px; }
.sx.hidden, #steps.sx-head.hidden, #nav.sx-nav.hidden { display:none !important; }
.sx:not(.hidden) { display:flex; flex-direction:column; gap:12px; }

/* ---------- Kopf + Schritte ---------- */
#steps.sx-head { display:flex !important; flex-direction:column; gap:12px; margin:0 0 12px !important; padding:0 !important; border:0 !important; background:none !important; box-shadow:none !important; }
.sx-top { display:flex; align-items:center; gap:14px; padding:2px; }
.sx-orb { position:relative; width:54px; height:54px; border-radius:50%; display:grid; place-items:center; flex:none; color:#eaf5ff;
  background:radial-gradient(circle at 35% 30%, #6fb8ff, #1f5fbf 45%, #0a1f45 75%); box-shadow:0 0 0 1px rgba(160,210,255,.55), 0 0 18px rgba(61,155,255,.55), inset 0 0 14px rgba(160,220,255,.45); }
.sx-orb .sx-ico { width:26px; height:26px; filter:drop-shadow(0 0 4px rgba(200,235,255,.9)); }
.sx-orb::after { content:''; position:absolute; inset:-6px; border-radius:50%; border:1px solid rgba(120,190,255,.35); border-top-color:rgba(255,190,120,.9); animation:sx-spin 7s linear infinite; }
.sx-greet { flex:1; min-width:0; }
.sx-greet h1 { margin:0 !important; font:600 30px/1.1 var(--sx-font) !important; color:var(--sx-text) !important; text-shadow:0 0 14px rgba(120,180,255,.25) !important; letter-spacing:0 !important; background:none !important; }
.sx-greet p { margin:4px 0 0 !important; color:#b8c8e6 !important; font-size:15px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sx-pill { display:flex; align-items:center; gap:10px; min-height:52px; padding:6px 14px 6px 7px !important; border-radius:999px !important; border:1px solid transparent !important; text-align:left;
  background:var(--sx-card) !important; box-shadow:var(--sx-card-sh) !important; color:#fff !important; transition:transform .2s, box-shadow .25s, filter .25s; }
.sx-pill-orb { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; color:#d9eeff; background:radial-gradient(circle at 35% 30%, #4f9dff, #163f86 70%); box-shadow:0 0 12px rgba(61,155,255,.6), inset 0 0 8px rgba(160,220,255,.5); }
.sx-pill-tx { display:flex; flex-direction:column; line-height:1.15; }
.sx-pill-tx b { font-weight:500; font-size:14px; }
.sx-pill-tx small { font-size:12px; color:var(--sx-sub); }
.sx-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
#steps.sx-head .step { position:relative; display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:86px; padding:10px 6px !important; margin:0 !important;
  border:1px solid transparent !important; border-radius:18px !important; background:var(--sx-tile) !important; box-shadow:var(--sx-card-sh) !important; color:#e9edf3 !important;
  font-size:13px !important; letter-spacing:0 !important; font-weight:400 !important; text-transform:none !important; animation:none !important; transition:transform .2s, box-shadow .25s, filter .25s; overflow:hidden; }
#steps.sx-head .step .ic { color:#f4f8ff; filter:drop-shadow(0 0 6px rgba(140,200,255,.55)); display:grid; }
#steps.sx-head .step .ic .sx-ico { width:26px; height:26px; stroke-width:1.6; }
#steps.sx-head .step .lb { font-size:13px; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
#steps.sx-head .step small { font-size:10.5px; color:var(--sx-dim); letter-spacing:.06em; text-transform:uppercase; }
#steps.sx-head .step.done small { color:var(--sx-green); }
#steps.sx-head .step.done::after { content:'✓'; position:absolute; top:8px; right:10px; width:18px; height:18px; border-radius:50%; display:grid; place-items:center; font-size:11px; font-weight:700; color:#06261b; background:var(--sx-green); box-shadow:0 0 8px rgba(46,224,160,.6); }
#steps.sx-head .step.active { background:var(--sx-on-bg) padding-box, var(--sx-tile) !important; box-shadow:var(--sx-on-sh) !important; color:#fff0d6 !important; }
#steps.sx-head .step.active .ic { color:#ffd9a8; filter:drop-shadow(0 0 6px rgba(255,170,90,.75)); }
#steps.sx-head .step.active small { color:var(--sx-orange-hi); }

/* ---------- Panels ---------- */
.sx-panel { position:relative; border:1px solid transparent !important; border-radius:24px !important; background:var(--sx-panel) !important; box-shadow:var(--sx-panel-sh) !important; padding:18px 16px 16px !important; margin:0 !important; color:var(--sx-text) !important; min-width:0; }
.sx-ph { display:flex; align-items:center; gap:12px; margin:0 0 14px; min-width:0; flex-wrap:wrap; }
.sx-hx { display:grid; place-items:center; width:32px; height:32px; flex:none; color:var(--sx-blue); filter:drop-shadow(0 0 6px rgba(46,155,255,.85)); }
.sx-hx .sx-ico { width:26px; height:26px; stroke-width:2.1; }
.sx-tt { display:flex; flex-direction:column; gap:3px; min-width:0; flex:1; }
.sx-title { margin:0 !important; font:500 17px/1.08 var(--sx-font) !important; color:var(--sx-title) !important; letter-spacing:.01em !important; text-transform:none !important; }
.sx-sub { font-size:12.5px; line-height:1.3; color:var(--sx-sub) !important; }
.sx-split { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:12px; }
.sx-fold > summary { list-style:none; cursor:pointer; margin:0; }
.sx-fold > summary::-webkit-details-marker { display:none; }
.sx-chev { width:18px !important; height:18px !important; color:var(--sx-muted); transition:transform .25s; }
.sx-fold[open] .sx-chev { transform:rotate(180deg); }
.sx-fold[open] > summary { margin-bottom:14px; }

/* ---------- Felder ---------- */
.sx-fields { display:grid; gap:12px; margin-bottom:12px; }
.sx-two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.sx-four { grid-template-columns:repeat(4,minmax(0,1fr)); }
.sx-field { display:flex; flex-direction:column; gap:6px; min-width:0; margin:0 0 12px; }
.sx-fields .sx-field { margin:0; }
.sx-field > span:first-child { font-size:12px !important; color:var(--sx-lbl) !important; letter-spacing:0 !important; text-transform:none !important; display:flex; align-items:baseline; gap:6px; }
.sx-field > span:first-child b { color:#fff; font-weight:500; }
.sx-count { margin-left:auto; font-style:normal; font-size:11px; color:var(--sx-dim); font-variant-numeric:tabular-nums; }
.sx-count.over { color:#ff8a70; }
.sx :is(input:not([type=file]):not([type=checkbox]):not([type=range]), select, textarea) {
  width:100%; min-height:46px; padding:11px 14px !important; border:1px solid rgba(255,255,255,.14) !important; border-radius:14px !important; margin:0 !important;
  background:rgba(10,14,22,.72) !important; color:var(--sx-text) !important; font-size:15px !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important; outline:none; }
.sx textarea { min-height:150px; resize:vertical; line-height:1.45; }
#template { min-height:190px; }
#listingDescription { min-height:230px; }
.sx :is(input, textarea)::placeholder { color:#7f8a9e !important; }
.sx :is(input, select, textarea):focus { border-color:rgba(120,190,255,.55) !important; box-shadow:0 0 0 1px rgba(120,190,255,.35), 0 0 18px rgba(61,155,255,.3) !important; }
.sx select { -webkit-appearance:none; appearance:none; padding-right:36px !important;
  background:rgba(10,14,22,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23a9b8d4' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center !important; }
.sx select option { background:#0e1522; color:#eef4ff; }
.sx input[type=date]::-webkit-calendar-picker-indicator { filter:invert(.8); }
.sx-input-wrap { position:relative; display:flex; align-items:center; }
.sx-input-wrap > i { position:absolute; right:14px; font-style:normal; color:var(--sx-muted); pointer-events:none; font-size:14px; }
.sx-input-wrap > input { padding-right:34px !important; }
.sx-input-wrap > .sx-mini { position:absolute; right:6px; }
.sx-input-wrap > input + .sx-mini { }
.sx-input-wrap:has(.sx-mini) > input { padding-right:66px !important; }
.sx-hint { margin:0; font-size:12.5px; line-height:1.45; color:var(--sx-sub) !important; }
.sx-note { margin:10px 0 0 !important; font-size:12px !important; line-height:1.45; color:var(--sx-dim) !important; }
.sx-status { margin:10px 0 0 !important; font-size:13px !important; color:var(--sx-lbl) !important; min-height:0; }
.sx-status:empty { display:none; }
.sx-status.ok { color:var(--sx-green) !important; }
.sx-status.err { color:#ff9c86 !important; }

/* Zustand */
.sx-scale { display:grid !important; grid-template-columns:repeat(10,minmax(0,1fr)); gap:6px !important; margin:0 !important; }
.sx-scale button { min-height:42px; padding:0 !important; border:1px solid transparent !important; border-radius:12px !important; background:var(--sx-card) !important; box-shadow:var(--sx-card-sh) !important;
  color:var(--sx-lbl) !important; font-size:14px !important; font-weight:500 !important; transition:transform .15s, box-shadow .2s; }
.sx-scale button.on { color:#fff0d6 !important; background:var(--sx-on-bg) !important; box-shadow:var(--sx-on-sh) !important; }

/* Knöpfe */
.sx-btn, #nav.sx-nav #back { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:40px; padding:0 16px !important; border:1px solid rgba(255,255,255,.18) !important;
  border-radius:999px !important; background:rgba(10,14,22,.6) !important; color:var(--sx-text) !important; font-size:13px !important; font-weight:500 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important; white-space:nowrap; transition:box-shadow .2s, filter .2s, transform .15s; width:auto; }
.sx-btn .sx-ico { width:17px; height:17px; }
.sx-btn:disabled { opacity:.45; cursor:not-allowed; }
.sx-mini { min-height:32px; padding:0 12px !important; border:0 !important; border-radius:999px !important; background:rgba(46,155,255,.18) !important; color:#9fd2ff !important; font-size:12px !important; font-weight:600 !important; }
@media(hover:hover) { :is(.sx-btn, #nav.sx-nav #back):not(:disabled):hover { box-shadow:0 0 0 1px rgba(140,200,255,.45), 0 0 12px rgba(70,150,255,.3) !important; } }
.sx-btn:active { transform:scale(.97); }
.sx-cta, #nav.sx-nav #next { display:inline-flex; align-items:center; gap:12px; min-height:58px; padding:7px 22px 7px 8px !important; border:1px solid transparent !important; border-radius:999px !important; text-align:left;
  color:#fff0d6 !important; background:var(--sx-on-bg) padding-box, var(--sx-tile) !important; box-shadow:var(--sx-on-sh) !important; transition:transform .2s, filter .25s; animation:sx-breathe 3.6s ease-in-out infinite; }
.sx-cta-sm { min-height:46px; padding:5px 18px 5px 6px !important; }
.sx-cta-orb { width:42px; height:42px; border-radius:50%; display:grid; place-items:center; flex:none; color:#fff3dc; background:radial-gradient(circle at 35% 30%, rgba(255,200,140,.55), rgba(120,60,20,.5) 70%); box-shadow:inset 0 0 10px rgba(255,190,120,.45), 0 0 10px rgba(255,150,60,.4); }
.sx-cta-sm .sx-cta-orb { width:34px; height:34px; }
.sx-cta-tx { display:flex; flex-direction:column; line-height:1.2; }
.sx-cta-tx b { font-size:15px; font-weight:600; color:#fff4e2; }
.sx-cta-tx small { font-size:12px; color:#f1d6b6; opacity:.9; }
.sx-cta:disabled { opacity:.6; animation:none; cursor:progress; }
@media(hover:hover) { :is(.sx-cta, .sx-pill, #nav.sx-nav #next):hover { transform:translateY(-2px); filter:brightness(1.12); } }
:is(.sx-cta, .sx-pill, #nav.sx-nav #next):active { transform:scale(.97); }
.sx-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.sx-center { justify-content:center; margin-top:12px; }
.sx-ai-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:4px; }

/* Chips */
.sx-chips { display:flex; flex-wrap:wrap; gap:7px; margin:-2px 0 12px; }
.sx-chips:empty { display:none; }
.sx-chips button, .sx-checks span { display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:0 12px !important; border:1px solid rgba(255,255,255,.14) !important; border-radius:999px !important;
  background:rgba(10,14,22,.5) !important; color:var(--sx-lbl) !important; font-size:12px !important; box-shadow:none !important; }
.sx-chips button.on { color:#fff0d6 !important; background:var(--sx-on-bg) !important; box-shadow:var(--sx-on-sh) !important; border-color:transparent !important; }
.sx-checks { display:flex; flex-wrap:wrap; gap:6px; margin:-4px 0 12px; }
.sx-checks span.ok { color:var(--sx-green) !important; border-color:rgba(46,224,160,.35) !important; }
.sx-checks span.miss { color:var(--sx-orange-hi) !important; border-color:rgba(255,190,120,.35) !important; }
.sx-tags button { color:#9fd2ff !important; }

/* Segment wie Zeitraum-Umschalter */
.sx-seg { display:flex !important; gap:0 !important; width:max-content; max-width:100%; margin:0 0 14px !important; padding:3px !important; overflow-x:auto; scrollbar-width:none;
  border:1px solid rgba(255,255,255,.18) !important; border-radius:100px !important; background:rgba(10,14,22,.6) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important; }
.sx-seg::-webkit-scrollbar { display:none; }
.sx-seg button { position:relative; flex:none; min-height:34px !important; padding:0 16px !important; border:0 !important; border-radius:100px !important; background:none !important; box-shadow:none !important;
  color:var(--sx-muted) !important; font:500 13px/1 var(--sx-font) !important; white-space:nowrap; animation:none !important; }
.sx-seg button + button::before { content:''; position:absolute; left:0; top:10px; bottom:10px; width:1px; background:rgba(255,255,255,.12); }
.sx-seg button.on::before, .sx-seg button.on + button::before { display:none; }
.sx-seg button.on { color:#fff0d6 !important; background:var(--sx-on-bg) !important; box-shadow:var(--sx-on-sh) !important; }

/* ---------- Fotos ---------- */
.sx-drop { display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:8px; min-height:170px; padding:20px !important; margin:0 0 12px !important; text-align:center; cursor:pointer;
  border:1.5px dashed rgba(120,190,255,.45) !important; border-radius:18px !important; background:radial-gradient(ellipse at 50% 0, rgba(46,155,255,.12), rgba(10,14,22,.4) 70%) !important; color:var(--sx-text) !important; transition:border-color .2s, box-shadow .2s, background .2s; }
.sx-drop.drag, .sx-drop:hover { border-color:rgba(160,215,255,.9) !important; box-shadow:0 0 22px rgba(61,155,255,.35) !important; }
.sx-drop-orb { width:52px; height:52px; border-radius:50%; display:grid; place-items:center; color:#eaf5ff; background:radial-gradient(circle at 35% 30%, #6fb8ff, #1f5fbf 50%, #0a1f45 85%); box-shadow:0 0 18px rgba(61,155,255,.55); }
.sx-drop b { font-size:16px; font-weight:500; color:#fff !important; }
.sx-drop small { font-size:12.5px; color:var(--sx-sub) !important; }
.sx-photos .sx-row { margin-bottom:12px; }
.sx-thumbs { display:grid; grid-template-columns:repeat(auto-fill, minmax(92px,1fr)); gap:9px; }
.sx-thumbs:empty { display:none; }
.sx-thumb { position:relative; aspect-ratio:4/5; border-radius:14px; overflow:hidden; background:#121a28; box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), 0 6px 14px rgba(0,0,0,.3); }
.sx-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.sx-thumb.cover { box-shadow:var(--sx-on-sh); }
.sx-thumb .tag { position:absolute; left:6px; top:6px; padding:3px 8px; border-radius:999px; font-size:10.5px; font-weight:600; color:#fff0d6; background:rgba(60,30,12,.8); box-shadow:inset 0 0 0 1px rgba(255,176,96,.7); }
.sx-thumb .tag.n { color:#eef4ff; background:rgba(8,12,20,.75); box-shadow:inset 0 0 0 1px rgba(255,255,255,.18); }
.sx-thumb .bar { position:absolute; left:0; right:0; bottom:0; display:flex; justify-content:center; gap:4px; padding:6px; background:linear-gradient(180deg, transparent, rgba(6,10,18,.85)); }
.sx-thumb .bar button { width:30px; height:30px; padding:0 !important; border:0 !important; border-radius:50% !important; display:grid; place-items:center; color:#fff !important; background:rgba(14,20,32,.85) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18) !important; font-size:14px !important; }
.sx-thumb .bar button:hover { box-shadow:inset 0 0 0 1px rgba(140,200,255,.6), 0 0 10px rgba(70,150,255,.4) !important; }
.sx-thumb .bar .sx-ico { width:15px; height:15px; }
.sx-thumbs-edit { grid-template-columns:repeat(auto-fill, minmax(130px,1fr)); margin-bottom:12px; }

/* Titelbild */
.sx-cover { position:relative; aspect-ratio:4/5; width:100%; max-width:300px; margin:0 auto; border-radius:18px; overflow:hidden; background:linear-gradient(160deg,#1c2a40,#0b111c); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), 0 14px 30px rgba(0,0,0,.4); }
.sx-cover img { width:100%; height:100%; object-fit:cover; display:block; }
.sx-cover .empty { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:20px; text-align:center; color:var(--sx-dim); font-size:13px; }
.sx-cover .empty .sx-ico { width:34px; height:34px; color:#5f7ea8; }
.sx-cover .badge { position:absolute; left:10px; top:10px; display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:999px; font-size:11px; font-weight:600; color:#eef4ff; background:rgba(8,12,20,.78); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }
.sx-cover .badge i { width:7px; height:7px; border-radius:50%; background:var(--sx-green); box-shadow:0 0 8px var(--sx-green); }
.sx-cover .badge.warn i { background:#ffb060; box-shadow:0 0 8px #ffb060; }
.sx-cover.busy::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg, transparent 30%, rgba(160,210,255,.28) 50%, transparent 70%); background-size:250% 100%; animation:sx-scan 1.3s linear infinite; }
.sx-cover.busy .empty, .sx-cover.busy img { filter:saturate(.6) brightness(.85); }
.sx-cover-lg { max-width:none; }
.sx-studio-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:18px; align-items:start; }
.sx-swatches { display:flex; flex-wrap:wrap; gap:8px; }
.sx-swatches button { width:38px; height:38px; padding:0 !important; border-radius:50% !important; border:0 !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.3), 0 4px 10px rgba(0,0,0,.3) !important; }
.sx-swatches button.on { box-shadow:0 0 0 2px #0b111c, 0 0 0 4px #ffb060, 0 0 14px rgba(255,150,60,.6) !important; }
.sx-srcs { display:flex; gap:8px; overflow-x:auto; padding:4px 2px 6px; scrollbar-width:none; }
.sx-srcs:empty::after { content:'Noch keine Fotos'; font-size:12px; color:var(--sx-dim); }
.sx-srcs button { flex:none; width:58px; height:72px; padding:0 !important; border:0 !important; border-radius:10px !important; overflow:hidden; background:#121a28 !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.16) !important; }
.sx-srcs button img { width:100%; height:100%; object-fit:cover; display:block; }
.sx-srcs button.on { box-shadow:0 0 0 2px #ffb060, 0 0 12px rgba(255,150,60,.5) !important; }
#sxEngine { margin:0 !important; }
.sx input[type=range] { width:100%; accent-color:#ffb060; }
.sx-switch { display:flex; align-items:center; gap:10px; margin:0 0 14px; font-size:13px; color:var(--sx-lbl); cursor:pointer; }
.sx-switch input { position:absolute; opacity:0; }
.sx-switch span { position:relative; width:42px; height:24px; flex:none; border-radius:999px; background:rgba(10,14,22,.8); box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); transition:background .2s; }
.sx-switch span::after { content:''; position:absolute; left:3px; top:3px; width:18px; height:18px; border-radius:50%; background:#a9b8d4; transition:transform .2s, background .2s; }
.sx-switch input:checked + span { background:var(--sx-on-bg); box-shadow:var(--sx-on-sh); }
.sx-switch input:checked + span::after { transform:translateX(18px); background:#fff0d6; }
.sx-switch input:focus-visible + span { outline:2px solid #8fd4ff; outline-offset:2px; }

/* Plattform-Vorschau */
.sx-preview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.sx-preview figure { margin:0; display:flex; flex-direction:column; gap:8px; }
.sx-preview .fr { border-radius:12px; overflow:hidden; background:#121a28; box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); }
.sx-preview .fr img { width:100%; height:100%; object-fit:cover; display:block; }
.sx-preview figcaption { font-size:12px; color:var(--sx-lbl); display:flex; justify-content:space-between; }
.sx-preview figcaption small { color:var(--sx-dim); }

/* Produktdaten-Score */
.sx-score { display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; font-size:12px; color:var(--sx-lbl); background:rgba(10,14,22,.6); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); }
.sx-score b { color:#fff; font-weight:600; }
.sx-score i { width:56px; height:6px; border-radius:4px; background:rgba(32,48,60,.75); overflow:hidden; display:block; }
.sx-score i s { display:block; height:100%; border-radius:4px; background:linear-gradient(90deg,#2a8cff,#8fd4ff); box-shadow:0 0 8px rgba(58,168,255,.7); }

/* ---------- Preise ---------- */
.sx-target { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.sx-target .sx-field { flex:1 1 220px; margin:0; }
.sx-history { margin:4px 0 12px !important; }
.sx-history b { color:#fff; font-weight:500; }
.sx-prices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.sx-price { display:flex; flex-direction:column; gap:8px; padding:12px; border-radius:16px; background:var(--sx-card); box-shadow:var(--sx-card-sh); border:1px solid transparent; }
.sx-price .lbl { font-size:12.5px; color:var(--sx-lbl); display:flex; align-items:center; gap:7px; }
.sx-price .lbl::before { content:''; width:8px; height:8px; border-radius:50%; background:#3a8ef0; box-shadow:0 0 8px #3a8ef0; }
.sx-price[data-p="vinted"] .lbl::before { background:#2aa57a; box-shadow:0 0 8px #2aa57a; }
.sx-price[data-p="instagram"] .lbl::before { background:#cf7f2a; box-shadow:0 0 8px #cf7f2a; }
.sx-price input { font-size:20px !important; }
.sx-price .dl { font:600 12px/1.2 var(--sx-font); color:var(--sx-green); min-height:15px; }
.sx-price .dl.neg { color:#718cff; }
.sx-price .dl.nil { color:var(--sx-dim); font-weight:500; }
.sx-subfold { margin-top:12px; }
.sx-subfold > summary { cursor:pointer; font-size:13px; color:var(--sx-muted); list-style:none; display:inline-flex; align-items:center; gap:6px; }
.sx-subfold > summary::-webkit-details-marker { display:none; }
.sx-subfold > summary::before { content:'›'; display:inline-block; transition:transform .2s; font-size:16px; }
.sx-subfold[open] > summary::before { transform:rotate(90deg); }
.sx-fees { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:12px 0 10px; }
.sx-fees > div { padding:10px; border-radius:14px; background:rgba(10,14,22,.45); box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); display:grid; gap:8px; }
.sx-fees b { font-size:12.5px; font-weight:500; color:#fff; }
.sx-fees label { display:grid; grid-template-columns:1fr 86px; align-items:center; gap:8px; font-size:11.5px; color:var(--sx-sub); }
.sx-fees input { min-height:36px !important; padding:6px 10px !important; font-size:13px !important; }

/* Lagerplatz-Vorschläge */
#sxLocChips { margin:0; }
#sxLocChips::before { content:'Zuletzt genutzt:'; font-size:12px; color:var(--sx-dim); align-self:center; margin-right:2px; }

/* ---------- Veröffentlichen ---------- */
.sx-publish { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.sx-pub { display:flex; flex-direction:column; gap:10px; padding:14px; border-radius:18px; background:var(--sx-card); box-shadow:var(--sx-card-sh); border:1px solid transparent; min-width:0; }
.sx-pub.live { box-shadow:inset 0 0 0 1.5px rgba(46,224,160,.6), 0 0 18px rgba(46,224,160,.18), var(--sx-card-sh); }
.sx-pub-hd { display:flex; align-items:center; gap:10px; }
.sx-pub-hd .mi { display:grid; place-items:center; width:38px; height:38px; flex:none; border-radius:12px; border:1px solid rgba(255,205,130,.45); color:var(--sx-orange-hi);
  background:radial-gradient(circle at 35% 25%, rgba(255,215,150,.22), rgba(60,40,22,.35) 70%); box-shadow:inset 0 0 10px rgba(255,150,60,.18), 0 0 10px rgba(255,140,50,.18); font-weight:700; font-size:14px; }
.sx-pub-hd div { display:flex; flex-direction:column; gap:2px; min-width:0; }
.sx-pub-hd b { font-size:15px; font-weight:500; color:#fff; }
.sx-pub-hd small { font-size:12px; color:var(--sx-sub); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sx-pub-st { margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:11.5px; color:var(--sx-dim); white-space:nowrap; }
.sx-pub-st i { width:7px; height:7px; border-radius:50%; background:#7f8da8; }
.sx-pub.live .sx-pub-st { color:var(--sx-green); }
.sx-pub.live .sx-pub-st i { background:var(--sx-green); box-shadow:0 0 8px var(--sx-green); }
.sx-pub .sx-row .sx-btn { flex:1 1 auto; min-height:36px; padding:0 10px !important; font-size:12.5px !important; }
.sx-pub input { min-height:38px !important; font-size:13px !important; padding:8px 12px !important; }
.sx-pub .sx-switch { margin:0; font-size:12.5px; }

/* ---------- Fertig-Check ---------- */
.sx-ready { display:flex; align-items:center; gap:16px; margin-bottom:16px; }
.sx-ready svg.ring { width:76px; height:76px; flex:none; }
.sx-ready .ring .t { fill:none; stroke:rgba(32,48,60,.8); stroke-width:7; }
.sx-ready .ring .v { fill:none; stroke-width:7; stroke-linecap:round; transform:rotate(-90deg); transform-origin:38px 38px; transition:stroke-dashoffset .6s; filter:drop-shadow(0 0 5px rgba(58,168,255,.8)); }
.sx-ready .ring text { fill:#fff; font:600 17px var(--sx-font); }
.sx-ready-tx { display:flex; flex-direction:column; gap:6px; min-width:0; }
.sx-ready-tx b { font-size:16px; font-weight:500; color:#fff; }
.sx-ready-tx .sx-chips { margin:0; }
.sx-ready-tx .sx-chips button { color:var(--sx-orange-hi) !important; border-color:rgba(255,190,120,.35) !important; }
.sx-finish-row { gap:12px; }

/* ---------- Untere Leiste ---------- */
#nav.sx-nav { position:sticky; bottom:96px; z-index:8; display:flex !important; gap:10px; max-width:1000px; margin:0 auto 12px !important; padding:10px 16px !important; border:0 !important; background:none !important; box-shadow:none !important; }
#nav.sx-nav #back { flex:0 0 auto; min-height:52px; padding:0 22px !important; background:rgba(10,14,22,.85) !important; }
#nav.sx-nav #back:disabled { opacity:.4; }
#nav.sx-nav #next { flex:1; justify-content:center; padding:0 22px !important; min-height:52px; font-size:15px !important; font-weight:600 !important; }

/* Bildbearbeitung im gleichen Stil */
#editor .editor-top { background:rgba(8,13,24,.94) !important; border-bottom:1px solid rgba(255,255,255,.1) !important; }
#editor button, #editor .preset, #editor .tab { border-radius:999px !important; border:1px solid rgba(255,255,255,.18) !important; background:rgba(10,14,22,.6) !important; color:#eef4ff !important; font-family:var(--sx-font) !important; }
#editor #applyEditor, #editor .tab.on { color:#fff0d6 !important; background:var(--sx-on-bg) !important; box-shadow:var(--sx-on-sh) !important; border-color:transparent !important; }
#editor .editlabel { color:#78c6f8 !important; letter-spacing:.1em; font-family:var(--sx-font) !important; }
#editor input[type=range] { accent-color:#ffb060; }

/* ---------- Animationen ---------- */
@keyframes sx-spin { to { transform:rotate(360deg); } }
@keyframes sx-scan { from { background-position:150% 0; } to { background-position:-100% 0; } }
@keyframes sx-breathe { 0%,100% { box-shadow:inset 0 0 0 1.5px #ffb060, 0 0 8px rgba(255,150,60,.45); } 55% { box-shadow:inset 0 0 0 1.5px #ffd9a8, 0 0 18px rgba(255,160,80,.85); } }
html.cc-no-pulse :is(.sx-cta, #nav.sx-nav #next) { animation:none !important; }
@media (prefers-reduced-motion: reduce) { :is(.sx, #steps.sx-head, #nav.sx-nav) *, .sx-orb::after { animation:none !important; transition:none !important; } }

/* ---------- Schmale Bildschirme ---------- */
@media (max-width:760px) {
  .sx-split, .sx-studio-body { grid-template-columns:1fr; }
  .sx-four { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sx-publish { grid-template-columns:1fr; }
  .sx-cover-lg { max-width:340px; }
}
@media (max-width:560px) {
  .sx-top { flex-wrap:wrap; }
  .sx-greet h1 { font-size:26px !important; }
  .sx-pill { order:3; width:100%; }
  .sx-steps { gap:8px; }
  #steps.sx-head .step { min-height:72px; gap:4px; border-radius:16px !important; }
  #steps.sx-head .step .ic .sx-ico { width:22px; height:22px; }
  #steps.sx-head .step .lb { font-size:11px; }
  #steps.sx-head .step small, #steps.sx-head .step .lx { display:none; }
  .sx-panel { padding:16px 12px 12px !important; border-radius:22px !important; }
  .sx-two { grid-template-columns:1fr; }
  .sx-scale { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .sx-prices, .sx-fees { grid-template-columns:1fr; }
  .sx-preview { gap:8px; }
  .sx-cta { width:100%; }
  .sx-ai-row .sx-btn { width:100%; }
  #nav.sx-nav { bottom:84px; padding:8px 12px !important; }
}