@import url("../Content/typography.css?v=2");
:root {font-size:var(--ui-font-size);font-family:var(--ui-font-family);color:#203327;background:#edf0ed;color-scheme:light}
* {box-sizing:border-box}
body {height:100dvh;margin:0;display:flex;flex-direction:column;overflow:hidden}
button,input {font:inherit}
button {cursor:pointer;padding:6px 10px;border:1px solid #b6c5ba;border-radius:4px;background:#fff;color:inherit}
button:hover {background:#edf3ef}
button:disabled {opacity:.5;cursor:default}
button:focus-visible,input:focus-visible {outline:2px solid #2476c8;outline-offset:2px}
.app-header {flex:none;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 14px;background:#fff;border-bottom:1px solid #c7d4cb}
h1 {font-size:20px;margin:0}
#category-form {display:flex;align-items:center;gap:6px;font-size:calc(13px + var(--ui-font-increase, 2px))}
#category-id {width:clamp(140px,20vw,280px);max-width:100%;padding:5px;border:1px solid #b6c5ba;border-radius:4px;background:#fff;color:inherit}
#category-name {font-size:calc(13px + var(--ui-font-increase, 2px))}
nav {display:flex;gap:5px;margin-left:auto}
.app-header nav{flex-wrap:wrap;min-width:0;max-width:100%}.app-header nav button{flex:0 0 auto}
footer {padding:5px 12px;font-size:calc(11px + var(--ui-font-increase, 2px));flex:none;border-top:1px solid #c7d4cb;background:white}
#workspace {flex:1;min-height:0;overflow:auto;padding:6px}
.panel-view {width:100%;height:100%;min-height:0;min-width:0;overflow:hidden}
.panel-view[hidden] {display:none!important}
.map-panel {position:relative;background:white}
.map-panel>svg {display:block;width:100%;height:100%;touch-action:none;user-select:none;cursor:grab}
.map-panel>svg.dragging {cursor:grabbing}
.map-reset {position:absolute;right:10px;top:10px;z-index:1}
.map-message {position:absolute;bottom:8px;left:8px;max-width:90%;padding:5px 8px;background:#ffffffdd;font-size:calc(12px + var(--ui-font-increase, 2px));pointer-events:none}
.error {color:#a32121}
.course-control {fill:none;stroke:#a020a0;stroke-width:12}
.track-line {fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.track-head {stroke:#fff;stroke-width:2}
.playback-panel {padding:12px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.playback-buttons {display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.speed-label {display:flex;gap:8px;align-items:center;font-size:calc(13px + var(--ui-font-increase, 2px))}
.speed-label input {min-width:60px;flex:1}
.speed-label output {width:32px;font-variant-numeric:tabular-nums}
.playback-time {font-size:18px;font-variant-numeric:tabular-nums}
.playback-note {font-size:calc(12px + var(--ui-font-increase, 2px));color:#58685d;margin:0}
.runners-panel {display:flex;flex-direction:column}
.runner-tools {padding:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;border-bottom:1px solid #d4ddd5;font-size:calc(12px + var(--ui-font-increase, 2px))}
.runner-tools select {max-width:100%;min-width:0;padding:6px;border:1px solid #b6c5ba;border-radius:4px;background:white;color:inherit;font:inherit;width:135px}
.runner-name-filter{display:flex;flex-direction:column;gap:5px;padding:8px 10px 0;font-size:calc(12px + var(--ui-font-increase,2px))}
.runner-name-filter input{box-sizing:border-box;width:100%;min-width:0;min-height:34px;padding:6px 8px;border:1px solid #b6c5ba;border-radius:4px;background:#fff;color:inherit;font:inherit}
.runner-name-filter input:focus-visible{outline:2px solid #2476c8;outline-offset:2px}
.runner-name-filter [data-filter-count]{color:#657369}
.runner-list {flex:1;min-height:0;overflow:auto;padding:6px}
.runner-row {display:flex;align-items:center;gap:8px;padding:8px 6px;font-size:calc(13px + var(--ui-font-increase, 2px));cursor:pointer}
.runner-row:hover {background:#edf3ef}
.runner-row.is-selected-runner,.runners-panel .runner-leg-table .runner-row.is-selected-runner{background:#e3efff;box-shadow:inset 3px 0 #2e79ed}
.runner-row button.runner-name{border:0;background:transparent;color:inherit;text-align:left;padding:0;font:inherit;cursor:pointer}
.runner-row button.runner-name:focus-visible{outline:2px solid #2476c8;outline-offset:3px}
.runner-row.is-selected-runner .runner-name{font-weight:600}
.runner-row input {flex:none}
.runner-name {flex:1;overflow-wrap:anywhere}
.runner-duration {font-size:calc(11px + var(--ui-font-increase, 2px));color:#657369;font-variant-numeric:tabular-nums}
.runner-swatch {width:11px;height:11px;border-radius:50%;flex:none}
.runners-message {font-size:calc(12px + var(--ui-font-increase, 2px));padding:0 10px;margin:8px 0}
@media(max-width:650px) {.app-header{gap:8px;padding:8px}nav{margin-left:0}nav button{font-size:calc(12px + var(--ui-font-increase, 2px));padding:4px 7px}}.map-toolbar{position:absolute;right:10px;top:10px;z-index:1;display:flex;align-items:center;gap:8px;padding:5px;background:#fffffff2;border:1px solid #dce5ef;border-radius:6px;font-size:calc(12px + var(--ui-font-increase, 2px))}
.map-toolbar .map-reset{position:static}.map-toolbar label{display:flex;align-items:center;gap:5px;padding-left:4px}.map-toolbar select{padding:5px;border:1px solid #dce5ef;border-radius:4px;background:white;color:#20314c}
.heatmap-legend{position:absolute;right:10px;bottom:10px;background:#fffffff0;border-radius:5px;padding:7px;display:flex;align-items:center;gap:6px;font-size:calc(11px + var(--ui-font-increase, 2px))}.heatmap-legend[hidden]{display:none}.heatmap-legend i{width:90px;height:9px;background:linear-gradient(to right,#2364ff,#00d2dc,#3cdc5a,#ffdc1e,#f02d19);border-radius:4px}
.map-leg-bar{position:absolute;top:58px;left:10px;right:10px;display:flex;gap:2px;padding:5px;background:#343434ed;overflow-x:auto;border-radius:4px;z-index:1}.map-leg-bar[hidden]{display:none}.map-leg-bar button{background:transparent;color:white;border:2px solid transparent;border-radius:2px;min-width:28px;padding:4px;flex:none}.map-leg-bar button[aria-pressed="true"]{border-color:#ff684d;background:#813b2d}.map-leg-bar button:focus-visible{outline:2px solid white}.course-control.leg-control{stroke:#e34b27;stroke-width:16}

.map-leg-bar{gap:0}.map-leg-bar button.leg-from{border-right-color:transparent;border-radius:2px 0 0 2px}.map-leg-bar button.leg-to{border-left-color:transparent;border-radius:0 2px 2px 0}

.map-toolbar label[hidden]{display:none}


.appearance-settings{padding:16px;overflow:auto}.appearance-settings h2{font-size:17px;margin:0 0 10px}.appearance-settings p{font-size:calc(12px + var(--ui-font-increase, 2px));line-height:1.5;color:#637567}.appearance-slider{display:grid;grid-template-columns:1fr auto;gap:8px;margin:16px 0;font-size:calc(13px + var(--ui-font-increase, 2px))}.appearance-slider input{grid-column:1 / -1;width:100%;margin:0;accent-color:#225e50}.appearance-style{display:flex;flex-direction:column;gap:8px;margin:16px 0;font-size:calc(13px + var(--ui-font-increase, 2px))}.appearance-style select{padding:8px 10px;max-width:100%;border:1px solid var(--line,#d6dfed);border-radius:4px;box-shadow:none}
.appearance-style select:focus-visible{border-color:var(--accent,#2e79ed);outline:1px solid var(--accent,#2e79ed);outline-offset:0;box-shadow:none}

.map-toolbar{left:10px;overflow-x:auto;scrollbar-width:thin}
.map-toolbar>label,.map-toolbar>.map-reset{flex:none;white-space:nowrap}
.map-playback{display:flex;align-items:center;gap:8px;flex:1;min-width:350px;color:#172340}
.map-playback .replay-toggle{width:30px;height:30px}
.map-playback .replay-toggle svg{width:18px;height:18px;cursor:pointer}
.map-playback .replay-restart{flex:none;font-size:calc(11px + var(--ui-font-increase, 2px));white-space:nowrap}
.map-playback .replay-timeline{min-width:80px;flex:1}
.map-playback .replay-speed{width:125px;margin-left:0;padding-left:0}
.map-playback .playback-time{font-variant-numeric:tabular-nums}

.map-playback[hidden],.map-options-popup[hidden]{display:none}
.map-toolbar.playback-hidden{left:auto}
.map-menu-button{flex:none;position:sticky;right:0;font-size:22px;line-height:24px;width:28px;padding:0;border:0;border-radius:4px;background:white;color:#20314c}
.map-menu-button:hover,.map-menu-button[aria-expanded=true]{background:#edf2f8}
.map-options-popup{position:absolute;right:10px;z-index:5;min-width:150px;padding:5px;background:white;border:1px solid #dce5ef;border-radius:6px;box-shadow:0 4px 14px #17234026}
.map-options-popup button{display:block;width:100%;padding:8px 12px;text-align:left;border:0;border-radius:4px;background:white;color:#20314c;font-size:calc(12px + var(--ui-font-increase, 2px))}
.map-options-popup button:hover,.map-options-popup button:focus-visible{background:#edf2f8}


.appearance-settings .appearance-restore{display:block;margin:20px auto 12px;padding:10px 16px}

.map-leg-bar .leg-prefix,.map-leg-bar .leg-arrow,.map-leg-bar .leg-distance{display:none}

/* Desktop Legs bar matches the mobile light theme. */
body:not(.mobile-replay) .map-leg-bar{gap:0;padding:7px 8px;background:#fff;border:1px solid #c7d8cf;align-items:center;scrollbar-width:none;user-select:none;overscroll-behavior-x:contain;color-scheme:light}
body:not(.mobile-replay) .map-leg-bar::-webkit-scrollbar{display:none}
body:not(.mobile-replay) .map-leg-bar::-webkit-scrollbar-thumb{background:#9bbeb0;border-radius:4px}
body:not(.mobile-replay) .map-leg-bar::-webkit-scrollbar-track{background:#f2f6f3}
body:not(.mobile-replay) .map-leg-bar button{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:38px;min-height:32px;margin:0 3px;padding:5px 9px;border:1px solid transparent;border-radius:8px;background:transparent;color:#527363;font:calc(12px + var(--ui-font-increase, 2px)) ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
body:not(.mobile-replay) .map-leg-bar button:hover:not([aria-pressed=true]){background:transparent}
body:not(.mobile-replay) .map-leg-bar button[aria-pressed=true]{background:#e1eee9;border-color:#32815f;color:#104e3f;font-weight:600}
body:not(.mobile-replay) .map-leg-bar button.leg-from{margin-right:0;padding-right:3px;border-right:0;border-radius:8px 0 0 8px}
body:not(.mobile-replay) .map-leg-bar button.leg-to{margin-left:0;padding-left:3px;border-left:0;border-radius:0 8px 8px 0}
body:not(.mobile-replay) .map-leg-bar .leg-from .leg-prefix,body:not(.mobile-replay) .map-leg-bar .leg-from .leg-arrow{display:inline}
body:not(.mobile-replay) .map-leg-bar .leg-to .leg-distance:not(:empty){display:inline;margin-left:3px;padding:2px 4px;border-radius:4px;background:#32815f18;font-size:calc(10px + var(--ui-font-increase, 2px))}
body:not(.mobile-replay) .map-leg-bar button:focus-visible{outline:2px solid #256956}
body:not(.mobile-replay) .map-leg-bar button:first-child .leg-number,body:not(.mobile-replay) .map-leg-bar button:last-child .leg-number{font-size:20px;line-height:1;font-weight:400}
.map-toolbar{top:0;left:0;right:0;border-radius:0;border-top:0;border-left:0;border-right:0}
.map-view-buttons{display:flex;gap:3px;flex:none}
.map-view-buttons button,.map-playback .replay-restart{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:5px;border:1px solid transparent;border-radius:4px;background:transparent;color:#527363}
.map-view-buttons button[aria-pressed="true"]{background:#e1eee9;color:#104e3f;border-color:#9bbeb0}
.map-view-buttons button:hover,.map-playback .replay-restart:hover:not(:disabled){background:#e1eee9}
.map-view-buttons svg,.map-playback .replay-restart svg{width:20px;height:20px}
.map-view-buttons button:focus-visible,.map-playback .replay-restart:focus-visible{outline:2px solid #256956;outline-offset:1px}

.map-toolbar .map-playback .replay-speed{border-left:1px solid #c7d4cb;border-right:1px solid #c7d4cb;padding-left:10px;padding-right:10px}

.map-active-overlays{position:absolute;top:52px;left:8px;z-index:2;margin:0;padding:6px 10px 9px;max-width:calc(100% - 16px);max-height:40%;overflow:auto;background:#fffffff2;border:1px solid #c7d4cb;border-radius:4px;color:#26374b;font-size:13px}
.map-active-overlays[hidden]{display:none}
.map-overlays-heading{font-weight:600;margin:0 0 4px}
.map-active-overlays label{display:flex;align-items:center;gap:7px;padding:3px 0;cursor:pointer}
.map-active-overlays input{margin:0;flex:none;accent-color:#256956}
.map-active-overlays input:focus-visible{outline:2px solid #1769dc;outline-offset:2px}

.panel-map-action-header{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.panel-map-action-header>strong,.panel-map-action-header>h2,.panel-map-action-header>h3{margin:0;min-width:0}
.panel-map-action[hidden]{display:none!important}
.panel-map-action-header>.panel-map-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:30px;padding:5px 10px;border:1px solid #32815f;border-radius:5px;background:transparent;color:var(--ink,#225e50);font:inherit;font-size:12px;line-height:18px;font-weight:600;white-space:nowrap;cursor:pointer;box-shadow:none}
.panel-map-button svg{width:16px;height:16px;flex:none}
.panel-map-action-header>.panel-map-button[aria-pressed=true]{background:#225e50;border-color:#225e50;color:#fff}
.panel-map-action-header>.panel-map-button:hover:not(:disabled){background:#32815f1f}
.panel-map-action-header>.panel-map-button[aria-pressed=true]:hover:not(:disabled){background:#327a65}
.panel-map-action-header>.panel-map-button:focus-visible{outline:2px solid #32815f;outline-offset:3px}
.panel-map-action-header>.panel-map-button:disabled{opacity:.45;cursor:default}


/* Keep status text and analysis captions out of the map viewport. */
.map-panel .map-message,.map-panel .map-setter-legend{display:none}

/* Match grouped dropdown headings to the Add Panel section headings. */
.runner-tools optgroup,.layout-controls optgroup{font-style:normal;font-weight:700;font-size:calc(11px + var(--ui-font-increase, 2px));text-transform:uppercase;letter-spacing:.6px;color:#60796a}
.runner-tools optgroup option,.layout-controls optgroup option{font-style:normal;font-weight:400;font-size:calc(12px + var(--ui-font-increase, 2px));text-transform:none;letter-spacing:normal;color:#203327}

/* Native dropdown groups/options need an explicit application font too. */
select,select optgroup,select option{font-family:var(--ui-font-family)}

.grouped-select-trigger{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;font-family:var(--ui-font-family);font-size:14px;text-align:left;white-space:nowrap}
.grouped-select-trigger::after{content:'';width:6px;height:6px;border-right:1.5px solid;border-bottom:1.5px solid;transform:rotate(45deg);margin:0 2px 3px}
.grouped-select-popup{position:fixed;z-index:10000;overflow:auto;max-width:calc(100vw - 16px);padding:8px;background:#fff;border:1px solid #bccfc2;border-radius:6px;box-shadow:0 8px 24px #16372830;font-family:var(--ui-font-family);color:#203327}
.grouped-select-popup[hidden]{display:none}
.grouped-select-heading{font-family:var(--ui-font-family);font-size:calc(11px + var(--ui-font-increase, 2px));font-style:normal;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#60796a;margin:10px 6px 5px}
.grouped-select-popup>[role=group]:first-child .grouped-select-heading{margin-top:2px}
.grouped-select-option{display:block;width:100%;border:0;border-radius:3px;background:#f7faf7;padding:7px 12px;text-align:left;font-family:var(--ui-font-family);font-size:calc(13px + var(--ui-font-increase, 2px));font-weight:400;color:#203327}
.grouped-select-option:hover:not(:disabled),.grouped-select-option:focus-visible{background:#e4f0e8}
.grouped-select-option[aria-selected=true]{background:#dbece3}

body:not(.mobile-replay) .map-leg-bar{left:0;right:0;border-radius:0;border-top:0;border-left:0;border-right:0}

.app-header #category-id+.grouped-select-trigger{width:clamp(140px,20vw,280px);max-width:100%;min-height:32px;background:#f7faf7;color:#193d30;border-color:#b6cfc2}
@media(max-width:650px){.app-header #category-id+.grouped-select-trigger{width:140px}}

.runner-pace-panel{padding:12px;overflow:auto;display:flex;flex-direction:column;gap:10px;color:#26374b}
.runner-pace-panel p{margin:0;line-height:1.45;color:#53657a;font-size:14px}
.runner-pace-panel .pace-scroll{min-height:140px;flex:1;border:1px solid #dce5ef;border-radius:4px;background:#fff}
.runner-pace-panel .pace-scroll svg{display:block;width:100%;height:100%;min-height:140px}
.runner-pace-panel .pace-grid{stroke:#dce5ef;stroke-dasharray:2 3;fill:none}
.runner-pace-panel .pace-cursor{stroke:#256956;stroke-width:1.5}
.runner-pace-panel .pace-empty{fill:#60796a;font-size:12px}
.runner-pace-panel .pace-legend{max-height:45%;overflow:auto;flex:none}
.runner-pace-panel .pace-runner{display:grid;grid-template-columns:8px minmax(0,1fr) auto;gap:8px;align-items:center;padding:5px 0;font-size:14px}
.runner-pace-panel .pace-runner i{width:8px;height:8px;border-radius:50%}
.runner-pace-panel .pace-runner-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.runner-pace-panel .pace-runner-value{font-variant-numeric:tabular-nums}

.runner-pace-panel{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);grid-template-rows:auto auto minmax(140px,1fr)}
.runner-pace-panel>strong,.runner-pace-panel>p{grid-column:1/-1}
.runner-pace-panel .pace-scroll{min-width:0;overflow:hidden}
.runner-pace-panel .pace-legend{min-width:0;min-height:0;max-height:none}
.runner-pace-panel.pace-chart-only{grid-template-columns:minmax(0,1fr)}
.runner-pace-panel .pace-legend[hidden]{display:none}
.runner-pace-panel svg:focus-visible{outline:2px solid #2476c8;outline-offset:-2px}

/* Shared native dropdown styling for analysis filters. */
.panel-filter-select{font-family:var(--ui-font-family);padding:revert;border-radius:revert}

.analysis-toolbar select,.hotspot-filters select,.terrain-usage-panel select,.decisive-legs-panel select,.approach-patterns-panel select,.route-groups-panel select{border:1px solid #dce5f2;border-radius:6px;background:#fff;color:#24375c;padding:6px 9px;font:inherit;font-size:calc(12px + var(--ui-font-increase, 2px));max-width:210px}

.map-route-tooltip{position:absolute;z-index:20;pointer-events:none;white-space:pre-line;max-width:calc(100% - 8px);padding:8px 10px;background:#fff;color:#20314c;border:1px solid #b8ccc1;border-radius:5px;box-shadow:0 3px 12px #0002;font-size:13px;line-height:1.5}.map-route-tooltip[hidden]{display:none}

.map-leg-bar.leg-hovering,body:not(.mobile-replay) .map-leg-bar.leg-hovering{background-image:linear-gradient(to right,transparent var(--leg-hover-start),#dcece4 var(--leg-hover-start),#dcece4 var(--leg-hover-end),transparent var(--leg-hover-end));background-size:100% 32px;background-repeat:no-repeat;background-position:center;cursor:pointer}

.map-leg-bar.leg-dragging,.map-leg-bar.leg-dragging button{cursor:grabbing}

.grouped-select-option.grouped-select-counted{display:flex;align-items:baseline;justify-content:space-between;gap:24px}
.grouped-select-label{min-width:0;overflow-wrap:anywhere}
.grouped-select-count{flex:none;margin-left:auto;text-align:right;font-variant-numeric:tabular-nums;color:#60796a}

/* Shared replay controls, including dynamically opened panels and menus. */
input[type=range],input[type=checkbox]{accent-color:#32815f!important}

.replay-settings-button{display:inline-flex;align-items:center;justify-content:center;flex:none;padding:6px;border:1px solid #b6c5ba;border-radius:4px;background:#fff;color:#256956;cursor:pointer}
.replay-settings-button[aria-expanded=true],.replay-settings-button:hover{background:#edf3ef}
.replay-settings-button:focus-visible,.replay-settings-panel select:focus-visible{outline:2px solid #2476c8;outline-offset:2px}
.replay-settings-panel{position:fixed;margin:0;box-sizing:border-box;width:280px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow:auto;padding:16px;border:1px solid #b6c5ba;border-radius:6px;background:#fff;color:#203327;box-shadow:0 5px 20px #0003;font-size:14px}
.replay-settings-panel label{display:flex;flex-direction:column;gap:6px;margin-top:14px}
.replay-settings-panel label[hidden]{display:none}
.replay-settings-panel select{width:100%;padding:7px;border:1px solid #b6c5ba;border-radius:4px;background:#fff;color:inherit;font:inherit}

.replay-settings-panel select:disabled{background:#f0f2f1;color:#758078;cursor:not-allowed;opacity:1}

.runner-summary{display:flex;align-items:center;gap:8px;padding:4px 10px}
.runner-summary .runners-message{flex:1;min-width:0;margin:0;padding:0}
.runner-deselect-all{flex:none;margin-left:auto;padding:3px 7px;min-height:26px;border:1px solid #b6c5ba;border-radius:4px;background:#fff;color:#256956;font:inherit;font-size:12px;cursor:pointer}
.runner-deselect-all:hover:not(:disabled){background:#edf3ef}
.runner-deselect-all:focus-visible{outline:2px solid #2476c8;outline-offset:2px}
.runner-deselect-all:disabled{opacity:.45;cursor:default}

/* Manual camera override: one action restores the current desktop follow mode. */
.map-follow-status{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:2;max-width:calc(100% - 16px)}
.map-follow-status[hidden]{display:none}
.map-follow-status .map-resume-follow{display:inline-flex;align-items:center;justify-content:center;gap:4px;margin:0;padding:6px 10px;max-width:100%;border:1px solid var(--message-info-border,#ccd2d6);border-radius:5px;background:var(--message-info-bg,#f2f4f5);color:var(--message-info-text,#46525b);font-size:13px;line-height:1.4;white-space:nowrap;box-shadow:0 2px 8px #16372820;cursor:pointer}
.map-follow-status .map-resume-follow:hover{background:#e6ecef;border-color:#87979f}
.map-follow-status .map-resume-follow:focus-visible{outline:2px solid #2476c8;outline-offset:3px}

.runner-incomplete{font-size:12px;color:#806024}

/* A lightweight category switch inside Settings, distinct from workspace tabs. */
.settings-section-switch{display:inline-flex;align-items:center;gap:4px;padding:3px;border-radius:8px;background:var(--button,#eef3ef);margin-bottom:8px}
.appearance-settings .settings-section-switch button{border:0;border-radius:5px;box-shadow:none;background:transparent;color:var(--muted,#637567);padding:7px 12px;min-height:34px;font:inherit;font-size:14px;cursor:pointer}
.appearance-settings .settings-section-switch button[aria-pressed=true]{background:var(--surface,#fff);color:var(--ink,#163d35);font-weight:600}
.appearance-settings .settings-section-switch button:hover{color:var(--ink,#163d35);background:var(--selected,#e1eee6)}
.settings-section-switch button:focus-visible{outline:2px solid var(--accent,#32815f);outline-offset:2px}
.appearance-settings .settings-section[hidden]{display:none}
