/* physenAI shared visual system — keep in sync with serverplatform/src/physen-system.css. */
:root {
  --physen-ink: #193c37;
  --physen-accent: #087f6b;
  --physen-accent-dark: #056451;
  --physen-muted: #71817d;
  --physen-line: #e1e9e5;
  --physen-canvas: #f5f7f5;
  --physen-tint: #eaf4ee;
  --physen-radius: 14px;
  --sidebar: 235px;
  --brand: var(--physen-accent);
  --green: var(--physen-accent);
  --green-dark: var(--physen-accent-dark);
  --green-light: var(--physen-tint);
  --ink: var(--physen-ink);
  --text: var(--physen-ink);
  --muted: var(--physen-muted);
  --line: var(--physen-line);
  --border: var(--physen-line);
  color: var(--physen-ink);
  background: var(--physen-canvas);
  font-family:
    'DM Sans',
    'PingFang SC',
    'Microsoft YaHei',
    -apple-system,
    sans-serif;
  -webkit-font-smoothing: antialiased;
}
::selection {
  background: #c7eadc;
  color: #164d3b;
}
.product-switch {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--physen-line);
  border-radius: 10px;
  background: #f2f5f2;
  white-space: nowrap;
}
.product-switch a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 15px;
  border-radius: 7px;
  color: #71817d;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}
.product-switch a:hover {
  color: var(--physen-accent);
  background: #e8eee9;
  text-decoration: none;
}
.product-switch a.is-active {
  color: var(--physen-accent-dark);
  background: #fff;
  box-shadow: 0 1px 4px #193c3710;
}
.product-companion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 20px;
  padding: 16px 14px;
  border: 1px solid #cfe1d6;
  border-radius: 12px;
  color: #426c5c;
  background: linear-gradient(120deg, #eef5e8, #e7f2ed);
  font-size: 11px;
  line-height: 1.6;
  text-decoration: none;
}
.product-companion small {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 600;
  color: #1b5e4e;
}
.product-companion:hover {
  border-color: #8bbda7;
  transform: translateY(-1px);
  text-decoration: none;
}
.topbar {
  height: 72px;
  background: #ffffffed;
  border-bottom: 1px solid var(--physen-line);
}
.panel,
.stat-card {
  border-color: var(--physen-line);
  border-radius: var(--physen-radius);
  box-shadow: 0 3px 16px #173b3003;
}
.primary-button {
  background: var(--physen-accent);
  border-radius: 8px;
}
.primary-button:hover {
  background: var(--physen-accent-dark);
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid #83c4ad;
  outline-offset: 3px;
}
@media (max-width: 600px) {
  .topbar {
    height: 64px;
  }
  .product-switch {
    gap: 2px;
    padding: 3px;
  }
  .product-switch a {
    font-size: 11px;
    padding: 0 10px;
    min-height: 30px;
  }
}