/* Calm, readable utility screens. Camera, tutorial media and live FX are untouched. */
:is(#screen-settings, #screen-round-setup, #screen-gym-timer, #screen-ai-menu, #screen-tips) {
  background: var(--p-bg);
}
:is(#screen-settings, #screen-round-setup, #screen-gym-timer, #screen-ai-menu) > .setup-content,
#screen-tips > .tips-content {
  max-width: 760px;
  margin-inline: auto;
  padding-inline: max(20px, env(safe-area-inset-left), env(safe-area-inset-right));
  color: var(--p-ink);
  background: var(--p-bg);
  scrollbar-color: var(--p-line) transparent;
  scrollbar-gutter: stable;
}
:is(#screen-settings, #screen-round-setup, #screen-gym-timer, #screen-ai-menu, #screen-tips) .back-btn {
  color: var(--p-muted);
  background: var(--p-paper);
  border: 1px solid var(--p-line);
  box-shadow: none;
}
:is(#screen-settings, #screen-round-setup, #screen-gym-timer, #screen-ai-menu, #screen-tips) :is(.setup-title, .tips-title) {
  margin: 24px 0 18px;
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: -.035em;
  color: var(--p-ink);
}
#screen-settings .settings-section { margin-bottom: 16px; padding: 20px; }
#screen-settings .settings-label { gap: 12px; line-height: 1.6; color: var(--p-ink); }
#screen-settings .settings-value { color: var(--p-accent); }
#screen-settings :is(.settings-hint, .tv-guide-row) { color: var(--p-muted); font-size: 12px; line-height: 1.8; }
#screen-settings :is(.style-desc, .fx-desc) { color: var(--p-muted); font-size: 11px; line-height: 1.65; }
#screen-settings :is(.style-btn, .fx-btn) {
  min-height: 64px;
  min-width: 0;
  padding: 12px 8px;
  border: 1px solid var(--p-line);
  background: var(--p-paper);
  color: var(--p-ink);
  box-shadow: none;
}
#screen-settings :is(.style-btn, .fx-btn).active {
  border-color: var(--p-accent);
  background: var(--p-raised);
  color: var(--p-ink);
  box-shadow: inset 0 0 0 1px var(--p-accent);
}
#screen-settings .settings-text {
  min-height: 48px;
  border: 1px solid var(--p-line);
  border-radius: 10px;
  background: var(--p-bg);
  color: var(--p-ink);
  font-size: 16px; /* Avoid input-focus zoom on phones. */
}
#screen-settings .settings-preview { color: var(--p-muted); font-size: 13px; line-height: 1.85; }
#screen-settings .settings-preview strong { color: var(--p-ink); }
#screen-settings #settings-save { min-height: 52px; margin-top: 8px; }
:is(#screen-round-setup, #screen-gym-timer) .preset-btn {
  border: 1px solid var(--p-line);
  border-radius: 16px;
  background: var(--p-paper);
  padding: 18px 20px;
  box-shadow: none;
}
:is(#screen-round-setup, #screen-gym-timer) .preset-btn.active {
  background: var(--p-raised);
  border-color: var(--p-accent);
  box-shadow: inset 0 0 0 1px var(--p-accent);
}
:is(#screen-round-setup, #screen-gym-timer) .preset-label { color: var(--p-ink); line-height: 1.6; }
:is(#screen-round-setup, #screen-gym-timer) .preset-detail { color: var(--p-muted); line-height: 1.7; }
:is(#screen-round-setup, #screen-gym-timer) .custom-settings {
  color: var(--p-ink);
  background: var(--p-paper);
  border: 1px solid var(--p-line);
  border-radius: 16px;
  box-shadow: none;
}
@media (min-width: 800px) {
  :is(#screen-settings, #screen-round-setup, #screen-gym-timer, #screen-ai-menu) > .setup-content,
  #screen-tips > .tips-content { padding-top: 32px; padding-inline: 32px; }
  #screen-settings .settings-section { padding: 24px; }
}
@media (max-width: 359px) {
  #screen-settings .settings-section { padding: 14px; }
  #screen-settings :is(.settings-style-row, .settings-fx-row) { gap: 6px; }
  #screen-settings .settings-label { font-size: 13px; }
}
