/*
 * KolCM technology glass theme
 * Taste audit direction: dense operations cockpit, cold chrome neutrals,
 * one cyan interaction accent, large frosted surfaces and restrained motion.
 * This is a web glassmorphism approximation built with backdrop-filter.
 * Shape rule: 16px shell/panels, 12px cards, 10px controls, pills only for status.
 */

:root {
  color-scheme: dark;
  --bg: #07111f;
  --surface: rgba(13, 25, 43, 0.68);
  --surface2: rgba(18, 34, 56, 0.58);
  --surface3: rgba(27, 46, 72, 0.62);
  --border: rgba(185, 222, 255, 0.13);
  --border2: rgba(188, 225, 255, 0.24);
  --accent: #65d9ff;
  --accent-rgb: 101, 217, 255;
  --accent2: #ff7f91;
  --accent3: #67e7ce;
  --accent4: #b69cff;
  --accent5: #ffc36b;
  --text: #edf7ff;
  --text2: #b5c6d8;
  --text3: #7f93a8;
  --font-serif: "MiSans", "HarmonyOS Sans SC", "Microsoft YaHei UI", "PingFang SC", sans-serif;
  --font-sans: "MiSans", "HarmonyOS Sans SC", "Microsoft YaHei UI", "PingFang SC", sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  --radius: 12px;
  --shell-radius: 16px;
  --control-radius: 10px;
  --glass-blur: 22px;
  --glass-bg: rgba(13, 25, 43, 0.68);
  --glass-bg-strong: rgba(9, 19, 34, 0.82);
  --glass-bg-soft: rgba(22, 39, 63, 0.46);
  --glass-highlight: rgba(225, 244, 255, 0.09);
  --glass-shadow: 0 18px 56px rgba(1, 8, 20, 0.3), inset 0 1px 0 var(--glass-highlight);
  --glass-shadow-soft: 0 10px 32px rgba(1, 8, 20, 0.18), inset 0 1px 0 rgba(225, 244, 255, 0.065);
}

html.light {
  color-scheme: light;
  --bg: #dfeaf3;
  --surface: rgba(247, 252, 255, 0.69);
  --surface2: rgba(239, 247, 252, 0.68);
  --surface3: rgba(226, 239, 248, 0.75);
  --border: rgba(47, 91, 124, 0.15);
  --border2: rgba(39, 91, 128, 0.26);
  --accent: #006f91;
  --accent-rgb: 0, 111, 145;
  --accent2: #b72f4d;
  --accent3: #087b6d;
  --accent4: #6844a8;
  --accent5: #9a5a00;
  --text: #122638;
  --text2: #415b70;
  --text3: #566e82;
  --glass-bg: rgba(247, 252, 255, 0.69);
  --glass-bg-strong: rgba(247, 252, 255, 0.86);
  --glass-bg-soft: rgba(240, 248, 253, 0.58);
  --glass-highlight: rgba(255, 255, 255, 0.72);
  --glass-shadow: 0 18px 54px rgba(45, 83, 111, 0.16), inset 0 1px 0 var(--glass-highlight);
  --glass-shadow-soft: 0 10px 28px rgba(45, 83, 111, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.66);
}

html,
body {
  min-height: 100%;
}

body.app-shell {
  position: relative;
  min-height: 100dvh;
  background:
    radial-gradient(circle at 12% 8%, rgba(24, 150, 193, 0.2), transparent 29%),
    radial-gradient(circle at 82% 16%, rgba(51, 98, 150, 0.2), transparent 31%),
    radial-gradient(circle at 64% 88%, rgba(18, 116, 135, 0.13), transparent 34%),
    linear-gradient(145deg, #07111f 0%, #091523 46%, #06101c 100%);
}

html.light body.app-shell {
  background:
    radial-gradient(circle at 10% 6%, rgba(85, 190, 226, 0.3), transparent 31%),
    radial-gradient(circle at 86% 12%, rgba(131, 174, 220, 0.28), transparent 32%),
    radial-gradient(circle at 68% 88%, rgba(95, 192, 190, 0.18), transparent 34%),
    linear-gradient(145deg, #dce8f2 0%, #edf4f8 48%, #d7e4ed 100%);
}

body.app-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(118deg, transparent 18%, rgba(193, 232, 255, 0.028) 39%, transparent 56%),
    radial-gradient(circle at 50% -10%, rgba(var(--accent-rgb), 0.09), transparent 42%);
}

body.app-shell::after {
  opacity: 0.32;
  mix-blend-mode: soft-light;
}

.app {
  position: relative;
  z-index: 1;
  height: 100dvh;
  gap: 10px;
  padding: 10px;
  background: transparent;
}

.main-area {
  min-width: 0;
  gap: 10px;
}

.sidebar,
.topbar,
.modal,
.bigscreen-overlay .bs-card {
  border: 1px solid var(--border);
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(145%);
  backdrop-filter: blur(var(--glass-blur)) saturate(145%);
  box-shadow: var(--glass-shadow);
}

.sidebar {
  border-radius: var(--shell-radius);
  overflow: hidden auto;
}

.logo-area {
  padding: 18px 18px 15px;
  border-color: var(--border);
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.08), transparent 62%);
}

.logo-title,
.topbar-title,
.modal-title,
.tips-hero h2,
.bs-title {
  font-family: var(--font-sans);
  font-weight: 650;
  letter-spacing: -0.02em;
}

.logo-title {
  color: var(--text);
}

.logo-title::first-letter {
  color: var(--accent);
}

.logo-sub {
  color: var(--text3);
  letter-spacing: 0.1em;
}

.logo-sub,
.nav-label,
.sidebar-mode-label,
.k-return-label,
.k-copy-btn,
.k-return-empty,
.k-model span {
  font-size: 10px;
}

.sidebar-mode-bar,
.sidebar-footer {
  border-color: var(--border);
  background: rgba(var(--accent-rgb), 0.025);
}

.sidebar-mode-select,
.sidebar-settings-trigger {
  border-color: var(--border);
  border-radius: var(--control-radius);
  background: var(--glass-bg-soft);
}

.nav-section {
  padding-top: 12px;
}

.nav-label {
  color: var(--text3);
  letter-spacing: 0.12em;
}

.nav-item {
  margin: 1px 8px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: var(--control-radius);
  transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.nav-item:hover {
  color: var(--text);
  border-color: rgba(var(--accent-rgb), 0.12);
  background: rgba(var(--accent-rgb), 0.065);
  transform: translateX(2px);
}

.nav-item.active {
  color: var(--text);
  border-color: rgba(var(--accent-rgb), 0.25);
  background: linear-gradient(105deg, rgba(var(--accent-rgb), 0.18), rgba(var(--accent-rgb), 0.055));
  box-shadow: inset 3px 0 0 var(--accent), inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.nav-icon {
  filter: saturate(0.72);
}

.topbar {
  min-height: 56px;
  height: 56px;
  border-radius: var(--shell-radius);
  padding-inline: 18px;
}

.topbar-title {
  font-size: 16px;
}

.topbar-sub,
.topbar-time {
  color: var(--text3);
}

.topbar-search {
  gap: 6px;
}

.topbar-search-input,
.search-input,
.filter-select,
.form-input,
.form-select,
.form-textarea,
.sidebar-mode-select {
  border: 1px solid var(--border);
  border-radius: var(--control-radius);
  background: var(--glass-bg-soft);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
}

.topbar-search-input:focus,
.search-input:focus,
.filter-select:focus,
.form-input:focus,
.form-select:focus,
.form-textarea:focus,
.sidebar-mode-select:focus {
  border-color: rgba(var(--accent-rgb), 0.65);
  background: var(--glass-bg-strong);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.content {
  padding: 14px 18px 24px;
  border-radius: var(--shell-radius);
  scrollbar-color: var(--border2) transparent;
}

.page.active {
  animation: glass-page-in 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes glass-page-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

.quick-panel {
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--glass-bg-soft);
  box-shadow: var(--glass-shadow-soft);
  -webkit-backdrop-filter: blur(16px) saturate(135%);
  backdrop-filter: blur(16px) saturate(135%);
}

.card,
.stat-card,
.table-wrap,
.k-col,
.discovery-card,
.search-result-item,
.todo-summary-card,
.return-address-parser,
.order-form-fold,
.tips-hero,
.deadline-alert-card,
.activity-link-parser,
.sidebar-settings-group,
.sidebar-settings-toolbar {
  border-color: var(--border);
  background: var(--glass-bg);
  box-shadow: var(--glass-shadow-soft);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
}

.card,
.stat-card,
.table-wrap,
.k-col,
.discovery-card,
.tips-hero {
  border-radius: var(--radius);
}

.card-title,
.table-title,
.k-title {
  color: var(--text);
  font-weight: 650;
  letter-spacing: -0.01em;
}

.stat-card {
  padding: 16px;
  overflow: hidden;
}

.stat-card::before {
  height: 1px;
  background: linear-gradient(90deg, var(--accent), rgba(var(--accent-rgb), 0));
}

.stat-card::after {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  right: -55px;
  top: -70px;
  border-radius: 50%;
  background: rgba(var(--accent-rgb), 0.09);
  filter: blur(14px);
  pointer-events: none;
}

.stat-card:hover {
  border-color: rgba(var(--accent-rgb), 0.4);
  transform: translateY(-2px);
}

.stat-val,
html.light .stat-val {
  color: var(--accent);
  filter: none;
  font-variant-numeric: tabular-nums;
}

.table-wrap {
  overflow: hidden;
}

.table-header,
th,
td {
  border-color: var(--border);
}

th {
  background: rgba(var(--accent-rgb), 0.035);
  color: var(--text3);
}

tr:hover td {
  background: rgba(var(--accent-rgb), 0.055);
}

.kanban {
  gap: 10px;
}

.k-col {
  min-height: 190px;
  padding: 11px;
}

.k-head {
  padding: 1px 1px 8px;
  border-bottom: 1px solid rgba(var(--accent-rgb), 0.09);
}

.k-cnt {
  border: 1px solid var(--border);
  background: rgba(var(--accent-rgb), 0.055);
}

.k-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(22, 39, 62, 0.56);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

html.light .k-card {
  border-color: var(--border);
  background: rgba(245, 251, 255, 0.62);
}

.k-card:hover,
html.light .k-card:hover {
  border-color: rgba(var(--accent-rgb), 0.46);
  background: rgba(var(--accent-rgb), 0.075);
  box-shadow: 0 10px 24px rgba(1, 8, 20, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  transform: translateY(-2px);
}

.btn,
.qp-btn {
  min-height: 34px;
  border-radius: var(--control-radius);
  white-space: nowrap;
  transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.btn:active,
.qp-btn:active,
.nav-item:active {
  transform: translateY(1px) scale(0.985);
}

.btn-primary,
.topbar > .btn-primary {
  border: 1px solid rgba(201, 242, 255, 0.5);
  background: var(--accent) !important;
  color: #07131c !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 8px 20px rgba(var(--accent-rgb), 0.18) !important;
}

.btn-primary:hover,
.topbar > .btn-primary:hover {
  background: #8ce4ff !important;
  border-color: rgba(224, 248, 255, 0.75);
  transform: translateY(-1px);
}

html.light .btn-primary,
html.light .topbar > .btn-primary {
  border-color: rgba(0, 67, 88, 0.25);
  background: #087c9e !important;
  color: #f4fbff !important;
}

html.light .btn-primary:hover,
html.light .topbar > .btn-primary:hover {
  background: #006f91 !important;
}

.btn-outline,
.qp-btn,
html.light .btn-outline,
html.light .qp-btn {
  border: 1px solid var(--border);
  background: rgba(var(--accent-rgb), 0.025);
  color: var(--text2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.btn-outline:hover,
.qp-btn:hover,
html.light .btn-outline:hover,
html.light .qp-btn:hover {
  border-color: rgba(var(--accent-rgb), 0.42);
  background: rgba(var(--accent-rgb), 0.09);
  color: var(--text);
  transform: translateY(-1px);
}

.btn-ghost,
html.light .btn-ghost {
  color: var(--text3);
}

.btn-ghost:hover,
html.light .btn-ghost:hover {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.065);
}

.modal-overlay,
html.light .modal-overlay {
  background: rgba(3, 10, 20, 0.64);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  backdrop-filter: blur(10px) saturate(120%);
}

.modal,
html.light .modal {
  border-color: var(--border);
  border-radius: var(--shell-radius);
  background: var(--glass-bg-strong);
  box-shadow: 0 28px 90px rgba(1, 8, 20, 0.42), inset 0 1px 0 var(--glass-highlight);
}

.modal-title,
html.light .modal-title {
  color: var(--text);
}

.modal-actions {
  border-top: 1px solid var(--border);
}

.toast,
html.light .toast {
  border: 1px solid rgba(var(--accent-rgb), 0.32);
  border-radius: var(--control-radius);
  background: var(--glass-bg-strong);
  color: var(--text);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  box-shadow: var(--glass-shadow);
}

/* The legacy light theme has high-specificity solid fills. Re-open those
   surfaces so the light theme keeps the same frosted material hierarchy. */
html.light .sidebar,
html.light .topbar,
html.light .card,
html.light .stat-card,
html.light .table-wrap,
html.light .k-col,
html.light .discovery-card,
html.light .search-result-item,
html.light .todo-summary-card,
html.light .return-address-parser,
html.light .order-form-fold,
html.light .tips-hero,
html.light .deadline-alert-card,
html.light .activity-link-parser,
html.light .sidebar-settings-group,
html.light .sidebar-settings-toolbar {
  border-color: var(--border);
  background: var(--glass-bg);
}

html.light .topbar-search-input,
html.light .search-input,
html.light .filter-select,
html.light .form-input,
html.light .form-select,
html.light .form-textarea,
html.light .sidebar-mode-select,
html.light .sidebar-settings-trigger {
  border-color: var(--border);
  background: var(--glass-bg-soft);
  color: var(--text);
}

html.light th {
  border-color: var(--border);
  background: rgba(var(--accent-rgb), 0.035);
  color: var(--text3);
}

html.light td {
  border-color: var(--border);
}

html.light tr:hover td {
  background: rgba(var(--accent-rgb), 0.055);
}

html.light .nav-item:hover {
  border-color: rgba(var(--accent-rgb), 0.12);
  background: rgba(var(--accent-rgb), 0.065);
}

html.light .nav-item.active {
  color: var(--text);
  border-color: rgba(var(--accent-rgb), 0.25);
  background: linear-gradient(105deg, rgba(var(--accent-rgb), 0.16), rgba(var(--accent-rgb), 0.045));
}

html.light .topbar .btn-primary[onclick="openNew()"],
html.light .topbar .btn-primary[onclick="openNew()"]:hover {
  border-color: rgba(0, 67, 88, 0.25);
  background: #087c9e !important;
  color: #f4fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 8px 20px rgba(var(--accent-rgb), 0.18) !important;
}

.tabs {
  border: 1px solid var(--border);
  border-radius: var(--control-radius);
  background: rgba(var(--accent-rgb), 0.025);
}

.tab-btn {
  border-radius: 8px;
}

/* 达人数据页沿用同一套玻璃材质。旧主题中该页有更高优先级的纯白
   覆盖，因此这里同时声明深浅两套选择器，避免主题切换后材质断层。 */
#page-kolstats .card,
html.light #page-kolstats .card {
  border-color: var(--border);
  background: var(--glass-bg);
}

#page-kolstats .card-title,
html.light #page-kolstats .card-title,
#ks-history-list b,
html.light #ks-history-list b {
  color: var(--text);
}

#page-kolstats #ks-chart,
html.light #page-kolstats #ks-chart {
  box-sizing: border-box;
  border: 1px solid var(--border);
  border-radius: var(--control-radius);
  background: rgba(var(--accent-rgb), 0.025) !important;
}

#ks-history-list > div,
html.light #ks-history-list > div {
  border-color: var(--border);
}

.tab-btn.active {
  background: rgba(var(--accent-rgb), 0.12);
  color: var(--accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.tag,
.s-badge {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.sidebar-settings-trigger:focus-visible,
.btn:focus-visible,
.qp-btn:focus-visible,
.nav-item:focus-visible,
.tab-btn:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

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

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: var(--border2);
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(var(--accent-rgb), 0.36);
  background-clip: padding-box;
}

/* Login uses the same material language without depending on the app shell. */
body.login-page {
  min-height: 100dvh;
  height: auto;
  padding: 20px;
  background:
    radial-gradient(circle at 18% 12%, rgba(24, 150, 193, 0.26), transparent 34%),
    radial-gradient(circle at 82% 78%, rgba(51, 98, 150, 0.22), transparent 36%),
    linear-gradient(145deg, #07111f 0%, #091523 52%, #06101c 100%);
}

body.login-page::before {
  background:
    linear-gradient(118deg, transparent 18%, rgba(193, 232, 255, 0.04) 39%, transparent 56%),
    radial-gradient(circle at 50% -12%, rgba(var(--accent-rgb), 0.12), transparent 44%);
}

body.login-page::after {
  opacity: 0.28;
  mix-blend-mode: soft-light;
}

.login-page .login-box {
  width: min(420px, 100%);
  border: 1px solid var(--border);
  border-radius: var(--shell-radius);
  background: var(--glass-bg);
  box-shadow: 0 28px 90px rgba(1, 8, 20, 0.42), inset 0 1px 0 var(--glass-highlight);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  backdrop-filter: blur(26px) saturate(150%);
}

.login-page .login-box::before {
  left: 0;
  right: 0;
  background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb), 0.78), transparent);
}

.login-page .dots {
  display: none;
}

.login-page .login-logo .title {
  color: var(--text);
  font-family: var(--font-sans);
  font-weight: 650;
  letter-spacing: -0.02em;
}

.login-page .login-logo .sub,
.login-page .form-label,
.login-page .hint {
  color: var(--text3);
}

.login-page .form-input {
  border-color: var(--border);
  border-radius: var(--control-radius);
  background: var(--glass-bg-soft);
}

.login-page .form-input:focus {
  border-color: rgba(var(--accent-rgb), 0.65);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.12);
}

.login-page .btn-login {
  min-height: 42px;
  border: 1px solid rgba(201, 242, 255, 0.5);
  border-radius: var(--control-radius);
  background: var(--accent);
  color: #07131c;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 10px 24px rgba(var(--accent-rgb), 0.18);
}

.login-page .btn-login:hover {
  background: #8ce4ff;
}

.login-page #guest-btn {
  border-color: var(--border) !important;
  background: rgba(var(--accent-rgb), 0.025) !important;
  color: var(--text2) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.login-page #guest-btn:hover {
  border-color: rgba(var(--accent-rgb), 0.42) !important;
  background: rgba(var(--accent-rgb), 0.09) !important;
  color: var(--text) !important;
}

@media (max-width: 1280px) {
  .topbar {
    padding-inline: 14px;
  }
}

@media (max-width: 768px) {
  .app {
    gap: 8px;
    padding: 8px;
  }

  .main-area {
    gap: 8px;
  }

  .sidebar {
    top: 8px;
    bottom: 8px;
    left: -276px;
    width: 260px;
    box-shadow: 0 24px 72px rgba(1, 8, 20, 0.48), inset 0 1px 0 var(--glass-highlight);
  }

  .sidebar.open {
    left: 8px;
  }

  .topbar {
    min-height: 50px;
    height: 50px;
    padding-inline: 8px;
  }

  .content {
    padding: 6px 2px 18px;
  }

  .quick-panel {
    padding: 8px;
  }

  .card,
  .stat-card,
  .table-wrap,
  .k-col {
    -webkit-backdrop-filter: blur(14px) saturate(125%);
    backdrop-filter: blur(14px) saturate(125%);
  }

  .modal {
    width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
  }
}

@media (max-width: 480px) {
  .login-page .login-box {
    padding: 30px 22px 24px;
  }

  .topbar > .btn {
    padding-inline: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page.active {
    animation: none;
  }

  .nav-item,
  .btn,
  .qp-btn,
  .stat-card,
  .k-card,
  .discovery-card {
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --surface: #0f2034;
    --surface2: #162b45;
    --glass-bg: #0f2034;
    --glass-bg-strong: #0b1a2c;
    --glass-bg-soft: #162b45;
  }

  html.light {
    --surface: #f5f9fc;
    --surface2: #eaf2f7;
    --glass-bg: #f5f9fc;
    --glass-bg-strong: #f8fbfd;
    --glass-bg-soft: #eaf2f7;
  }

  .sidebar,
  .topbar,
  .modal,
  .card,
  .stat-card,
  .table-wrap,
  .k-col,
  .discovery-card,
  .quick-panel,
  .login-page .login-box {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  :root {
    --glass-bg: rgba(13, 25, 43, 0.96);
    --glass-bg-strong: rgba(9, 19, 34, 0.98);
    --glass-bg-soft: rgba(18, 34, 56, 0.94);
  }

  html.light {
    --glass-bg: rgba(247, 252, 255, 0.97);
    --glass-bg-strong: rgba(247, 252, 255, 0.99);
    --glass-bg-soft: rgba(239, 247, 252, 0.96);
  }
}

@media print {
  .app {
    padding: 0;
  }

  body.app-shell,
  html.light body.app-shell {
    background: #fff !important;
  }
}