/* Richie Zxy Custom Faircamp Theme - Minimal Professional */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700&family=JetBrains+Mono:wght@400;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --color-amber: #d7b56d;
  --color-amber-muted: #b48e3a;
  --color-dark: #05070A;
  --color-panel: #0A0D12;
  --color-line: rgba(255, 255, 255, 0.08);
}

body {
  font-family: 'Inter', sans-serif !important;
  background-color: var(--color-dark) !important;
  color: #E2E8F0 !important;
}

/* Headings */
h1, h2, h3 {
  font-family: 'Cinzel', serif !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #FFFFFF !important;
}

/* Remove Faircamp default </> icon */
header h1::before, header .brand::before {
  content: none !important;
  display: none !important;
}

/* Global links */
a {
  color: var(--color-amber) !important;
  transition: color 0.2s ease;
  text-decoration: none !important;
}
a:hover {
  color: #FFFFFF !important;
}

/* Track rows */
.track {
  border: 1px solid var(--color-line);
  background: var(--color-panel);
  border-radius: 0;
  margin-bottom: 4px;
  transition: border-color 0.2s ease;
}
.track:hover {
  border-color: var(--color-amber-muted);
}

/* Waveforms */
.waveform canvas {
  filter: grayscale(100%) brightness(1.5);
  transition: filter 0.3s ease;
}
.track:hover .waveform canvas {
  filter: sepia(100%) hue-rotate(5deg) saturate(300%) brightness(1.2);
}

/* Buttons */
.button {
  font-family: 'JetBrains Mono', monospace !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 0 !important;
  border: 1px solid var(--color-line) !important;
  background: var(--color-panel) !important;
  color: #FFFFFF !important;
}

.button:hover {
  border-color: var(--color-amber) !important;
  background: var(--color-dark) !important;
  color: var(--color-amber) !important;
}

/* Album covers with frame */
.cover-image {
  border: 1px solid var(--color-line);
  border-radius: 0;
  transition: border-color 0.3s ease;
}
a:hover .cover-image {
  border-color: var(--color-amber);
}

/* Audio Player Bottom Bar */
#player {
  background: var(--color-panel) !important;
  border-top: 1px solid var(--color-line);
  box-shadow: none !important;
}

/* Faircamp Structural Overrides - Terminal Brutalism */
body {
  padding-top: 0 !important;
  display: flex;
  flex-direction: column;
}

#zxy-ecosystem-bar {
  position: sticky;
  top: 0;
}

main {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 32px 0 !important;
  width: 100%;
}

/* Framed Grid Chambers for Albums */
.list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1px;
  background: var(--color-line);
  border: 1px solid var(--color-line);
  padding: 1px;
}

.list-item {
  background: var(--color-panel);
  padding: 16px;
  display: flex;
  flex-direction: column;
}

@media (max-width: 640px) {
  .zxy-eco-brand {
    display: none !important;
  }
}
.zxy-eco-links a {
  transition: color 0.15s ease;
}
.zxy-eco-links a:hover {
  color: #ffffff !important;
}

/* Keep the padded navigation viewport inside the page; links scroll within it. */
#zxy-ecosystem-bar .zxy-eco-scroll {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}

/* Faircamp pages already own their horizontal gutters and viewport-based widths. */
.layout > * {
  box-sizing: border-box;
  min-width: 0;
}