/* Focused Settings: one decision level at a time, in browser and PWA. */
.app-settings.settings-focused {display:block;min-height:100dvh;}
.settings-focused .app-settings-header {display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem clamp(1rem,4vw,3rem);height:auto;min-height:76px;}
.settings-focused .settings-header-title {font-size:1rem;color:var(--ink-muted);}
.settings-focused .settings-header-title svg {display:none;}
.settings-focused .settings-back {display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;min-height:44px;padding:0;border:0;background:transparent;}
.settings-focused h1.settings-page-title {font-family:"Fraunces",Georgia,serif;font-weight:600;font-optical-sizing:none;font-variation-settings:"opsz" 72,"SOFT" 100,"WONK" 1;font-size:var(--hearth-heading);letter-spacing:-.025em;line-height:1.2;text-wrap:balance;text-align:center;margin:0 0 2rem;}
.settings-focused .app-settings-content {width:100%;max-width:52rem;margin:0 auto;padding:var(--hearth-inset);min-width:0;box-sizing:border-box;}
.settings-focused .settings-wayfinding {display:flex;align-items:center;gap:.6rem;min-height:44px;margin:0 0 1.5rem;font-size:.9rem;}
.settings-wayfinding a {display:inline-flex;align-items:center;min-height:44px;color:var(--ink-muted);text-underline-offset:.3em;}
.settings-focused h1 {font-size:clamp(1.8rem,4vw,2.5rem);line-height:1.2;margin:0 0 .8rem;}
.settings-focused h1.settings-page-title {width:100%;max-width:none;}
/* Route focus announces the heading without making it look like a control. */
.settings-intro {max-width:42ch;color:var(--ink-muted);line-height:1.65;margin:0 0 2rem;}
.settings-directory {display:grid;gap:.75rem;list-style:none;margin:0;padding:0;}
.settings-directory a {display:grid;grid-template-columns:1fr auto;gap:.35rem 1rem;align-items:center;padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:.8rem;background:var(--paper-soft);color:var(--ink);text-decoration:none;min-height:44px;}
.settings-directory strong {font-weight:500;font-size:1.08rem;}
.settings-directory small {grid-column:1;color:var(--ink-muted);font-size:.9rem;line-height:1.5;}
.settings-directory .settings-direction {grid-column:2;grid-row:1 / 3;color:var(--clay);}
.settings-directory a:hover {border-color:var(--clay);}
.settings-focused a:focus-visible,.settings-focused button:focus-visible {outline:2px solid var(--clay);outline-offset:4px;}
.settings-focused .appearance-settings {max-width:none;}
.settings-focused .settings-save-status {min-height:3em;margin:1.5rem 0 0;color:var(--ink-muted);font-size:.9rem;line-height:1.5;}
.settings-focused .settings-lede {font-size:1rem;line-height:1.65;max-width:44ch;margin-bottom:2rem;}
.settings-focused .appearance-choice-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:.75rem;}
.settings-focused .appearance-choice {border-radius:.8rem;box-shadow:none;min-width:0;}
.settings-focused .appearance-choice:has(input:checked) {border-color:var(--clay);background:color-mix(in srgb,var(--clay) 7%,var(--paper-soft));}
.settings-focused .appearance-choice:focus-within {outline:2px solid var(--clay);outline-offset:3px;}
.settings-focused .appearance-choice-copy strong {position:relative;padding-inline-end:1.5rem;}
.settings-focused .appearance-choice-copy strong::after {content:"✓";position:absolute;inset-inline-end:0;visibility:hidden;}
.settings-focused .appearance-choice:has(input:checked) .appearance-choice-copy strong::after {visibility:visible;}
.settings-focused .appearance-choice-group {margin-block:1.5rem;}
.settings-focused fieldset {min-inline-size:0;}
.settings-focused legend {max-inline-size:100%;white-space:normal;overflow-wrap:anywhere;}
.settings-focused h1,.settings-focused h2,.settings-focused h3,.settings-focused .settings-wayfinding {overflow-wrap:anywhere;}
.settings-focused .settings-wayfinding {flex-wrap:wrap;}
.settings-focused .appearance-divider {margin-block:2rem;opacity:.55;}
.settings-focused .toggle-setting {padding-block:1.2rem;gap:1rem;}
.settings-focused .toggle-setting-copy small {line-height:1.6;max-width:38ch;}
.settings-focused .settings-back > span:last-child {display:inline;}
.settings-focused .security-card-grid {display:grid;grid-template-columns:1fr;gap:.6rem;}
.settings-focused .settings-account-task {border:1px solid var(--line);border-radius:.75rem;background:var(--paper-soft);overflow:hidden;}
.settings-focused .settings-account-task > summary {position:relative;display:block;list-style:none;padding:1rem 3rem 1rem 1rem;min-height:44px;box-sizing:border-box;cursor:pointer;font-size:1rem;font-weight:500;}
.settings-focused .settings-account-task > summary::-webkit-details-marker {display:none;}
.settings-focused .settings-account-task > summary::after {content:'›';position:absolute;inset-inline-end:1rem;top:50%;transform:translateY(-50%);font-size:1.3rem;color:var(--clay);}
.settings-focused .settings-account-task[open] > summary::after {transform:translateY(-50%) rotate(90deg);}
.settings-focused .settings-account-task[open] > summary {border-bottom:1px solid var(--line);}
.settings-focused .settings-account-task > .security-card-body,.settings-focused .settings-account-task > .danger-zone {padding:1rem;}
.settings-focused .settings-preset-options > fieldset {padding:1rem;}
.settings-focused .account-object-card {display:block;}
.settings-focused .security-group-heading p,.settings-focused .account-partition-heading p {font-size:.95rem;line-height:1.6;}
.settings-focused summary:focus-visible {outline:2px solid var(--clay);outline-offset:-4px;}
.settings-focused .settings-context {margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--ink-muted);}
.settings-context summary {min-height:44px;display:list-item;cursor:pointer;padding:.6rem 0;}
.settings-context nav {display:flex;flex-wrap:wrap;gap:.4rem 1rem;}
.settings-context a {display:inline-flex;align-items:center;min-height:44px;color:var(--ink-muted);text-underline-offset:.25em;}
.settings-context a[aria-current] {color:var(--clay);}
@media(max-width:480px){.settings-focused .settings-header-title {display:none;}.settings-focused .app-settings-content {padding-inline:1rem;}.settings-directory a {padding:1rem;}}
@media(forced-colors:active){.settings-directory a {border-color:ButtonText;}.settings-directory .settings-direction {color:LinkText;}}
