/* Elder mode: the settings page, the login/home entry, and the larger type scale. Colors come from design-tokens.css. */
.ac-elder-entry{gap:5px}
.ac-elder-entry>svg{color:var(--dc-color-brand-strong)}
.ac-elder-entry small{font-size:11px;font-weight:600;color:var(--dc-color-brand-strong)}
.ac-elder-entry::after{content:'';display:none;width:7px;height:7px;border-radius:50%;background:var(--dc-color-brand)}
/* Beside a back button the enlarged title needs the room, so the state collapses to a dot. */
.dc-elder-text .ac-auth .ac-elder-entry small{display:none}
.dc-elder-text .ac-auth .ac-elder-entry.is-on::after{display:inline-block}

/* The white studio image and restrained teal details share the product palette. */
.elder-page{padding-bottom:8px}
.elder-page .ac-header{padding-bottom:16px}
.elder-hero{position:relative;isolation:isolate;overflow:hidden;min-height:224px;padding:24px 20px;border-radius:var(--dc-radius-feature);background:var(--dc-color-surface);box-shadow:var(--dc-shadow-control)}
.elder-hero-art{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center}
.elder-hero::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--dc-color-surface),transparent 66%);pointer-events:none}
.elder-hero-copy{position:relative;width:max-content;max-width:100%}
.elder-eyebrow{font-size:12px;line-height:1.5;font-weight:600;letter-spacing:.3px;color:var(--dc-color-text-secondary)}
.elder-hero h2{font-size:25px;line-height:1.4;font-weight:700;letter-spacing:-.6px;margin:14px 0 0}
.elder-hero h2>span{color:var(--dc-color-brand-strong)}
.elder-hero p{font-size:13px;line-height:1.7;color:var(--dc-color-text-secondary);margin:12px 0 0}

.elder-panel{margin-top:26px}
.elder-panel-heading{padding:0 4px}
.elder-panel-heading h2{display:flex;align-items:center;gap:8px;font-size:18px;line-height:1.5;font-weight:700}
.elder-panel-heading p{font-size:13px;line-height:1.7;color:var(--dc-color-text-secondary);margin:6px 0 0}
.elder-enabled-mark{display:inline-grid;place-items:center;flex-shrink:0;width:22px;height:22px;border-radius:50%;color:var(--dc-color-brand-strong);background:var(--dc-color-brand-soft)}
.elder-features{list-style:none;margin:16px 0 0;padding:0 16px;border:0;border-radius:var(--dc-radius-feature);box-shadow:var(--dc-shadow-control)}
.elder-features li{display:flex;align-items:center;gap:12px;min-height:94px;padding:20px 0;border-bottom:1px solid var(--dc-color-divider)}
.elder-features li:last-child{border-bottom:0}
.elder-feature-icon{display:inline-grid;place-items:center;flex-shrink:0;width:44px;height:44px;border-radius:14px;background:var(--dc-color-brand-soft);color:var(--dc-color-brand-strong);box-shadow:inset 0 1px 0 var(--dc-color-inverse-secondary)}
.elder-feature-icon>svg{width:24px;height:24px;stroke-width:1.7}
.elder-feature-icon--autoRead{background:var(--dc-color-info-soft);color:var(--dc-color-info)}
.elder-feature-icon--voiceFirst{background:var(--dc-color-warning-soft);color:var(--dc-color-warning-text)}
.elder-features .is-inactive .elder-feature-icon{background:var(--dc-color-subtle);color:var(--dc-color-text-secondary)}
.elder-feature-copy{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.elder-feature-copy strong{font-size:17px;font-weight:600;line-height:1.4}
.elder-feature-copy>span{font-size:13px;line-height:1.65;color:var(--dc-color-text-secondary);overflow-wrap:anywhere}
.elder-note-phrase{display:inline-block;max-width:100%;vertical-align:top}
.elder-feature-copy>small{font-size:12px;line-height:1.6;color:var(--dc-color-text-secondary)}

/* The visible 48 × 30 track sits inside a 52 × 48 touch target. */
.elder-switch{display:inline-grid;place-items:center;position:relative;flex-shrink:0;width:52px;min-height:48px;padding:0;border:0;border-radius:var(--dc-radius-control);background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.elder-switch-track{display:block;position:relative;width:48px;height:30px;border-radius:var(--dc-radius-pill);background:var(--dc-color-disabled);transition:background .2s}
.elder-switch-thumb{position:absolute;top:3px;left:3px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--dc-color-surface);color:var(--dc-color-text-secondary);box-shadow:var(--dc-shadow-control);transition:transform .2s,color .2s}
.elder-switch-thumb svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.elder-switch.is-on .elder-switch-track{background:var(--dc-color-brand)}
.elder-switch.is-on .elder-switch-thumb{transform:translateX(18px);color:var(--dc-color-brand-strong)}
.elder-switch:focus-visible{outline:2px solid var(--dc-color-brand);outline-offset:2px}

.elder-actions{margin-top:24px}
.elder-page .elder-primary{width:100%;min-height:52px;font-size:16px;font-weight:600;border-radius:var(--dc-radius-pill);box-shadow:0 4px 12px var(--dc-color-shadow)}
.elder-page .elder-note{font-size:12px;line-height:1.7;color:var(--dc-color-text-secondary);margin:12px 0 0;text-align:center}
.elder-page .elder-close{display:block;width:100%;min-height:52px;padding:12px 16px;border:1px solid var(--dc-color-border);border-radius:var(--dc-radius-pill);background:transparent;color:var(--dc-color-text-secondary);font-size:14px;cursor:pointer}
.elder-close:focus-visible{outline:2px solid var(--dc-color-brand);outline-offset:3px}
.elder-primary:active,.elder-close:active{transform:scale(.99)}
@media(max-width:360px){
  .elder-hero{padding:20px 16px;min-height:216px}
  .elder-features{padding:0 12px}
  .elder-features li{gap:10px}
  .elder-feature-icon{width:36px;height:40px;border-radius:12px}
  .elder-feature-icon>svg{width:22px;height:22px}
  .elder-switch{width:48px}
}
@media(prefers-reduced-motion:reduce){.elder-switch-track,.elder-switch-thumb{transition:none}.elder-primary:active,.elder-close:active{transform:none}}

/* Large text: shared tokens grow here; hard-coded pixel sizes are rewritten at runtime by elder-mode.js. */
html.dc-elder-text{--dc-font-caption:15px;--dc-font-label:16px;--dc-font-body:18px;--dc-font-section:20px;--dc-font-title:24px;--dc-font-display:46px}
.dc-elder-text .dc-button{min-height:52px}
.dc-elder-text .dc-tab-button{min-height:62px}
.dc-elder-text .dc-back{width:40px;height:40px}
.dc-elder-text .ac-form input,.dc-elder-text .ac-form select,.dc-elder-text .ac-readonly{height:56px}
.dc-elder-text .ac-menu-row{min-height:66px}
.dc-elder-text .dc-segments button{min-height:42px}
.dc-elder-text .ac-form .ac-group-card label{min-height:62px}
.dc-elder-text .ca-scenarios{grid-template-columns:repeat(2,minmax(0,1fr))}