/* ==========================================================================
   Clip Match DACH — gemeinsames Design der App-Bereiche
   (Creator-Bereich, Firmenbereich, Admin, Creator entdecken, Profil)
   Wird NACH den seiteneigenen Styles geladen und überschreibt diese gezielt.
   ========================================================================== */
:root{
  --glow:linear-gradient(120deg,#6D5EF5 0%,#A855F7 50%,#EC4C9C 100%);
  --glow-soft:linear-gradient(120deg,rgba(109,94,245,.16),rgba(168,85,247,.12) 50%,rgba(236,76,156,.14));
  --card-shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 18px 40px -24px rgba(0,0,0,.7);
}

/* ---------- Hintergrund mit leichtem Farbschimmer ---------- */
body{ background:
  radial-gradient(900px 480px at 85% -120px, rgba(168,85,247,.13), transparent 70%),
  radial-gradient(760px 420px at -10% 0, rgba(109,94,245,.12), transparent 70%),
  var(--bg); background-attachment:fixed; overflow-x:hidden; }
::selection{ background:rgba(139,124,250,.4); color:#fff; }

/* Alte Kopfzeilen ausblenden (falls noch irgendwo vorhanden) */
.top-bar{ display:none !important; }

/* ---------- Neue App-Kopfzeile ---------- */
.app-header{ position:sticky; top:0; z-index:60; background:rgba(8,9,15,.74);
  backdrop-filter:saturate(160%) blur(14px); -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line-soft); }
.app-header::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(139,124,250,.55),rgba(236,76,156,.45),transparent); opacity:.6; }
.app-header .inner{ max-width:1240px; margin:0 auto; padding:0 24px; height:64px; display:flex; align-items:center; gap:14px; }
.app-header .brand{ display:flex; align-items:center; gap:10px; padding:0; flex:none; }
.app-header .brand-mark{ width:34px; height:34px; border-radius:11px; background:var(--glow); display:grid; place-items:center; box-shadow:0 6px 18px rgba(168,85,247,.4); }
.app-header .brand-name{ font-weight:800; font-size:17px; letter-spacing:-.01em; }
.app-header .brand-name b{ color:var(--indigo-2); }
.app-back{ display:inline-flex; align-items:center; gap:7px; height:36px; padding:0 14px 0 10px; border-radius:999px;
  font-size:13px; font-weight:600; color:var(--dim); background:rgba(255,255,255,.04); border:1px solid var(--line);
  transition:color .15s, border-color .15s, background .15s; flex:none; cursor:pointer; }
.app-back:hover{ color:var(--text); border-color:var(--indigo-2); background:rgba(139,124,250,.1); }
.app-back svg{ transition:transform .2s var(--ease); }
.app-back:hover svg{ transform:translateX(-2px); }
.role-tag{ margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700;
  padding:7px 14px; border-radius:999px; border:1px solid var(--line); background:var(--surface); color:var(--dim); white-space:nowrap; }
.role-tag.role-creator{ color:#F9A8D4; border-color:rgba(236,76,156,.35); background:rgba(236,76,156,.1); }
.role-tag.role-firm{ color:#C4B5FD; border-color:rgba(139,124,250,.4); background:rgba(109,94,245,.12); }
.role-tag.role-admin{ color:#FCD34D; border-color:rgba(245,166,35,.38); background:rgba(245,166,35,.1); }
.app-header .header-cta{ margin-left:0; }
.app-header .role-tag + .header-cta{ margin-left:4px; }
@media (max-width:640px){
  .app-header .inner{ padding:0 14px; height:58px; gap:10px; }
  .app-back{ padding:0 10px; }
  .app-back-label{ display:none; }
  .app-header .brand-name{ font-size:15.5px; }
  .app-header .brand-mark{ width:30px; height:30px; }
  .role-tag{ font-size:11.5px; padding:6px 10px; }
}
@media (max-width:400px){ .app-header .brand-name b{ display:none; } }

/* ---------- Hero-Bereich ---------- */
.hero h1{ font-weight:800; letter-spacing:-.025em; }
.hero-badge{ background:var(--glow-soft) !important; border:1px solid rgba(139,124,250,.3); color:#D6CCFF !important; }
.hero .accent, .accent-text{ background:var(--glow); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* ---------- Karten / Panels: Glas-Look ---------- */
.apply-card, .form-card, .status-card, .account-panel, .profile-panel, .deal-card, .listing, .like-card,
.app-card, .pending-card, .overview-card, .settings-card, .chart-card, .stat-box, .recent-box, .lock-card,
.person-row, .earn-box, .teaser, .rating-box, .profile-admin, .mini-chart, .deal-row-wrap{
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)), var(--surface);
  border-color:var(--line-soft);
  box-shadow:var(--card-shadow);
}
.person-row, .deal-row-wrap{ border-radius:var(--r-md); }
.listing, .deal-card, .app-card, .stat-box, .overview-card{ transition:transform .18s var(--ease), border-color .18s, box-shadow .18s; }
.listing:hover, .deal-card:hover, .stat-box:hover{ transform:translateY(-2px); border-color:rgba(139,124,250,.4); box-shadow:0 22px 44px -24px rgba(109,94,245,.45); }

/* ---------- Buttons ---------- */
.submit-btn, .accept-btn, .save-btn, .pay-btn, .rating-submit, .header-cta{
  background:var(--glow) !important; color:#fff !important; border:0 !important;
  box-shadow:0 10px 26px -10px rgba(168,85,247,.6); transition:transform .15s var(--ease), box-shadow .2s, filter .2s; }
.submit-btn:hover:not(:disabled), .accept-btn:hover:not(:disabled), .save-btn:hover:not(:disabled),
.pay-btn:hover:not(:disabled), .header-cta:hover{
  transform:translateY(-1px); box-shadow:0 14px 32px -10px rgba(168,85,247,.75); filter:brightness(1.06); }
.submit-btn:disabled, .accept-btn:disabled, .save-btn:disabled{ filter:grayscale(.5); opacity:.6; box-shadow:none; }
.pill-btn, .mini-btn, .load-more{ transition:border-color .15s, color .15s, background .15s; }
.pill-btn:hover, .mini-btn:hover, .load-more:hover{ border-color:var(--indigo-2); }

/* ---------- Formulare ---------- */
input[type=text], input[type=email], input[type=password], input[type=number], input[type=url], input[type=tel],
input[type=search], input[type=date], select, textarea{
  transition:border-color .15s, box-shadow .15s, background .15s; }
input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, input[type=number]:focus,
input[type=url]:focus, input[type=tel]:focus, input[type=search]:focus, input[type=date]:focus, select:focus, textarea:focus{
  outline:none; border-color:var(--indigo-2) !important; box-shadow:0 0 0 4px rgba(139,124,250,.16); }

/* ---------- Tabs ---------- */
.auth-tabs{ background:rgba(255,255,255,.03); border-color:var(--line-soft); }
.auth-tabs button.is-on, .deal-tab.is-active{ background:var(--glow) !important; color:#fff !important; border-color:transparent !important; box-shadow:0 8px 20px -10px rgba(168,85,247,.7); }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--line-soft); }

/* ---------- Scrollbalken ---------- */
*{ scrollbar-color:#2A2F4A transparent; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-thumb{ background:#2A2F4A; border-radius:10px; border:2px solid var(--bg); }
::-webkit-scrollbar-track{ background:transparent; }

/* ==========================================================================
   Admin-Bereich: strukturiertes Layout mit Seitenleiste
   ========================================================================== */
body.admin-in .hero{ display:none !important; }
body.admin-in #admin-grid{ max-width:1240px; padding-top:26px; }
#admin-grid.admin-grid{ grid-template-columns:250px minmax(0,1fr); gap:28px; align-items:start; }
.admin-main{ min-width:0; display:flex; flex-direction:column; gap:24px; }

.admin-side{ position:sticky; top:84px; max-height:calc(100vh - 100px); overflow-y:auto; overscroll-behavior:contain;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01)), var(--surface);
  border:1px solid var(--line-soft); border-radius:var(--r-lg); padding:16px 12px; box-shadow:var(--card-shadow);
  display:flex; flex-direction:column; gap:6px; scrollbar-width:thin; }
.side-head{ display:flex; flex-direction:column; gap:2px; padding:4px 10px 12px; border-bottom:1px solid var(--line-soft); margin-bottom:4px; }
.side-title{ font-weight:800; font-size:15px; background:var(--glow); -webkit-background-clip:text; background-clip:text; color:transparent; width:max-content; }
.side-sub{ font-size:12px; color:var(--faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Navigation: senkrecht statt Pillen-Leiste */
.admin-side .quick-nav{ position:static; display:flex; flex-direction:column; flex-wrap:nowrap; gap:2px;
  background:none; backdrop-filter:none; -webkit-backdrop-filter:none; padding:0; margin:0; border:0; overflow:visible; }
.admin-side .nav-group{ display:block; font-size:10.5px; font-weight:800; letter-spacing:.09em; text-transform:uppercase;
  color:var(--faint); padding:12px 10px 4px; }
.admin-side .nav-group:first-child{ padding-top:6px; }
.admin-side .quick-nav a{ position:relative; display:flex; align-items:center; gap:10px; font-size:13.5px; font-weight:600;
  color:var(--dim); background:none; border:1px solid transparent; border-radius:11px; padding:6px 10px; line-height:1.3; flex:none; }
.admin-side .quick-nav a i{ font-style:normal; width:22px; height:22px; display:grid; place-items:center; font-size:13px;
  border-radius:8px; background:rgba(255,255,255,.04); flex:none; }
.admin-side .quick-nav a:hover{ color:var(--text); background:rgba(255,255,255,.04); border-color:transparent; }
.admin-side .quick-nav a.is-active{ color:#fff; background:var(--glow-soft); border-color:rgba(139,124,250,.35); }
.admin-side .quick-nav a.is-active::before{ content:""; position:absolute; left:-12px; top:8px; bottom:8px; width:3px; border-radius:0 3px 3px 0; background:var(--glow); }
.admin-side .quick-nav a.is-active i{ background:var(--glow); }
.admin-side .quick-nav .nav-badge{ margin-left:auto; }
.admin-side .quick-nav a.is-active .nav-badge:not(:empty){ background:#fff; color:var(--indigo); }
.admin-side .admin-logout{ margin:10px 0 0; padding:10px; border-top:1px solid var(--line-soft); border-radius:0; justify-content:flex-start; width:100%; }

/* Bereichs-Überschriften im Hauptteil */
.admin-sec-head h2{ font-size:22px; font-weight:800; letter-spacing:-.02em; }
.admin-section{ animation:cmFadeUp .28s var(--ease); }
@keyframes cmFadeUp{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .admin-section{ animation:none; } }

/* Tablet & Handy: Seitenleiste wird zur Wisch-Leiste oben */
@media (max-width:980px){
  #admin-grid.admin-grid{ grid-template-columns:minmax(0,1fr); gap:18px; }
  body.admin-in #admin-grid{ padding-top:14px; }
  .admin-side{ position:sticky; top:58px; z-index:40; max-height:none; overflow:visible; padding:8px; border-radius:16px;
    flex-direction:row; align-items:center; gap:8px; background:rgba(14,16,26,.92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
  .side-head{ display:none; }
  .admin-side .quick-nav{ flex-direction:row; overflow-x:auto; scrollbar-width:none; gap:6px; flex:1; min-width:0; }
  .admin-side .quick-nav::-webkit-scrollbar{ display:none; }
  .admin-side .nav-group{ display:none; }
  .admin-side .quick-nav a{ white-space:nowrap; padding:7px 12px 7px 8px; font-size:13px; border-radius:999px; background:rgba(255,255,255,.03); border-color:var(--line-soft); }
  .admin-side .quick-nav a i{ width:20px; height:20px; font-size:12px; background:none; }
  .admin-side .quick-nav a.is-active::before{ display:none; }
  .admin-side .quick-nav a.is-active i{ background:none; }
  .admin-side .admin-logout{ margin:0; width:auto; flex:none; border-top:0; border-left:1px solid var(--line-soft); padding:6px 4px 6px 10px; font-size:0; gap:0; }
  .admin-side .admin-logout svg{ width:18px; height:18px; }
}

/* ==========================================================================
   Creator- & Firmenbereich im Instagram-Stil
   ========================================================================== */
body.creator-in .hero, body.firm-in .hero{ display:none; }
body.creator-in main > .wrap, body.firm-in main > .wrap{ max-width:960px; padding-top:22px; }
body.firm-in #header-cta{ display:none !important; }

/* Profilkopf */
.ig-head{ display:flex; align-items:center; gap:26px; padding:8px 4px 22px; }
.ig-avatar{ flex:none; width:96px; height:96px; border-radius:50%; padding:3px; background:conic-gradient(from 210deg,#F5A623,#EC4C9C,#A855F7,#6D5EF5,#F5A623); position:relative; }
.ig-avatar::after{ content:""; position:absolute; inset:3px; border-radius:50%; border:3px solid var(--bg); pointer-events:none; }
.ig-avatar > span, .ig-avatar > img{ width:100%; height:100%; border-radius:50%; display:grid; place-items:center; object-fit:cover;
  background:var(--glow); color:#fff; font-size:38px; font-weight:800; }
.ig-avatar.is-firm > span{ background:linear-gradient(135deg,#1f2340,#2b2560); color:#D6CCFF; }
.ig-info{ flex:1; min-width:0; }
.ig-top{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.ig-name{ font-size:24px; font-weight:800; letter-spacing:-.02em; margin:0; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.ig-logout{ margin-left:auto; font-size:12.5px; font-weight:600; color:var(--dim); padding:7px 14px; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid var(--line); }
.ig-logout:hover{ color:var(--text); border-color:var(--indigo-2); }
.ig-sub{ margin:4px 0 0; font-size:13.5px; color:var(--dim); }
.ig-star{ color:#F5C451; }
.ig-stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:16px; }
.ig-stat{ text-align:left; padding:8px 10px; border-radius:12px; background:none; border:0; color:inherit; font:inherit; }
button.ig-stat{ cursor:pointer; transition:background .15s; }
button.ig-stat:hover{ background:rgba(255,255,255,.04); }
.ig-stat b{ display:block; font-size:19px; font-weight:800; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ig-stat b.up{ color:var(--up); }
.ig-stat span{ display:block; font-size:12px; color:var(--faint); }

/* Reiter (Desktop: oben wie Instagram-Profilreiter, Handy: Leiste unten) */
.ig-nav{ position:sticky; top:64px; z-index:45; display:flex; align-items:stretch; justify-content:center; gap:4px;
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); margin:0 0 24px;
  background:rgba(8,9,15,.82); backdrop-filter:saturate(160%) blur(14px); -webkit-backdrop-filter:saturate(160%) blur(14px); }
.ig-tab{ position:relative; display:flex; align-items:center; gap:8px; padding:14px 18px; font-size:13px; font-weight:700; letter-spacing:.02em;
  color:var(--faint); background:none; border:0; cursor:pointer; transition:color .15s; text-decoration:none; }
.ig-tab svg{ width:20px; height:20px; }
.ig-tab:hover{ color:var(--text); }
.ig-tab.is-active{ color:var(--text); }
.ig-tab.is-active::after{ content:""; position:absolute; left:14px; right:14px; top:-1px; height:2px; border-radius:2px; background:var(--glow); }
.ig-badge{ font-style:normal; min-width:18px; height:18px; padding:0 5px; border-radius:99px; background:#EC4C9C; color:#fff; font-size:11px; font-weight:800; display:inline-grid; place-items:center; box-shadow:0 0 0 2px var(--bg); }
.ig-badge:empty{ display:none; }
.ig-tab[hidden], .ig-tab[style*="display: none"]{ display:none !important; }

/* Großes ➕ (Firmen) */
.ig-fab{ display:flex; align-items:center; gap:8px; margin:7px 10px; padding:0 20px 0 8px; border-radius:999px; border:0; cursor:pointer; color:#fff; font-weight:800; font-size:13.5px;
  background:var(--glow); box-shadow:0 10px 26px -8px rgba(168,85,247,.7); transition:transform .15s var(--ease), box-shadow .2s; }
.ig-fab:hover{ transform:translateY(-1px) scale(1.02); box-shadow:0 14px 32px -8px rgba(236,76,156,.7); }
.ig-fab:active{ transform:scale(.95); }
.ig-fab-plus{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.2); transition:transform .3s var(--ease); }
.ig-fab:hover .ig-fab-plus{ transform:rotate(90deg); }
.ig-fab-plus svg{ width:18px; height:18px; }
.ig-fab{ position:relative; }
.ig-fab .ig-badge{ position:absolute; top:-6px; right:-6px; }
.ig-fab.is-active{ box-shadow:0 0 0 3px rgba(139,124,250,.35), 0 10px 26px -8px rgba(168,85,247,.7); }

/* Bereiche */
.ftab[hidden], #ctab-deals[hidden]{ display:none !important; }
.ftab .form-card{ position:static; max-width:680px; margin:0 auto; }
.new-deal-head{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.ndh-ico{ width:46px; height:46px; flex:none; border-radius:14px; display:grid; place-items:center; background:var(--glow); color:#fff; box-shadow:0 10px 24px -10px rgba(168,85,247,.7); }
.ig-empty-cta{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; margin-top:16px; padding:16px; border-radius:var(--r-lg);
  border:1.5px dashed rgba(139,124,250,.45); background:rgba(109,94,245,.06); color:#D6CCFF; font-weight:700; cursor:pointer; transition:background .15s, border-color .15s; }
.ig-empty-cta:hover{ background:rgba(109,94,245,.12); border-color:var(--indigo-2); }
.ig-empty-cta[hidden]{ display:none; }
.ig-empty-cta svg{ width:18px; height:18px; }

/* „✨ Neue Deals“-Pille */
.new-pill{ position:fixed; top:126px; left:0; right:0; margin:0 auto; width:max-content; max-width:calc(100% - 32px); z-index:70; display:inline-flex; align-items:center; gap:8px;
  padding:10px 18px 10px 14px; border-radius:999px; border:0; cursor:pointer; color:#fff; font-weight:800; font-size:14px;
  background:var(--glow); box-shadow:0 14px 34px -10px rgba(168,85,247,.85), 0 0 0 1px rgba(255,255,255,.15) inset; }
.new-pill[hidden]{ display:none; }
.new-pill.pop{ animation:cmPillIn .45s cubic-bezier(.2,1.4,.4,1); }
.new-pill:hover{ box-shadow:0 18px 40px -10px rgba(236,76,156,.9), 0 0 0 1px rgba(255,255,255,.25) inset; }
@keyframes cmPillIn{ from{ opacity:0; transform:translateY(-16px) scale(.9); } to{ opacity:1; transform:none; } }
.flash-new{ animation:cmFlash 2.2s ease; }
@keyframes cmFlash{ 0%,40%{ box-shadow:0 0 0 3px rgba(236,76,156,.75), 0 20px 40px -20px rgba(236,76,156,.6); } 100%{ box-shadow:var(--card-shadow); } }

/* Handy: Leiste unten wie bei Instagram */
@media (max-width:720px){
  body.creator-in, body.firm-in{ padding-bottom:calc(74px + env(safe-area-inset-bottom)); }
  body.creator-in main > .wrap, body.firm-in main > .wrap{ padding-top:14px; }
  .ig-head{ display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:16px; row-gap:0; padding:4px 0 14px; align-items:center; }
  .ig-info{ display:contents; }
  .ig-avatar{ grid-row:1 / span 2; }
  .ig-top{ grid-column:2; align-self:end; }
  .ig-sub{ grid-column:2; align-self:start; }
  .ig-stats{ grid-column:1 / -1; }
  .ig-avatar{ width:74px; height:74px; }
  .ig-avatar > span{ font-size:28px; }
  .ig-name{ font-size:19px; }
  .ig-top{ gap:8px; }
  .ig-logout{ padding:5px 10px; font-size:12px; }
  .ig-sub{ font-size:12.5px; }
  .ig-stats{ margin-top:12px; gap:2px; border-top:1px solid var(--line-soft); padding-top:8px; }
  .ig-stat{ text-align:center; padding:6px 2px; }
  .ig-stat b{ font-size:16px; }
  .ig-stat span{ font-size:11px; }
  .ig-nav{ position:fixed; top:auto; bottom:0; left:0; right:0; margin:0; border-bottom:0; justify-content:space-around; gap:0;
    padding:4px 4px calc(4px + env(safe-area-inset-bottom)); background:rgba(8,9,15,.94); z-index:65; }
  .ig-tab{ flex:1; flex-direction:column; gap:3px; padding:8px 2px 6px; font-size:10.5px; letter-spacing:0; }
  .ig-tab svg{ width:24px; height:24px; }
  .ig-tab.is-active::after{ display:none; }
  .ig-tab.is-active svg{ filter:drop-shadow(0 0 8px rgba(168,85,247,.6)); }
  .ig-tab.is-active{ color:#fff; }
  .ig-badge{ position:absolute; top:3px; left:calc(50% + 6px); }
  .ig-fab{ flex:none; width:58px; height:58px; padding:0; margin:-22px 6px 0; justify-content:center; border-radius:50%; box-shadow:0 0 0 5px var(--bg), 0 12px 28px -6px rgba(168,85,247,.8); }
  .ig-fab-plus{ width:auto; height:auto; background:none; }
  .ig-fab-plus svg{ width:28px; height:28px; }
  .ig-fab-label{ position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:7px; font-size:10.5px; font-weight:700; color:#fff; white-space:nowrap; }
  .ig-fab .ig-badge{ top:-2px; right:-2px; }
  .ig-nav.has-fab{ padding-bottom:calc(18px + env(safe-area-inset-bottom)); }
  body.creator-in, body.firm-in{ padding-bottom:calc(88px + env(safe-area-inset-bottom)); }
  .new-pill{ top:70px; font-size:13.5px; }
  body.creator-in .site-footer, body.firm-in .site-footer{ padding-bottom:20px; }
}
@media (max-width:380px){ .ig-stat b{ font-size:14.5px; } }
@media (max-width:720px){ body.ctab-market .ig-head{ display:none; } }

/* Alle Deals (Marktplatz) */
.market-head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.market-head h2{ font-size:22px; font-weight:800; letter-spacing:-.02em; display:flex; align-items:center; gap:10px; }
.market-count{ font-size:13px; font-weight:800; padding:3px 10px; border-radius:999px; background:var(--glow-soft); border:1px solid rgba(139,124,250,.35); color:#D6CCFF; }
.market-search{ flex:1; min-width:200px; max-width:360px; margin-left:auto; height:42px; padding:0 16px; border-radius:999px; background:var(--surface); border:1px solid var(--line); color:var(--text); font:inherit; font-size:14px; }
.m-row{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.m-label{ flex:none; width:72px; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--faint); }
.m-chips{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px 0; min-width:0; }
.m-chips::-webkit-scrollbar{ display:none; }
.m-chip{ flex:none; padding:8px 14px; border-radius:999px; font-size:13px; font-weight:700; color:var(--dim); background:var(--surface); border:1px solid var(--line); cursor:pointer; white-space:nowrap; transition:color .15s, border-color .15s, background .15s; }
.m-chip:hover{ color:var(--text); border-color:var(--indigo-2); }
.m-chip.is-on{ color:#fff; background:var(--glow); border-color:transparent; box-shadow:0 8px 20px -10px rgba(168,85,247,.8); }
.market .listing-grid{ margin-top:18px; }
.market-cta{ display:flex; align-items:center; gap:14px; width:100%; text-align:left; padding:16px 18px; margin:0 0 26px; border-radius:var(--r-lg); cursor:pointer; color:var(--text);
  background:linear-gradient(120deg,rgba(109,94,245,.22),rgba(168,85,247,.16) 50%,rgba(236,76,156,.2)); border:1px solid rgba(139,124,250,.4); box-shadow:0 18px 40px -24px rgba(168,85,247,.8); transition:transform .15s var(--ease), border-color .15s; }
.market-cta:hover{ transform:translateY(-2px); border-color:var(--indigo-2); }
.mc-ico{ width:48px; height:48px; flex:none; border-radius:15px; display:grid; place-items:center; background:var(--glow); color:#fff; box-shadow:0 10px 24px -10px rgba(168,85,247,.8); }
.mc-txt{ flex:1; min-width:0; display:flex; flex-direction:column; }
.mc-txt b{ font-size:17px; font-weight:800; }
.mc-txt small{ font-size:13px; color:var(--dim); }
.mc-new{ flex:none; font-size:12px; font-weight:800; padding:4px 10px; border-radius:999px; background:#EC4C9C; color:#fff; }
.mc-arr{ flex:none; font-size:20px; color:var(--indigo-2); transition:transform .2s var(--ease); }
.market-cta:hover .mc-arr{ transform:translateX(4px); }
.sec-h{ font-size:19px; font-weight:800; margin:0 0 12px; }
@media (max-width:720px){
  .market-head h2{ font-size:19px; }
  .market-search{ max-width:none; min-width:0; width:100%; margin-left:0; flex-basis:100%; }
  .m-row{ flex-direction:column; align-items:stretch; gap:6px; }
  .m-label{ width:auto; }
  .m-chips{ margin:0 -16px; padding:2px 16px; }
}
.admin-side .quick-nav a.nav-ext{ color:var(--faint); font-weight:600; }
.admin-side .quick-nav a.nav-ext::after{ content:"↗"; margin-left:auto; font-size:12px; opacity:.6; }
.admin-side .quick-nav a.nav-ext:hover{ color:var(--text); }
@media (max-width:720px){ body.creator-in #cm-top, body.firm-in #cm-top{ bottom:calc(100px + env(safe-area-inset-bottom)); right:12px; } }

/* ==========================================================================
   HANDY v2: App-Bereiche strukturierter & mit mehr Style
   ========================================================================== */
@media (max-width:720px){
  /* Eingabefelder: 16px verhindert das automatische Hineinzoomen am iPhone */
  input[type=text], input[type=email], input[type=password], input[type=number], input[type=url], input[type=tel],
  input[type=search], input[type=date], input[type=datetime-local], select, textarea{ font-size:16px !important; }
  .field input, .field textarea, .field select{ padding:13px 14px !important; border-radius:14px !important; background:rgba(255,255,255,.04) !important; }
  .field label{ font-size:13px !important; color:#C9CEE6 !important; }
  .form-group-label{ display:flex; align-items:center; gap:10px; }
  .form-group-label::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,rgba(139,124,250,.4),transparent); }
  .apply-card, .form-card, .status-card{ padding:22px 18px !important; border-radius:24px !important; }
  .submit-btn{ min-height:52px; font-size:16px !important; border-radius:16px !important; }

  /* WhatsApp-Hinweis kompakt */
  .notif-bar{ font-size:12.5px !important; padding:9px 14px !important; gap:8px 12px !important; line-height:1.4; }
  .notif-bar button{ padding:7px 14px !important; font-size:12.5px !important; }

  /* Fortschritt bei Deals: nur aktueller Schritt beschriftet */
  .stepper{ margin:14px 0 22px !important; }
  .stepper li .lbl{ display:none; }
  .stepper li.current .lbl{ display:block; position:absolute; top:30px; left:50%; transform:translateX(-50%); white-space:nowrap; font-size:11.5px; font-weight:700; color:#D6CCFF; }
  .stepper li:last-child.current .lbl{ left:auto; right:0; transform:none; }
  .stepper li:first-child.current .lbl{ left:0; transform:none; }

  /* Deal-Karten aufgeräumter */
  .deal-cover{ aspect-ratio:16/6 !important; }
  .deal-card, .deal-row-wrap{ border-radius:22px !important; }
  .deal-row{ gap:8px !important; }
  .deal-row .info b{ font-size:16px; }
  .row-actions, .notice-actions{ display:flex; flex-wrap:wrap; gap:8px; }
  .row-actions > *, .notice-actions > *{ flex:1 1 calc(50% - 8px); justify-content:center; text-align:center; }

  /* Abschnittstitel mit Farbakzent */
  .sec-h, .deal-list-head h2{ display:flex; align-items:center; gap:10px; }
  .sec-h::before, .deal-list-head h2::before{ content:""; width:6px; height:22px; border-radius:6px; background:var(--glow); flex:none; }

  /* Start-Check kompakter */
  .onb{ padding:16px !important; border-radius:22px !important; }
  .onb-list li button{ padding:11px 12px !important; font-size:13.5px !important; }
}
@media (max-width:720px){
  .market-cta{ padding:14px !important; gap:12px !important; }
  .market-cta .mc-ico{ width:44px; height:44px; border-radius:14px; }
  .market-cta .mc-arr{ display:none; }
  .market-cta .mc-txt b{ font-size:16px; } .market-cta .mc-txt small{ font-size:12.5px; line-height:1.35; }
}