/* Postmodern Cereal — vendored obsidian phosphor tokens.
   Jet black fields match the Charthouse viewport.
   Phosphor green matches Postmodern Serial (#39ff14).
   Gold and glass surfaces follow Charthouse brass and See What Sticks. */

:root {
  --pc-bg: #0a0e14;
  --pc-bg-raise: #120c18;
  --pc-bg-ink: #07090d;
  --pc-phosphor: #39ff14;
  --pc-phosphor-soft: rgba(57, 255, 20, 0.14);
  --pc-phosphor-dim: #1c7a28;
  --pc-gold: #e3b341;
  --pc-gold-soft: rgba(227, 179, 65, 0.16);
  --pc-gold-dim: #8a6414;
  --pc-violet: #c9a6ff;
  --pc-text: #e7efe4;
  --pc-muted: #8d998c;
  --pc-dim: #5c675e;
  --pc-danger: #e07a6a;
  --pc-danger-soft: rgba(224, 122, 106, 0.16);
  --pc-glass: rgba(18, 12, 24, 0.62);
  --pc-glass-card: rgba(18, 14, 28, 0.55);
  --pc-glass-border: rgba(231, 239, 228, 0.1);
  --pc-glass-phosphor: rgba(57, 255, 20, 0.22);
  --pc-blur: blur(16px);
  --pc-radius-sm: 8px;
  --pc-radius: 14px;
  --pc-radius-lg: 20px;
  --pc-mono: "IBM Plex Mono", "Cascadia Code", "Segoe UI Mono", ui-monospace, monospace;
  --pc-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  --pc-pad: 1rem;
  --pc-gap: 0.75rem;
}

.glass-panel,
.glass-card,
.glass-drawer,
.glass-modal {
  background: var(--pc-glass);
  backdrop-filter: var(--pc-blur);
  -webkit-backdrop-filter: var(--pc-blur);
  border: 1px solid var(--pc-glass-border);
  box-shadow: var(--pc-shadow);
}

.glass-panel {
  border-radius: var(--pc-radius);
}

.glass-card {
  background: var(--pc-glass-card);
  border-radius: var(--pc-radius-lg);
}

.glass-drawer {
  border-radius: var(--pc-radius-lg) 0 0 var(--pc-radius-lg);
}

.glass-modal {
  border-radius: var(--pc-radius-lg);
}

.glass-card:focus-within,
.glass-panel:focus-within {
  border-color: var(--pc-glass-phosphor);
}