:root {
  --codex-bg: #0d0d0d;
  --codex-surface: #171717;
  --codex-surface-raised: #1f1f1f;
  --codex-surface-subtle: #242424;
  --codex-input-surface: #3d3d3a;
  --codex-border: #303030;
  --codex-border-strong: #454545;
  --codex-text: #f2f2f2;
  --codex-text-secondary: #b4b4b4;
  --codex-text-muted: #858585;
  --codex-accent: #79d7bd;
  --codex-accent-strong: #a4ead6;
  --codex-accent-soft: rgba(121, 215, 189, 0.12);
  --codex-success: #72d29b;
  --codex-danger: #ff8a8a;
  --codex-warning: #f2c66d;
  --codex-on-accent: #0b201a;
  --codex-danger-soft: rgba(255, 138, 138, 0.12);
  --codex-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 12px 32px rgba(0, 0, 0, 0.18);
  color-scheme: dark;
}

html[data-codex-theme="light"] {
  --codex-bg: #f7f7f5;
  --codex-surface: #ffffff;
  --codex-surface-raised: #ffffff;
  --codex-surface-subtle: #f1f1ef;
  --codex-input-surface: #f1f1ef;
  --codex-border: #dededb;
  --codex-border-strong: #c8c8c4;
  --codex-text: #1f1f1f;
  --codex-text-secondary: #565656;
  --codex-text-muted: #62625e;
  --codex-accent: #0f766e;
  --codex-accent-strong: #0b5f59;
  --codex-accent-soft: rgba(15, 118, 110, 0.1);
  --codex-success: #168053;
  --codex-danger: #c24141;
  --codex-warning: #9a650f;
  --codex-on-accent: #ffffff;
  --codex-danger-soft: rgba(194, 65, 65, 0.1);
  --codex-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 12px 32px rgba(0, 0, 0, 0.07);
  color-scheme: light;
}

html,
body {
  background: var(--codex-bg) !important;
  color: var(--codex-text-secondary) !important;
}

body {
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "PingFang SC", "Microsoft YaHei", sans-serif !important;
  text-rendering: optimizeLegibility;
}

body::before,
body::after {
  display: none !important;
}

.header {
  background: color-mix(in srgb, var(--codex-surface) 94%, transparent) !important;
  border-color: var(--codex-border) !important;
  box-shadow: none !important;
}

.header h1,
.card-title,
.finance-value,
.stat-value,
.info-value,
.b-title {
  color: var(--codex-text) !important;
  letter-spacing: -0.01em !important;
}

.subtitle,
.card-title small,
.stat-label,
.finance-label,
.finance-title,
.info-label,
.empty,
.coach-id,
.spinner-text {
  color: var(--codex-text-muted) !important;
}

.card,
.modal-content,
.voucher-batch,
.voucher-form {
  background: var(--codex-surface) !important;
  border: 1px solid var(--codex-border) !important;
  box-shadow: var(--codex-shadow) !important;
  backdrop-filter: none !important;
}

.card,
.modal-content {
  border-radius: 12px !important;
}

.member-group,
.recent-tab-content,
.member-tab-content {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
  box-shadow: none !important;
}

.stat-item,
.finance-item,
.code-row,
.slot-row,
.schedule-row,
.recent-item,
.expense-item {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
  box-shadow: none !important;
}

.finance-divider,
.divider {
  background: var(--codex-border) !important;
  border-color: var(--codex-border) !important;
}

.member-tab,
.recent-tab,
.schedule-tab,
.detail-tab,
.finance-tab {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
  color: var(--codex-text-muted) !important;
}

.member-tab:hover,
.recent-tab:hover,
.schedule-tab:hover,
.detail-tab:hover,
.finance-tab:hover {
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
}

.member-tab.active,
.recent-tab.active,
.schedule-tab.active,
.detail-tab.active,
.finance-tab.active {
  color: var(--codex-accent-strong) !important;
  background: var(--codex-accent-soft) !important;
  border-color: color-mix(in srgb, var(--codex-accent) 45%, var(--codex-border)) !important;
}

.coach-item.active {
  background: var(--codex-accent-soft) !important;
  border-color: color-mix(in srgb, var(--codex-accent) 45%, var(--codex-border)) !important;
}

.coach-item.active .coach-avatar {
  background: var(--codex-accent) !important;
  color: #0b201a !important;
}

.coach-item.active .coach-name,
.coach-item.active .coach-id {
  color: var(--codex-text) !important;
}

.coach-item.inactive {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
}

.member-tag,
.tag {
  background: var(--codex-surface-subtle) !important;
  border: 1px solid var(--codex-border) !important;
  color: var(--codex-text-secondary) !important;
}

.member-tag:hover {
  background: var(--codex-accent-soft) !important;
  border-color: var(--codex-accent) !important;
  color: var(--codex-text) !important;
}

.tag-green {
  color: var(--codex-success) !important;
}

.tag-red {
  color: var(--codex-danger) !important;
}

a {
  color: var(--codex-accent) !important;
}

button,
.btn-primary,
.btn-voucher,
.btn-copy-code,
input[type="button"],
input[type="submit"] {
  border: 1px solid var(--codex-border-strong) !important;
  border-radius: 8px !important;
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text) !important;
  box-shadow: none !important;
}

button:hover,
.btn-primary:hover,
.btn-voucher:hover,
.btn-copy-code:hover {
  background: color-mix(in srgb, var(--codex-surface-subtle) 72%, var(--codex-accent-soft)) !important;
  border-color: var(--codex-accent) !important;
}

input,
select,
textarea {
  background: var(--codex-bg) !important;
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
  border-radius: 8px !important;
  color-scheme: inherit !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--codex-text-muted) !important;
}

html[data-codex-theme="light"] input[type="time"]::-webkit-calendar-picker-indicator {
  filter: none !important;
}

/* Native time fields need an explicit surface/color-scheme in legacy modals.
   Otherwise Chromium can retain the old near-black inline paint in light mode. */
#editBookingModal .codex-time-input {
  background-color: var(--codex-input-surface) !important;
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
  color-scheme: dark !important;
}

html[data-codex-theme="light"] #editBookingModal .codex-time-input {
  background-color: var(--codex-input-surface) !important;
  color-scheme: light !important;
}

:focus-visible {
  outline: 2px solid var(--codex-accent) !important;
  outline-offset: 2px !important;
}

.modal-overlay,
.spinner-overlay,
.orange-ai-overlay,
.lightbox {
  background: rgba(0, 0, 0, 0.66) !important;
}

.codex-theme-toggle {
  position: fixed;
  z-index: 10050;
  top: max(12px, env(safe-area-inset-top));
  right: max(12px, env(safe-area-inset-right));
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border-radius: 10px !important;
  border: 1px solid var(--codex-border) !important;
  background: color-mix(in srgb, var(--codex-surface-raised) 94%, transparent) !important;
  color: var(--codex-text-secondary) !important;
  box-shadow: var(--codex-shadow) !important;
  backdrop-filter: blur(12px);
  cursor: pointer;
}

.codex-theme-toggle:hover {
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
}

.codex-theme-toggle svg {
  width: 17px;
  height: 17px;
  pointer-events: none;
}

* {
  scrollbar-color: var(--codex-border-strong) transparent;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  background: var(--codex-border-strong);
  border-radius: 999px;
}

@media (max-width: 640px) {
  .codex-theme-toggle {
    width: 34px;
    height: 34px;
    top: max(8px, env(safe-area-inset-top));
    right: max(8px, env(safe-area-inset-right));
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media print {
  .codex-theme-toggle {
    display: none !important;
  }
}

/* CODEX CORE POLISH 20260803B
   Visual-only overrides: preserve every legacy module and its layout. */
::selection {
  background: var(--codex-accent-soft);
  color: var(--codex-text);
}

.codex-theme-toggle {
  top: auto !important;
  bottom: max(14px, env(safe-area-inset-bottom)) !important;
}

.card,
.stat-item,
.finance-item,
.member-group,
.slot-item,
.record,
.calendar-day,
.voucher-batch,
.voucher-codes,
.recent-tab-content,
.member-tab-content,
.photos img {
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease,
    box-shadow 160ms ease, transform 160ms ease !important;
}

.card-title,
.info-row,
.history-item,
.recent-item,
.code-row,
.record {
  border-color: var(--codex-border) !important;
}

#fin-month-stats > div,
.slot-item,
.record,
.calendar-day,
.voucher-codes,
.history-item,
.schedule-day,
.photos img {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
  box-shadow: none !important;
}

.slot-item:hover,
.record:hover,
.calendar-day:hover:not(.empty),
.history-item:hover {
  background: color-mix(in srgb, var(--codex-surface-subtle) 88%, var(--codex-accent-soft)) !important;
  border-color: var(--codex-border-strong) !important;
}

.schedule-day-title,
.record-date,
.cal-title,
.slot-member,
.recent-amount,
.voucher-toggle,
.member-tab.active .tab-count,
.slot-last .slot-time,
.slot-last .slot-end-badge {
  color: var(--codex-accent) !important;
}

.slot-time,
.recent-info,
.record-meta,
.record-signin,
.history-item,
.stat-value span,
.member-group-title {
  color: var(--codex-text-secondary) !important;
}

.recent-date,
.slot-course,
.slot-empty,
.calendar-header,
.calendar-day,
.photos-empty,
.footer,
.loading {
  color: var(--codex-text-muted) !important;
}

.calendar-day.has-class {
  color: var(--codex-accent-strong) !important;
  background: var(--codex-accent-soft) !important;
  border-color: color-mix(in srgb, var(--codex-accent) 55%, var(--codex-border)) !important;
  box-shadow: none !important;
}

.calendar-day.today {
  border-color: var(--codex-border-strong) !important;
}

.photos img:hover {
  border-color: var(--codex-accent) !important;
  box-shadow: 0 0 0 3px var(--codex-accent-soft) !important;
}

.member-group.active-group .member-tag,
#tab-active .member-tag {
  background: color-mix(in srgb, var(--codex-success) 12%, var(--codex-surface-subtle)) !important;
  border-color: color-mix(in srgb, var(--codex-success) 42%, var(--codex-border)) !important;
  color: var(--codex-success) !important;
}

.member-group.inactive-group .member-tag,
#tab-inactive .member-tag {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
  color: var(--codex-text-muted) !important;
}

.member-group.no-coach-group .member-tag,
#tab-nocoach .member-tag {
  background: color-mix(in srgb, var(--codex-danger) 10%, var(--codex-surface-subtle)) !important;
  border-color: color-mix(in srgb, var(--codex-danger) 38%, var(--codex-border)) !important;
  color: var(--codex-danger) !important;
}

.member-group-title::before {
  box-shadow: none !important;
}

.member-tab .tab-count {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-muted) !important;
}

select option,
select optgroup {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text) !important;
}

label,
.form-label,
.field-label {
  color: var(--codex-text-secondary) !important;
}

input:disabled,
select:disabled,
textarea:disabled,
button:disabled {
  opacity: 0.48 !important;
  cursor: not-allowed !important;
}

.lightbox img {
  border-color: var(--codex-border-strong) !important;
  box-shadow: var(--codex-shadow) !important;
}

.lightbox-close,
.orange-ai-close-btn {
  background: var(--codex-surface-raised) !important;
  border: 1px solid var(--codex-border-strong) !important;
  color: var(--codex-text-secondary) !important;
}

.lightbox-close:hover,
.orange-ai-close-btn:hover {
  color: var(--codex-text) !important;
  border-color: var(--codex-accent) !important;
}

hr {
  border-color: var(--codex-border) !important;
}

@media (max-width: 640px) {
  .codex-theme-toggle {
    top: auto !important;
    bottom: max(10px, env(safe-area-inset-bottom)) !important;
  }
}
/* CODEX RESPONSIVE CONTRACT 20260803C */
@media (min-width: 900px) {
  body > .container {
    width: min(100% - 40px, 1100px) !important;
    margin-inline: auto !important;
  }

  .codex-theme-toggle {
    width: 38px;
    height: 38px;
  }
}

@media (max-width: 640px) {
  body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom)) !important;
  }

  .header {
    padding-block: 12px !important;
    padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right)) !important;
  }

  .header h1 {
    font-size: 18px !important;
    line-height: 1.25 !important;
  }

  .card {
    padding: 14px !important;
    margin-bottom: 12px !important;
    border-radius: 10px !important;
  }

  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  #fin-month-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .schedule-slots {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .voucher-form {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .voucher-form > * {
    grid-column: 1 / -1 !important;
  }

  .finance-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .finance-item {
    min-width: 0 !important;
  }

  input,
  select,
  textarea {
    font-size: 16px !important;
  }

  .btn-primary,
  .btn-submit,
  .btn-voucher,
  input[type="button"],
  input[type="submit"] {
    min-height: 44px !important;
  }

  .member-tag {
    min-height: 34px;
    display: inline-flex !important;
    align-items: center;
  }

  .modal-content {
    width: calc(100vw - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    overflow: auto !important;
  }

  .codex-theme-toggle {
    width: 40px;
    height: 40px;
    right: max(10px, env(safe-area-inset-right));
  }
}

@media (max-width: 380px) {
  .card {
    padding: 12px !important;
  }

  .stats-grid {
    gap: 6px !important;
  }

  .stat-item,
  .finance-item {
    padding-inline: 6px !important;
  }

  .member-tab,
  .recent-tab,
  .finance-tab,
  .schedule-tab {
    font-size: 11px !important;
    padding-inline: 3px !important;
  }
}

@media (hover: none) {
  .member-tag:hover,
  .coach-item:hover,
  .photos img:hover {
    transform: none !important;
  }
}
/* CODEX LIGHT CONTRAST CONTRACT 20260803D
   Light surfaces always use dark, readable text. Bright hues are accents, not body copy. */
html[data-codex-theme="light"] {
  --gold: var(--codex-accent-strong);
  --text: var(--codex-text);
  --text-secondary: var(--codex-text-secondary);
  --muted: var(--codex-text-muted);
}

html[data-codex-theme="light"] body,
html[data-codex-theme="light"] .card,
html[data-codex-theme="light"] .modal-content,
html[data-codex-theme="light"] .stat-item,
html[data-codex-theme="light"] .finance-item,
html[data-codex-theme="light"] .member-group,
html[data-codex-theme="light"] .record,
html[data-codex-theme="light"] .history-item,
html[data-codex-theme="light"] .recent-item,
html[data-codex-theme="light"] .schedule-row,
html[data-codex-theme="light"] .slot-item,
html[data-codex-theme="light"] .calendar-day,
html[data-codex-theme="light"] .voucher-form,
html[data-codex-theme="light"] .voucher-batch {
  color: var(--codex-text-secondary) !important;
}

html[data-codex-theme="light"] .subtitle,
html[data-codex-theme="light"] .info-label,
html[data-codex-theme="light"] .stat-label,
html[data-codex-theme="light"] .finance-label,
html[data-codex-theme="light"] .record-meta,
html[data-codex-theme="light"] .record-signin,
html[data-codex-theme="light"] .recent-date,
html[data-codex-theme="light"] .member-group-title,
html[data-codex-theme="light"] .form-group label,
html[data-codex-theme="light"] .file-list,
html[data-codex-theme="light"] .empty,
html[data-codex-theme="light"] .loading {
  color: var(--codex-text-muted) !important;
  opacity: 1 !important;
}

html[data-codex-theme="light"] h1,
html[data-codex-theme="light"] h2,
html[data-codex-theme="light"] h3,
html[data-codex-theme="light"] .card-title,
html[data-codex-theme="light"] .info-value,
html[data-codex-theme="light"] .stat-value,
html[data-codex-theme="light"] .finance-value,
html[data-codex-theme="light"] .recent-member,
html[data-codex-theme="light"] .record-date,
html[data-codex-theme="light"] .cal-title,
html[data-codex-theme="light"] .schedule-day-title {
  color: var(--codex-text) !important;
  opacity: 1 !important;
}

html[data-codex-theme="light"] .member-tab.active,
html[data-codex-theme="light"] .recent-tab.active,
html[data-codex-theme="light"] .schedule-tab.active,
html[data-codex-theme="light"] .detail-tab.active,
html[data-codex-theme="light"] .finance-tab.active,
html[data-codex-theme="light"] .record-date,
html[data-codex-theme="light"] .cal-title,
html[data-codex-theme="light"] a:not(.bottom-nav-bar) {
  color: var(--codex-accent-strong) !important;
}

html[data-codex-theme="light"] #fin-commission {
  color: #11643f !important;
}

html[data-codex-theme="light"] #fin-total,
html[data-codex-theme="light"] #fin-reimburse,
html[data-codex-theme="light"] #fin-debug {
  color: #7a4a00 !important;
}

html[data-codex-theme="light"] #fin-society {
  color: #1e4fa3 !important;
}

html[data-codex-theme="light"] #fin-salary {
  color: #6f2b8d !important;
}

html[data-codex-theme="light"] :is(input, select, textarea, option, optgroup) {
  color: var(--codex-text) !important;
  background-color: var(--codex-surface) !important;
  opacity: 1 !important;
}

html[data-codex-theme="light"] :is(input, textarea)::placeholder {
  color: var(--codex-text-muted) !important;
  opacity: 1 !important;
}

/* Legacy inline dark-theme text must not become white/pale text on light cards. */
html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color:#fff" i],
html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color: #fff" i],
html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color:#C0C0C0" i],
html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color: #C0C0C0" i],
html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color:#f5e7b2" i] {
  color: var(--codex-text) !important;
}

html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color:#D4AF37" i],
html[data-codex-theme="light"] body
  :not(.bottom-nav-bar):not(.bottom-nav-bar *):not(.share-toast):not(.lightbox):not(.lightbox *)
  [style*="color: #D4AF37" i] {
  color: var(--codex-accent-strong) !important;
}

html[data-codex-theme="light"] #memberOptions > div,
html[data-codex-theme="light"] #editMemberOptions > div,
html[data-codex-theme="light"] #memberDropdown > div,
html[data-codex-theme="light"] #confirmMsg,
html[data-codex-theme="light"] #editMember {
  color: var(--codex-text-secondary) !important;
}
/* CODEX COMPONENT CONTRACT 20260803E
   One component language for every legacy modal, dropdown, toast and form. */
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i]) {
  color: var(--codex-text-secondary) !important;
}

:is(.modal-overlay, [id$="modal" i]):not(.orange-ai-overlay) {
  background: rgba(0, 0, 0, 0.58) !important;
  backdrop-filter: blur(4px) !important;
}

:is(.modal-overlay, [id$="modal" i]):not(.orange-ai-overlay)
  > :is(.modal-content, div, section, form):first-child,
.modal-content,
[role="dialog"] {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--codex-shadow) !important;
}

.modal-header,
.modal-body,
.modal-footer {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-secondary) !important;
  border-color: var(--codex-border) !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(h1, h2, h3, h4, .modal-title, .modal-header, [id$="Title" i]) {
  color: var(--codex-text) !important;
  opacity: 1 !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(p, label, small, .help-text, .hint, [id$="Msg" i]) {
  color: var(--codex-text-secondary) !important;
  opacity: 1 !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, span, p, label, strong)[style*="#D4AF37" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, span, p, label, strong)[style*="#f5e7b2" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, span, p, label, strong)[style*="#C0C0C0" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, span, p, label, strong)[style*="color:#fff" i] {
  color: var(--codex-text) !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, section, article, form)[style*="background:#0" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, section, article, form)[style*="background: #0" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, section, article, form)[style*="background:#1" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, section, article, form)[style*="background: #1" i],
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, section, article)[style*="background:rgba(0,0,0" i] {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text-secondary) !important;
  border-color: var(--codex-border) !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(input, select, textarea),
:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(input, select, textarea)[style] {
  background: var(--codex-input-surface) !important;
  color: var(--codex-text) !important;
  border: 1px solid var(--codex-border-strong) !important;
  box-shadow: none !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(input, select, textarea)[readonly] {
  color: var(--codex-text-secondary) !important;
  border-color: var(--codex-border) !important;
  opacity: 1 !important;
}

@media (max-width: 600px) {
  :is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
    :is(input, select, textarea) {
    font-size: 16px !important;
  }
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(input, select, textarea):focus {
  border-color: var(--codex-accent) !important;
  outline: 2px solid var(--codex-accent-soft) !important;
  outline-offset: 1px !important;
}

:is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i]) iframe {
  background: var(--codex-bg) !important;
}

:is([id$="Dropdown" i], [id$="Options" i], .dropdown-menu, .member-options, .select-options) {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--codex-shadow) !important;
}

:is([id$="Dropdown" i], [id$="Options" i], .dropdown-menu, .member-options, .select-options)
  > :is(div, button, a) {
  background: transparent !important;
  color: var(--codex-text-secondary) !important;
  border-color: var(--codex-border) !important;
}

:is([id$="Dropdown" i], [id$="Options" i], .dropdown-menu, .member-options, .select-options)
  > :is(div, button, a):hover {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text) !important;
}

:is(#toast, .toast, .share-toast, .flash-message, .alert-toast) {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text) !important;
  border: 1px solid var(--codex-border-strong) !important;
  border-radius: 9px !important;
  box-shadow: var(--codex-shadow) !important;
  text-shadow: none !important;
}

:is(.modal-close, .close-btn, [aria-label="关闭"]) {
  background: transparent !important;
  color: var(--codex-text-muted) !important;
  border-color: transparent !important;
}

:is(.modal-close, .close-btn, [aria-label="关闭"]):hover {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text) !important;
}

:is(.btn-primary, .btn-submit, button[id^="confirm" i], input[type="submit"]) {
  background: var(--codex-accent) !important;
  color: var(--codex-on-accent) !important;
  border-color: var(--codex-accent) !important;
  font-weight: 600 !important;
}

:is(.btn-primary, .btn-submit, button[id^="confirm" i], input[type="submit"]):hover {
  background: var(--codex-accent-strong) !important;
  border-color: var(--codex-accent-strong) !important;
}

:is(#confirmRefundBtn, .btn-danger, .danger-button, button[data-danger="true"]) {
  background: var(--codex-danger) !important;
  color: #ffffff !important;
  border-color: var(--codex-danger) !important;
}

html[data-codex-theme="light"]
  :is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, span, p, label, strong)[style*="#D4AF37" i],
html[data-codex-theme="light"]
  :is(.modal-overlay, .modal, [role="dialog"], [id$="modal" i])
  :is(div, span, p, label, strong)[style*="#f5e7b2" i] {
  color: var(--codex-text) !important;
}

@media (max-width: 640px) {
  :is(.modal-overlay, [id$="modal" i]):not(.orange-ai-overlay)
    > :is(.modal-content, div, section, form):first-child {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    overflow: auto !important;
    padding: 16px !important;
  }
}
/* Legacy inline color normalization across non-modal page content. */
body [style*="color:#D4AF37" i],
body [style*="color: #D4AF37" i] {
  color: var(--codex-accent) !important;
}

body [style*="color:#f5e7b2" i],
body [style*="color: #f5e7b2" i],
body [style*="color:#C5A845" i],
body [style*="color: #C5A845" i] {
  color: var(--codex-text) !important;
}

html[data-codex-theme="light"] body
  :not(.modal-overlay):not(.spinner-overlay):not(.loading-overlay):not(.lightbox):not(.share-toast)
  [style*="background:rgba(0,0,0" i] {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
}

#uploadModal {
  z-index: 20000 !important;
  overscroll-behavior: contain;
}

#uploadModal > .modal-content {
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
}

#uploadModal > .modal-content > .modal-header {
  flex: 0 0 auto;
  box-sizing: border-box;
  margin-bottom: 0 !important;
}

#uploadModal > .modal-content > .modal-body {
  flex: 1 1 auto;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
}

#uploadModal #uploadFrame {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 0;
  touch-action: pan-y;
}

@media (max-width: 640px) {
  #uploadModal {
    align-items: stretch !important;
    justify-content: stretch !important;
    padding: 0 !important;
  }

  #uploadModal > .modal-content {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  #uploadModal > .modal-content > .modal-header {
    min-height: 54px;
    padding: max(10px, env(safe-area-inset-top)) 14px 10px !important;
  }
}
/* CODEX BOTTOM ACTION BAR 20260803F */
.bottom-nav-bar {
  min-height: 54px !important;
  height: calc(54px + env(safe-area-inset-bottom)) !important;
  padding: 0 max(64px, env(safe-area-inset-right)) env(safe-area-inset-bottom)
    max(16px, env(safe-area-inset-left)) !important;
  background: color-mix(in srgb, var(--codex-surface-raised) 96%, transparent) !important;
  color: var(--codex-text-secondary) !important;
  border-top: 1px solid var(--codex-border) !important;
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

.bottom-nav-bar span {
  color: var(--codex-text-secondary) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-shadow: none !important;
}

.bottom-nav-bar:hover {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text) !important;
}

.bottom-nav-bar:hover span {
  color: var(--codex-text) !important;
}

.bottom-nav {
  background: color-mix(in srgb, var(--codex-surface-raised) 96%, transparent) !important;
  border-top: 1px solid var(--codex-border) !important;
  padding: 10px max(12px, env(safe-area-inset-right))
    calc(10px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)) !important;
  gap: 8px !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

.bottom-nav .nav-item {
  min-height: 42px !important;
  height: 42px !important;
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border) !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  filter: none !important;
}

.bottom-nav .nav-item:hover,
.bottom-nav .nav-item.active {
  background: var(--codex-accent-soft) !important;
  color: var(--codex-text) !important;
  border-color: var(--codex-accent) !important;
  filter: none !important;
}

.share-float-btn {
  right: max(14px, env(safe-area-inset-right)) !important;
  bottom: calc(68px + env(safe-area-inset-bottom)) !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 10px !important;
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border) !important;
  box-shadow: var(--codex-shadow) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.share-float-btn:hover {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
}

.codex-theme-toggle {
  bottom: calc(8px + env(safe-area-inset-bottom)) !important;
  right: max(10px, env(safe-area-inset-right)) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

@media (max-width: 640px) {
  body {
    padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
  }

  .bottom-nav-bar {
    min-height: 52px !important;
    height: calc(52px + env(safe-area-inset-bottom)) !important;
  }

  .bottom-nav-bar span {
    font-size: 12px !important;
  }

  .share-float-btn {
    bottom: calc(66px + env(safe-area-inset-bottom)) !important;
    width: 40px !important;
    height: 40px !important;
  }
}
/* CODEX QUIET COACH DIRECTORY 20260803G */
#coach-list .coach-item {
  position: relative !important;
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border) !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

#coach-list .coach-item.active {
  background: var(--codex-surface-subtle) !important;
  border-color: var(--codex-border) !important;
}

#coach-list .coach-item .coach-avatar,
#coach-list .coach-item.active .coach-avatar,
#coach-list .coach-item.inactive .coach-avatar {
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border-strong) !important;
  box-shadow: none !important;
}

#coach-list .coach-item .coach-name,
#coach-list .coach-item.active .coach-name {
  color: var(--codex-text) !important;
}

#coach-list .coach-item .coach-id,
#coach-list .coach-item.active .coach-id {
  color: var(--codex-text-muted) !important;
}

#coach-list .coach-item.active::after,
#coach-list .coach-item.inactive::after {
  content: "";
  position: absolute;
  top: 9px;
  right: 9px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--codex-success);
}

#coach-list .coach-item.inactive {
  background: var(--codex-surface-subtle) !important;
  border: 1px solid var(--codex-border) !important;
  opacity: 0.62 !important;
}

#coach-list .coach-item.inactive::after {
  background: var(--codex-text-muted);
}

#coach-list .coach-item:hover,
#coach-list .coach-item.active:hover,
#coach-list .coach-item.inactive:hover {
  background: color-mix(in srgb, var(--codex-surface-subtle) 90%, var(--codex-accent-soft)) !important;
  border-color: var(--codex-border-strong) !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
}

#coach-list #addCoachBtn {
  background: transparent !important;
  border: 1px dashed var(--codex-border-strong) !important;
  color: var(--codex-text-muted) !important;
}

#coach-list #addCoachBtn > div:first-child {
  background: transparent !important;
  color: var(--codex-text-muted) !important;
  border-color: var(--codex-border-strong) !important;
}

#coach-list #addCoachBtn::after {
  display: none !important;
}

/* Coupon UI is intentionally hidden; backend and data remain available. */
.voucher-module,
#voucher-module,
.voucher-form,
#v-result,
#v-batches {
  display: none !important;
}

/* CODEX AGGREGATE OVERVIEW GRID 20260803H */
.venue-overview-card,
.venue-overview-card #finance-section,
.venue-overview-card .finance-section,
.venue-overview-card .finance-tab-content {
  min-width: 0 !important;
  width: 100% !important;
}

.venue-overview-card .finance-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.venue-overview-card .finance-tab {
  min-width: 0 !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.3 !important;
  white-space: normal !important;
}

.venue-overview-card .finance-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

.venue-overview-card .finance-item,
.stat-grid .stat-item {
  min-width: 0 !important;
  min-height: 72px !important;
  padding: 12px 10px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--codex-border) !important;
}

.venue-overview-card .finance-label,
.stat-grid .stat-label {
  line-height: 1.35 !important;
  text-wrap: balance;
}

.venue-overview-card .finance-value,
.stat-grid .stat-value {
  max-width: 100% !important;
  line-height: 1.25 !important;
  font-variant-numeric: tabular-nums !important;
  overflow-wrap: anywhere !important;
}

.venue-overview-card .finance-value {
  font-size: clamp(14px, 1.55vw, 18px) !important;
}

.stat-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

@media (max-width: 720px) {
  .venue-overview-card .finance-row,
  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .venue-overview-card .finance-tabs {
    gap: 6px !important;
  }

  .venue-overview-card .finance-tab {
    min-height: 42px !important;
    padding-inline: 5px !important;
  }

  .venue-overview-card .finance-item,
  .stat-grid .stat-item {
    min-height: 68px !important;
    padding: 10px 7px !important;
  }
}
/* CODEX COACH SCHEDULE OWNERSHIP 20260803I */
.slot-item.slot-own-coach {
  background: color-mix(in srgb, var(--codex-surface-subtle) 90%, var(--codex-accent-soft)) !important;
  outline: 1px solid color-mix(in srgb, var(--codex-accent) 52%, var(--codex-border)) !important;
  outline-offset: -1px !important;
}
.slot-item.slot-own-coach .slot-member {
  color: var(--codex-accent) !important;
  font-weight: 650 !important;
}

.slot-item.slot-other-coach .slot-time,
.slot-item.slot-other-coach .slot-end,
.slot-item.slot-other-coach .slot-member {
  color: var(--codex-text-muted) !important;
  text-shadow: none !important;
}

.slot-item.slot-other-coach .slot-member {
  font-weight: 500 !important;
}

.slot-item.slot-other-coach {
  background: color-mix(in srgb, var(--codex-surface-subtle) 96%, var(--codex-surface)) !important;
  border-color: var(--codex-border) !important;
  opacity: 1 !important;
}

.slot-item.slot-venue-class .slot-time,
.slot-item.slot-venue-class .slot-end,
.slot-item.slot-venue-class .slot-member {
  color: var(--codex-text-secondary) !important;
}
/* CODEX FLOAT PANELS 20260804A */
.float-bar {
  right: max(14px, env(safe-area-inset-right)) !important;
  bottom: calc(68px + env(safe-area-inset-bottom)) !important;
  gap: 10px !important;
}

.float-btn {
  width: 42px !important;
  height: 42px !important;
  border-radius: 10px !important;
  background: var(--codex-surface-raised) !important;
  color: var(--codex-text-secondary) !important;
  border: 1px solid var(--codex-border) !important;
  box-shadow: var(--codex-shadow) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.float-btn:hover {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
  transform: translateY(-1px) !important;
}

.float-panel {
  background: var(--codex-surface-raised) !important;
  border: 1px solid var(--codex-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--codex-shadow) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  right: max(14px, env(safe-area-inset-right)) !important;
}

.float-panel-header {
  background: var(--codex-surface-raised) !important;
  border-bottom: 1px solid var(--codex-border) !important;
}

.float-panel-header h3 {
  color: var(--codex-text) !important;
  font-weight: 600 !important;
}

.float-panel-close {
  background: transparent !important;
  color: var(--codex-text-muted) !important;
  border-radius: 6px !important;
}

.float-panel-close:hover {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text) !important;
}

.float-panel-body {
  color: var(--codex-text-secondary) !important;
}

.float-panel-tabs {
  border-bottom: 1px solid var(--codex-border) !important;
}

.float-panel-tab {
  color: var(--codex-text-muted) !important;
  border-bottom: 2px solid transparent !important;
}

.float-panel-tab.active {
  color: var(--codex-accent) !important;
  border-bottom-color: var(--codex-accent) !important;
}

.float-panel-tab:hover {
  color: var(--codex-text) !important;
}

.guide-checklist-item {
  border-bottom: 1px solid var(--codex-border) !important;
}

.guide-checklist-item label {
  color: var(--codex-text-secondary) !important;
}

.guide-checklist-item.done label {
  color: var(--codex-text-muted) !important;
}

.guide-section-title {
  color: var(--codex-text) !important;
  border-bottom: 1px solid var(--codex-border) !important;
}

.guide-progress {
  color: var(--codex-text-muted) !important;
}

.guide-progress span {
  color: var(--codex-accent) !important;
}

.agent-chat-log {
  color: var(--codex-text-secondary) !important;
}

.agent-msg.user {
  background: var(--codex-accent-soft) !important;
  color: var(--codex-text) !important;
}

.agent-msg.bot {
  background: var(--codex-surface-subtle) !important;
  color: var(--codex-text-secondary) !important;
}

.agent-input-row {
  border-top: 1px solid var(--codex-border) !important;
}

.agent-input-row input {
  background: var(--codex-surface) !important;
  color: var(--codex-text) !important;
  border: 1px solid var(--codex-border-strong) !important;
}

.agent-input-row input:focus {
  border-color: var(--codex-accent) !important;
  outline: 2px solid var(--codex-accent-soft) !important;
  outline-offset: 1px !important;
}

.agent-input-row input::placeholder {
  color: var(--codex-text-muted) !important;
}

.agent-input-row button {
  background: var(--codex-accent) !important;
  color: var(--codex-on-accent) !important;
  border-color: var(--codex-accent) !important;
  font-weight: 600 !important;
}

.agent-input-row button:hover {
  background: var(--codex-accent-strong) !important;
}

.guide-reset-btn {
  color: var(--codex-text-muted) !important;
  background: transparent !important;
  border: 1px solid var(--codex-border) !important;
}

.guide-reset-btn:hover {
  color: var(--codex-text) !important;
  border-color: var(--codex-border-strong) !important;
}

@media (max-width: 640px) {
  .float-panel {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    max-height: calc(100dvh - 140px) !important;
  }

  .float-btn {
    width: 40px !important;
    height: 40px !important;
  }
}