/* ═══════════════════════════════════════════════════════════════════════
   DAD Journal — Handy: flüssig und tippbar
   Reine Ergänzung, ändert am Rechner nichts. Wird als letzte Datei geladen.
   Drei Ursachen für Ruckeln auf dem Handy, alle gemessen:
     1. Weichzeichner (backdrop-filter) auf JEDER Karte und den festen
        Leisten - beim Scrollen rechnet das Gerät sie in jedem Bild neu.
     2. Eingabefelder unter 16 px - iOS zoomt beim Antippen die Seite.
     3. Einblenden mit Unschärfe-Filter auf der Startseite (61 Elemente).
   ═══════════════════════════════════════════════════════════════════════ */

html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
a,button,summary,label,select,[role=button],[data-tab],.tab-btn{-webkit-tap-highlight-color:transparent;touch-action:manipulation;}

@media (max-width:900px), (pointer:coarse){
  /* 1 · Weichzeichner aus. Karten bekommen dafür eine feste, leicht
        hellere Fläche, damit sie sich weiter vom Grund abheben. */
  html body .kpi-cell,html body .equity-wrap,html body .cal-wrap,html body .symbol-table,html body .payout-card,
  html body .day-sidebar,html body .modal-inner,html body .rc-card,html body .rw-item2,html body .trade-block,
  html body .coach-sidebar,html body .coach-main,html body .coach-session,html body .acc-card,html body .b-panel,
  html body .bc,html body .price-card,html body .rate-overlay{
    -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  }
  html body header,html body .tab-nav,html body .dad-ticker,html body nav,html body .ticker-strip{
    -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  }
  /* feste Leisten: deckend, sonst scheint der Inhalt beim Scrollen durch */
  html body header{background:rgba(6,7,10,.98) !important;}
  html body .tab-nav{background:rgba(8,9,12,.98) !important;}
  html body > nav{background:rgba(6,8,12,.97) !important;}
  html body .modal-overlay,html body .lightbox,html body .tour-shade{-webkit-backdrop-filter:none !important;backdrop-filter:none !important;}

  /* Anmeldeseite: die wandernden Lichtflecken stehen still */
  html body .login-aurora i{animation:none !important;}

  /* 3 · Startseite: Einblenden ohne Unschärfe-Filter */
  html body .rv,html body .fade{filter:none !important;}
}

@media (max-width:900px){
  /* 2 · kein iOS-Zoom beim Antippen */
  /* :not(#_a):not(#_b) hebt die Spezifitaet ueber bestehende Regeln wie
     ".field select{font-size:13px !important}" - sonst gewinnen die. */
  html body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]):not(#_a):not(#_b),
  html body select:not(#_a):not(#_b),html body textarea:not(#_a):not(#_b){font-size:16px !important;}

  /* Tippflächen: mindestens 40 px */
  /* nur die Hoehe: breitere Knoepfe draengten in der Kopfleiste das Theme-Feld zusammen */
  html body header button,html body .sn-toggle{min-height:40px;}
  html body header .logout-btn{min-width:36px;}
  html body .tab-btn{min-height:44px;}
}

@media (max-width:560px){
  /* Startseite: Kopfleiste passte nicht, die Sprachwahl war abgeschnitten */
  html body > nav{padding-left:14px !important;padding-right:14px !important;}
  html body > nav .nav-center{display:none !important;}
  html body > nav .nav-right{gap:6px;}
  html body > nav .nav-start{padding-left:12px !important;padding-right:12px !important;white-space:nowrap;}
  html body > nav .i18n-switch{margin-left:2px;}
}

@media (max-width:760px){
  /* Trade-Zeile: Auf dem Handy stehen die Felder in zwei Spalten. Symbol und
     Kontrakte hatten eine feste Breite von 60/52 px (inline) - mit 16 px
     Schrift war "MNQ" abgeschnitten. Jetzt fuellt jedes Feld seine Spalte. */
  html body .trade-row input:not(#_a):not(#_b),html body .trade-row select:not(#_a):not(#_b){
    width:100% !important;min-width:0 !important;box-sizing:border-box !important;}
}

@media (max-width:760px){
  /* Symbol-Tabelle im Dashboard: .wtable wird hier zur wischbaren Fläche,
     .symbol-table setzte aber overflow:hidden — 144 px der Tabelle waren
     abgeschnitten und nicht erreichbar. */
  html body .wtable.symbol-table{overflow-x:auto !important;-webkit-overflow-scrolling:touch;}
}