.settings-menu { display: grid; gap: 15px; margin: -12px 0 20px; padding: 17px; border: 1px solid #2f74af; border-radius: 17px; background: linear-gradient(135deg, rgba(18, 48, 76, .98), rgba(5, 21, 37, .98)); box-shadow: 0 16px 38px rgba(0,0,0,.28); }
.color-settings { display: grid; gap: var(--fightr-space-sm); border-top: 1px solid #454545; padding-top: 15px; }
.color-settings h3 { margin: 0; }
.color-settings label { display:flex; justify-content:space-between; align-items:center; color:var(--steel); }
.color-settings input { width:54px; height:34px; border:0; background:transparent; }
.settings-menu-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.settings-menu h2 { margin: 0; font-size: 1.2rem; }
.close-settings { width: 34px; height: 34px; border: 1px solid #385978; border-radius: 10px; background: #091a2c; color: #dbe9f8; font-size: 1.6rem; line-height: 1; }
.audio-setting { display: grid; gap: 9px; color: #eaf3ff; font-weight: 700; }
.audio-setting span { display: flex; justify-content: space-between; }
.audio-setting strong { color: #4d9dff; font-variant-numeric: tabular-nums; }
.sound-settings { display: grid; gap: 8px; border-top: 1px solid rgba(215,215,208,.2); padding-top: 14px; }
.sound-settings h3 { margin: 0 0 2px; color: var(--chalk); font-size: 1rem; }
.sound-picker { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 1.1fr) 42px; align-items: center; gap: 8px; color: var(--steel); font-size: .86rem; }
.sound-picker select { width: 100%; min-height: 36px; border: 1px solid var(--line); border-radius: 9px; background: #121211; color: var(--chalk); padding: 0 8px; font: inherit; }
.sound-preview-button { width: 42px; height: 36px; border: 1px solid var(--fight-red-light); border-radius: 9px; background: #181715; color: var(--fight-red-light); font-weight: 900; }
.sound-preview-button:hover { background: var(--fight-red); color: var(--chalk); }
.audio-setting input { width: 100%; accent-color: #2e8cff; }
.warning-toggle { display: flex; align-items: center; gap: var(--fightr-space-sm); color: #eaf3ff; font-weight: 700; }
.warning-settings { display: grid; gap: 12px; min-width: 0; margin: 0; border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.warning-settings legend { padding: 0 6px; font-weight: 700; }
.warning-mode { display: grid; gap: var(--fightr-space-xs); }
.warning-mode select { width: 100%; min-height: 40px; background: #121211; color: var(--chalk); border: 1px solid var(--line); border-radius: 9px; padding: 8px; font: inherit; }
.warning-phases { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: var(--fightr-space-sm); }
.warning-help { color: var(--steel); font-size: .85rem; margin: 0; }
.warning-settings:disabled { opacity: .65; }
@media (max-width: 380px) {
.warning-settings .sound-picker { grid-template-columns: minmax(0, 1fr) 42px; }
.warning-settings .sound-picker > span { grid-column: 1 / -1; }
}
.warning-toggle input { width: 19px; height: 19px; accent-color: #2e8cff; }
.ducking-settings { display: grid; gap: 0; margin: 0; border: 1px solid rgba(215,215,208,.2); border-radius: 12px; padding: 8px 12px; }
.ducking-settings legend { padding: 0 6px; color: var(--chalk); font-weight: 800; }
.ducking-option { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 48px; border-top: 1px solid rgba(215,215,208,.12); color: var(--chalk); cursor: pointer; }
.ducking-option:first-of-type { border-top: 0; }
.ducking-option span { display: grid; gap: 2px; }
.ducking-option small { color: var(--steel); font-weight: 400; }
.ducking-option input { width: 20px; height: 20px; margin: 0; accent-color: var(--fight-red); }
.warning-seconds { display: grid; grid-template-columns: 1fr 76px auto; align-items: center; gap: var(--fightr-space-sm); color: #afc4db; }
.warning-seconds input { width: 100%; border: 1px solid #365470; border-radius: 10px; background: #071729; color: #f8fbff; padding: 8px; text-align: center; font: inherit; font-weight: 800; }
.settings-card { border: 1px solid #294664; border-radius: 19px; background: linear-gradient(135deg, rgba(17, 43, 69, .94), rgba(5, 21, 37, .97)); box-shadow: inset 0 1px rgba(255,255,255,.03), 0 16px 42px rgba(0,0,0,.24); }
.settings-card { padding: 20px; }
.time-picker { margin: 0 0 14px; border: 1px solid #34536e; border-radius: 17px; background: rgba(1, 13, 26, .76); padding: 18px 14px; text-align: center; }
.picker-primary-row { display: grid; grid-template-columns: 54px 54px auto 54px 54px; align-items: center; justify-content: center; gap: var(--fightr-space-xs); }
.picker-display { display: inline-grid; grid-template-columns: 2.25ch auto 2.25ch; align-items: center; border: 1px solid #2789fc; border-radius: 16px; box-shadow: 0 0 19px rgba(39,137,252,.34); padding: 9px 14px; color: #f8fbff; font-size: 2.15rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.picker-time-input { width: 2.25ch; min-width: 0; border: 0; appearance: textfield; background: transparent; color: inherit; padding: 0; text-align: center; font: inherit; font-variant-numeric: tabular-nums; }
.picker-time-input:focus { outline: 0; color: #53a3ff; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
.picker-time-input::-webkit-inner-spin-button { appearance: none; margin: 0; }
.picker-time-input::-webkit-outer-spin-button { appearance: none; margin: 0; }
.picker-adjustment { border: 1px solid #33516c; background: #0a1b2d; color: #3e96ff; border-radius: 12px; font-weight: 800; }
.common-times button { border: 1px solid #33516c; background: #0a1b2d; color: #3e96ff; border-radius: 12px; font-weight: 800; }
.picker-adjustment { min-height: 45px; padding: 10px 12px; font-size: .95rem; }
.common-times { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin-top: 17px; padding-top: 14px; border-top: 1px solid rgba(90, 126, 159, .28); }
.common-times span { width: 100%; margin-bottom: 2px; color: #a9bdd3; font-size: .85rem; }
.common-times button { padding: 7px 10px; font-size: .84rem; color: #d9e5f5; }
.common-times button.is-selected { border-color: #288bff; color: #fff; box-shadow: 0 0 12px rgba(40,139,255,.32); }
@media (max-width: 430px) {
.settings-card { padding: 16px; }
.picker-primary-row { grid-template-columns: 46px 46px minmax(96px, auto) 46px 46px; gap: 4px; }
.picker-adjustment { padding-inline: 4px; font-size: .78rem; }
.picker-display { padding-inline: 10px; font-size: 1.85rem; }
}
.settings-menu { border-color: var(--line); background: linear-gradient(135deg, rgba(37,37,35,.98), rgba(16,16,16,.98)); box-shadow: inset 0 1px rgba(255,255,255,.03), 0 12px 30px rgba(0,0,0,.2); }
.settings-card { border-color: var(--line); background: linear-gradient(135deg, rgba(37,37,35,.98), rgba(16,16,16,.98)); box-shadow: inset 0 1px rgba(255,255,255,.03), 0 12px 30px rgba(0,0,0,.2); }
.settings-menu { margin-top: 0; }
.settings-menu h2 { color: var(--chalk); }
.color-settings h3 { color: var(--chalk); }
.audio-setting { color: var(--chalk); }
.warning-toggle { color: var(--chalk); }
.audio-setting strong { color: var(--fight-red-light); }
.picker-time-input:focus { color: var(--fight-red-light); }
.picker-adjustment { color: var(--fight-red-light); }
.audio-setting input { accent-color: var(--fight-red); }
.warning-toggle input { accent-color: var(--fight-red); }
.warning-seconds input { border-color: var(--line); background: #121211; color: var(--chalk); }
.time-picker { border-color: var(--line); background: #121211; color: var(--chalk); }
.settings-card { padding: 13px 16px; border-radius: 15px; }
.picker-display { border-color: var(--fight-red-light); box-shadow: 0 0 18px rgba(168,14,13,.3); }
.picker-adjustment { border-color: #625c59; background: #292825; }
.common-times button { border-color: #625c59; background: #292825; }
.common-times button.is-selected { border-color: var(--fight-red-light); box-shadow: 0 0 12px rgba(168,14,13,.3); }
@media (orientation: landscape) and (min-width: 600px) {
.setup-screen > .settings-card { grid-column: 1 / -1; }
.settings-card { padding: 11px 14px; }
}
.settings-menu [hidden] { display: none !important; }