Mini Video Library

:root {
  --bg: #06060d;
  --panel: #0d1020;
  --line: #24335f;
  --text: #e8fbff;
  --muted: #8294bd;
  --accent: #ff2bd6;
}

body {
  background:
    linear-gradient(rgba(0, 246, 255, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 246, 255, .025) 1px, transparent 1px),
    radial-gradient(circle at 15% 10%, rgba(255, 43, 214, .13), transparent 30%),
    radial-gradient(circle at 85% 85%, rgba(0, 246, 255, .1), transparent 34%),
    var(--bg);
  background-size: 32px 32px, 32px 32px, auto, auto, auto;
}

header {
  background: rgba(6, 6, 13, .88);
  border-bottom-color: #00f6ff70;
  box-shadow: 0 0 26px #00f6ff18;
}

.brand {
  color: #00f6ff;
  text-shadow: 0 0 12px #00f6ff90;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.brand:first-letter { color: #ff2bd6; }
nav a:hover, .back:hover { color: #00f6ff; text-shadow: 0 0 10px #00f6ff; }

.hero h1, .detail-header h1, .settings h1 {
  text-shadow: 3px 3px 0 #ff2bd640, -2px -2px 0 #00f6ff25;
}

.eyebrow { color: #00f6ff !important; text-shadow: 0 0 8px #00f6ff; }

input, select, textarea, button {
  background: #0b1020;
  border-color: #30467e;
  border-radius: 3px;
}

input:focus, select:focus, textarea:focus {
  outline: 1px solid #00f6ff;
  border-color: #00f6ff;
  box-shadow: 0 0 16px #00f6ff38;
}

button:hover {
  color: #00f6ff;
  border-color: #00f6ff;
  box-shadow: inset 0 0 12px #00f6ff14, 0 0 12px #00f6ff20;
}

.button, .play {
  color: #090610;
  background: linear-gradient(100deg, #ff2bd6, #ff477e);
  border-radius: 3px;
  box-shadow: 4px 4px 0 #00f6ff, 0 0 24px #ff2bd650;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.button:hover, .play:hover { color: #090610; transform: translate(-1px, -1px); }

.poster, .cover, .media-facts div, .track-card, .detail-panels, .plugin-card, .stat-grid article {
  border-color: #30467e;
  box-shadow: 0 0 0 1px #ff2bd618, 0 12px 36px #000a;
}

.card:hover .poster { box-shadow: 0 0 0 1px #00f6ff, 0 18px 45px #00f6ff20; }
.compatibility { color: #00f6ff; background: #07191d; border-color: #00f6ff60; }
.tag-cloud span, .badge { background: #17152b; border: 1px solid #ff2bd650; }
.settings-tabs button.active { color: #00f6ff; border-color: #00f6ff; background: #101a30; }
::selection { color: #05060b; background: #00f6ff; }