/* Warm festive, low-distraction visual layer. Loaded last for both themes. */
body[data-theme="light"] {
  --accent: #c43a31;
  --accent-rgb: 196, 58, 49;
  --accent-2: #a95d56;
  --accent-2-rgb: 169, 93, 86;
  --success-tech: #5c7f68;
  --warning-tech: #8c6274;
  --danger-tech: #9f1830;
  --calm-bg: #ffffff;
  --calm-sidebar: #ffffff;
  --calm-panel: #ffffff;
  --calm-panel-soft: #ffffff;
  --calm-field: #ffffff;
  --calm-text: #3d2424;
  --calm-muted: #7f5f5f;
  --calm-line: #efdada;
  --calm-line-strong: #d9b4b4;
  --calm-shadow: 0 8px 24px rgba(120, 45, 45, .05);
  color-scheme: light;
}

body[data-theme="dark"] {
  --accent: #ff7155;
  --accent-rgb: 255, 113, 85;
  --accent-2: #c98b84;
  --accent-2-rgb: 201, 139, 132;
  --success-tech: #87aa8d;
  --warning-tech: #b98a9a;
  --danger-tech: #ff8294;
  --calm-bg: #321816;
  --calm-sidebar: #3c1d1a;
  --calm-panel: #4a2521;
  --calm-panel-soft: #542c27;
  --calm-field: #60332e;
  --calm-text: #f5e5e1;
  --calm-muted: #c8aaa5;
  --calm-line: #70413a;
  --calm-line-strong: #89534a;
  --calm-shadow: 0 8px 24px rgba(35, 7, 6, .25);
  color-scheme: dark;
}

body[data-theme="light"],
body[data-theme="dark"] {
  color: var(--calm-text);
  background: var(--calm-bg);
}

.tech-atmosphere,
.tech-grid,
.tech-orb,
.particle-field {
  display: none !important;
}

.login-shell,
.app-shell {
  background: var(--calm-bg);
}

.login-card,
.sidebar,
.topbar,
.panel,
.stat-card,
.overview-stat-card,
.operation-metric,
.monitor-card,
.staff-rhythm-card,
.todo-card,
.drawer,
.dialog-card {
  border-color: var(--calm-line);
  background: var(--calm-panel);
  box-shadow: var(--calm-shadow);
}

.login-card,
.login-form,
.login-copy {
  background: var(--calm-panel);
}

.login-card::before,
.login-card::after,
.login-copy::after,
.role-command-strip::before,
.role-command-strip::after,
.overview-hero::before,
.overview-hero::after,
.motivation-banner::after,
.overview-stat-card::after,
.panel::before {
  display: none !important;
}

.brand-lockup,
.login-copy h1,
.login-form label,
.sidebar-brand b,
.sidebar-user,
.topbar h2,
.command-copy h3,
.overview-hero h3,
.panel-heading h3,
.drawer-head h3,
.dialog-head h3,
.detail-section h4,
.cell-main,
.detail-value,
.timeline-item b,
.overview-stat-card b,
.operation-metric b,
.monitor-card b,
.todo-card b,
.staff-rhythm-card h3,
.staff-rhythm-progress > b {
  color: var(--calm-text);
  text-shadow: none;
}

.brand-mark {
  color: #fff;
  background: var(--accent);
  border: 2px solid var(--accent-2);
  box-shadow: 0 0 0 3px rgba(var(--accent-2-rgb), .1);
}

.login-copy p,
.form-note,
.breadcrumb,
.sidebar-brand small,
.nav-item,
.staff-quick-item,
.cutoff-note,
.system-status small,
.command-copy p,
.overview-hero p,
.panel-heading p,
.stat-card .stat-label,
.overview-stat-card span,
.overview-stat-card small,
.operation-metric span,
.operation-metric small,
.monitor-card span,
.monitor-card small,
.todo-card span,
.todo-card small,
.staff-rhythm-card p,
.staff-rhythm-progress > span,
.cell-sub,
.detail-key,
.timeline-item,
.empty-cell,
.pagination,
.page-jump,
.page-size-control,
.trend-legend {
  color: var(--calm-muted);
}

.eyebrow,
.login-copy .eyebrow,
.overview-hero .eyebrow,
.motivation-copy > span {
  color: var(--accent);
  text-shadow: none;
}

.sidebar {
  position: fixed;
  border-right-color: var(--calm-line);
  background: var(--calm-sidebar);
  box-shadow: 6px 0 18px rgba(120, 45, 45, .05);
}

.sidebar::before {
  display: none;
}

.sidebar::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--accent-2);
}

.sidebar-brand {
  min-height: 92px;
  padding-right: 76px;
  border-bottom: 1px solid rgba(var(--accent-2-rgb), .24);
}

.festive-corner {
  position: absolute;
  z-index: 3;
  top: 2px;
  right: 12px;
  width: 58px;
  height: 84px;
  pointer-events: none;
}

.festive-cord {
  position: absolute;
  left: 28px;
  top: 0;
  width: 2px;
  height: 13px;
  background: var(--accent-2);
}

.festive-lantern {
  position: absolute;
  left: 11px;
  top: 12px;
  width: 36px;
  height: 38px;
  border: 2px solid var(--accent-2);
  border-radius: 44% 44% 40% 40%;
  background: var(--accent);
  box-shadow: inset 0 0 0 4px rgba(var(--accent-2-rgb), .1), 0 4px 10px rgba(116, 25, 18, .18);
}

.festive-lantern::before {
  content: "福";
  position: absolute;
  inset: 6px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(var(--accent-2-rgb), .78);
  border-radius: 50%;
  color: #fff1ee;
  font-size: 15px;
  font-weight: 900;
}

.festive-lantern::after {
  content: "";
  position: absolute;
  left: 5px;
  right: 5px;
  top: -5px;
  height: 3px;
  border-radius: 3px;
  background: var(--accent-2);
  box-shadow: 0 42px 0 var(--accent-2);
}

.festive-tassel {
  position: absolute;
  left: 28px;
  top: 53px;
  width: 2px;
  height: 15px;
  background: var(--accent-2);
}

.festive-tassel::after {
  content: "";
  position: absolute;
  left: -4px;
  bottom: -5px;
  width: 10px;
  height: 8px;
  border-radius: 1px 1px 6px 6px;
  background: var(--accent);
}

.festive-greeting {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  color: var(--accent);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .12em;
}

.festive-greeting::before {
  content: "迎春纳福";
}

.brand-lockup::after {
  content: "新春纳福";
  margin-left: 9px;
  padding: 4px 7px;
  border: 1px solid rgba(var(--accent-2-rgb), .62);
  border-radius: 999px;
  color: var(--accent);
  background: rgba(var(--accent-2-rgb), .12);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.sidebar-signal,
.role-pill,
.system-status,
.cutoff-note,
.theme-toggle,
.menu-button {
  color: var(--calm-muted);
  border-color: var(--calm-line);
  background: var(--calm-panel-soft);
  box-shadow: none;
}

.nav-item:hover,
.staff-quick-item:hover {
  color: var(--calm-text);
  border-color: var(--calm-line);
  background: rgba(var(--accent-rgb), .07);
}

.nav-item.active,
.staff-quick-item.active {
  color: var(--calm-text);
  border-color: var(--calm-line-strong);
  background: rgba(var(--accent-rgb), .14);
  box-shadow: inset 4px 0 var(--accent-2);
}

.topbar {
  height: auto;
  min-height: 0;
  padding: 0;
  display: block;
  border-color: rgba(var(--accent-2-rgb), .36);
  background: color-mix(in srgb, var(--calm-sidebar) 94%, transparent);
  box-shadow: 0 4px 14px rgba(120, 45, 45, .04);
}

.topbar-main {
  min-height: 92px;
  padding: 18px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.role-command-strip,
.overview-hero,
.todo-hero,
.monitor-hero {
  color: var(--calm-text);
  border-color: var(--calm-line);
  border-left: 4px solid var(--accent-2);
  background: var(--calm-panel);
  box-shadow: var(--calm-shadow);
}

.command-telemetry,
.command-telemetry > div,
.todo-summary-strip,
.bulk-bar,
.info-strip,
.assignment-card,
.detail-item {
  color: var(--calm-text);
  border-color: var(--calm-line);
  background: var(--calm-panel-soft);
}

.motivation-banner {
  border-color: rgba(159, 24, 48, .72);
  border-left-color: #9f1830;
  background: var(--calm-panel);
  box-shadow: var(--calm-shadow);
}

.topbar .motivation-banner {
  margin: 0;
  padding: 9px 32px;
  min-height: 48px;
  align-items: center;
  border-width: 1px 0 0 5px;
  border-radius: 0;
  box-shadow: none;
}

.topbar .motivation-mark {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  font-size: 15px;
  box-shadow: none;
}

.topbar .motivation-copy {
  flex: 1;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.topbar .motivation-copy > span {
  margin: 0;
  white-space: nowrap;
}

.topbar .motivation-copy p {
  font-size: 14px;
  line-height: 1.5;
}

.motivation-mark {
  color: #fff;
  background: var(--accent);
  border: 2px solid var(--accent-2);
  box-shadow: 0 5px 14px rgba(129, 32, 23, .16);
}

.motivation-copy p {
  color: var(--calm-text);
  text-shadow: none;
}

.motivation-copy strong {
  color: var(--accent-2);
}

.stat-card,
.overview-stat-card,
.operation-metric,
.monitor-card,
.todo-card,
.staff-rhythm-card {
  background-image: none !important;
  box-shadow: none;
}

.stat-card:hover,
.overview-stat-card:hover,
.todo-card:hover {
  border-color: var(--calm-line-strong);
  box-shadow: none;
  transform: none;
}

.stat-card.primary,
.overview-stat-card.primary,
.overview-stat-card.info,
.overview-stat-card.success,
.admin-outcome-card.withdrawn,
.admin-outcome-card.refund,
.todo-card.info,
.todo-card.urgent {
  color: var(--accent);
  border-top-color: rgba(var(--accent-rgb), .46);
}

.overview-stat-card.warning,
.todo-card.warning {
  color: var(--warning-tech);
  border-top-color: rgba(140, 98, 116, .5);
}

.overview-stat-card.danger,
.todo-card.danger {
  color: var(--danger-tech);
  border-top-color: rgba(159, 24, 48, .68);
}

.overview-stat-card.success,
.admin-outcome-card.refund {
  color: var(--success-tech);
  border-top-color: rgba(92, 127, 104, .55);
}

.overview-stat-card.primary,
.overview-stat-card.info,
.admin-outcome-card.withdrawn {
  border-top-color: rgba(var(--accent-rgb), .64);
}

.filters,
.sensitive-keyword-search {
  border-color: var(--calm-line);
  background: var(--calm-panel-soft);
}

.login-form input,
.stack-form input,
.stack-form select,
.stack-form textarea,
.filters input,
.filters select,
.inline-rule-select,
.page-size-control select,
.page-jump input,
.action-card textarea,
.action-card select,
.sensitive-keyword-create input,
.sensitive-keyword-search input {
  color: var(--calm-text);
  border-color: var(--calm-line);
  background: var(--calm-field);
  box-shadow: none;
}

.login-form input:focus,
.stack-form input:focus,
.stack-form select:focus,
.stack-form textarea:focus,
.filters input:focus,
.filters select:focus,
.inline-rule-select:focus,
.page-size-control select:focus,
.page-jump input:focus,
.action-card textarea:focus,
.action-card select:focus,
.sensitive-keyword-create input:focus,
.sensitive-keyword-search input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .1);
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--calm-muted) 72%, transparent);
}

.primary-button {
  color: #fff;
  border-color: var(--accent);
  background: var(--accent);
  box-shadow: none;
}

.primary-button:hover {
  filter: brightness(.94);
  box-shadow: none;
  transform: none;
}

body[data-theme="dark"] .primary-button,
body[data-theme="dark"] .brand-mark,
body[data-theme="dark"] .staff-quick-item.active b {
  color: #321816;
}

.role-pill {
  color: var(--accent);
  border-color: rgba(var(--accent-2-rgb), .5);
  background: rgba(var(--accent-2-rgb), .13);
}

.theme-toggle-icon {
  color: var(--accent);
  background: rgba(var(--accent-rgb), .11);
}

.secondary-button,
.row-action,
.close-button {
  color: var(--calm-text);
  border-color: var(--calm-line);
  background: var(--calm-panel-soft);
  box-shadow: none;
}

.secondary-button:hover,
.row-action:hover,
.close-button:hover,
.theme-toggle:hover {
  color: var(--calm-text);
  border-color: var(--calm-line-strong);
  background: rgba(var(--accent-rgb), .08);
  transform: none;
}

.panel-heading,
.drawer-head,
.dialog-head,
.detail-grid,
.detail-item,
.action-card,
.sidebar-foot,
.staff-quick-nav {
  border-color: var(--calm-line);
}

.table-shell th {
  color: var(--calm-muted);
  border-color: var(--calm-line);
  background: var(--calm-panel-soft);
}

.table-shell td {
  color: var(--calm-text);
  border-color: var(--calm-line);
  background: transparent;
}

.table-shell tbody tr:hover td {
  background: rgba(var(--accent-rgb), .045);
}

.tag-blue,
.tag-green,
.tag-gray,
.sla-normal {
  color: var(--calm-text);
  border-color: var(--calm-line);
  background: rgba(var(--accent-rgb), .09);
}

.tag-amber,
.sla-warning {
  color: var(--warning-tech);
  border-color: rgba(140, 98, 116, .24);
  background: rgba(140, 98, 116, .11);
}

.tag-red,
.sla-danger {
  color: var(--danger-tech);
  border-color: rgba(159, 24, 48, .28);
  background: rgba(159, 24, 48, .11);
}

.progress-track,
.evidence-hash {
  background: var(--calm-panel-soft);
}

.progress-track i,
.trend-completed,
.trend-total,
.trend-overdue {
  background: var(--accent);
}

.trend-overdue {
  background: var(--danger-tech);
}

.trend-completed {
  background: var(--success-tech);
}

.drawer,
.dialog-card {
  color: var(--calm-text);
}

.modal-backdrop {
  background: rgba(58, 17, 13, .54);
  backdrop-filter: blur(2px);
}

.toast {
  color: var(--calm-text);
  border-color: var(--calm-line-strong);
  background: var(--calm-panel);
  box-shadow: var(--calm-shadow);
}

.toast.error {
  color: #9f1830;
  border-color: #d68a95;
  background: #fff3f4;
}

#processRuleStatus.error {
  color: var(--danger-tech);
  font-weight: 700;
}

body[data-theme="dark"] .toast.error {
  color: #ffd3da;
  border-color: #ad6270;
  background: #572b28;
}

.watermark-layer {
  opacity: .55;
}

body[data-theme="dark"] .sensitive-complaint-row td,
body[data-theme="dark"] .staff-marked-row > td {
  background: rgba(159, 24, 48, .18) !important;
}

body[data-theme="dark"] .sensitive-complaint-badge,
body[data-theme="dark"] .sensitive-detail-alert,
body[data-theme="dark"] .staff-mark-badge {
  color: #ffb2bd;
  border-color: rgba(255, 130, 148, .4);
  background: rgba(159, 24, 48, .2);
}

@media (max-width: 780px) {
  .topbar,
  .sidebar {
    background: var(--calm-sidebar);
  }

  .festive-corner {
    right: 10px;
  }

  .topbar {
    min-height: 0;
    padding: 0;
  }

  .topbar-main {
    min-height: 76px;
    padding: 14px 18px;
    gap: 12px;
  }

  .topbar .motivation-banner {
    margin: 0;
    padding: 8px 18px;
    min-height: 0;
  }

  .topbar .motivation-mark {
    display: none;
  }

  .topbar .motivation-copy {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  .topbar .motivation-copy p {
    font-size: 13px;
  }
}
