:root {
  --font-body: 16px;
  --font-secondary: 14px;
  --font-caption: 12px;
  --font-label: 12px;
  --touch-target: 48px;
  --page-gutter: clamp(14px, 4vw, 24px);
  --content-width: 760px;
}

body { font-size:var(--font-body); line-height:1.45; }
body[data-text-size="large"] { --font-body:18px; --font-secondary:16px; --font-caption:14px; --font-label:13px; }
.app-shell { width:min(100%,var(--content-width)); padding-left:var(--page-gutter); padding-right:var(--page-gutter); }

/* Readable type: technical labels remain compact without becoming miniature. */
.brand-copy strong{font-size:15px}.brand-copy em{font-size:12px}.brand-copy small{font-size:var(--font-caption)}
.eyebrow,.card-heading,.metric-card>span,.diagnostic-summary small,.setup-card label,.analytics-card small,.health-categories h3,.analytics-explanation h3,.sensor-group h3{font-size:var(--font-label);line-height:1.35}
.card-heading small,.dial-inner small,.scale,.gear-row,.metric-card small,.capabilities-card small,.sensor-row small,.diagnostic-summary p,.quick-actions small,.voice-launch-card small,.graph-pid,.graph-source,.trip-share-status,.history-row>small,.history-stats,.app-update-settings p,.app-update-settings small,.battery-reliability span{font-size:var(--font-caption);line-height:1.45}
.sensor-row strong,.quick-actions strong,.voice-launch-card strong,.history-row>strong,.dialog-action strong,.setup-heading h2{font-size:var(--font-secondary)}
.vehicle-context-copy>span,.vehicle-context-copy>small,.profile-confidence small,.sensor-chips span,.update-banner small,.scan-evidence,.console-warning{font-size:var(--font-caption);line-height:1.4}.vehicle-context-copy>strong,.profile-confidence span,.capabilities-card strong{font-size:var(--font-secondary)}
.sensor-row span,.graph-stats,.event-timeline time,.event-timeline strong,.event-timeline p,.analytics-card span,.analysis-reference strong,.analysis-reference small,.voice-status span,.voice-watches span{font-size:var(--font-caption)}
.scan-button,.console-launch,.official-download-link,.history-actions button,.voice-controls button,.pid-discovery-actions button,.setup-save,.danger-action,.trip-share-actions button,.app-update-settings button{font-size:var(--font-label);letter-spacing:.35px}
.bottom-nav button{font-size:12px}.bottom-nav button span{font-size:21px}
.dialog-copy,.analysis-report p,.analysis-report ul,.analytics-explanation p,.compare-control p{font-size:var(--font-secondary)}

button,select,input,summary,a{touch-action:manipulation}
.scan-button,.quick-actions button,.voice-launch-card>button,.console-launch,.official-download-link,.history-actions button,.voice-controls button,.pid-discovery-actions button,.setup-save,.danger-action,.trip-share-actions button,.app-update-settings button,.vehicle-context-card>button,.capabilities-card>button{min-height:var(--touch-target)}
.setup-card select,.setup-card input,.compare-control select,.analysis-session-field select,.trip-share-controls select{min-height:var(--touch-target);font-size:16px}

.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.metric-card{min-height:126px}.metric-card strong{font-size:clamp(24px,7vw,32px)}
.primary-grid{gap:12px}.gauge-card{min-width:0}.quick-actions{gap:12px}.history-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.history-stats span{padding:8px 10px;border-radius:8px;background:var(--surface-soft)}
.history-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.history-actions button{width:100%;padding:10px}
.trip-sensor-table>div{font-size:var(--font-caption)}.trip-sensor-table strong small,.trip-sensor-table .table-head{font-size:11px}

/* Full screens share one predictable Android-style header and back control. */
.navigation-page[open]{padding:calc(12px + env(safe-area-inset-top)) var(--page-gutter) calc(94px + env(safe-area-inset-bottom));background:#080b09}
.navigation-page>.dialog-card{width:min(100%,960px);padding:62px 0 32px}
.navigation-page .close-button{position:fixed;left:max(var(--page-gutter),calc((100% - 960px)/2));right:auto;top:calc(12px + env(safe-area-inset-top));width:44px;height:44px;border:1px solid var(--border);border-radius:12px;background:var(--surface-raised);display:grid;place-items:center;font-size:0;z-index:7}
.navigation-page .close-button::after{content:'←';font-size:22px;color:var(--text)}
.navigation-page .dialog-card h2{font-size:clamp(28px,7vw,36px);line-height:1.1}

/* Proper Settings grouping. */
.settings-header{display:flex;align-items:center;gap:12px}.settings-section{margin-top:16px;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}
.settings-section>h3{margin:0 0 4px;font-size:18px}.settings-section>.settings-description{display:block;margin-bottom:12px;color:var(--muted);font-size:var(--font-caption);line-height:1.45}
.settings-section .setup-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}.settings-section .data-settings{margin:0;padding:0;border:0;background:transparent}
.settings-choice{display:grid;gap:7px;margin-top:12px;color:#aab6b1;font-size:var(--font-label)}.settings-choice select{width:100%}
.consent-toggle{font-size:var(--font-secondary)!important;line-height:1.45}.consent-toggle input{width:22px!important;height:22px!important}
.settings-footer-actions{display:grid;gap:10px;margin-top:16px}.settings-footer-actions .setup-save{order:-1}

@media(max-width:520px){
  .app-shell{padding-left:14px;padding-right:14px}.topbar{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}
  .brand-copy small{display:none}.hero{padding-top:22px}.hero h1{font-size:34px}
  .primary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gauge-card{padding:14px;min-height:218px}.dial{width:min(38vw,145px);height:min(38vw,145px)}.speed-value strong{font-size:clamp(44px,14vw,56px)}
  .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-card{padding:15px}.recording-strip{grid-template-columns:auto 1fr}.recording-strip button{grid-column:1/-1;width:100%}
  .history-list{grid-template-columns:1fr!important}.settings-section .setup-fields{grid-template-columns:1fr}.settings-section .setup-fields .setup-wide{grid-column:auto}
}

@media(max-width:360px){
  .topbar{gap:8px}.brand-mark{width:38px;height:38px}.brand-copy strong{font-size:13px}.brand-copy em{font-size:11px}.connection-pill{padding:8px 10px;font-size:12px}
  .primary-grid{grid-template-columns:1fr}.gauge-card{min-height:230px}.dial{width:164px;height:164px}.metrics-grid,.quick-actions,.history-actions{grid-template-columns:1fr 1fr}
}

@media (orientation:landscape) and (min-width:700px){
  .app-shell{width:min(100%,1440px);grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr);padding-left:112px;padding-right:24px}
  .bottom-nav{grid-template-rows:repeat(5,minmax(0,1fr));width:96px;padding:14px 9px}.bottom-nav button{font-size:12px;min-height:0}.bottom-nav button span{font-size:24px}
  .navigation-page[open]{left:96px;width:calc(100% - 96px);padding-left:24px;padding-right:24px}.navigation-page .close-button{left:max(120px,calc((100% - 864px)/2 + 96px))}
  .metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.history-list{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))!important}.settings-section .setup-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
}