@font-face {
  font-family: "Chomsky";
  src: url("/assets/Chomsky.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
:root {
  --acid: #d20a13;
  --black: #070707;
  --paper: #f4f4f1;
  --mono: "Inter", sans-serif;
  --display: "Inter", sans-serif;
  --old-english: "Chomsky", "Old English Text MT", serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--black); color: var(--paper); font-family: var(--mono); }
h1,h2,.logo,.announcement,.pitch { font-weight: 900; text-transform: uppercase; }
a { color: inherit; text-decoration: none; }
.announcement { overflow: hidden; white-space: nowrap; background: var(--paper); color: var(--black); padding: 11px 0; border-bottom: 1px solid #000; font: 700 13px/1 var(--mono); letter-spacing: .08em; }
.announcement div { width: max-content; animation: roll 22s linear infinite; }
header { min-height: 88px; display: flex; align-items: center; justify-content: space-between; padding: 10px 3vw; border-bottom: 1px solid #ffffff22; background: var(--black); position: relative; z-index: 5; }
.brand-lockup { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.logo { color: var(--acid); font: 400 31px/1 var(--old-english); letter-spacing: 0; text-transform: none; display: inline-flex; align-items: center; }
.logo .registered { color: var(--acid); font: 9px var(--mono); align-self: flex-start; margin-left: 3px; }
.exclusive-link { color: var(--paper); font-size: 13px; line-height: 1; letter-spacing: .04em; }
.exclusive-link:hover { color: var(--acid); }
.ace-mark { width: 54px; height: 62px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.ace-mark img { display: block; width: auto; height: 100%; object-fit: contain; }
.music { min-height: calc(100svh - 111px); display: grid; grid-template-columns: minmax(300px,.82fr) minmax(390px,1.18fr); gap: 5vw; align-items: center; padding: 5vw 6vw 6vw; position: relative; overflow: hidden; background: linear-gradient(90deg,transparent 49.9%,#ffffff12 50%,transparent 50.1%),radial-gradient(circle at 7% 85%,#ffffff10,transparent 27%); }
.music:before { content: "KA"; position: absolute; top: -11vw; left: -5vw; font: 48vw/.8 var(--display); color: transparent; -webkit-text-stroke: 1px #ffffff08; pointer-events: none; }
.identity,.player-shell { position: relative; z-index: 1; }
.kicker { font-size: 12px; letter-spacing: .12em; line-height: 1.5; }
h1 { font: 400 clamp(58px,7.2vw,116px)/.82 var(--old-english); letter-spacing: -.015em; margin: 35px 0 45px; white-space: nowrap; text-transform: none; }
h1::first-line { color: var(--paper); }
.now-playing { color: var(--acid); font-size: 12px; letter-spacing: .1em; display: flex; align-items: center; gap: 11px; }
.now-playing span { width: 9px; height: 9px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 14px var(--acid); }
.player-shell { border: 1px solid #ffffff40; background: #111; padding: 10px; box-shadow: 20px 20px 0 var(--paper); }
.player-top { padding: 7px 5px 16px; display: flex; justify-content: space-between; font-size: 10px; color: #888; }
.player-shell iframe { display: block; border-radius: 2px; }
.spotify-link { display: flex; justify-content: space-between; padding: 20px 12px 10px; font-size: 12px; letter-spacing: .08em; }
.spotify-link:hover { color: var(--acid); }
.platform-links { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 12px; border: 2px solid var(--paper); background: #0a0a0a; }
.platform-links a { min-height: 54px; padding: 0 10px; border-right: 1px solid var(--paper); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-align: center; white-space: nowrap; }
.platform-links a:last-child { border-right: 0; }
.platform-links a:hover { background: var(--paper); color: var(--black); }
.featured-single { min-height: 58px; margin-top: 12px; border: 2px solid var(--acid); display: flex; align-items: center; justify-content: center; color: var(--acid); font-size: 13px; font-weight: 800; letter-spacing: .08em; }
.featured-single:hover { background: var(--acid); color: var(--black); }
.stamp { position: absolute; right: -18px; top: 12px; color: #ffffff28; font: 10px/1.6 var(--mono); transform: rotate(90deg); }
@keyframes roll { to { transform: translateX(-50%); } }
.exclusives { min-height: 74svh; display: flex; align-items: center; justify-content: center; background: var(--black); color: var(--paper); }
.exclusive-copy { padding: 9vw 5vw; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid #1a1a1a; }
h2 { font: clamp(48px,6.4vw,108px)/.78 var(--display); letter-spacing: -.085em; margin: 45px 0 0; white-space: nowrap; }
h2 em { color: transparent; -webkit-text-stroke: 2px var(--paper); font-style: normal; }
.signup-panel { width: min(920px,100%); padding: 7vw 6vw; display: flex; flex-direction: column; justify-content: center; }
.join-heading { color: var(--paper); font: 400 clamp(56px,7vw,100px)/.86 var(--old-english); letter-spacing: 0; margin: 0 0 42px; text-transform: none; white-space: normal; }
.pitch { font: clamp(26px,3.4vw,48px)/1.12 var(--display); letter-spacing: -.04em; max-width: 900px; }
.signup { margin-top: 65px; }
.signup label { font-size: 11px; display: block; margin-bottom: 12px; }
.field-row { display: grid; grid-template-columns: 1fr auto; }
.field-row input,.field-row button { min-height: 65px; border: 2px solid var(--paper); border-radius: 0; padding: 0 18px; font: 14px var(--mono); }
.field-row input { background: #111; color: #fff; opacity: 1; -webkit-text-fill-color: #bbb; }
.field-row button { background: var(--paper); color: var(--black); cursor: not-allowed; }
.form-note { color: #999; font-size: 11px; line-height: 1.6; }
footer { min-height: 90px; display: flex; align-items: center; justify-content: space-between; padding: 0 3vw; font-size: 10px; color: #777; }
footer div { display: flex; gap: 24px; }
footer a:hover { color: var(--acid); }
@media (max-width:800px) {
  .announcement { padding: 10px 0; font-size: 12px; }
  header { min-height: 82px; padding: 9px 20px; }
  .brand-lockup { gap: 7px; }
  .logo { font-size: 23px; letter-spacing: 0; }
  .exclusive-link { font-size: 13px; }
  .ace-mark { width: 43px; height: 54px; }
  .music { min-height: auto; grid-template-columns: 1fr; padding: 30px 20px 48px; gap: 24px; }
  .identity { padding: 0; }
  .identity .kicker { margin: 0 0 14px; }
  h1 { font-size: 15vw; line-height: .78; margin: 0 0 22px; }
  .now-playing { margin-bottom: 4px; }
  .player-shell { box-shadow: 10px 10px 0 var(--paper); }
  .player-shell iframe { height: 480px; }
  .stamp { display: none; }
  .exclusives { min-height: auto; }
  .signup-panel { padding: 42px 20px; }
  .join-heading { font-size: clamp(52px,15vw,68px); margin-bottom: 28px; }
  .pitch { font-size: 20px; line-height: 1.15; margin: 0; }
  .signup { margin-top: 22px; }
  .field-row { grid-template-columns: 1fr; }
  .field-row button { border-top: 0; }
  footer { flex-direction: column; align-items: flex-start; justify-content: center; gap: 14px; padding: 30px 20px; }
}
@media (max-width:360px) {
  .platform-links a { padding: 0 4px; font-size: 11px; letter-spacing: .02em; }
}
