/* Settings: a small set of categories, useful defaults up front, details on demand. */
#settingsPage.settings-window {
  --settings-accent:#099caf;
  width:min(1120px,calc(100vw - 48px));
  height:min(820px,calc(100dvh - 48px));
  border:1px solid #dce6e8;
  border-radius:16px;
  box-shadow:0 24px 90px #162d3830;
}
#settingsPage.hidden { display:none; }
#settingsPage .settings-heading {
  display:flex;
  align-items:center;
  gap:22px;
  padding:22px 26px;
  border-bottom:1px solid #e8edef;
}
#settingsPage .settings-heading h2 { margin:0 0 5px;font-size:23px;letter-spacing:.5px; }
#settingsPage .settings-heading p { margin:0;font-size:11px;color:#8a969f; }
#settingsPage .page-heading-actions { flex:none;display:flex;align-items:center;gap:12px; }
#settingsPage .settings-save-state { color:#559580;background:#eef8f3;font-size:10px;padding:7px 10px;white-space:nowrap; }
#settingsPage .page-close-button { width:32px;height:32px;border:0;background:#f2f5f6;border-radius:8px;font-size:21px;color:#7d8993; }
#settingsPage .settings-search { position:relative;margin-left:auto;width:290px;min-width:180px;z-index:10; }
#settingsPage .settings-search input { width:100%;height:39px;padding:0 13px;border:1px solid #e0e7ea;border-radius:8px;background:#f8fafb;color:#2d414c;font:12px Inter,"Microsoft YaHei",sans-serif;outline:none; }
#settingsPage .settings-search input::placeholder { color:#9aa6ac; }
#settingsPage .settings-search input:focus { border-color:#79cbd3;box-shadow:0 0 0 3px #0ba3b610;background:#fff; }
#settingsPage .settings-search-results { position:absolute;top:46px;left:0;right:0;overflow:hidden;padding:5px;background:#fff;border:1px solid #dde7ea;border-radius:9px;box-shadow:0 12px 35px #16394720; }
#settingsPage .settings-search-results[hidden] { display:none; }
#settingsPage .settings-search-results button { display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;padding:12px 10px;border:0;border-radius:5px;background:#fff;color:#3b5260;text-align:left; }
#settingsPage .settings-search-results button:hover,#settingsPage .settings-search-results button:focus-visible { background:#eff9fa; }
#settingsPage .settings-search-results strong { min-width:0;font-size:11px;font-weight:500; }
#settingsPage .settings-search-results span { flex:none;font-size:9px;color:#8c9ca5; }
#settingsPage .settings-search-results p { margin:10px;font-size:11px;color:#94a1a8; }
#settingsPage .settings-layout { grid-template-columns:208px minmax(0,1fr); }
#settingsPage .settings-sidebar { padding:22px 13px;gap:7px;background:#f7f9fa;border-color:#e8edef; }
#settingsPage .settings-sidebar button { display:flex;align-items:center;gap:12px;height:auto;min-height:66px;padding:11px 13px;border-radius:8px;box-shadow:none;color:#7c8c96; }
#settingsPage .settings-sidebar button>svg { flex:none;width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
#settingsPage .settings-sidebar button>.settings-category-copy { display:block;flex:1;width:auto;height:auto;padding:0;border:0;border-radius:0;background:none;text-align:left;color:inherit; }
#settingsPage .settings-sidebar strong { display:block;font-size:12px;font-weight:600; }
#settingsPage .settings-sidebar small { display:block;margin-top:5px;color:#a0abb2;font-size:9px;font-weight:400;white-space:nowrap; }
#settingsPage .settings-sidebar button.active { background:#e7f5f7;border:1px solid #cce9ed;color:#098b9e; }
#settingsPage .settings-sidebar button.active small { color:#71a6b0; }
#settingsPage .settings-content { scroll-padding:20px;overscroll-behavior:contain; }
#settingsPage .settings-panel { max-width:none;padding:25px 30px 30px; }
#settingsPage .settings-panel>header { margin:0 0 22px;padding:0;border:0; }
#settingsPage .settings-panel>header h2 { font-size:20px;font-weight:600;letter-spacing:0;margin:0 0 7px; }
#settingsPage .settings-panel>header p { font-size:11px;color:#8a99a2;line-height:1.7; }
#settingsPage .settings-group { min-width:0;margin:0 0 17px;border:1px solid #e2e9ec;border-radius:10px;background:#fff;overflow:hidden; }
#settingsPage .settings-group>h3,#settingsPage .settings-group>summary { margin:0;padding:13px 17px;font-size:12px;font-weight:600;color:#41535e;background:#f9fbfc; }
#settingsPage .settings-group>h3 { border-bottom:1px solid #edf1f3; }
#settingsPage .settings-group-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;padding:3px 17px 8px; }
#settingsPage .settings-group-note { padding:0 17px;color:#929fa7;font-size:10px; }
#settingsPage .settings-field { min-width:0;padding:15px 0 13px;margin:0;border:0;border-radius:0;background:none; }
#settingsPage .settings-field>div { align-items:center;gap:9px;margin-bottom:10px; }
#settingsPage .settings-field label { color:#566a76;font-size:11px;font-weight:500; }
#settingsPage .settings-field output { color:#278b9b;font:500 11px Inter,"Microsoft YaHei",sans-serif;font-variant-numeric:tabular-nums; }
#settingsPage #settingsSensitivityValue,#settingsPage #settingsVerticalSensitivityValue { display:none; }
#settingsPage .settings-field .settings-select,#settingsPage .settings-field .settings-number-input { height:39px;border:1px solid #e0e7ea;border-radius:6px;background:#fafcfd;color:#334d5c;font-size:12px;box-shadow:none; }
#settingsPage .settings-field input[type=range] { display:block;margin:0;width:100%;accent-color:#18a8b9; }
#settingsPage .settings-field input[type=range] { appearance:none;height:4px;margin:8px 0;background:#e5ecef;border-radius:4px; }
#settingsPage .settings-field input[type=range]::-webkit-slider-thumb { appearance:none;width:14px;height:14px;border:2px solid #fff;border-radius:50%;background:#18a8b9;box-shadow:0 0 0 1px #18a8b930;cursor:pointer; }
#settingsPage .settings-field input[type=range]::-moz-range-thumb { width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#18a8b9;cursor:pointer; }
#settingsPage .settings-field input[type=range]::-moz-range-track { height:4px;border:0;border-radius:4px;background:#e5ecef; }
#settingsPage .settings-field-wide { grid-column:1/-1; }
#settingsPage .settings-group-grid>.settings-toggle { display:flex;align-items:center;justify-content:space-between;gap:15px;min-width:0;min-height:76px;margin:0;padding:13px 0;border:0;border-radius:0;background:none; }
#settingsPage .settings-toggle strong { color:#566a76;font-size:11px;font-weight:500; }
#settingsPage .settings-toggle small { display:block;margin-top:5px;color:#9aa6ae;font-size:9px;line-height:1.7; }
#settingsPage .settings-help { color:#9ba7ae;font-size:9px;line-height:1.8; }
#settingsPage .settings-field .settings-help { display:block;margin-top:9px; }
#settingsPage .settings-toggle .switch { flex:none; }
#settingsPage .settings-advanced>summary { display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;font-size:11px;font-weight:500;cursor:pointer;list-style:none; }
#settingsPage .settings-advanced>summary::-webkit-details-marker { display:none; }
#settingsPage .settings-advanced>summary:after { content:'+';font:18px/1 Inter,sans-serif;color:#98a7b0; }
#settingsPage .settings-advanced[open]>summary:after { content:'−'; }
#settingsPage .settings-advanced[open]>summary { border-bottom:1px solid #edf1f3;background:#f9fbfc; }
#settingsPage .settings-located { outline:2px solid #79d1da;outline-offset:-2px;border-radius:6px;background:#effafb; }
#settingsPage .settings-field[hidden],#settingsPage .settings-group-grid>.settings-toggle.input-setting-hidden { display:none!important; }
#settingsPage .trail-setting-row { grid-column:1/-1;flex-wrap:wrap; }
#settingsPage .trail-color-field .color-row { padding:0;background:none;border:0;min-height:35px; }
#settingsPage .trail-color-choices { gap:9px; }
#settingsPage .trail-color-choices .color-swatch { width:22px;height:22px; }
#settingsPage .trail-color-preview { width:80px;height:22px; }
#settingsPage .settings-group-grid>#customHitSoundField { grid-column:1/-1; }
#settingsPage .settings-group-grid>.settings-toggle:only-child { grid-column:1/-1; }
#settingsPage .settings-field .text-button { padding:5px 8px;font-size:10px;border:1px solid #e0e9ec;border-radius:5px;white-space:nowrap;background:#fff; }

/* Live appearance previews remain visible beside the controls. */
#settingsPage .aim-appearance-section { margin-top:0; }
#settingsPage .aim-appearance-heading { margin:0 0 14px; }
#settingsPage .aim-appearance-heading h3 { font-size:12px;font-weight:600; }
#settingsPage .aim-appearance-heading p,#settingsPage .aim-appearance-heading>span { display:none; }
#settingsPage .crosshair-settings-layout { grid-template-columns:180px minmax(0,1fr);gap:22px; }
#settingsPage .crosshair-settings-layout .crosshair-preview { position:sticky;top:0;aspect-ratio:1;height:auto;max-height:none;border-radius:10px;box-shadow:none; }
#settingsPage .crosshair-controls { grid-template-columns:repeat(2,minmax(0,1fr));gap:0 19px; }
#settingsPage .crosshair-controls .settings-toggle { min-height:61px;padding:6px 0;border:0;background:none;border-radius:0; }
#settingsPage .crosshair-controls .settings-field { padding:12px 0; }
#settingsPage .crosshair-controls .crosshair-kick-field { border-bottom:1px solid #edf1f3; }
#settingsPage .crosshair-controls .crosshair-kick-field>div:first-child { margin-bottom:9px; }
#settingsPage .crosshair-kick-hint { font-size:8px;line-height:1.7;color:#a3aeb5; }
#settingsPage .crosshair-controls .color-row { padding:11px 0;min-height:52px;border:0;border-top:1px solid #edf1f3;border-radius:0;background:none; }
#settingsPage .crosshair-controls .color-row>span { font-size:11px;font-weight:500; }
#settingsPage .target-appearance-section { margin-top:25px;padding-top:21px; }
#settingsPage .target-settings-layout { grid-template-columns:180px minmax(0,1fr);gap:22px; }
#settingsPage .target-color-preview { min-height:120px;border-radius:10px; }
#settingsPage .target-color-preview-ball { width:48px;height:48px; }
#settingsPage .target-controls .color-row { padding:0;border:0;background:none;border-radius:0; }
#settingsPage .target-controls .color-row>div { gap:9px; }
#settingsPage .target-controls .color-swatch { width:23px;height:23px; }

/* Only the ordinary weapon view controls are presented here. */
#settingsPage .weapon-tuning-family-tabs { display:flex;gap:4px;width:max-content;margin:0 0 20px;padding:4px;border:1px solid #e2e9ec;border-radius:8px;background:#f3f7f8; }
#settingsPage .weapon-tuning-family-button { min-height:34px;min-width:104px;padding:8px 15px;border:0;border-radius:5px;background:none;color:#8a9ba5;font:500 12px Inter,sans-serif;text-align:center;box-shadow:none; }
#settingsPage .weapon-tuning-family-button.active { background:#fff;color:#138f9f;border:0;box-shadow:0 1px 5px #244b5b10; }
#settingsPage .weapon-view-workspace { display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:22px;align-items:start; }
#settingsPage .weapon-view-preview-column { position:sticky;top:0;min-width:0; }
#settingsPage .weapon-placement-preview { width:100%;min-height:0;aspect-ratio:4/3;height:auto;margin:0;border:1px solid #e1e9ed;border-radius:10px;overflow:hidden; }
#settingsPage .weapon-placement-preview[data-preview3d="true"] .preview-weapon-hitbox { position:absolute;inset:0;z-index:8;width:100%;height:100%;min-width:0;opacity:0;transform:none;filter:none;cursor:grab; }
#settingsPage .weapon-placement-preview[data-preview3d="true"] .preview-weapon-hitbox:active { cursor:grabbing; }
#settingsPage .weapon-preview-overlay { top:12px;left:13px;right:13px;text-shadow:none;color:#70858e; }
#settingsPage .weapon-preview-family { font:500 10px Inter,"Microsoft YaHei",sans-serif;color:#71858e;letter-spacing:.3px; }
#settingsPage .weapon-preview-position,#settingsPage .weapon-preview-rotation { display:none; }
#settingsPage .weapon-preview-status { font:10px Inter,"Microsoft YaHei",sans-serif;color:#768c96;text-shadow:none; }
#settingsPage .weapon-preview-status[data-state="ready"] { display:none; }
#settingsPage .weapon-preview-status[data-state="error"] { color:#af6460; }
#settingsPage .weapon-preview-instruction { font-size:9px;color:#9eabb2;line-height:1.8;margin:9px 2px 0; }
#settingsPage .weapon-position-controls { min-width:0; }
#settingsPage .weapon-position-controls .settings-group-grid { grid-template-columns:1fr; }
#settingsPage .weapon-position-controls .settings-field { padding:12px 0; }
#settingsPage .weapon-tuning-actions { align-items:flex-start;flex-direction:column;gap:8px;margin-top:13px; }
#settingsPage .weapon-tuning-actions .text-button { padding:8px 10px;border:1px solid #e0e8eb;border-radius:6px;background:#fff;color:#79929d;font-size:10px; }
#settingsPage .weapon-tuning-actions .settings-help { font-size:9px; }

#settingsPage [data-settings-panel="privacy"]>.settings-toggle { padding:20px 0;margin:0;border-bottom:1px solid #e8eef0; }
#settingsPage [data-settings-panel="privacy"]>.settings-help { margin:9px 0 18px; }
#settingsPage .settings-footer { position:relative;display:flex;align-items:center;justify-content:flex-start;gap:16px;min-height:66px;padding:12px 25px;border-top:1px solid #e8edef;background:#fff; }
#settingsPage .settings-footer>div { margin-left:auto; }
#settingsPage .settings-footer .text-button { display:block;height:34px;padding:0 10px;border:1px solid #e1e8eb;border-radius:6px;background:#fff;color:#8b9aa3;font-size:10px;font-weight:400; }
#settingsPage .settings-done-button { height:36px;padding:0 25px;border-radius:7px;background:#13a7b9;font-size:12px;font-weight:500;box-shadow:none; }
#settingsPage .settings-reset-menu { position:relative; }
#settingsPage .settings-reset-menu>summary { list-style:none;cursor:pointer;font-size:10px;color:#9aa7af; }
#settingsPage .settings-reset-menu>summary::-webkit-details-marker { display:none; }
#settingsPage .settings-reset-menu>#resetSettings { position:absolute;bottom:28px;left:0;width:max-content;padding:8px 12px;height:auto;color:#b37672;background:#fff;border-radius:7px;box-shadow:0 5px 20px #233e4b18; }
#settingsPage button:focus-visible,#settingsPage summary:focus-visible,#settingsPage select:focus-visible,#settingsPage input:focus-visible { outline:2px solid #74cbd4;outline-offset:3px; }

@media(max-width:1000px) {
  #settingsPage .settings-heading { gap:14px;padding:20px; }
  #settingsPage .settings-layout { grid-template-columns:177px minmax(0,1fr); }
  #settingsPage .settings-sidebar { padding:18px 10px; }
  #settingsPage .settings-sidebar button { padding:11px 9px;gap:9px; }
  #settingsPage .settings-sidebar small { font-size:8px; }
  #settingsPage .settings-panel { padding:23px; }
  #settingsPage .settings-search { width:245px; }
  #settingsPage .crosshair-settings-layout { grid-template-columns:130px minmax(0,1fr)!important;gap:17px; }
  #settingsPage .crosshair-settings-layout .crosshair-preview { position:sticky!important;max-height:none; }
  #settingsPage .target-settings-layout { grid-template-columns:130px minmax(0,1fr);gap:17px; }
  #settingsPage .crosshair-controls { gap:0 12px; }
}
@media(max-width:760px) {
  #settingsPage.settings-window { top:12px!important;bottom:12px!important;width:calc(100vw - 24px);height:calc(100dvh - 24px);transform:translateX(-50%)!important;border-radius:12px; }
  #settingsPage .settings-heading { display:grid;grid-template-columns:1fr auto;gap:14px;padding:17px 18px; }
  #settingsPage .settings-heading h2 { font-size:21px; }
  #settingsPage .settings-heading p { font-size:10px; }
  #settingsPage .page-heading-actions { gap:10px; }
  #settingsPage .settings-save-state { display:block;font-size:9px;padding:5px 8px; }
  #settingsPage .settings-search { grid-column:1/-1;grid-row:2;width:100%;margin:0; }
  #settingsPage .settings-search input { height:36px;font-size:11px; }
  #settingsPage .settings-search-results { top:42px; }
  #settingsPage .settings-layout { grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr); }
  #settingsPage .settings-sidebar { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:8px;overflow:visible;border-right:0;border-bottom:1px solid #e8edef; }
  #settingsPage .settings-sidebar button { min-width:0;min-height:35px;padding:9px 2px;gap:0;border-radius:6px; }
  #settingsPage .settings-sidebar button>svg,#settingsPage .settings-sidebar small { display:none; }
  #settingsPage .settings-sidebar button>.settings-category-copy { display:block;min-width:0;text-align:center; }
  #settingsPage .settings-sidebar strong { font-size:10px;font-weight:500;white-space:nowrap; }
  #settingsPage .settings-panel { padding:21px 17px 24px; }
  #settingsPage .settings-panel>header { margin-bottom:18px; }
  #settingsPage .settings-panel>header h2 { font-size:18px; }
  #settingsPage .settings-panel>header p { font-size:10px; }
  #settingsPage .settings-group-grid { gap:0 15px;padding:2px 13px 8px; }
  #settingsPage .settings-group>h3,#settingsPage .settings-group>summary { padding:12px 13px;font-size:11px; }
  #settingsPage .settings-field label { font-size:10px; }
  #settingsPage .settings-field output { font-size:10px; }
  #settingsPage .settings-field .settings-select,#settingsPage .settings-field .settings-number-input { height:37px;font-size:11px; }
  #settingsPage .crosshair-settings-layout { grid-template-columns:1fr!important;gap:17px; }
  #settingsPage .crosshair-settings-layout .crosshair-preview { position:relative!important;width:100%;height:125px;aspect-ratio:auto;max-height:none; }
  #settingsPage .crosshair-controls { grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px; }
  #settingsPage .target-settings-layout { grid-template-columns:76px minmax(0,1fr);gap:16px; }
  #settingsPage .target-color-preview { min-height:86px; }
  #settingsPage .target-color-preview-ball { width:36px;height:36px; }
  #settingsPage .target-controls .color-row { gap:10px; }
  #settingsPage .target-controls .color-row>div { gap:7px;flex-wrap:wrap; }
  #settingsPage .target-controls .color-swatch { width:20px;height:20px; }
  #settingsPage .weapon-tuning-family-tabs { width:100%; }
  #settingsPage .weapon-tuning-family-button { flex:1; }
  #settingsPage .weapon-view-workspace { grid-template-columns:1fr;gap:18px; }
  #settingsPage .weapon-view-preview-column { position:relative; }
  #settingsPage .weapon-placement-preview { aspect-ratio:16/9; }
  #settingsPage .weapon-position-controls .settings-group-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #settingsPage .weapon-tuning-actions { flex-direction:row;align-items:center;justify-content:space-between; }
  #settingsPage .settings-footer { gap:14px;min-height:61px;padding:10px 17px; }
  #settingsPage .settings-footer .text-button { font-size:9px;padding:0 9px; }
  #settingsPage .settings-done-button { padding:0 21px;font-size:11px; }
}
@media(max-width:400px) {
  #settingsPage .settings-save-state { display:none; }
  #settingsPage .settings-panel { padding:18px 13px 22px; }
  #settingsPage .settings-group-grid { grid-template-columns:1fr; }
  #settingsPage .settings-group-grid>.settings-toggle { min-height:62px; }
  #settingsPage .settings-group-grid>.settings-field { padding:12px 0; }
  #settingsPage .weapon-position-controls .settings-group-grid { grid-template-columns:1fr; }
  #settingsPage .settings-footer { gap:10px;padding:10px 13px; }
}
@media(prefers-reduced-motion:reduce) {
  #settingsPage * { scroll-behavior:auto;transition:none!important; }
}
