/* GOAT Path · Settings composition · 2026.10.07.0019
   Shared visual roots: .card / .subtabs / .seg / inputs / .gp-fold.
   Settings owns only composition, density opt-in and Settings-specific sub-panels. */

.settings-surface{position:relative;max-width:760px;width:100%;margin:0 auto;padding-bottom:4px}
.settings-surface>.bento{display:flex;flex-direction:column;gap:var(--window-gap)}
.settings-fold{position:relative;width:100%;animation:none}

/* Guided setup stays discoverable, but uses the normal button root instead of a standalone hero action. */
.settings-guide{display:flex;align-items:center;margin:0 0 var(--window-gap)}
.settings-guide-btn{
  width:auto;min-height:32px!important;padding:4px 10px!important;border-radius:999px!important;
  display:inline-flex;align-items:center;gap:6px
}
.settings-guide-btn strong{font:700 11.75px/1.2 var(--disp);white-space:nowrap}
.settings-guide-arrow{color:var(--mut);font:700 13px/1 var(--body)}

/* Profile composition: reduce empty vertical rhythm without changing control semantics. */
.settings-field-gap{margin-top:7px!important}
.settings-goal-since{font-size:10px!important;margin-top:4px!important}
.settings-inline-toggle{justify-content:space-between;align-items:center}
.settings-zero-margin{margin:0!important}
.settings-top-gap{margin-top:6px!important}
.settings-range-labels{justify-content:space-between;margin-top:1px}
.settings-range-label{font-size:10.5px}
.settings-bk-status{margin-bottom:6px}
.settings-import-kicker{margin:0 0 6px!important}
.settings-account-count{margin-top:6px}
.profile-note{margin-top:4px}
.profile-note>summary{cursor:pointer;font-size:10.5px;font-weight:700;color:var(--mut)}
.profile-note-body{font-size:10.5px!important;line-height:1.45!important;margin-top:4px!important}

/* Account security is a sibling disclosure, using the same Settings controls. */
.settings-password-slot{min-width:0}
.settings-password-slot>.card{
  padding:0;background:transparent;border:0;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;animation:none
}
#authPasswordTitle{font:700 12.5px var(--disp);margin-bottom:8px!important}
#authPasswordMsg:empty{display:none}
#syncMsg{
  display:inline-flex!important;align-items:center;min-height:26px;
  margin-top:6px!important;padding:3px 7px;border:1px solid var(--line);
  border-radius:999px;background:var(--soft2);font-size:10.5px!important;line-height:1!important
}

/* Privacy choices live in their own Analysis-style Account card. */
.settings-account .account-sharing-note{font-size:11.5px;line-height:1.45;margin:8px 0 0}
.settings-account .impbrow .btn.danger{flex:none}

/* Imported history: retain provenance and controls, remove the essay from Settings. */
.settings-account .provcard>.mut{display:none}
.settings-account .provcard{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;
  margin-top:7px!important;padding:8px 9px!important;border:1px solid var(--line);
  border-left:1px solid var(--line);border-radius:10px;background:var(--soft2);box-shadow:none
}
.settings-account .provcard .kicker{margin:0}
.settings-account .provcard .btn{width:auto!important;min-height:36px;margin:0!important;padding:5px 9px}
.settings-account .impbatch{gap:5px}
.settings-account .impbrow{min-height:38px;padding:6px 8px}
.settings-account .impbrow .btn{min-height:34px!important;padding:5px 9px}

/* Danger is semantic, not attached to a section's changing list position. */
.settings-account .settings-fold.account-danger>.gp-summary:before{
  background:var(--bad);box-shadow:0 0 0 5px var(--badSoft);opacity:1
}
.settings-account .settings-fold.account-danger>.gp-summary .gp-title{color:var(--bad)}

/* About reads as system metadata rather than another prose card. */
.settings-app .settings-fold[data-settings-key="app-2"] .settings-fold-body>.mut:first-child{
  font-family:var(--mono);font-size:11.5px
}

@media(max-width:699px){
  .settings-account .provcard{grid-template-columns:minmax(0,1fr) auto}
  .settings-account .provcard .btn{width:auto!important}
}
@media(prefers-reduced-motion:reduce){
  .settings-fold{transition:none}
}

/* Read-only Beta panel in Settings > Account. */
.gp-beta{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--soft2);margin:4px 0 13px}
.gp-beta-head{display:flex;align-items:center;gap:8px;font:700 12px/1.3 var(--disp)}
.gp-beta-pill{padding:3px 7px;border:1px solid var(--line);border-radius:6px;font:700 9px/1 var(--mono);letter-spacing:.06em;color:var(--mut)}
.gp-beta-intro,.gp-beta-foot{font-size:10.5px!important;line-height:1.5!important;color:var(--mut);margin:8px 0!important}
.gp-beta-item{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding:8px 0}
.gp-beta-item>div{flex:1;min-width:0}.gp-beta-item b,.gp-beta-item span{display:block;font-size:10.5px;line-height:1.5}
.gp-beta-item span{color:var(--mut)}
.gp-beta-item .btn{min-height:28px;flex:0 0 auto;padding:5px 8px;font-size:10px;opacity:.55;cursor:not-allowed}
.gp-beta-buttons{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.gp-beta-buttons .btn{flex:1 1 150px;font-size:10.5px;min-height:36px}
.gp-beta-status{overflow-wrap:anywhere;font:500 10px/1.5 var(--mono)!important;color:var(--mut);margin-top:8px!important}


/* Backup & Recovery: shared theme tokens, touch-friendly actions. */
.backup-toolbar,.backup-row,.backup-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.backup-toolbar,.backup-row{justify-content:space-between}
.backup-history{margin-top:14px}
.backup-row{padding:14px 0;border-top:1px solid var(--line)}
.backup-row b,.backup-row span{display:block;font-size:12px;line-height:1.6}
.backup-preview{margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--soft)}
.backup-preview input{display:block;width:100%;margin:10px 0}
.backup-preview button{margin:4px 6px 0 0}
@media(max-width:480px){.backup-actions{width:100%}.backup-actions .btn{flex:1;min-height:42px}}


/* Account follows Analysis' shared .gp-fold/.gp-summary/.gp-body card contract.
   Only content density and destructive emphasis are Account-specific. */
.settings-account .settings-fold>.gp-body{min-width:0}
.settings-account .settings-fold-body .btn{min-height:40px;font-size:12px;border-radius:10px}
.settings-account .settings-fold-body>.mut{font-size:11.5px}
.settings-account .account-data-group{min-width:0}
.settings-account .account-data-group+.account-data-group{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.settings-account .account-group-heading{font:700 12.25px/1.3 var(--disp);margin-bottom:7px;color:var(--ink)}
.settings-account .account-group-hint{font-size:11.5px;line-height:1.45;margin:0 0 8px}
.settings-account .account-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.settings-account .account-file-btn{display:flex;justify-content:center;align-items:center;width:100%;text-align:center;cursor:pointer;padding:8px 10px}
.settings-account .settings-account-count{font-size:10.5px!important;margin-top:11px!important}
.settings-account .account-backup-block{padding-top:12px;margin-top:12px;border-top:1px solid var(--line)}
.settings-account .account-backup-block h3{font:700 12.25px/1.3 var(--disp);margin:0 0 8px}
.settings-account #authPasswordSlot:empty+.account-backup-block{padding-top:0;margin-top:0;border-top:0}
.settings-account .account-restore-note{font-size:10.75px;line-height:1.45;margin:8px 0 0}
.settings-account .backup-toolbar,.settings-account .backup-actions{gap:7px}
.settings-account .backup-row{padding:9px 0}
.settings-account .backup-history{margin-top:9px}
.settings-account .security-section h3{font:700 12.25px/1.3 var(--disp)}
.settings-account .security-section p{font-size:11.5px;line-height:1.45}
.settings-account .security-section .f{margin-top:8px}
@media(max-width:480px){
 .settings-account .settings-fold-body .btn{min-height:42px}
 .settings-account .account-action-grid{gap:7px}
}

/* Profile and App inherit the same Analysis card headers as Account.
   A single configuration-control rhythm keeps touch targets and text readable. */
.settings-profile .settings-fold>.gp-body,.settings-app .settings-fold>.gp-body{min-width:0}
.settings-profile .settings-fold-body .grid2,.settings-profile .settings-fold-body .grid3{column-gap:9px;row-gap:9px}
.settings-profile .settings-fold-body label.f,.settings-app .settings-fold-body label.f{
 font-size:10.75px;line-height:1.35;letter-spacing:.025em;margin-bottom:5px
}
.settings-profile .settings-fold-body .seg button,.settings-app .settings-fold-body .seg button{min-height:38px}
.settings-profile .settings-fold-body .btn,.settings-app .settings-fold-body .btn{
 min-height:40px;font-size:12px;border-radius:10px
}
.settings-app .settings-app-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.settings-app .settings-app-actions .btn{width:100%;min-width:0;white-space:normal}
@media(max-width:480px){
 .settings-profile .settings-fold-body .btn,.settings-app .settings-fold-body .btn{min-height:42px}
 .settings-profile .settings-fold-body .seg button,.settings-app .settings-fold-body .seg button{min-height:40px}
}

/* Recovery follows the shared type scale, spacing and touch targets. */
.security-section{min-width:0}
.security-section+.security-section{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.security-section h3{font:700 12.5px/1.4 var(--disp);margin:0 0 6px}
.security-section p{font-size:12px;line-height:1.5;margin:7px 0}
.security-section p:empty{display:none}
.security-section .f{display:block;margin:10px 0 5px}
.security-section input:not([type="checkbox"]),.security-section select,#authGate .card input{width:100%;min-width:0}
.security-section>.btn,.security-email>.btn{margin-top:8px}
.security-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
.security-actions>.f,.security-actions>input{flex-basis:100%}
.security-actions .btn{flex:1 1 180px}
.security-prepared{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--soft2)}
.security-recovery-key{display:block;overflow-wrap:anywhere;user-select:all;font:500 12px/1.6 var(--mono);padding:9px 0}
.security-saved-check{display:flex;align-items:flex-start;gap:9px;font-size:12px;line-height:1.5;margin:8px 0 12px;cursor:pointer}
.security-saved-check input{flex:0 0 20px;width:20px!important;height:20px;min-height:20px!important;margin:0;accent-color:var(--acc)}
.security-prepared>.btn{width:100%;white-space:normal}
.security-help{margin-top:12px;font-size:12px}
.security-help>summary{cursor:pointer;font-weight:600;color:var(--mut);padding:6px 0}
.security-email{margin-top:12px;padding-top:3px;border-top:1px solid var(--line)}
.security-section .btn{white-space:normal}
@media(max-width:480px){.security-section .btn{min-height:42px}.security-section input:not([type="checkbox"]),.security-section select{min-height:42px;font-size:16px!important}}
#authForgotPassword,#authLegacyPassword{width:100%;margin-top:8px}
.auth-recovery-fields{margin:12px 0}
.auth-recovery-fields .f,#authGate .auth-recovery-fields .f{display:block;margin:10px 0 5px}
.auth-recovery-fields input,#authRecoveryNonce{width:100%;min-width:0}
#authRecoverySaveBtn{width:100%;margin-top:12px}
#authRecoveryMsg{font-size:12px;line-height:1.5;margin:10px 0 0}
@media(max-width:480px){#authRecoveryNew,#authRecoveryConfirm,#authRecoveryNonce{font-size:16px!important;min-height:42px}}


/* Settings button density: one control for actions, tabs and choices. */
#v-data{--settings-button-height:28px;--settings-button-padding:3px 8px}
#v-data .btn,#v-data .lvlbtn,#v-data .devbtn,#v-data .subtab,#v-data .seg button,#v-data .opt{
 box-sizing:border-box;min-height:var(--settings-button-height)!important;
 min-width:0;max-width:100%;padding:var(--settings-button-padding)!important;
 font-size:12px;line-height:20px;border-radius:9px;white-space:normal;overflow-wrap:break-word
}
#v-data .btn,#v-data .lvlbtn{display:inline-flex;align-items:center;justify-content:center;text-align:center}
#v-data .settings-guide-btn strong{white-space:normal}
#v-data .settings-guide-btn{border-radius:9px!important}
#v-data .seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:100%;box-sizing:border-box}
#v-data .seg button{padding:3px 4px!important}
#v-data .opt{width:100%;text-align:left}
#v-data .opt-name{font-size:12px;line-height:20px}
#v-data .settings-app-actions .btn,#v-data .account-action-grid .btn{width:100%}
#v-data .backup-actions .btn{flex:1 1 0}
#v-data .backup-preview .btn{margin:4px 4px 0 0}
#v-data .settings-surface input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
#v-data .settings-surface select,#v-data .settings-surface textarea{font-size:16px}