/* BRAIN – Anpassung an Tablet & Handy.
   Desktop: > 1100px · Tablet: 761–1100px · Handy: ≤ 760px */

.mobile-only { display: none !important; }
.br-graph { touch-action: none; }
@media (hover: none) {
  .br-nav .tip { display: none; }
  .lb-img .face { opacity: 1 !important; }
  .br-media:hover img { transform: none; }
}

/* =========================================================== TABLET */
@media (max-width: 1100px) {
  body { min-width: 0; }
  .br-search { width: 200px; }
  .br-topbar { padding: 0 var(--space-5); gap: var(--space-3); }
  .screen-pad, .prof, .evwrap, .wikiwrap, .statswrap, .upwrap, .setwrap { left: 24px; right: 24px; }
  .screen-brain .filters, .screen-map .scale { left: 24px; right: 24px; }
  .screen-brain .filters .legend { display: none; }
  .screen-brain .ask { width: auto; min-width: 0; left: 24px; right: 96px; transform: none; }
  .memory { left: 24px; }
  .prof { grid-template-columns: 280px 1fr; }
  .evwrap { grid-template-columns: 300px 1fr; }
  .row3 { grid-template-columns: 1fr 1fr; }
  .evwrap .hero .over { flex-wrap: wrap; gap: 8px; }
  .evwrap .hero .over > div { flex-basis: 100%; }
  .row3 .mapbox { grid-column: span 2; }
  .wikiwrap { grid-template-columns: 240px minmax(0, 1fr); }
  .wikiwrap .side { grid-column: 2; }
  .statswrap { grid-template-columns: 1fr; }
  .statswrap > * { grid-column: 1 !important; grid-row: auto !important; }
  .upwrap { grid-template-columns: 1fr; overflow: auto; display: flex; flex-direction: column; padding-bottom: 24px; }
  .upwrap .left { flex: none; }
  .queue { min-height: 260px; }
  .priv { flex: none; }
  .setwrap { grid-template-columns: 1fr; }
  .lb { grid-template-columns: minmax(0, 1fr) 330px; }
  .screen-chat .think-hud b { font-size: 21px; line-height: 27px; }
}

/* =========================================================== HANDY */
@media (max-width: 760px) {
  .mobile-only { display: revert !important; }
  .desktop-only { display: none !important; }
  html, body, #root { height: 100%; }
  body { font-size: 15px; }
  input, textarea, select, .inp { font-size: 16px !important; } /* verhindert iOS-Zoom */

  /* ---------- Rahmen: Navigation unten, kompakte Topbar */
  .br-app { flex-direction: column; height: 100dvh; }
  .br-sidebar {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 50;
    width: auto; height: calc(62px + env(safe-area-inset-bottom)); padding: 6px 6px env(safe-area-inset-bottom);
    flex-direction: row; justify-content: space-between; align-items: center; gap: 0;
    border-right: 0; border-top: 1px solid var(--line); background: rgba(6,8,15,0.92);
    overflow-x: auto; scrollbar-width: none;
  }
  .br-sidebar::-webkit-scrollbar { display: none; }
  .br-logo, .br-nav-spacer { display: none; }
  .br-nav { width: 46px; height: 44px; flex: none; }
  .br-sidebar { justify-content: space-around; }
  .br-nav svg { width: 21px; height: 21px; }
  .br-nav.on::before { left: 12px; right: 12px; top: -7px; bottom: auto; width: auto; height: 3px; }
  .br-nav .tip { display: none; }
  .br-main { padding-bottom: calc(62px + env(safe-area-inset-bottom)); min-height: 0; }
  .br-topbar { height: 56px; padding: 0 16px; gap: 10px; }
  .br-topbar .crumb > .br-hud { display: none; }
  .br-topbar .crumb b { font-size: 19px; }
  .br-topbar .grow { min-width: 0; display: flex; justify-content: flex-end; }
  .br-topbar .grow .br-seg button { padding: 0 9px; }
  .br-search { width: 38px; padding: 0; justify-content: center; font-size: 0; flex: none; }
  .br-search svg { width: 18px; height: 18px; }
  .br-search kbd { display: none; }
  .br-me { padding: 3px; flex: none; }
  .br-me .meta { display: none; }

  /* ---------- Allgemein */
  .screen-pad, .prof, .evwrap, .wikiwrap, .statswrap, .upwrap, .setwrap { left: 0; right: 0; bottom: 0; padding: 0 16px 20px; overflow: auto; }
  .br-h-title { font-size: 26px; line-height: 32px; }
  .br-h-hero { font-size: 36px; line-height: 40px; }
  .gal { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 104px; gap: 6px; }
  .empty.big { margin: 16px 0; padding: 24px; }
  .modal-wrap { place-items: end center; }
  .modal { width: 100% !important; max-width: 100vw; max-height: 88dvh; border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important; padding: 20px 18px calc(20px + env(safe-area-inset-bottom)); }
  .modal.popover { width: auto !important; border-radius: var(--radius-lg) !important; }
  .mrow { justify-content: stretch; } .mrow .br-btn { flex: 1; justify-content: center; }
  #toasts { left: 16px; right: 16px; bottom: calc(76px + env(safe-area-inset-bottom)); align-items: stretch; }

  /* ---------- Login */
  .who { gap: 10px; margin: 18px 0 10px; }
  .who-p { width: 104px; padding: 16px 6px 12px; gap: 8px; }
  .who-p .br-av.lg { width: 64px; height: 64px; }
  .who-p b { font-size: 16px; }
  .pin { width: calc(100vw - 48px); max-width: 340px; }
  .wordmark { font-size: 36px; }
  .login-in { padding: 0 16px; }
  .login-in .small { font-size: 12px; }

  /* ---------- Brain */
  .screen-brain .filters { top: 2px; left: 0; right: 0; padding: 0 16px; overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap; }
  .screen-brain .filters::-webkit-scrollbar { display: none; }
  .screen-brain .filters .br-chip { flex: none; height: 28px; padding: 0 10px; font-size: 12px; }
  .screen-brain .filters .br-seg { flex: none; }
  .screen-brain .hud { display: none; }
  .screen-brain .zoom { display: none; }
  .screen-brain .ask { left: 12px; right: 12px; bottom: 12px; }
  .br-ask { height: 54px; padding: 0 6px 0 14px; }
  .br-ask .send { width: 42px; height: 42px; }
  .br-ask input { font-size: 16px; }
  .memory, .memory.compact { left: 12px; right: 12px; bottom: 76px; width: auto; padding: 10px 12px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 10px; }
  .memory .imgs, .memory .sub { display: none; }
  .memory h3 { font-size: 15px; line-height: 20px; grid-column: 1; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .memory .br-eyebrow { grid-column: 1; }
  .memory .row { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
  .memory .row a.br-btn { display: none; }
  .memory.empty-card .row a.br-btn { display: inline-flex; }
  .memory.empty-card { grid-template-columns: 1fr; }
  .memory.empty-card .sub { display: block; font-size: 12px; }
  .memory.empty-card .row { grid-column: 1; grid-row: auto; margin-top: 6px; }
  .screen-brain .detail { left: 8px; right: 8px; top: auto; bottom: 8px; width: auto; max-height: 62%; z-index: 6; border-radius: var(--radius-lg); }
  .screen-brain .detail.hide { transform: translateY(24px); }
  .detail .dclose { position: absolute; top: 10px; right: 10px; }

  /* ---------- Chat */
  .screen-chat .bg { opacity: .25; right: 0; }
  .screen-chat .think-hud, .screen-chat .sugg { display: none; }
  .screen-chat .panel { top: 0; left: 8px; right: 8px; bottom: 76px; width: auto; }
  .screen-chat .head { padding: 12px 14px; }
  .screen-chat .thread { padding: 16px 14px 8px; }
  .screen-chat .q { max-width: 88%; }
  .screen-chat .a { gap: 10px; }
  .screen-chat .a .who { width: 24px; height: 24px; }
  .screen-chat .cards { grid-template-columns: repeat(2, 1fr); }
  .screen-chat .cards .br-media { height: 104px; }
  .screen-chat .br-media.big { height: 220px; }
  .screen-chat .ask { left: 8px; right: 8px; bottom: 12px; width: auto; }
  .screen-chat .hello h2 { font-size: 30px; line-height: 36px; }
  .hello-sugg { display: flex !important; flex-direction: column; gap: 8px; margin-top: 16px; }
  .hello-sugg .br-btn { height: auto; min-height: 40px; padding: 8px 14px; white-space: normal; text-align: left; justify-content: flex-start; }

  /* ---------- Personen */
  .pgrid { grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 4px 0 14px; }
  .pcard { padding: 18px 10px 14px; gap: 8px; }
  .pcard .br-av.lg { width: 64px; height: 64px; }
  .pcard h2 { font-size: 17px; }
  .pcard .nums b { font-size: 17px; }
  .unk { padding: 14px; }
  .unk-h { flex-wrap: wrap; }
  .unk-h > span:last-child { margin-left: 0 !important; width: 100%; }
  .unk-list { grid-template-columns: 1fr; gap: 8px; }
  .prof { display: flex; flex-direction: column; gap: 14px; }
  .prof .side, .prof .main { overflow: visible; padding-bottom: 0; flex: none; }
  .prof .gal .br-media:nth-child(1) { grid-column: span 2; grid-row: span 2; }
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs > * { flex: none; }

  .qgrid { grid-template-columns: 1fr; gap: 10px; }
  .qimg { height: 230px; }
  .queue-sec { padding: 14px; }
  .queue-sec .qhint { margin-left: 0; width: 100%; }
  .who-pick button { height: 40px; font-size: 14px; }
  .galwrap { left: 0; right: 0; padding: 0 10px 20px; }
  .galgrid { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 31vw; gap: 3px; }
  .galgrid .br-media { border-radius: 4px; border: 0; }
  .galbar { padding: 6px 4px 10px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .galbar > * { flex: none; }
  .galmonth { margin: 14px 4px 8px; }

  /* ---------- Events: Liste ODER Detail */
  .evwrap { display: block; }
  .evwrap .tl { padding: 4px 0 20px; overflow: visible; }
  .evwrap .detail { overflow: visible; padding-bottom: 0; }
  .evwrap.has-key .tl { display: none; }
  .evwrap:not(.has-key) .detail { display: none; }
  .evwrap .hero { height: 230px; }
  .evwrap .hero .over { flex-wrap: wrap; padding: 50px 14px 14px; gap: 8px; }
  .evwrap .hero .over > div { flex-basis: 100%; }
  .evwrap .hero .br-h-title { font-size: 22px; line-height: 28px; }
  .evwrap .hero .over { background: linear-gradient(transparent, rgba(4,5,10,0.95) 45%); }
  .evwrap .hero .br-hud { color: var(--ink-muted); }
  .row3 { grid-template-columns: 1fr; gap: 10px; }
  .row3 .mapbox { grid-column: auto; }
  .evwrap .gal { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 100px; }
  .back { display: inline-flex !important; align-items: center; gap: 6px; margin: 4px 0 10px; font-size: 14px; font-weight: 600; color: var(--ink-muted); }
  .back svg { width: 16px; height: 16px; }
  .albums { grid-template-columns: 1fr 1fr; gap: 8px; }
  .album { height: 150px; }
  .album .over b { font-size: 14px; }

  /* ---------- Karte */
  .screen-map .list { top: 6px; left: 8px; right: 8px; width: auto; max-height: none; padding: 6px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .screen-map .list::-webkit-scrollbar { display: none; }
  .screen-map .list > .br-hud { display: none; }
  .screen-map .list > div { display: flex; gap: 4px; margin-top: 0 !important; }
  .screen-map .list .pl { width: auto; flex: none; padding: 6px 10px; }
  .screen-map .list .pl span:not(.n) { display: none; }
  .screen-map .card { left: 8px; right: 8px; top: auto; bottom: 8px; width: auto; max-height: 60%; }
  .screen-map .scale { left: 8px; right: auto; bottom: 10px; }
  .screen-map .scale .br-hud { display: none; }
  .screen-map .card:not(.hide) ~ .scale { display: none; }
  .leaflet-control-zoom { display: none; }

  /* ---------- Wiki: Liste ODER Seite */
  .wikiwrap { display: block; }
  .wikiwrap .idx { max-height: none; margin-top: 4px; }
  .wikiwrap.has-id .idx { display: none; }
  .wikiwrap:not(.has-id) .page, .wikiwrap:not(.has-id) .side { display: none; }
  .wikiwrap .page { padding: 18px 16px; overflow: visible; }
  .wikiwrap .side { margin-top: 14px; }
  .wikiwrap .media { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 84px; }
  .quote q { font-size: 17px; line-height: 23px; }
  .qrow { flex-direction: column; } .qrow label:last-child { width: auto; }

  /* ---------- Stats */
  .statswrap { display: flex; flex-direction: column; gap: 12px; }
  .tiles { grid-template-columns: 1fr 1fr; gap: 10px; align-self: stretch; }
  .tiles .tile:last-child { grid-column: span 2; }
  .tile .br-av { width: 24px; height: 24px; right: 12px; top: 12px; }
  .tile .br-hud { font-size: 10px; letter-spacing: .1em; padding-right: 28px; }
  .tile { padding: 14px 16px; }
  .tile .br-stat { font-size: 32px; line-height: 36px; }
  .chart { padding: 14px; }
  .ch-h { flex-direction: column; align-items: flex-start; gap: 8px; }
  .bars, .months { gap: 4px; }
  .months span { font-size: 9px; letter-spacing: 0; }
  .rank { grid-template-columns: 1fr; gap: 10px; }
  .cands { grid-template-columns: 1fr 1fr; }

  /* ---------- Upload */
  .upwrap { display: flex; flex-direction: column; gap: 12px; }
  .drop { height: 130px; }
  .drop .br-hud { display: none; }
  .qh { flex-wrap: wrap; gap: 4px; }
  .dup { flex-wrap: wrap; }
  .dup > div:nth-child(2) { flex: 1 1 calc(100% - 90px) !important; }
  .dup > button { flex: 1; justify-content: center; }
  .f { grid-template-columns: 40px 1fr auto; grid-template-areas: "a b d" "a c c"; row-gap: 4px; }
  .f > :nth-child(1) { grid-area: a; } .f > :nth-child(2) { grid-area: b; } .f > :nth-child(3) { grid-area: c; } .f > :nth-child(4) { grid-area: d; }
  .queue { min-height: 200px; }
  .priv { padding: 16px; }

  /* ---------- Einstellungen */
  .setwrap { display: flex; flex-direction: column; gap: 12px; }
  .setwrap .box { padding: 16px; }
  .two { grid-template-columns: 1fr; }
  .setwrap .br-seg { display: flex; width: 100%; }
  .setwrap .br-seg button { flex: 1; padding: 4px 6px; font-size: 11px; height: auto; min-height: 28px; line-height: 13px; }
  .lan code { font-size: 13px; word-break: break-all; }

  /* ---------- Lightbox: Bild oben, Infos darunter */
  .modal-wrap.full { place-items: stretch; }
  .lb-modal { width: 100vw !important; height: 100dvh; max-height: 100dvh; border-radius: 0 !important; padding: 0 !important; }
  .lb { display: block; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .lb-stage { height: 56dvh; background: #000; }
  .lb-img { max-height: 56dvh; }
  .lb-img img { border-radius: 0; }
  .lb-video { max-height: 56dvh; border-radius: 0; box-shadow: none; }
  .lb-nav { width: 38px; height: 38px; top: auto; bottom: 10px; transform: none; }
  .lb-side { border-radius: 0; border: 0; border-top: 1px solid var(--line); overflow: visible; padding: 16px 16px calc(24px + env(safe-area-inset-bottom)); }
  .lb-modal .mclose { position: fixed; top: calc(10px + env(safe-area-inset-top)); right: 10px; z-index: 10; }
  .lb-tags { padding-right: 0; }
  .lb-actions .br-btn { flex: 1 1 auto; justify-content: center; }

  /* ---------- Schnellsuche & Diashow */
  .search-modal { margin-top: 0; align-self: start; border-radius: 0 0 var(--radius-lg) var(--radius-lg) !important; }
  .modal-wrap:has(.search-modal) { place-items: start center; }
  .qs-media { grid-template-columns: repeat(3, 1fr); }
  .show-top b { font-size: 20px; }
  .show-top { left: 16px; top: calc(16px + env(safe-area-inset-top)); }
  .show-cap { left: 16px; right: 16px; max-width: none; font-size: 15px; bottom: 24px; }
  .pick-grid { grid-template-columns: repeat(3, 1fr); }
  .avpick { grid-template-columns: repeat(auto-fill, 76px); }
}