/* Ruin Coin – Bedienung für PC und Handy: einheitliche Bausteine, Tippflächen, Handy-Kopfzeile.
   Wird als letztes Stylesheet geladen und ergänzt die Bereichs-CSS-Dateien. */

/* ---------- Überall ---------- */
html { -webkit-text-size-adjust: 100%; }
* { scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4em; text-align: center; }
.btn.block { display: flex; }
.btn.link { display: inline; }
:is(a, button, summary, input, select, textarea):focus-visible { outline: 2px solid var(--gold2); outline-offset: 2px; }
.row > select { min-width: 110px; }
.sidebar nav { overflow-x: hidden; }

/* Fenster: Schließen-Knopf */
.modal-x { position: sticky; top: 0; float: right; z-index: 3; margin: -8px -8px 4px 8px; background: var(--panel2); }

/* ---------- Seitenmenü mit Gruppen ---------- */
.nav-head { padding: 12px 10px 4px; color: var(--gold); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.nav-head:first-child { padding-top: 0; }
.sidebar .nav-item { padding: .42em .7em; }
.logo { padding-bottom: 12px; }

/* ---------- Einstellungen ---------- */
.settings { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.set-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.set-sec h3 { margin-bottom: .3em; }
.set-sec > p:first-of-type { margin-top: 0; }
.set-hint { color: var(--muted); font-size: .82rem; margin: 0 0 12px; }
.set-actions { display: flex; flex-direction: column; gap: 8px; }
.set-toggle { display: flex; justify-content: space-between; margin: 0; color: var(--text); font-size: .95rem; min-height: 44px; }
.set-status { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.set-name { display: flex; gap: 8px; flex-wrap: wrap; }
.set-name input { flex: 1 1 160px; min-width: 0; }
.set-sec .avatar-pick { margin-top: .3em; }

/* ---------- Team-Panel: aufklappbare Bereiche ---------- */
.adm-sec > h3 { display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer; user-select: none; }
.adm-sec > h3::after { content: "▾"; color: var(--muted); transition: transform .15s; flex: none; }
.adm-sec.closed > h3 { margin-bottom: 0; }
.adm-sec.closed > h3::after { transform: rotate(-90deg); }
.adm-sec.closed > :not(h3) { display: none !important; }

/* ---------- Handy: Karten-Tabellen brauchen auf dem PC nichts ---------- */
@media (min-width: 761px) {
  .mobile-only { display: none !important; }
}

/* ---------- Touch-Geräte und schmale Fenster: Tippflächen ---------- */
@media (max-width: 760px), (pointer: coarse) {
  .btn, .btn.sm, .tab, .ptab, .car-tab, .sb-tab, .sb-chip, .bot-chip, .bot-risk, .admin-tab, .dz-tab, .chat-tabs button {
    min-height: 44px; display: inline-flex; align-items: center; justify-content: center;
  }
  .btn.block { display: flex; }
  .btn.link { display: inline-flex; }
  .ptab, .car-tab, .sb-tab { text-decoration: none; }
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]), select, textarea { min-height: 44px; font-size: 16px; }
  input[type=range] { min-height: 44px; }
  summary { padding-block: 10px; }
  .check, .switch { min-height: 44px; }
  .check input { width: 22px; height: 22px; flex: none; }
  .icon-btn, .icon-btn.sm, .chat-head .icon-btn { min-width: 44px; min-height: 44px; }
  .sm-btn { width: 44px; height: 44px; }
  .chat-emojis button { min-width: 40px; min-height: 40px; }
  .chat-tools button { min-width: 34px; min-height: 34px; font-size: 1rem; }
  .table-wrap td a:not(.btn), .list-item > a:not(.btn) { display: inline-flex; align-items: center; min-height: 40px; }
  .adm-sec > h3 { min-height: 44px; }
}
/* Ohne Maus gibt es kein Überfahren: Chat-Werkzeuge immer zeigen */
@media (hover: none) {
  .chat-tools { display: inline-flex; }
}

/* ---------- Handy ---------- */
@media (max-width: 760px) {
  html, body { overflow-x: clip; }
  .view { padding: 14px 14px calc(84px + env(safe-area-inset-bottom)); }
  .card { padding: 14px; }
  h2 { font-size: 1.3rem; }
  .page-head { margin-bottom: 12px; align-items: stretch; }
  .page-head > div:first-child { flex: 1 1 100%; }
  .page-head > select, .page-head > .btn { flex: 1 1 100%; width: 100% !important; max-width: none !important; }

  /* Kopfzeile: eine Zeile, Suche klappt bei Bedarf auf */
  .topbar { flex-wrap: nowrap; gap: 6px; padding: calc(6px + env(safe-area-inset-top)) 10px 6px; }
  .topbar .icon-btn { width: 40px; min-width: 40px; }
  #soundBtn { display: none; }
  .balances { flex: 1 1 auto; min-width: 0; margin: 0; flex-direction: column; gap: 0; justify-content: center; align-self: stretch; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 2px 8px; }
  .bal { background: none; border: 0; border-radius: 6px; padding: 0; font-size: .78rem; line-height: 1.3; gap: 5px; min-width: 0; }
  .bal > span:last-child { overflow: hidden; text-overflow: ellipsis; }
  .bal .coin.sm { width: 13px; height: 13px; font-size: 8px; }
  .bal-ico { font-size: .72rem; width: 13px; text-align: center; }
  .me-chip { flex: none; padding: 0; border: 0; background: none; }
  .search { position: absolute; left: 0; right: 0; top: 100%; max-width: none; flex: none; order: 0; padding: 8px 10px; background: rgba(9,12,11,.97); border-bottom: 1px solid var(--line); display: none; }
  .topbar.search-open .search { display: block; }
  .suggest { left: 10px; right: 10px; }
  .suggest-item { min-height: 44px; }
  .notif-panel { top: 58px; left: 10px; right: 10px; max-height: calc(100dvh - 150px); }
  .ticker { font-size: .78rem; }
  .ticker-inner { padding: .3em 0; }

  /* Menü „Mehr“: zweispaltig, alles auf einen Blick */
  .sidebar { width: min(88vw, 340px); padding: calc(12px + env(safe-area-inset-top)) 10px calc(10px + env(safe-area-inset-bottom)); }
  .sidebar nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 4px; align-content: start; }
  .nav-head { grid-column: 1 / -1; padding: 10px 8px 2px; }
  .sidebar .nav-item { position: relative; padding: .3em .5em; min-height: 44px; gap: 7px; font-size: .9rem; line-height: 1.15; }
  .sidebar .nav-item .ico { width: 20px; flex: none; }
  .nav-item.soon::after, .nav-item.team-only::after { position: absolute; right: 2px; top: 1px; margin: 0; font-size: .55rem; padding: 0 .3em; background: var(--bg2); }
  .sidebar .logo { padding-bottom: 6px; }
  .sidebar-foot { padding-top: 6px; }
  .bottom-nav a, .bottom-nav button { min-height: 52px; justify-content: center; }

  /* Kennzahlen als Zeilen: lange Beträge passen, nichts bricht mitten in der Zahl um */
  .grid:has(> .stat) { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .card.stat { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2px 12px; padding: 10px 14px; }
  .stat .label { flex: 1 1 auto; min-width: 0; font-size: .74rem; }
  .stat .value { margin: 0; font-size: 1.08rem; white-space: nowrap; overflow-wrap: normal; }
  .stat .sub { flex: 1 1 100%; }

  /* Reiter: alle Einträge sichtbar statt versteckt zur Seite scrollen */
  .page-tabs, .car-tabs, .sb-tabs { flex-wrap: wrap; overflow: visible; margin-bottom: 12px; }
  .ptab, .car-tab, .sb-tab { flex: 1 1 auto; padding: .4em .7em; font-size: .88rem; text-align: center; }
  .admin-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; }
  .admin-tab { padding: .3em .2em; font-size: .78rem; white-space: normal; line-height: 1.15; position: relative; gap: 3px; }
  .admin-tab .admin-badge { position: absolute; top: -4px; right: -2px; }
  .dz-tabs { flex-wrap: wrap; overflow: visible; }
  .dz-tab { flex: 1 1 auto; font-size: .85rem; padding: .3em .5em; }
  /* Filter-Chips bleiben scrollbar, der Rand zeigt, dass es weitergeht */
  .sb-chips { mask-image: linear-gradient(90deg, #000 92%, transparent); padding-right: 20px; }

  /* Fenster nutzen die volle Breite */
  .modal { padding: 8px; place-items: end center; }
  .modal-card, .modal-card.wide { max-width: none; max-height: calc(100dvh - 16px); padding: 16px; border-radius: 16px; }
  .row > .btn { flex: 1 1 auto; }
  .toast { min-width: 0; max-width: none; }

  /* Rangliste passt ohne Seitwärts-Scrollen */
  .card.table-wrap { overflow-x: hidden; }
  .card.table-wrap .lb th, .card.table-wrap .lb td { padding: .55em .35em; font-size: .86rem; }
  .card.table-wrap .lb th:first-child, .card.table-wrap .lb td:first-child { padding-left: .7em; width: 44px; white-space: nowrap; }
  .card.table-wrap .lb th:last-child, .card.table-wrap .lb td:last-child { padding-right: .7em; }
  .card.table-wrap .lb td.right { white-space: nowrap; }
  .card.table-wrap .who { gap: 6px; flex-wrap: wrap; }
  .card.table-wrap .who .avatar { width: 28px; height: 28px; font-size: 15px; }
  .card.table-wrap .who b { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .card.table-wrap .clan-tag { font-size: .68rem; }

  /* Breite Tabellen werden zu Karten (Beschriftung setzt app.js aus den Spaltenköpfen) */
  .table-wrap:not(.card) { overflow-x: visible; }
  .table-wrap:not(.card) table, .table-wrap:not(.card) tbody, .table-wrap:not(.card) tr { display: block; width: 100%; }
  .table-wrap:not(.card) thead { display: none; }
  .table-wrap:not(.card) tr { border: 1px solid var(--line); border-radius: 12px; padding: 6px 12px; margin-bottom: 8px; background: var(--panel2); }
  .table-wrap:not(.card) td { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; border: 0; border-bottom: 1px dashed rgba(255,255,255,.06); text-align: right; min-width: 0; overflow-wrap: break-word; }
  .table-wrap:not(.card) td:last-child { border-bottom: 0; }
  .table-wrap:not(.card) td.hide-sm { display: none; }
  .table-wrap:not(.card) td::before { content: attr(data-label); color: var(--muted); font-size: .78rem; text-align: left; flex: 0 1 auto; min-width: 0; }
  .table-wrap:not(.card) td:not([data-label])::before, .table-wrap:not(.card) td[data-label=""]::before { display: none; }
  .table-wrap:not(.card) td:not([data-label]), .table-wrap:not(.card) td[data-label=""] { justify-content: flex-start; text-align: left; flex-wrap: wrap; }
  .table-wrap:not(.card) td > :is(input, select) { flex: 1 1 50%; width: auto; min-width: 0; }
  .table-wrap:not(.card) td > .who { flex-wrap: wrap; }

  /* Einstellungen */
  .settings { grid-template-columns: minmax(0, 1fr); }
  .profile-head { gap: 12px; }
  .profile-head h2 { font-size: 1.4rem; }
  .profile-head .avatar.lg { width: 72px; height: 72px; font-size: 38px; }
  .profile-head > .row { flex: 1 1 100%; }
  .profile-head > .row > * { flex: 1 1 auto; }

  /* Dashboard-Kacheln */
  .grid.cols-3:has(> .soon-card) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .soon-card { flex-direction: column; text-align: center; gap: 4px; padding: 12px 8px; }
  .soon-card .big { font-size: 28px; line-height: 1.1; }
  .soon-card .tiny { display: none; }

  /* Roulette: Kessel-Tisch hochkant statt seitwärts scrollen */
  .rt-wrap { overflow: visible; }
  .rt-grid { min-width: 0; grid-template-columns: 34px 34px repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(14, 40px); }
  .rt-cell { grid-row: var(--mr) !important; grid-column: var(--mc) !important; }
  .rt-cell.r .rt-label, .rt-cell.b .rt-label, .rt-cell.g .rt-label { width: 30px; height: 30px; }
  .rt-cell.out { font-size: .78rem; }
  .rt-cell.side { writing-mode: vertical-rl; }
  .rt-chips .chip { width: 26px; height: 26px; }
  .felt-controls { flex-wrap: wrap; }
  .felt-controls > * { flex: 1 1 100%; min-width: 0; }
  .felt-controls .row { flex: 1 1 100% !important; }
  .felt-controls .row > span { flex: 1 1 100%; }

  /* Wettschein-Knopf nicht über dem Chat */
  body.chat-open .sb-fab { display: none; }
  .chat-drawer { height: 100dvh; bottom: auto; }
  .chat-tabs button { font-size: .85rem; }

  /* Team-Panel */
  .md-top { min-width: 0; }
  .md-body > * { min-width: 0; }
  .md-3d { max-width: 100%; }
  .admin-panel .row > label { flex: 1 1 100%; }
  .admin-panel .card h3 { font-size: 1rem; }
  .admin-panel [style*="max-width"] { max-width: none !important; }
}
@media (max-width: 760px), (pointer: coarse) {
  .chip-f { min-height: 44px; }
  .help-box summary { padding-block: 10px; }
  .btn.sm { min-width: 44px; }
}
@media (max-width: 760px) {
  /* Ticker und Aktivitäten: Symbol neben dem Text, Zeit darunter */
  .feed:not(#aLog):not(#xFeed) .list-item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 10px; }
  .feed:not(#aLog):not(#xFeed) .list-item small { grid-column: 2; margin: 0; }
  .tc-value { font-size: .84rem; white-space: nowrap; }
  .fw-wrap { max-width: 100%; }
  #whSvg { max-width: 100%; }
}
@media (max-width: 760px) {
  .check { white-space: normal; }
  /* Tabellen im Sportbereich: nur das Wichtigste */
  .sb-table th, .sb-table td { padding: 6px 4px; }
  .sb-tt { white-space: normal !important; min-width: 96px; }
}

/* Reiter brechen um, statt Einträge außerhalb des Fensters zu verstecken */
.admin-tabs, .page-tabs, .car-tabs, .sb-tabs, .dz-tabs { flex-wrap: wrap; overflow: visible; }

/* Mittlere Fensterbreiten: lange Beträge sprengen vier Spalten nicht */
@media (min-width: 761px) and (max-width: 1300px) {
  .grid.cols-4:has(> .stat) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 761px) {
  .rt-grid { min-width: 0; grid-template-columns: 48px repeat(12, minmax(0, 1fr)) 48px; }
}
@media (max-width: 760px) {
  .row > select { min-width: 0; }
  .nav-head { padding-top: 7px; }
}

/* Fenster mit eigenem Schließen- oder Abbrechen-Knopf brauchen keinen zweiten */
#modalCard:has([data-close]:not(.modal-x)) .modal-x { display: none; }
.dz-head .muted { word-break: normal; }
@media (max-width: 760px) {
  .daily-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .clan-hero-stats { flex-wrap: wrap; gap: 8px 18px; }
  .clan-hero-stats b { font-size: 1rem; }
  .g2-layout > *, .g2-board { min-width: 0; }
  .g2-board .fw-wrap { width: 100%; max-width: calc(100vw - 58px); }
}

/* ================= App-Hülle ================= */
/* Auf dem PC bleibt alles wie gehabt: Seitenmenü links */
.app-back, .app-title, .more-sheet, .more-backdrop { display: none; }

/* Bereichs-Seiten */
.hub-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.hub-tile { display: flex; align-items: center; gap: 12px; padding: 12px 14px; min-height: 68px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(180deg, var(--panel), var(--bg2)); }
.hub-tile:hover { border-color: var(--gold-dark); }
.hub-tile.locked { opacity: .55; }
.hub-ico { width: 44px; height: 44px; flex: none; display: grid; place-items: center; font-size: 24px; border-radius: 12px; background: var(--bg); border: 1px solid var(--line); }
.hub-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.hub-text small { color: var(--muted); font-size: .78rem; }
.hub-sum { margin-bottom: 12px; }
.hub-sum > small { display: block; color: var(--muted); font-size: .8rem; }
.hub-sum > b { font-size: 1.6rem; color: var(--gold2); font-variant-numeric: tabular-nums; }
.hub-sum-row { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 4px; font-size: .9rem; font-variant-numeric: tabular-nums; }
.hub-sum-row i { font-style: normal; display: inline-grid; vertical-align: middle; }

/* Startseite */
.home-hero { margin-bottom: 14px; }
.hh-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.hh-net small, .hh-row small, .hh-rank small { display: block; color: var(--muted); font-size: .76rem; }
.hh-net b { display: block; font-size: 1.9rem; line-height: 1.2; color: var(--gold2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hh-rank { text-align: right; flex: none; }
.hh-rank b { font-size: 1.4rem; }
.hh-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.hh-row b { font-size: 1.1rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hh-lvl { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.quick-grid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.quick-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 72px; padding: 8px 2px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); font-size: .78rem; font-weight: 600; }
.quick-tile:hover { border-color: var(--gold-dark); }
.quick-tile span { font-size: 24px; line-height: 1.2; }

/* Einstellungen als Liste */
.settings { display: block; }
.set-wrap { max-width: 640px; margin: 0 auto; }
.set-me { display: flex; align-items: center; gap: 14px; }
.set-me .avatar.lg { width: 64px; height: 64px; font-size: 34px; }
.set-me-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.set-me-text b { font-size: 1.1rem; }
.set-me-text small { color: var(--muted); }
.chev { color: var(--muted); font-size: 1.3rem; line-height: 1; flex: none; }
.set-head { margin: 18px 4px 6px; color: var(--muted); font-size: .74rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.set-group { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; }
.set-pad { padding: 10px; }
.set-row { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; margin: 0; padding: 6px 14px; background: none; border: 0; border-bottom: 1px solid var(--line); color: var(--text); font: inherit; font-size: .95rem; text-align: left; cursor: pointer; }
.set-row:last-child { border-bottom: 0; }
.set-row:hover { background: rgba(255,255,255,.03); }
.set-ico { width: 24px; text-align: center; flex: none; }
.set-label { flex: 1; min-width: 0; }
.set-value { color: var(--muted); font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 45%; }
.set-row .switch { min-height: 0; pointer-events: none; }
.set-out { margin-top: 20px; }
.install-steps { padding-left: 20px; line-height: 1.8; }
.avatar-pick { max-height: min(46vh, 320px); }
.app-load { min-height: 40vh; display: grid; place-items: center; }
.app-load span { width: 30px; height: 30px; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--gold); opacity: 0; animation: appSpin .8s linear infinite, appFade .2s .25s forwards; }
@keyframes appSpin { to { transform: rotate(360deg); } }
@keyframes appFade { to { opacity: 1; } }
.view.page-in { animation: pageIn .18s ease-out; }
@keyframes pageIn { from { opacity: 0; } }

@media (max-width: 1100px) { .quick-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- Handy: wie eine App ---------- */
@media (max-width: 760px) {
  :root { --bar-h: calc(54px + env(safe-area-inset-top)); --tab-h: calc(58px + env(safe-area-inset-bottom)); }
  html { -webkit-tap-highlight-color: transparent; }
  body { overscroll-behavior-y: contain; touch-action: manipulation; }
  a, button, summary, .tab, .hg-head { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
  a:active, button:active, summary:active { opacity: .72; }
  .view { padding: 12px 12px calc(var(--tab-h) + 24px); }

  /* Kopfzeile: Zurück bzw. eigenes Bild, Titel mit Kontostand, Suche, Glocke */
  .topbar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-rows: auto auto; column-gap: 8px; align-items: center; height: var(--bar-h); padding: env(safe-area-inset-top) 10px 0; background: rgba(9,12,11,.94); }
  #menuBtn, #soundBtn, #chatBtn, .sidebar, .nav-backdrop, .ticker { display: none !important; }
  .me-chip { grid-area: 1 / 1 / 3 / 2; }
  .me-chip .avatar { width: 38px; height: 38px; font-size: 20px; }
  .app-back { display: none; grid-area: 1 / 1 / 3 / 2; width: 40px; font-size: 1.7rem; line-height: 1; background: none; border: 0; }
  body.sub-page .app-back { display: block; }
  body.sub-page .me-chip { display: none; }
  .app-title { display: block; grid-area: 1 / 2; align-self: end; font: 700 1.02rem/1.2 Cinzel, Georgia, serif; color: var(--gold2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .balances { grid-area: 2 / 2; flex-direction: row; gap: 10px; align-self: start; background: none; border: 0; padding: 0; border-radius: 0; min-width: 0; overflow: hidden; }
  .bal { font-size: .72rem; line-height: 1.3; font-weight: 600; color: var(--muted); flex: 0 1 auto; }
  #searchBtn { grid-area: 1 / 3 / 3 / 4; }
  .notif-wrap { grid-area: 1 / 4 / 3 / 5; }
  .topbar .icon-btn:not(.app-back) { background: none; border: 0; width: 40px; min-width: 40px; }
  .notif-panel { top: var(--bar-h); left: 8px; right: 8px; }

  /* Tab-Leiste */
  .bottom-nav { height: var(--tab-h); align-items: start; background: rgba(9,12,11,.97); }
  .bottom-nav a, .bottom-nav button { position: relative; min-height: 58px; padding: 6px 0; font-size: .7rem; font-weight: 600; }
  .bottom-nav span { font-size: 1.35rem; filter: grayscale(.7) opacity(.75); transition: filter .15s, transform .15s; }
  .bottom-nav .active span { filter: none; transform: translateY(-1px); }
  .bottom-nav .active::before { content: ""; position: absolute; top: 0; left: 28%; right: 28%; height: 2px; border-radius: 2px; background: var(--gold); }
  .bottom-nav .badge { position: absolute; top: 3px; left: calc(50% + 6px); right: auto; font-style: normal; }

  /* Reiter: eine Zeile, bleiben beim Scrollen sichtbar */
  .page-tabs, .car-tabs, .sb-tabs { position: sticky; top: var(--bar-h); z-index: 15; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 0; margin: 0 -12px 12px; padding: 0 4px; background: rgba(9,12,11,.96); border-bottom: 1px solid var(--line); border-radius: 0; }
  .page-tabs::-webkit-scrollbar, .car-tabs::-webkit-scrollbar, .sb-tabs::-webkit-scrollbar { display: none; }
  .ptab, .car-tab, .sb-tab, .ptab.active, .car-tab.active, .sb-tab.active { flex: 1 0 auto; padding: 0 12px; background: none; border: 0; border-bottom: 2px solid transparent; border-radius: 0; box-shadow: none; font-size: .86rem; white-space: nowrap; }
  .ptab.active, .car-tab.active, .sb-tab.active { color: var(--gold2); border-bottom-color: var(--gold); }

  /* Seitenköpfe: Titel steht schon oben, Werbetexte entfallen */
  .view > .page-head:first-child > div:first-child { display: none; }
  .view > .page-head:first-child:not(:has(> :nth-child(2))) { display: none; }
  .view > .page-head:first-child:has(> :nth-child(2)) { margin-bottom: 10px; }
  .casino-head > a, .casino-head > h2 { display: none; }
  .casino-head { margin-bottom: 8px; justify-content: flex-end; }
  .casino-head:not(:has(> :nth-child(3))) { display: none; }
  .sb-hero { padding: 12px; margin-bottom: 10px; }
  .sb-hero > div:first-child { display: none; }
  .sb-hero-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; width: 100%; }
  .sb-hero-stats > div { min-width: 0; padding: 6px 8px; }
  .sb-hero-stats small { font-size: .58rem; letter-spacing: 0; }
  .sb-hero-stats b { font-size: .92rem; }

  .view > .page-head:first-child:not(:has(> :nth-child(2))) + :is(.page-tabs, .car-tabs, .sb-tabs), .view > :is(.page-tabs, .car-tabs, .sb-tabs):first-child { margin-top: -12px; }

  /* Bereichs-Seiten */
  .hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .hub-tile { flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; min-height: 124px; }
  .hub-tile small { font-size: .74rem; }

  /* Startseite */
  .hh-net b { font-size: 1.5rem; }
  .hh-row b { font-size: .98rem; }
  .quick-tile { min-height: 66px; font-size: .74rem; }
  .home-lists > .card:last-child { order: -1; }
  #dFeed { max-height: none; overflow: visible; }
  #dFeed .list-item:nth-child(n+6) { display: none; }

  /* Einstellungen */
  .set-me { padding: 12px 14px; }

  /* Mehr-Blatt */
  .more-backdrop { position: fixed; inset: 0; z-index: 69; background: rgba(0,0,0,.55); display: block; opacity: 0; pointer-events: none; transition: opacity .2s; }
  .more-backdrop.show { opacity: 1; pointer-events: auto; }
  .more-sheet { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; max-height: 86dvh; overflow-y: auto; padding: 6px 14px calc(12px + env(safe-area-inset-bottom)); background: var(--panel); border-top: 1px solid var(--line); border-radius: 20px 20px 0 0; box-shadow: var(--shadow); transform: translateY(105%); visibility: hidden; transition: transform .24s cubic-bezier(.2,.8,.3,1), visibility .24s; }
  .more-sheet.open { transform: none; visibility: visible; }
  .sheet-grip { width: 40px; height: 4px; margin: 4px auto 10px; border-radius: 2px; background: var(--line); }
  .more-me { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg2); }
  .more-me .avatar { width: 46px; height: 46px; font-size: 24px; }
  .more-me-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
  .more-me-text small { color: var(--muted); font-size: .78rem; }
  .more-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 10px 0; }
  .more-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 78px; padding: 8px 4px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg2); font-size: .76rem; font-weight: 600; text-align: center; line-height: 1.15; }
  .more-tile span { font-size: 24px; line-height: 1.2; }
  .more-out { display: flex; align-items: center; justify-content: center; min-height: 46px; border: 1px solid var(--line); border-radius: 12px; color: var(--down); font-weight: 600; }
  .more-foot { padding-top: 10px; text-align: center; color: var(--muted); font-size: .76rem; }

  /* Fenster als Blatt von unten */
  .modal { padding: 0; place-items: end stretch; backdrop-filter: none; }
  .modal-card, .modal-card.wide { max-height: 90dvh; padding: 22px 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 20px 20px 0 0; border-width: 1px 0 0; animation: sheetUp .24s cubic-bezier(.2,.8,.3,1); transition: transform .2s; position: relative; }
  .modal-card::before { content: ""; position: absolute; top: 8px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: var(--line); }
  @keyframes sheetUp { from { transform: translateY(100%); } }
  .modal-x { margin-top: -14px; }

  /* Hinweise oben, nicht über der Tab-Leiste */
  .toasts { top: calc(var(--bar-h) + 6px); bottom: auto; left: 10px; right: 10px; }
  .sb-pops { top: calc(var(--bar-h) + 6px); }

  /* Chat als eigene Ansicht */
  .chat-drawer { animation: sheetUp .22s cubic-bezier(.2,.8,.3,1); padding-top: env(safe-area-inset-top); }
  .chat-form { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .sb-fab { bottom: calc(var(--tab-h) + 12px); }
  .sb-slip { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
}
@media (max-width: 760px) {
  .profile-head > .row { flex: 1 1 100% !important; }
  .profile-head > .row > * { flex: 1 1 40%; }
}