
/* W23: Account tab layout — grouped cards, aligned label/value rows */
.acct-grid{display:grid;grid-template-columns:260px 1fr;gap:14px;align-items:start;margin-bottom:14px}
.acct-card{border:1px solid var(--gray-m);border-radius:10px;padding:14px 16px;background:#fff;margin-bottom:14px}
.acct-grid .acct-card{margin-bottom:0}
.acct-card-hd{font-size:12.5px;font-weight:800;margin-bottom:8px}
.acct-card-hd i{color:var(--blue)}
.acct-row{display:grid;grid-template-columns:150px 1fr;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid #f4f4f6;font-size:12.5px}
.acct-row:last-child{border-bottom:none}
.acct-lbl{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase}
.np-typerow{display:grid;grid-template-columns:1fr 64px 64px;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid #f4f4f6}
.np-typerow input[type=checkbox]{accent-color:var(--blue)}
.np-group{border:1px solid #eceef1;border-radius:8px;margin:8px 0;background:#fff}
.np-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:9px 12px;font-size:12.5px;font-weight:800}
.np-group>summary::-webkit-details-marker{display:none}
.np-group[open] .np-chev{transform:rotate(90deg)}
.np-chev{transition:transform .15s;font-size:13px;color:var(--muted)}
.np-group-body{padding:0 12px 8px}
@media(max-width:860px){
  .acct-grid{grid-template-columns:1fr}
  .acct-row{grid-template-columns:1fr;gap:2px}
  .acct-card{padding:12px}
  #settingsModal .modal-card{width:100vw!important;max-width:100vw!important}
  .np-typerow{grid-template-columns:1fr 56px 56px}
  .np-typerow input[type=checkbox]{width:20px;height:20px}
  .np-group>summary{padding:12px}
  /* W30D.6: Preferences tab — label above control, everything full-width and
     thumb-sized; the Appearance buttons become a 2×2 grid instead of running
     off the right edge (Frank 7/26) */
  #settings-pane-settings .settings-row{flex-direction:column;align-items:stretch;gap:8px;padding:13px 0}
  #settings-pane-settings .sr-label{font-size:13px}
  #settings-pane-settings .sr-val{width:100%}
  #settings-pane-settings .theme-seg{display:flex;width:100%}
  #settings-pane-settings .theme-seg button{flex:1 1 40%;justify-content:center;padding:12px 6px;font-size:13px;border-bottom:1px solid var(--gray-m)}
  #settings-pane-settings .theme-seg button:nth-child(2n){border-right:none}
  /* W35B.1: the rule above assumed four buttons; the Terra segments have two */
  #settings-pane-settings .theme-seg button:nth-last-child(-n+2){border-bottom:none}
  #settings-pane-settings .theme-seg button:nth-child(n+3){border-bottom:none}
  #settings-pane-settings select,#settings-pane-settings input[type=number]{width:100%!important;box-sizing:border-box;padding:11px 12px!important;font-size:13.5px!important}
  #settings-pane-settings input[type=time]{padding:10px 12px!important;font-size:13.5px!important;flex:1}
  #settings-pane-settings .btn.btn-primary{width:100%;justify-content:center;padding:12px;font-size:14px}
  #settings-pane-settings .btn.btn-primary+span{display:block;text-align:center}
  #settings-pane-settings>div:last-child{flex-direction:column;align-items:stretch}
}
