#settings-nav.settings-nav-grouped{display:flex;flex-direction:column;gap:16px;box-sizing:border-box;min-width:0;max-width:100%}
#settings-nav .settings-nav-group{display:flex;flex-direction:column;min-width:0;gap:6px}
#settings-nav .settings-nav-group[hidden]{display:none}
#settings-nav .settings-nav-group+.settings-nav-group{border-top:1px solid var(--bd);padding-top:14px}
#settings-nav .settings-nav-group-title{margin:0;padding:4px 12px;font-size:var(--fs-sm);font-weight:700;color:var(--tx);line-height:1.35}
#settings-nav .settings-nav-group-hint{display:block;margin-top:3px;color:var(--mt);font-size:var(--fs-xs);font-weight:400}
#settings-nav .settings-nav-group-items{display:flex;flex-direction:column;gap:2px}
@media(max-width:768px){
  /* Explicit intrinsic nav track: Safari must not allocate remaining height
     to the horizontal overflow container in a column flex layout. */
  #settings-modal .settings-layout{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:max-content minmax(0,1fr)!important;height:auto;align-content:stretch}
  #settings-nav.settings-nav-grouped{flex:0 0 auto;flex-direction:row;align-self:start;align-items:flex-start;align-content:start;height:max-content;min-height:0;max-height:none;gap:14px;padding:8px 12px;grid-auto-columns:unset;grid-template-rows:none;mask-image:none;-webkit-mask-image:none}
  #settings-nav .settings-nav-group{flex:0 0 auto;height:auto;min-height:0;gap:4px}
  #settings-nav .settings-nav-group+.settings-nav-group{border-top:0;border-left:1px solid var(--bd);padding-top:0;padding-left:16px}
  #settings-nav .settings-nav-group-title{position:sticky;left:0;align-self:flex-start;max-width:max-content;padding:0;font-size:12px;line-height:1.4}
  #settings-nav .settings-nav-group-hint{display:none}
  #settings-nav .settings-nav-group-items{display:flex;flex-direction:row;align-items:stretch;height:auto;min-height:0;gap:6px}
  #settings-nav .settings-nav-item{width:auto;flex:0 0 auto;min-height:44px;box-sizing:border-box;flex-direction:row;padding:8px 10px;gap:6px;font-size:13px}
  #settings-nav .settings-nav-item svg{width:18px;height:18px}
  #settings-nav .settings-nav-item.active,#settings-nav .settings-nav-item.active svg{color:var(--ach,var(--ac))}
  #settings-nav .settings-nav-item span{white-space:nowrap;overflow-wrap:normal;line-height:1.3}
  #settings-modal .settings-header{padding:calc(8px + env(safe-area-inset-top)) 12px 8px!important;min-height:calc(48px + env(safe-area-inset-top))}
  #settings-modal .settings-header h3{font-size:18px}
  #settings-modal .settings-close{width:44px;height:44px;min-width:44px;display:grid;place-items:center}
  #settings-modal .settings-content{padding:16px 12px max(12px,env(safe-area-inset-bottom));scroll-padding-block-start:16px}
}