@layer base {
  :root {
    --bg-page: #f8fafc;
    --bg-card: #ffffff;
    --text-primary: #0f172a;
    --text-secondary: #334155;
    --text-muted: #64748b;
    --border-subtle: #e2e8f0;
    --accent: #0f172a;
  }

  body {
    background-color: var(--bg-page);
    color: var(--text-primary);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
  }

  /* Refined tabular numbers for budgets and metrics */
  .tabular-nums {
    font-variant-numeric: tabular-nums;
  }
}

/* Crisp hairline cards with subtle micro-depth */
.clean-card {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
}

.clean-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 12px -2px rgba(15, 23, 42, 0.04), 0 2px 6px -1px rgba(15, 23, 42, 0.02);
}

/* Subtle input styling */
.clean-input {
  background-color: #ffffff;
  border: 1px solid #cbd5e1;
  color: #0f172a;
  border-radius: 0.375rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  outline: none;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.clean-input:focus {
  border-color: #0f172a;
  box-shadow: 0 0 0 1px #0f172a;
}

/* Minimal interactive tabs */
.tab-btn {
  padding: 0.5rem 0.875rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #64748b;
  border-radius: 0.375rem;
  transition: all 150ms ease;
  white-space: nowrap;
}

.tab-btn:hover {
  color: #0f172a;
  background-color: #f1f5f9;
}

.tab-btn.active {
  color: #0f172a;
  background-color: #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  border: 1px solid #e2e8f0;
}

/* Short and empty pages keep the shared system footer at the viewport bottom. */
body:not([data-page="login"]):not([data-page="register"]) {
  display: flex;
  flex-direction: column;
}
body:not([data-page="login"]):not([data-page="register"]) > main {
  flex: 1;
  width: 100%;
}

/* Article links follow the original navigation; long lists stay inside a compact menu. */
.waibao-article-menu { position: relative; flex-shrink: 0; }
.waibao-article-menu > summary { cursor: pointer; }
.waibao-article-panel { position: absolute; top: 100%; right: 0; z-index: 50; min-width: 12rem; max-width: min(24rem, 80vw); max-height: 60vh; overflow: auto; padding: .5rem; background: #fff; border: 1px solid #e2e8f0; border-radius: .5rem; box-shadow: 0 4px 12px rgba(15, 23, 42, .08); }
.waibao-article-panel > a { display: block; padding: .5rem .75rem; white-space: normal; overflow-wrap: anywhere; }

/* Site-specific presentation for Hangzhou Xulihengbo; other sites retain the original template. */
.waibao-xlhb-copy { display: none; }
html[data-waibao-site="site-261104-64214f8b"] .waibao-brand-mark { font-size: 0; background: #0f172a url('/template-assets/waibao_e/images/xulihengbo-mark.svg') center / cover no-repeat; }
html[data-waibao-site="site-261104-64214f8b"] .waibao-city-field,
html[data-waibao-site="site-261104-64214f8b"] .waibao-default-copy { display: none !important; }
html[data-waibao-site="site-261104-64214f8b"] .waibao-xlhb-copy { display: inline; }
html[data-waibao-site="site-261104-64214f8b"] .waibao-home-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
