/* Shared frontend palette and appearance controls. */
html[data-front-theme="light"]:not([data-admin-error-theme]) {
  color-scheme: light;
  background: #f5f7fb;
  --front-color-scheme: light;
  --front-color-canvas: #f5f7fb;
  --front-color-secondary: #394357;
  --front-color-danger: #b71824;
  --front-color-warning: #806000;
  --front-color-success: #14713d;
  --front-color-surface-rgb: 255,255,255;
  --front-color-shadow-rgb: 150,160,180;
  --front-color-text: #172033;
  --front-color-muted: #596579;
  --front-color-accent: #c41320;
  --front-color-surface: #fff;
  --front-color-inset: #f0f3f8;
  --front-color-placeholder: #e6ebf2;
  --front-color-neutral-rgb: 22,34,54;
  --bs-body-color: #172033;
  --bs-body-bg: #f5f7fb;
  --bs-border-color: #dbe0e8;
  --bs-secondary-color: #596579;
  --bs-emphasis-color: #172033;
  /* The shared site shell already consumes these palette tokens for admin error pages. */
  --admin-canvas: #f5f7fb;
  --admin-raised: var(--front-color-surface);
  --admin-text: var(--front-color-text);
  --admin-text-secondary: #394357;
  --admin-text-muted: var(--front-color-muted);
  --admin-text-faint: var(--front-color-muted);
  --admin-accent-text: var(--front-color-accent);
  --admin-danger-text: #b71824;
  --admin-warning-text: #806000;
  --admin-neutral-rgb: var(--front-color-neutral-rgb);
  --admin-color-scheme: light;
}

html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.filter-choice input:checked + span,.site-page .filter-reset:hover) { color: var(--front-color-text); }
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.auth-page__card,.collection-dialog,.membership-dialog,.filter-content,.playlist-modal .modal-content,.watch-add-menu,.watch-toast,.library-menu,.collection-video-menu) { background-color: var(--front-color-surface); }
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.front-feature-placement-label) { color: var(--front-color-muted); background: var(--front-color-inset); border-color: rgba(var(--front-color-neutral-rgb),.18); }
html[data-front-theme="light"]:not([data-admin-error-theme]) .front-feature-placement-text { background: linear-gradient(135deg,#fff0f2,#fff); border-color: rgba(var(--front-color-neutral-rgb),.08); box-shadow: 0 14px 34px rgba(22,34,54,.1); }
html[data-front-theme="light"]:not([data-admin-error-theme]) .front-feature-placement-text .front-feature-placement-item { color: var(--front-color-text); }
html[data-front-theme="light"]:not([data-admin-error-theme]) .front-feature-placement-text a { color: var(--front-color-accent); }
html[data-front-theme="light"]:not([data-admin-error-theme]) .front-feature-placement-text a:hover { color: var(--front-color-danger); }
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.front-embed-body,.front-embed-message) { color: var(--front-color-text); background: var(--front-color-canvas); }
html[data-front-theme="light"]:not([data-admin-error-theme]) .front-embed-message span { color: var(--front-color-muted); }
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.auth-submit,.search-submit,.auth-page__submit,.library-create,.collection-dialog__submit,.ticket-button--primary,.ticket-send-button,.membership-page__action,.premium-page__submit,.settings-submit,.referral-button,.withdrawal-submit,.copy-button,.button-primary,.filter-apply):hover { background-color: var(--front-color-accent); }

.preferences-toggle[aria-expanded="true"] { border-color: #de1722; }
.site-page .icon-button.preferences-toggle { background: var(--front-color-canvas,var(--admin-canvas,#0e1014)); }
html[data-front-theme="light"]:not([data-admin-error-theme]) .preferences-toggle { background: var(--front-color-surface); }
.preferences-popover { width: 292px; max-width: calc(100vw - 24px); max-height: calc(100dvh - 72px); overflow-x: hidden; overflow-y: auto; }
.preferences-panel { display: flex; flex-direction: column; gap: 2px; animation: preferences-forward .2s cubic-bezier(.2,.8,.2,1); }
.preferences-popover[data-direction="back"] .preferences-panel { animation-name: preferences-back; }
.preferences-panel .menu-option { width: 100%; }
.preferences-panel .menu-option > span { flex: 1; }
.preferences-panel .menu-option > svg { flex: 0 0 auto; }
.site-page .preferences-back { justify-content: flex-start; color: var(--front-color-text,var(--admin-text,#f4f5f7)); border-radius: 9px 9px 0 0; border-bottom: 1px solid rgba(var(--front-color-neutral-rgb,var(--admin-neutral-rgb,255,255,255)),.1); margin-bottom: 4px; padding-bottom: 14px; }
.preferences-note { margin: 8px 12px; color: var(--front-color-muted,#9aa1ad); font: 500 12px/1.6 var(--font-sans); }
.preferences-choices { display: flex; flex-direction: column; gap: 2px; min-width: 0; margin: 0; padding: 0; border: 0; }
.preferences-choice { position: relative; cursor: pointer; }
.preferences-radio { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; opacity: 0; }
.preferences-check { opacity: 0; transition: opacity .15s ease; }
.preferences-radio:checked ~ .preferences-check { opacity: 1; color: var(--front-color-accent,#ff4b55); }
.site-page .preferences-choice:has(:checked) { color: var(--front-color-text,#f4f5f7); background: rgba(222,23,34,.12); }
.preferences-choice:has(:focus-visible) { outline: 2px solid var(--front-color-accent,#ff4b55); outline-offset: -2px; }
@keyframes preferences-forward { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: translateX(0); } }
@keyframes preferences-back { from { opacity: 0; transform: translateX(-18px); } to { opacity: 1; transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) {
  .preferences-panel, .preferences-popover { animation: none !important; }
  .preferences-check { transition: none; }
}

.drawer-navigation { display: contents; }
@media (max-width: 899px) {
  .drawer-navigation { display: flex; flex: 1 0 auto; flex-direction: column; gap: 8px; min-width: 0; }
  .site-sidebar[data-direction="back"] .drawer-navigation { animation: preferences-back .2s cubic-bezier(.2,.8,.2,1); }
}
@media (prefers-reduced-motion: reduce) {
  .site-sidebar[data-direction="back"] .drawer-navigation { animation: none; }
}

html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.site-header,.site-sidebar,.mobile-dock,.mobile-search,.navigation-sheet) {
  background: var(--front-color-surface);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.membership-banner,.announcement-bar) {
  background: linear-gradient(90deg,#f5f7fb 0%,#fff0f2 50%,#f5f7fb 100%);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) .premium-link:hover { color: #705300; }
html[data-front-theme="light"]:not([data-admin-error-theme]) .menu-popover {
  box-shadow: 0 24px 60px rgba(22,34,54,.14);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) .video-card__thumbnail {
  background: var(--front-color-placeholder);
  box-shadow: inset 0 0 0 1px rgba(22,34,54,.08),0 24px 40px -24px rgba(22,34,54,.2);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.channel-card__thumbnail,.performer-card__portrait) {
  background: var(--front-color-placeholder);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) .auth-dialog {
  background: rgba(255,255,255,.98);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.auth-tabs,.auth-field input) {
  background: var(--front-color-inset);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) .auth-tabs button[aria-selected=true] {
  background: var(--front-color-surface);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) input::placeholder {
  color: var(--front-color-muted);
  opacity: 1;
}
html[data-front-theme="light"]:not([data-admin-error-theme]) :is(.auth-submit,.search-submit):hover {
  background: var(--front-color-accent);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) .toast-notification {
  background: rgba(255,255,255,.98);
  box-shadow: 0 16px 40px rgba(22,34,54,.14);
}
html[data-front-theme="light"]:not([data-admin-error-theme]) .toast-notification__icon { color: #fff; }
html[data-front-theme="light"]:not([data-admin-error-theme]) .dock-shorts:focus-visible .dock-shorts__icon {
  outline-color: var(--front-color-accent);
}
@media (max-width: 899px) {
  html[data-front-theme="light"]:not([data-admin-error-theme]) .site-sidebar {
    box-shadow: 24px 0 60px rgba(22,34,54,.14);
  }
  html[data-front-theme="light"]:not([data-admin-error-theme]) .navigation-sheet {
    box-shadow: 0 -24px 60px -20px rgba(22,34,54,.2),inset 0 1px 0 rgba(22,34,54,.04);
  }
}