/* Mobile account identity belongs in Profile & Settings, never above Chats. */
html:root.native-mobile body #mobile-account-controls,
html:root.native-mobile body #sidebar #workspace-bar,
html:root.native-mobile body #app-rail .rail-profile,
html:root.native-mobile body #app-rail #rail-logout,
html:root.native-mobile body #sidebar-menu #logout { display: none !important; }
html:root.native-mobile body #app-rail [data-nav="settings"] small { white-space: normal; }
html:root.native-mobile body #overlay[data-panel="settings"] #panel-title { font-size: 24px; }
html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .mobile-account-picker {
  margin: 0 0 10px; background: var(--page-bg); color: var(--page-ink);
  border: 1px solid var(--page-line); border-radius: 18px; overflow: hidden;
}
html:root.native-mobile body .mobile-account-picker summary,
html:root.native-mobile body .mobile-account-summary,
html:root.native-mobile body .mobile-account-choices button {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px;
  padding: 14px 16px; color: var(--page-ink); background: transparent;
  border: 0; text-align: left; cursor: pointer; list-style: none;
}
html:root.native-mobile body .mobile-account-picker summary::-webkit-details-marker { display: none; }
html:root.native-mobile body .mobile-account-picker span { flex: 1; min-width: 0; }
html:root.native-mobile body .mobile-account-picker strong,
html:root.native-mobile body .mobile-account-picker small { display: block; overflow-wrap: anywhere; }
html:root.native-mobile body .mobile-account-picker strong { font-size: 16px; font-weight: 600; }
html:root.native-mobile body .mobile-account-picker small { margin-top: 4px; font-size: 13px; color: var(--page-muted); }
html:root.native-mobile body .mobile-account-picker svg { width: 20px; height: 20px; flex-shrink: 0; }
html:root.native-mobile body .mobile-account-choices { border-top: 1px solid var(--page-line); }
html:root.native-mobile body .mobile-account-choices button + button { border-top: 1px solid var(--page-line); }
html:root.native-mobile body .mobile-account-choices button[aria-pressed="true"] { background: var(--page-soft); }
html:root.native-mobile body .mobile-account-picker :is(summary,button):focus-visible { outline: 2px solid #6d28d9; outline-offset: -3px; }

/* iPhone grouped settings: system type, compact rows and safe tab-bar clearance. */
@media (max-width:760px) {
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) {
    --settings-bg:#f2f2f7; --settings-card:#fff; --settings-ink:#111b21;
    --settings-muted:#667781; --settings-line:#e5e5ea; --settings-search:#e4e4e9;
    --settings-accent:#087f5b;
    color:var(--settings-ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    -webkit-font-smoothing:antialiased; bottom:0 !important;
  }
  html:root.native-mobile[data-theme="dark"] body #overlay:is([data-panel="settings"],[data-panel="profile"]) {
    --settings-bg:#000; --settings-card:#1c1c1e; --settings-ink:#f7f7f8;
    --settings-muted:#a1a1a6; --settings-line:#343438; --settings-search:#1c1c1e;
    --settings-accent:#25d366;
  }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) .panel { background:var(--settings-bg); }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) .panel > header {
    min-height:56px; padding:8px 16px; gap:8px; background:var(--settings-bg); border-bottom:1px solid var(--settings-line);
  }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) #panel-title {
    color:var(--settings-ink); font-size:22px !important; font-weight:650 !important; line-height:1.25; letter-spacing:-.45px;
  }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) :is(#panel-close,#panel-back) {
    width:44px; height:44px; min-width:44px; min-height:44px; padding:10px; border:0; border-radius:50%;
    background:transparent; color:var(--settings-accent);
  }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) #panel-body {
    min-height:0; overflow-y:auto; overflow-x:hidden; background:var(--settings-bg); padding:0 0 calc(100px + env(safe-area-inset-bottom)) !important;
    scroll-padding-bottom:calc(100px + env(safe-area-inset-bottom));
  }
  html:root.native-mobile body #overlay[data-panel="settings"] .advanced-settings { display:block; min-height:0; padding:0; background:var(--settings-bg); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home { padding:14px 16px 0; border:0; background:var(--settings-bg); color:var(--settings-ink); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-search {
    min-height:38px; padding:0 10px; gap:8px; border:0; border-radius:10px; background:var(--settings-search); color:var(--settings-muted);
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home #settings-search {
    min-height:38px; padding:6px 0; font-size:16px; color:var(--settings-ink) !important; -webkit-text-fill-color:var(--settings-ink) !important;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-search svg { width:19px; height:19px; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-profile-card {
    min-height:88px; padding:14px 16px; gap:14px; margin:20px 0 26px; border:0; border-radius:12px; background:var(--settings-card); box-shadow:none;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-profile-card > i { width:60px; height:60px; background:#087f5b; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-profile-card strong { font-size:calc(20px * var(--settings-text-scale,1)); font-weight:600; color:var(--settings-ink); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-profile-card small { color:var(--settings-muted); font-size:calc(14px * var(--settings-text-scale,1)); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-card {
    margin:0 0 24px; overflow:hidden; border:0; border-radius:12px; background:var(--settings-card); box-shadow:none;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-home-group h3 { margin:0 14px 8px; color:var(--settings-muted); font-size:12px; font-weight:400; letter-spacing:.35px; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row {
    display:flex; position:relative; align-items:center; min-height:56px; padding:11px 14px; gap:12px; border:0; border-radius:0; text-align:left;
    color:var(--settings-ink) !important; background:var(--settings-card); box-shadow:none;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row:not(:last-child)::after { content:""; position:absolute; bottom:0; left:56px; right:0; height:1px; background:var(--settings-line); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row b { flex:1; color:var(--settings-ink) !important; font-size:calc(17px * var(--settings-text-scale,1)); font-weight:400; line-height:1.25; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row small { margin-top:3px; color:var(--settings-muted) !important; font-size:calc(12px * var(--settings-text-scale,1)); line-height:1.3; font-weight:400; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row > span:first-child { width:29px; height:29px; flex:0 0 29px; border-radius:7px; color:#fff !important; background:#087f5b; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row > span:first-child svg { width:20px; height:20px; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row > :last-child:not(b) { width:14px; height:20px; min-width:14px; flex:0 0 14px; padding:0; color:var(--settings-muted) !important; background:transparent; border-radius:0; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="account"] > span:first-child { background:#007aff; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="privacy"] > span:first-child { background:#00a884; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="devices"] > span:first-child { background:#34aadc; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="chats"] > span:first-child { background:#34c759; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="notifications"] > span:first-child { background:#ff3b30; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="storage"] > span:first-child { background:#30b0c7; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home [data-settings-section="help"] > span:first-child { background:#007aff; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .settings-hub-row:is(:hover,:active) { background:var(--settings-search); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home .mobile-account-picker { border:0; border-radius:12px; background:var(--settings-card); color:var(--settings-ink); }
  html:root.native-mobile body #overlay[data-panel="settings"] .mobile-account-picker :is(summary,.mobile-account-summary,button) { min-height:56px; padding:10px 14px; color:var(--settings-ink); }
  html:root.native-mobile body #overlay[data-panel="settings"] .mobile-account-picker small { color:var(--settings-muted); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail { padding:20px 16px 0; color:var(--settings-ink); background:var(--settings-bg); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home.hidden + #settings-detail { padding:20px 16px 0; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail > h2 { display:none; }
  html:root.native-mobile body #overlay[data-panel="settings"] :is(.settings-clone-page,.settings-stack,.settings-hub-card,.settings-info-card,.notification-settings-clone) { border-color:var(--settings-line); border-radius:12px; box-shadow:none; background:var(--settings-card); color:var(--settings-ink); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail :is(p,small,.settings-clone-note) { color:var(--settings-muted); font-size:calc(14px * var(--settings-text-scale,1)); line-height:1.45; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail :is(b,label,h3) { color:var(--settings-ink); }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail :is(.settings-clone-row,.settings-clone-switch,.settings-clone-choice,.settings-select-row,.notification-choice-row,.notification-switch-row,.notification-category-row) { min-height:48px; background:var(--settings-card); color:var(--settings-ink); border-color:var(--settings-line); font-size:calc(17px * var(--settings-text-scale,1)); white-space:normal; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail :is(input,select,textarea) { background:var(--settings-bg); color:var(--settings-ink); -webkit-text-fill-color:var(--settings-ink); min-height:44px; font-size:16px; max-width:100%; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-detail a.settings-clone-row { display:flex; padding:12px 16px; color:var(--settings-accent); text-decoration:none; overflow-wrap:anywhere; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-log-out { width:100%; margin:0; min-height:48px; color:#e5484d; border:0; border-radius:12px; background:var(--settings-card); }
  html:root.native-mobile body #overlay[data-panel="profile"] .profile-panel { padding:20px 16px 0; }
  html:root.native-mobile body #overlay[data-panel="profile"] :is(.profile-hero,.settings-form,.profile-security) { margin:0 0 20px; padding:18px; border:0; border-radius:12px; color:var(--settings-ink); background:var(--settings-card); box-shadow:none; }
  html:root.native-mobile body #overlay[data-panel="profile"] .profile-hero { text-align:center; }
  html:root.native-mobile body #overlay[data-panel="profile"] #profile-avatar-large { width:96px; height:96px; margin:auto; border-radius:50%; }
  html:root.native-mobile body #overlay[data-panel="profile"] .profile-presence { display:none; }
  html:root.native-mobile body #overlay[data-panel="profile"] #profile-display-heading { color:var(--settings-ink); font-size:24px; font-weight:600 !important; }
  html:root.native-mobile body #overlay[data-panel="profile"] :is(p,small,.profile-security span) { color:var(--settings-muted); line-height:1.45; }
  html:root.native-mobile body #overlay[data-panel="profile"] :is(label,b) { color:var(--settings-ink); font-size:calc(15px * var(--settings-text-scale,1)); }
  html:root.native-mobile body #overlay[data-panel="profile"] :is(input,select) { min-height:44px; max-width:100%; font-size:16px; border:1px solid var(--settings-line); border-radius:8px; background:var(--settings-bg); color:var(--settings-ink); }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) :is(button,a,input,select,textarea):focus-visible { outline:2px solid var(--settings-accent); outline-offset:2px; }
  html:root.native-mobile body #overlay:is([data-panel="settings"],[data-panel="profile"]) button.primary { min-height:44px; background:#087f5b; color:#fff; }
}
