/* ------------------------------------------------------------------
   AECYST - deferred (non-critical) stylesheet. Extracted from index.html
   inline <style> (Task 3, LCP_v1). Loaded async via preload+onload swap.
   Cascade order preserved: critical inline first, this second - identical
   final render to the original single stylesheet.
   ------------------------------------------------------------------ */
  /* ------------------------------------------------------------------
     Section framework — brutalist, numbered, coded.
     ------------------------------------------------------------------ */
  section.block {
    position: relative;
    padding: 120px 48px;
    max-width: 1440px;
    margin: 0 auto;
  }
  .block-head {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 48px;
    align-items: end;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(242,239,233,0.08);
    margin-bottom: 64px;
  }
  .block-index {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.3em;
    color: var(--bone-dim);
    text-transform: uppercase;
  }
  .site-glyph {
    font-size: 36px;
    color: var(--blood-text);
  }
  .block-index .red-label {
    font-size: 28px;
    color: var(--blood-text);
    letter-spacing: 0.3em;
  }
  .block-index .num {
    color: var(--blood-text);
    display: block;
    font-size: 48px;
    letter-spacing: 0;
    font-weight: 300;
    margin-bottom: 8px;
    line-height: 1;
  }
  .block-title {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: clamp(42px, 6vw, 96px);
    line-height: 0.92;
    letter-spacing: -0.02em;
    color: var(--bone);
    margin: 0;
    text-wrap: balance;
  }
  .block-title .red { color: var(--blood-text); font-style: italic; font-weight: 400; }

  /* ------------------------------------------------------------------
     01 — Featured release: Vacillate
     ------------------------------------------------------------------ */
  .featured {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 64px;
    align-items: center;
  }
  .featured-art {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--ash);
    border: 1px solid rgba(242,239,233,0.1);
    overflow: hidden;
  }
  .featured-art-inner {
    position: absolute; inset: 0;
    background:
      radial-gradient(ellipse 70% 50% at 50% 70%, rgba(196,0,18,0.45) 0%, rgba(58,2,6,0.6) 40%, #000 85%),
      linear-gradient(180deg, #000 0%, #160303 100%);
  }
  .featured-thorns {
    position: absolute; inset: 0;
    background:
      radial-gradient(ellipse 40% 80% at 20% 40%, rgba(0,0,0,0.9) 0%, transparent 60%),
      radial-gradient(ellipse 40% 80% at 80% 40%, rgba(0,0,0,0.9) 0%, transparent 60%);
    mix-blend-mode: multiply;
  }
  .featured-title {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 28px;
  }
  .featured-top {
    display: flex;
    justify-content: space-between;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.35em;
    color: var(--bone-dim);
    text-transform: uppercase;
  }
  .featured-bottom {
    text-align: center;
  }
  .blood-title {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
    font-style: italic;
    font-size: clamp(56px, 10vw, 120px);
    letter-spacing: -0.02em;
    line-height: 0.9;
    color: var(--blood-text);
    text-shadow:
      0 0 30px rgba(196,0,18,0.6),
      1px 0 0 rgba(0,0,0,0.5);
    transform: skew(-3deg);
    margin: 0;
  }
  .featured-heart {
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    width: 38%;
    opacity: 0.6;
    mix-blend-mode: screen;
    filter: drop-shadow(0 0 40px rgba(196,0,18,0.8));
    animation: heart 3.2s ease-in-out infinite;
  }
  @keyframes heart {
    0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.55; }
    50% { transform: translate(-50%, -50%) scale(1.04); opacity: 0.75; }
  }

  .featured-copy .track-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.3em;
    color: var(--blood-text);
    text-transform: uppercase;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 14px;
  }
  .featured-copy .track-meta .dot {
    width: 6px; height: 6px; background: var(--blood);
    animation: pulse 1.8s ease-in-out infinite;
  }
  @keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.3; transform: scale(1.5); }
  }
  .featured-copy h3 {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
    font-size: clamp(56px, 8vw, 120px);
    letter-spacing: -0.03em;
    line-height: 0.9;
    margin: 0 0 28px;
  }
  .featured-copy .lyric {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 300;
    font-size: clamp(18px, 1.6vw, 22px);
    color: var(--bone);
    line-height: 1.45;
    max-width: 520px;
    margin-bottom: 36px;
    padding-left: 24px;
    border-left: 2px solid var(--blood);
  }
  .featured-copy .lyric em {
    color: var(--blood-text);
    font-style: normal;
  }
  .listen-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: rgba(242,239,233,0.08);
    border: 1px solid rgba(242,239,233,0.08);
    max-width: 520px;
  }
  .listen-cell {
    background: var(--black);
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--bone-dim);
    cursor: pointer;
    transition: all 200ms;
  }
  .listen-cell:hover {
    background: var(--blood);
    color: var(--bone);
  }
  .listen-cell .arrow { transition: transform 200ms; }
  .listen-cell:hover .arrow { transform: translateX(4px); color: var(--bone); }

  /* ------------------------------------------------------------------
     02 — Five wounds (the songs)
     ------------------------------------------------------------------ */
  .wounds {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    background: rgba(242,239,233,0.06);
    border: 1px solid rgba(242,239,233,0.06);
  }
  .wound {
    position: relative;
    background: var(--black);
    padding: 32px 24px 40px;
    min-height: 420px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    overflow: hidden;
    transition: background 260ms;
  }
  .wound::before {
    content: "";
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% 100%, rgba(196,0,18,0.35), transparent 65%);
    opacity: 0;
    transition: opacity 260ms;
  }
  .wound:hover::before { opacity: 1; }
  .wound-top {
    display: flex;
    justify-content: space-between;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    color: var(--bone-dim);
    text-transform: uppercase;
    position: relative;
    z-index: 2;
  }
  .wound-top .idx { color: var(--blood-text); }
  .wound-name {
    position: relative;
    z-index: 2;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
    font-size: clamp(26px, 2vw, 32px);
    line-height: 1;
    letter-spacing: -0.02em;
    margin-top: 80px;
  }
  .wound-theme {
    position: relative;
    z-index: 2;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 300;
    font-size: 15px;
    color: var(--bone-dim);
    line-height: 1.5;
    margin-top: 18px;
    transition: color 260ms;
  }
  .wound:hover .wound-theme { color: var(--bone); }
  .wound-tag {
    position: relative;
    z-index: 2;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    color: var(--blood-text);
    text-transform: uppercase;
    margin-top: 24px;
    text-decoration: none;
    display: block;
  }
  .wound-shape {
    position: absolute;
    top: 60px; right: 24px;
    width: 40px; height: 40px;
    border: 1px solid var(--blood);
    opacity: 0.4;
    transition: all 260ms;
    z-index: 2;
  }
  .wound:nth-child(1) .wound-shape { border-radius: 50%; }
  .wound:nth-child(2) .wound-shape { transform: rotate(45deg); }
  .wound:nth-child(3) .wound-shape { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
  .wound:nth-child(4) .wound-shape { border-radius: 50%; background: var(--blood); }
  .wound:nth-child(5) .wound-shape { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
  .wound:hover .wound-shape {
    opacity: 1;
    background: var(--blood);
    transform: scale(1.15) rotate(15deg);
  }
  .wound:nth-child(2):hover .wound-shape { transform: scale(1.15) rotate(60deg); }
  .wound:nth-child(3):hover .wound-shape { transform: scale(1.15); }
  .wound:nth-child(5):hover .wound-shape { transform: scale(1.15) rotate(45deg); }

  /* ------------------------------------------------------------------
     03 — Mission / manifesto
     ------------------------------------------------------------------ */
  .mission {
    position: relative;
    padding: 200px 48px;
    max-width: 1100px;
    margin: 0 auto;
    text-align: left;
  }
  .mission-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.4em;
    color: var(--blood-text);
    text-transform: uppercase;
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    gap: 14px;
  }
  .mission-label::before {
    content: "";
    width: 50px; height: 1px;
    background: var(--blood);
  }
  .mission-label::before { display: none; }
  .mission-cipher-flash {
    display: inline-block;
    color: var(--blood-text);
    font-family: 'Courier New', monospace;
    font-size: 0.75em;
    vertical-align: middle;
    margin-left: 0.3em;
    opacity: 0;
    letter-spacing: 0.05em;
  }
  .manifesto {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 3.4vw, 54px);
    line-height: 1.18;
    letter-spacing: -0.02em;
    color: var(--bone);
    text-wrap: balance;
  }
  .manifesto em {
    color: var(--blood-text);
    font-style: italic;
    font-weight: 500;
  }
  .manifesto .strike {
    position: relative;
    display: inline-block;
  }
  .manifesto .strike::after {
    content: "";
    position: absolute;
    left: -2%; right: -2%;
    top: 52%;
    height: 3px;
    background: var(--blood);
  }
  .mission-sign {
    margin-top: 64px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 32px;
    border-top: 1px solid rgba(242,239,233,0.1);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.25em;
    color: var(--bone-dim);
    text-transform: uppercase;
  }

  /* ------------------------------------------------------------------
     04 — Album thumbnails reel
     ------------------------------------------------------------------ */
  .reel {
    padding: 0 48px 120px;
    max-width: 1440px;
    margin: 0 auto;
  }
  .reel-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }
  .reel-item {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    cursor: pointer;
    background: var(--ash);
    border: 1px solid rgba(242,239,233,0.08);
  }
  .reel-item img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 600ms cubic-bezier(.2,0,.2,1), filter 400ms;
    filter: brightness(0.85) contrast(1.05);
  }
  .reel-item:hover img {
    transform: scale(1.06);
    filter: brightness(1) contrast(1.1);
  }
  .reel-item::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.9) 100%);
    pointer-events: none;
  }
  .reel-label {
    position: absolute;
    bottom: 20px; left: 24px; right: 24px;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    pointer-events: none;
  }
  .reel-label h4 {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 22px;
    margin: 0;
    color: var(--bone);
  }
  .reel-label span {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    color: var(--blood-text);
    text-transform: uppercase;
  }

  /* ------------------------------------------------------------------
     05 — Teach / YouTube
     ------------------------------------------------------------------ */
  .teach {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
  }
  .teach-left h3 {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 300;
    font-size: clamp(40px, 5vw, 72px);
    line-height: 1;
    letter-spacing: -0.02em;
    margin: 0 0 32px;
  }
  .teach-left h3 em {
    color: var(--blood-text);
    font-style: italic;
    font-weight: 500;
  }
  .teach-left p {
    font-size: 18px;
    line-height: 1.55;
    color: var(--bone-dim);
    max-width: 520px;
    margin-bottom: 40px;
  }
  .teach-topics {
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
  }
  .teach-topics li {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.2em;
    color: var(--bone-dim);
    text-transform: uppercase;
    padding-left: 18px;
    position: relative;
  }
  .teach-topics li::before {
    content: "";
    position: absolute;
    left: 0; top: 6px;
    width: 8px; height: 1px;
    background: var(--blood);
  }
  .teach-right {
    position: relative;
    aspect-ratio: 1 / 1;
    background:
      radial-gradient(ellipse 80% 80% at 50% 50%, rgba(196,0,18,0.2) 0%, transparent 70%),
      var(--black);
    border: 1px solid rgba(242,239,233,0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  .teach-right img {
    width: 85%; height: auto;
    filter: contrast(1.2) brightness(0.95);
    mix-blend-mode: screen;
    opacity: 0.95;
  }
  .teach-right-label {
    position: absolute;
    top: 24px; left: 24px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    color: var(--bone-dim);
    text-transform: uppercase;
  }
  .teach-right-label .red { color: var(--blood-text); }
  .teach-right-caption {
    position: absolute;
    bottom: 24px; right: 24px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    color: var(--bone-dim);
    text-transform: uppercase;
    text-align: right;
    max-width: 60%;
  }

  /* ------------------------------------------------------------------
     06 — Merch
     ------------------------------------------------------------------ */
  .merch {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
  .merch-item.merch-dark {
    background: #0a0a0a;
  }
  .merch-item.merch-dark img {
    filter: brightness(1.05) contrast(1.05);
  }
  .merch-item {
    position: relative;
    background: #fafafa;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    cursor: pointer;
    transition: transform 300ms;
  }
  .merch-item img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 400ms;
  }
  .merch-item { cursor: pointer; display: block; text-decoration: none; }
  .merch-item:hover img { transform: scale(1.04); }
  .merch-item::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.85) 100%);
    pointer-events: none;
  }
  .merch-meta {
    position: absolute;
    left: 20px; right: 20px; bottom: 20px;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }
  .merch-meta .merch-name {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 500;
    font-size: 15px;
    margin: 0;
    color: var(--bone);
  }
  .merch-meta span {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--blood-text);
    letter-spacing: 0.2em;
  }

  /* ------------------------------------------------------------------
     07 — Mailing list / sigil
     ------------------------------------------------------------------ */
  .sigil {
    position: relative;
    padding: 180px 48px;
    max-width: 1440px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
  }
  .sigil-left {
    position: relative;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* Sigil rings (visual tracks) */
  .sigil-ring {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(196,0,18,0.4);
    border-radius: 50%;
    animation: ring-pulse 4s ease-in-out infinite;
  }
  .sigil-ring.inner { inset: 36px; border-color: rgba(196,0,18,0.25); animation-direction: reverse; }
  @keyframes ring-pulse {
    0%, 100% { box-shadow: 0 0 0px rgba(196,0,18,0); }
    50% { box-shadow: 0 0 18px rgba(196,0,18,0.35), inset 0 0 18px rgba(196,0,18,0.1); }
  }
  body[data-motion="still"] .sigil-ring { animation: none; }

  /* Orbiting crows */
  .sigil-orbit {
    position: absolute;
    inset: 0;
    animation: rotate 20s linear infinite;
  }
  .sigil-orbit.slow { animation-duration: 34s; animation-direction: reverse; inset: 36px; }
  .orbit-crow {
    position: absolute;
    width: 58px;
    height: 58px;
    left: 50%;
    top: 50%;
    margin-left: -29px;
    margin-top: -29px;
  }
  .orbit-crow img {
    width: 100%; height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1) drop-shadow(0 0 10px rgba(196,0,18,0.85));
    opacity: 0.9;
    animation: counter-rot 20s linear infinite, crow-glitch 7s steps(1) infinite;
  }
  .sigil-orbit.slow .orbit-crow img {
    animation-duration: 34s, 9s;
    animation-direction: reverse, normal;
  }
  .orbit-crow:nth-child(1) { transform: rotate(0deg)   translateY(-50%); }
  .orbit-crow:nth-child(2) { transform: rotate(90deg)  translateY(-50%); }
  .orbit-crow:nth-child(3) { transform: rotate(180deg) translateY(-50%); }
  .orbit-crow:nth-child(4) { transform: rotate(270deg) translateY(-50%); }
  @keyframes counter-rot {
    from { transform: rotate(0deg); }
    to   { transform: rotate(-360deg); }
  }
  @keyframes crow-glitch {
    0%, 88%, 100% { opacity: 0.9; filter: brightness(0) invert(1) drop-shadow(0 0 10px rgba(196,0,18,0.85)); transform: rotate(var(--cr, 0deg)); }
    89% { opacity: 0.3; filter: brightness(0) invert(1) drop-shadow(0 0 30px rgba(196,0,18,1)) blur(1px); transform: rotate(var(--cr, 0deg)) translate(-3px, 2px); }
    90% { opacity: 1;   filter: brightness(0) invert(1) drop-shadow(0 0 40px rgba(196,0,18,1)); }
    91% { opacity: 0.5; filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(196,0,18,0.4)) blur(2px); transform: rotate(var(--cr, 0deg)) translate(3px, -1px); }
    92% { opacity: 0.95; filter: brightness(0) invert(1) drop-shadow(0 0 12px rgba(196,0,18,0.9)); }
  }
  body[data-motion="still"] .sigil-orbit { animation: none !important; }
  body[data-motion="still"] .orbit-crow img { animation: none !important; }
  body[data-motion="breathing"] .orbit-crow img { animation: counter-rot 20s linear infinite; }
  body[data-motion="breathing"] .sigil-orbit.slow .orbit-crow img { animation-duration: 34s; animation-direction: reverse; }
  @keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
  }
  .sigil-eye {
    width: 55%;
    z-index: 2;
    filter: drop-shadow(0 0 40px rgba(196,0,18,0.6));
    animation: eye-pulse 4s ease-in-out infinite;
  }
  .sigil-crow {
    position: absolute;
    width: 55%;
    left: 22.5%; top: 22.5%;
    z-index: 3;
    filter: drop-shadow(0 0 30px rgba(196,0,18,0.7)) invert(1) brightness(1.1) contrast(1.2);
    mix-blend-mode: screen;
    opacity: 0;
    animation: crow-flicker 5s steps(1) infinite;
  }
  @keyframes crow-flicker {
    0%, 60%, 100% { opacity: 0; transform: translate(0,0); }
    62% { opacity: 0.9; transform: translate(-4px, 2px); }
    64% { opacity: 0; }
    66% { opacity: 0.7; transform: translate(3px, -1px); }
    68% { opacity: 0; }
    75% { opacity: 1; transform: translate(0,0); }
    82% { opacity: 0.6; }
    84% { opacity: 0; }
  }
  body[data-motion="still"] .sigil-crow { display: none; }
  body[data-motion="breathing"] .sigil-crow { animation-duration: 10s; }
  @keyframes eye-pulse {
    0%, 100% { transform: scale(1); filter: drop-shadow(0 0 40px rgba(196,0,18,0.5)); }
    50% { transform: scale(1.02); filter: drop-shadow(0 0 60px rgba(196,0,18,0.75)); }
  }

  .sigil-right h3 {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 300;
    font-size: clamp(36px, 4.4vw, 68px);
    line-height: 1;
    letter-spacing: -0.02em;
    margin: 0 0 24px;
  }
  .sigil-right h3 em {
    color: var(--blood-text);
    font-style: italic;
    font-weight: 500;
  }
  .sigil-right p {
    font-size: 17px;
    line-height: 1.5;
    color: var(--bone-dim);
    margin-bottom: 32px;
    max-width: 440px;
  }
  .subscribe {
    display: flex;
    gap: 0;
    border: 1px solid rgba(242,239,233,0.2);
    max-width: 480px;
  }
  .subscribe input {
    flex: 1;
    background: transparent;
    border: 0;
    padding: 20px 22px;
    color: var(--bone);
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: 0.15em;
    outline: none;
  }
  .subscribe input::placeholder { color: rgba(242,239,233,0.3); text-transform: uppercase; letter-spacing: 0.25em; }
  .subscribe button {
    background: var(--blood);
    border: 0;
    padding: 20px 28px;
    color: var(--bone);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 200ms;
  }
  .subscribe button:hover { background: var(--blood-deep); }

  /* ------------------------------------------------------------------
     Footer
     ------------------------------------------------------------------ */
  .foot {
    position: relative;
    padding: 80px 48px 40px;
    border-top: 1px solid rgba(242,239,233,0.08);
    max-width: 1440px;
    margin: 80px auto 0;
  }
  .foot-mark {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 60px;
    filter: drop-shadow(0 0 60px rgba(196,0,18,0.4));
    user-select: none;
  }
  .foot-mark img {
    width: 100%; height: auto; display: block;
    opacity: 0.55;
  }
  .foot-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--bone-dim);
  }
  .foot-col .foot-head {
    color: var(--blood-text);
    margin: 0 0 16px;
    letter-spacing: 0.3em;
    font-weight: 400;
    /* POLISH v1: this was an h5 and inherited the UA default 0.83em, which
       rendered at 9.13px. Stated explicitly so the div matches exactly. */
    font-size: 0.83em;
  }
  .foot-col a { display: block; padding: 6px 0; transition: color 200ms; }
  .foot-col a:hover { color: var(--bone); }
  .foot-bottom {
    margin-top: 64px;
    padding-top: 24px;
    border-top: 1px solid rgba(242,239,233,0.08);
    display: flex;
    justify-content: space-between;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    color: rgba(242,239,233,0.3);
    text-transform: uppercase;
  }

  /* ------------------------------------------------------------------
     Motion modes (Tweaks)
     ------------------------------------------------------------------ */
  body[data-motion="still"] .glitch-r,
  body[data-motion="still"] .glitch-b,
  body[data-motion="still"] .hero-smoke,
  body[data-motion="still"] .sigil-ring,
  body[data-motion="still"] .sigil-eye,
  body[data-motion="still"] .featured-heart,
  body[data-motion="still"] .chrome-mark.breathe::after,
  body[data-motion="still"] .track-meta .dot {
    animation: none !important;
  }
  body[data-motion="still"] .glitch-r,
  body[data-motion="still"] .glitch-b { opacity: 0.3; }

  body[data-motion="breathing"] .glitch-r,
  body[data-motion="breathing"] .glitch-b {
    animation: none;
    opacity: 0.25;
  }
  /* glitching is the default — already animated above */

  /* ------------------------------------------------------------------
     Tweaks panel
     ------------------------------------------------------------------ */
  .tweaks-panel {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 200;
    background: rgba(8,8,8,0.95);
    border: 1px solid rgba(196,0,18,0.4);
    padding: 20px;
    min-width: 280px;
    font-family: 'JetBrains Mono', monospace;
    color: var(--bone);
    backdrop-filter: blur(8px);
    display: none;
  }
  .tweaks-panel.open { display: block; }
  .tweaks-panel .tweaks-head {
    margin: 0 0 16px;
    /* POLISH v1: this was an h6 and inherited the UA default bold. */
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--blood-text);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .tweaks-panel .tweaks-head .x { cursor: pointer; color: var(--bone-dim); }
  .tweaks-panel label {
    display: block;
    font-size: 10px;
    letter-spacing: 0.25em;
    color: var(--bone-dim);
    text-transform: uppercase;
    margin: 14px 0 8px;
  }
  .motion-opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
  .motion-opts button {
    background: transparent;
    border: 1px solid rgba(242,239,233,0.15);
    color: var(--bone-dim);
    padding: 10px 0;
    font-family: inherit;
    font-size: 10px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .motion-opts button.active {
    border-color: var(--blood);
    color: var(--blood-text);
    background: rgba(196,0,18,0.08);
  }
  .slider-row input[type="range"] {
    width: 100%;
    accent-color: var(--blood);
  }
  .slider-row .val {
    font-size: 10px;
    color: var(--blood-text);
    margin-top: 4px;
  }

  /* Nav smooth scroll + scroll-margin for fixed chrome */
  section[id], div[id] { scroll-margin-top: 80px; }

  /* Occult symbol layers removed */

  /* Hero orrery — orbiting crows around the wordmark */
  .hero-orrery {
    position: relative;
    display: inline-block;
    padding: 72px 0;
  }
  .hero-crow {
    position: absolute;
    object-fit: contain;
    top: 50%; left: 50%;
    pointer-events: none;
    opacity: 0; /* Task 1: stays 0 until JS injects src post-load, then fades via .crow-in */
    transition: opacity 1.5s ease-out;
  }
  .hero-crow.crow-in { opacity: 0.65; } /* second beat of the intro, ~1.5s fade */
  .hero-crow-a { width: 45px; height: 45px; margin: -22px 0 0 -22px; animation: heroOrbitCW 10s linear infinite; }
  .hero-crow-b { width: 38px; height: 38px; margin: -19px 0 0 -19px; animation: heroOrbitCCW 15s linear infinite; }
  .hero-crow-c { width: 42px; height: 42px; margin: -21px 0 0 -21px; animation: heroOrbitCW 23s linear infinite -7.6s; }
  @keyframes heroOrbitCW {
    0%   { transform: rotate(0deg)   translateX(220px) rotate(0deg)    scale(0.9); }
    50%  { transform: rotate(180deg) translateX(220px) rotate(-180deg) scale(1.1); }
    100% { transform: rotate(360deg) translateX(220px) rotate(-360deg) scale(0.9); }
  }
  @keyframes heroOrbitCCW {
    0%   { transform: rotate(0deg)    translateX(220px) rotate(0deg)   scale(1.0); }
    50%  { transform: rotate(-180deg) translateX(220px) rotate(180deg) scale(1.1); }
    100% { transform: rotate(-360deg) translateX(220px) rotate(360deg) scale(0.9); }
  }
  body[data-motion="still"] .hero-crow { animation: none !important; opacity: 0; }
  .crow-scatter {
    position: absolute;
    pointer-events: none;
    opacity: 0.22;
    filter: brightness(0) drop-shadow(0 0 20px rgba(196,0,18,0.4));
    z-index: 3;
  }
  .crow-1 { top: 120vh; right: 3vw; width: 90px; transform: scaleX(-1) rotate(-8deg); }
  .crow-2 { top: 260vh; left: 2vw; width: 70px; transform: rotate(5deg); }
  .crow-3 { top: 420vh; right: 4vw; width: 110px; transform: scaleX(-1) rotate(3deg); }
  .crow-4 { top: 560vh; left: 3vw; width: 80px; }
  body[data-motion="glitching"] .crow-scatter { animation: crow-breath 6s ease-in-out infinite; }
  @keyframes crow-breath {
    0%, 100% { opacity: 0.22; filter: brightness(0) drop-shadow(0 0 15px rgba(196,0,18,0.3)); }
    50% { opacity: 0.38; filter: brightness(0) drop-shadow(0 0 30px rgba(196,0,18,0.7)); }
  }
  @media (max-width: 960px) { .crow-scatter { display: none; } }

  /* Merch discount callout */
  .merch-code {
    margin-top: 48px;
    border: 1px solid rgba(196,0,18,0.35);
    background: rgba(196,0,18,0.05);
    padding: 32px 40px;
  }
  .merch-code-inner {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
  }
  .merch-code-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--bone-dim);
  }
  .merch-code-label strong { color: var(--bone); }
  .merch-code-badge {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    letter-spacing: 0.35em;
    font-weight: 700;
    color: var(--blood-text);
    border: 1px solid var(--blood);
    padding: 8px 20px;
    animation: badge-pulse 3s ease-in-out infinite;
  }
  @keyframes badge-pulse {
    0%, 100% { box-shadow: 0 0 0 rgba(196,0,18,0); }
    50% { box-shadow: 0 0 20px rgba(196,0,18,0.4); }
  }
  .cursor-glow {
    position: fixed;
    width: 480px; height: 480px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(196,0,18,0.18) 0%, rgba(196,0,18,0.06) 30%, transparent 60%);
    pointer-events: none;
    z-index: 105;
    mix-blend-mode: screen;
    transform: translate(-50%, -50%);
    transition: opacity 300ms;
    opacity: 0;
  }
  body[data-motion="still"] .cursor-glow { display: none; }

  /* Trance eye divider */
  .trance {
    position: relative;
    padding: 80px 48px;
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .trance-orrery {
    position: relative;
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 72px;
  }
  .trance-eye {
    width: 140px;
    height: 140px;
    animation: trance-spin 22s linear infinite;
    filter: drop-shadow(0 0 30px rgba(196,0,18,0.6));
    position: relative;
    z-index: 1;
  }
  .trance-eye-ccw {
    animation-direction: reverse;
  }
  @keyframes trance-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
  }
  body[data-motion="still"] .trance-eye { animation: none; }
  /* Orbiting crows */
  .trance-crow {
    position: absolute;
    width: 44px; height: 44px;
    object-fit: contain;
    opacity: 0.7;
    top: 50%; left: 50%;
    margin-top: -22px; margin-left: -22px;
    pointer-events: none;
  }
  .trance-crow-a { animation: tranceOrbitCW 8s linear infinite; }
  .trance-crow-b { animation: tranceOrbitCCW 13s linear infinite; }
  .trance-crow-c { animation: tranceOrbitCW 19s linear infinite; animation-delay: -6.3s; }
  @keyframes tranceOrbitCW {
    0%   { transform: rotate(0deg)   translateX(145px) rotate(0deg)    scale(0.9); }
    50%  { transform: rotate(180deg) translateX(145px) rotate(-180deg) scale(1.1); }
    100% { transform: rotate(360deg) translateX(145px) rotate(-360deg) scale(0.9); }
  }
  @keyframes tranceOrbitCCW {
    0%   { transform: rotate(0deg)    translateX(145px) rotate(0deg)   scale(1.0); }
    50%  { transform: rotate(-180deg) translateX(145px) rotate(180deg) scale(1.1); }
    100% { transform: rotate(-360deg) translateX(145px) rotate(360deg) scale(0.9); }
  }
  body[data-motion="still"] .trance-crow { animation: none !important; opacity: 0; }

  /* ------------------------------------------------------------------
     Enter orrery — orbiting crows around the sigil eye
     ------------------------------------------------------------------ */
  .enter-orrery {
    position: relative;
    width: 100%; height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
  }
  .sigil-left { overflow: visible; }
  .enter-crow {
    position: absolute;
    object-fit: contain;
    top: 50%; left: 50%;
    pointer-events: none;
    opacity: 0.65;
  }
  .enter-crow-a { width: 44px; height: 44px; margin: -22px 0 0 -22px; animation: enterOrbitCW 9s linear infinite; }
  .enter-crow-b { width: 36px; height: 36px; margin: -18px 0 0 -18px; animation: enterOrbitCCW 14s linear infinite; }
  .enter-crow-c { width: 40px; height: 40px; margin: -20px 0 0 -20px; animation: enterOrbitCW 21s linear infinite; animation-delay: -7s; }
  @keyframes enterOrbitCW {
    0%   { transform: rotate(0deg)   translateX(260px) rotate(0deg)    scale(0.9); }
    50%  { transform: rotate(180deg) translateX(260px) rotate(-180deg) scale(1.1); }
    100% { transform: rotate(360deg) translateX(260px) rotate(-360deg) scale(0.9); }
  }
  @keyframes enterOrbitCCW {
    0%   { transform: rotate(0deg)    translateX(260px) rotate(0deg)   scale(1.0); }
    50%  { transform: rotate(-180deg) translateX(260px) rotate(180deg) scale(1.1); }
    100% { transform: rotate(-360deg) translateX(260px) rotate(360deg) scale(0.9); }
  }
  body[data-motion="still"] .enter-crow { animation: none !important; opacity: 0; }

  /* ------------------------------------------------------------------
     Responsive (v2 adds reel column reset)
     ------------------------------------------------------------------ */
  .reel-grid-mobile {}
  @media (max-width: 960px) {
    .reel-grid { grid-template-columns: 1fr; }
    .block-head, .featured, .teach, .sigil { grid-template-columns: 1fr; gap: 32px; }
    .wounds { grid-template-columns: repeat(2, 1fr); }
    .merch { grid-template-columns: repeat(2, 1fr); }
    .reel-grid { grid-template-columns: 1fr; }
    .foot-row { grid-template-columns: repeat(2, 1fr); }
    section.block, .mission, .reel, .sigil { padding-left: 24px; padding-right: 24px; }
    .hero-meta, .hero-meta-r { display: none; }
    .foot { padding-left: 24px; padding-right: 24px; }
  }

  /* ------------------------------------------------------------------
     Contact
     ------------------------------------------------------------------ */
  .contact-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px;
    max-width: 780px;
  }
  .contact-field {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .contact-field.full { grid-column: 1 / -1; }
  .contact-field label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--bone-dim);
  }
  .contact-field label .red { color: var(--blood-text); }
  .contact-field input,
  .contact-field textarea {
    background: rgba(242,239,233,0.04);
    border: 1px solid rgba(242,239,233,0.12);
    padding: 18px 20px;
    color: var(--bone);
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: 0.1em;
    outline: none;
    transition: border-color 200ms;
    resize: none;
    -webkit-appearance: none;
  }
  .contact-field input::placeholder,
  .contact-field textarea::placeholder {
    color: rgba(242,239,233,0.2);
    letter-spacing: 0.2em;
  }
  .contact-field input:focus,
  .contact-field textarea:focus {
    border-color: var(--blood);
    background: rgba(196,0,18,0.04);
  }
  .contact-field textarea { height: 160px; }
  .contact-submit { margin-top: 18px; }
  @media (max-width: 960px) {
    .contact-form { grid-template-columns: 1fr; }
    .contact-field.full { grid-column: 1; }
  }

  /* ------------------------------------------------------------------
     Music / video embed reel
     ------------------------------------------------------------------ */
  .reel-music-head {
    padding: 0 48px 56px;
    max-width: 1440px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 48px;
    align-items: end;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(242,239,233,0.08);
    margin-bottom: 64px;
  }
  .reel-embed-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px;
    padding: 0 48px;
    max-width: 1440px;
    margin: 0 auto;
  }
  .reel-embed-card {
    display: flex;
    flex-direction: column;
    background: rgba(242,239,233,0.02);
    border: 1px solid rgba(242,239,233,0.07);
    overflow: hidden;
    transition: border-color 220ms;
  }
  .reel-embed-card:hover { border-color: rgba(196,0,18,0.4); }
  .reel-embed-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--bone);
    padding: 16px 18px 12px;
    border-bottom: 1px solid rgba(242,239,233,0.06);
  }
  .reel-embed-wrap {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    background: #000;
  }
  .reel-embed-wrap iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: 0;
  }
  .reel-embed-links {
    display: flex;
    gap: 0;
    border-top: 1px solid rgba(242,239,233,0.06);
  }
  .reel-embed-links a {
    flex: 1;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--bone-dim);
    padding: 12px 10px;
    text-align: center;
    text-decoration: none;
    transition: color 200ms, background 200ms;
    border-right: 1px solid rgba(242,239,233,0.06);
  }
  .reel-embed-links a:last-child { border-right: 0; }
  .reel-embed-links a:hover { color: var(--bone); background: rgba(196,0,18,0.08); }
  .reel-cta {
    padding: 52px 48px 0;
    max-width: 1440px;
    margin: 0 auto;
    text-align: center;
  }
  @media (max-width: 960px) {
    .reel-embed-grid { grid-template-columns: repeat(2, 1fr); padding: 0 24px; }
    .reel-music-head { padding: 0 24px 40px; }
    .reel-cta { padding: 40px 24px 0; }
  }
  @media (max-width: 540px) {
    .reel-embed-grid { grid-template-columns: 1fr; }
  }

  /* ------------------------------------------------------------------
     About
     ------------------------------------------------------------------ */
  .about {
    position: relative;
    padding: 140px 48px;
    max-width: 1440px;
    margin: 0 auto;
  }
  .about-head {
    grid-template-columns: 1fr;
  }
  .about-body {
    max-width: 820px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 300;
    font-size: clamp(18px, 1.85vw, 23px);
    line-height: 1.75;
    letter-spacing: 0.01em;
    color: var(--bone);
  }
  .about-body p {
    margin: 0 0 1.5em;
  }
  .about-body p:last-child { margin-bottom: 0; }
  .about-em {
    color: var(--blood-text);
    font-style: italic;
  }
  @media (max-width: 960px) {
    .about { padding: 100px 24px; }
  }

  /* ------------------------------------------------------------------
     Blog preview (main page)
     ------------------------------------------------------------------ */
  #blog .block-title {
    font-size: clamp(42px, 6vw, 96px) !important;
  }
  .blog-em { color: var(--blood-text); font-style: italic; }
  .blog-preview { max-width: 780px; }
  .blog-link-row {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: rgba(242,239,233,0.06);
    border: 1px solid rgba(242,239,233,0.06);
    margin-bottom: 48px;
  }
  .blog-link-row a {
    display: grid;
    grid-template-columns: 80px 1fr 24px;
    align-items: center;
    gap: 24px;
    padding: 22px 28px;
    background: var(--black);
    text-decoration: none;
    transition: background 200ms;
  }
  .blog-link-row a:hover { background: rgba(196,0,18,0.06); }
  .blog-link-date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--blood-text);
  }
  .blog-link-title {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: var(--bone);
    line-height: 1.4;
  }
  .blog-link-arrow {
    font-size: 14px;
    color: var(--bone-dim);
    transition: color 200ms, transform 200ms;
    display: inline-block;
  }
  .blog-link-row a:hover .blog-link-arrow { color: var(--blood-text); transform: translateX(4px); }
  @media (max-width: 760px) {
    .blog-link-row a { grid-template-columns: 1fr 20px; }
    .blog-link-date { display: none; }
  }

  /* ------------------------------------------------------------------
     Teach cards (3-col placeholder grid)
     ------------------------------------------------------------------ */
  .teach-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(242,239,233,0.06);
    border: 1px solid rgba(242,239,233,0.06);
  }
  @media (max-width: 960px) {
    .teach-cards { grid-template-columns: 1fr; }
  }

  /* ------------------------------------------------------------------
     Speaker toggle
     ------------------------------------------------------------------ */

  /* ------------------------------------------------------------------
     Fixed crow glitch overlays
     ------------------------------------------------------------------ */
  .crow-fixed {
    position: fixed;
    pointer-events: none;
    z-index: 1;
  }
  .crow-fixed-a {
    bottom: 5vh;
    left: 2vw;
    width: 180px;
    animation: crowGlitch 6s steps(1) infinite;
    animation-delay: 0s;
  }
  .crow-fixed-b {
    top: 8vh;
    right: 2vw;
    width: 120px;
    animation: crowGlitch 9s steps(1) infinite;
    animation-delay: 3s;
  }
  .crow-fixed-c {
    top: 50vh;
    right: 3vw;
    width: 90px;
    animation: crowGlitch 11s steps(1) infinite;
    animation-delay: 7s;
  }
  @keyframes crowGlitch {
    0%, 100% { opacity: 0; transform: scale(1) translateX(0); }
    10% { opacity: 0.12; transform: scale(0.95) translateX(2px); }
    12% { opacity: 0; }
    14% { opacity: 0.07; transform: scale(1) translateX(0); }
    15% { opacity: 0.15; }
    17% { opacity: 0; }
  }
  @media (max-width: 960px) { .crow-fixed { display: none; } }

  /* ------------------------------------------------------------------
     Cipher glitch overlays
     ------------------------------------------------------------------ */
  .cipher-glitch {
    position: fixed;
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(0.55rem, 0.8vw, 0.75rem);
    color: var(--blood-text);
    opacity: 0;
    letter-spacing: 0.15em;
    pointer-events: none;
    z-index: 9999;
    user-select: none;
  }
  .cipher-a { top: 18%; left: 6%;  animation: cipherFlash 22s steps(1) infinite; animation-delay: 0s; }
  .cipher-b { top: 55%; right: 5%; animation: cipherFlash 28s steps(1) infinite; animation-delay: 4.3s; }
  .cipher-c { top: 78%; left: 12%; animation: cipherFlash 19s steps(1) infinite; animation-delay: 11.7s; }
  .cipher-d { top: 32%; right: 8%; animation: cipherFlash 25s steps(1) infinite; animation-delay: 7.1s; }
  @keyframes cipherFlash {
    0%,   6.4%, 100% { opacity: 0; }
    6.5%             { opacity: 0.65; }
    7%               { opacity: 0; }
    41.9%            { opacity: 0; }
    42%              { opacity: 0.55; }
    42.6%            { opacity: 0; }
  }
  body[data-motion="still"] .cipher-glitch { animation: none !important; opacity: 0; }
  @media (max-width: 960px) { .cipher-glitch { display: none; } }

  /* EXPERIENCE WIDGET */
  #exp-panel {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 99999;
    background: rgba(0,0,0,0.92);
    border-left: 1px solid #3a0000;
    border-bottom: 1px solid #3a0000;
    padding: 10px 14px 14px;
    font-family: var(--mono, 'JetBrains Mono', monospace);
    min-width: 220px;
    pointer-events: all;
  }
  #exp-title {
    font-size: 11px;
    letter-spacing: 0.18em;
    color: #b0a090;
    margin-bottom: 8px;
    text-transform: uppercase;
    cursor: pointer;
    user-select: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  #exp-collapse-indicator {
    font-size: 9px;
    color: var(--blood, #c40012);
    margin-left: 8px;
  }
  .exp-red { color: var(--blood, #c40012); }
  #exp-warning {
    font-size: 10px;
    color: #6a5a5a;
    margin-bottom: 12px;
    line-height: 1.5;
    font-style: italic;
  }
  .exp-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
  }
  .exp-label {
    font-size: 10px;
    letter-spacing: 0.14em;
    color: #b0a090;
    text-transform: uppercase;
  }
  .exp-btn {
    font-family: var(--mono, 'JetBrains Mono', monospace);
    font-size: 10px;
    letter-spacing: 0.12em;
    background: transparent;
    border: 1px solid #3a0000;
    color: #b0b0b0;
    padding: 3px 10px;
    cursor: pointer;
    text-transform: uppercase;
    transition: color 0.2s, border-color 0.2s;
  }
  .exp-btn.active {
    color: var(--blood, #c40012);
    border-color: var(--blood, #c40012);
  }
  /* DOUBLE VISION GHOST */
  #dv-ghost {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 99990;
    opacity: 0;
    background: transparent;
    transition: opacity 0.4s;
  }
  /* VERTIGO — scale + drift combined in group keyframes so group elements
     get both the pulse-in and positional motion in one animation */
  @keyframes vertigoA { 0%,100% { transform: scale(1)     translate(0,0);       } 50% { transform: scale(1.022) translate(0.8px,-0.5px);  } }
  @keyframes vertigoB { 0%,100% { transform: scale(1)     translate(0,0);       } 50% { transform: scale(1.015) translate(-0.6px,0.4px);  } }
  @keyframes vertigoC { 0%,100% { transform: scale(1)     translate(0,0);       } 50% { transform: scale(1.009) translate(0.5px,0.6px);   } }
  @keyframes vertigoD { 0%,100% { transform: scale(1)     translate(0,0);       } 50% { transform: scale(1.031) translate(-1px,-0.4px);   } }
  /* Supplemental vocabulary for non-group elements */
  @keyframes vertigoE { 0%,100% { transform: translate(0,0);        } 50% { transform: translate(1.2px,-0.7px);         } }
  @keyframes vertigoF { 0%,100% { transform: scale(1) rotate(0deg); } 50% { transform: scale(1.01) rotate(0.22deg);     } }
  @keyframes vertigoG { 0%,100% { transform: translateX(0);         } 40% { transform: translateX(1px); } 80% { transform: translateX(-0.9px); } }

  /* Non-group elements — elements that don't carry group-a/b/c/d */
  body.vertigo-on .block-index .num { animation: vertigoF  9.6s ease-in-out infinite; }
  /* hero-wordmark excluded: position:absolute + translate(-50%,-50%) conflicts */
  body.vertigo-on .hero-tagline     { animation: vertigoG 18.3s ease-in-out infinite; }
  body.vertigo-on .tag-body         { animation: vertigoE 14.1s ease-in-out infinite; }
  body.vertigo-on .vendor-strip     { animation: vertigoG 15.2s ease-in-out infinite; }
  body.vertigo-on .chrome-mark      { animation: vertigoF 10.5s ease-in-out infinite; }

  /* Group rules LAST — wins the cascade for any element with both a group class
     and an element class above, restoring the scale pulse-in on all group elements */
  body.vertigo-on .group-a { animation: vertigoA  8.5s ease-in-out infinite; }
  body.vertigo-on .group-b { animation: vertigoB 11.3s ease-in-out infinite; }
  body.vertigo-on .group-c { animation: vertigoC 15.7s ease-in-out infinite; }
  body.vertigo-on .group-d { animation: vertigoD  6.8s ease-in-out infinite; }

  /* Experience widget: collapsed state flushes with the header.
     Subtle red flash every 6s draws attention without being obnoxious. */
  @keyframes exp-flash-red {
    0%, 80%, 100% { border-color: #3a0000; box-shadow: none; }
    88%  { border-color: rgba(196,0,18,0.85); box-shadow: 0 0 16px rgba(196,0,18,0.45), inset 0 0 8px rgba(196,0,18,0.12); }
    95%  { border-color: rgba(196,0,18,0.30); box-shadow: 0 0 5px rgba(196,0,18,0.15); }
  }
  #exp-panel.collapsed {
    padding: 0;
    border-bottom: none;
    animation: exp-flash-red 6s ease-in-out infinite;
  }
  #exp-panel.collapsed #exp-title {
    padding: 12px 14px;
    margin-bottom: 0;
  }
  /* Mobile: start collapsed, keep compact so it never covers page links */
  @media (max-width: 768px) {
    #exp-panel { min-width: 0; }
    #exp-panel.collapsed #exp-title { padding: 8px 10px; font-size: 9px; letter-spacing: 0.12em; }
  }

  /* ------------------------------------------------------------------
     VERTIGO LAYER — two spiral overlays that surface when Vertigo is ON.
     z-index 118: above vignette (115) + circuit (116), below grain (120).
     mix-blend-mode: overlay — white spirals lighten the void,
     black spirals collapse into it. Net effect: the site "breathes" circles.
     ------------------------------------------------------------------ */
  #vertigo-layer {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 118;
    opacity: 0;
    transition: opacity 1.4s ease;
  }
  #vertigo-layer img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: screen;  /* black areas become transparent — only bright rings visible */
    display: block;
  }
  /* vl-1 starts 10% larger and slowly contracts then swells back — very long cycle */
  #vertigo-layer .vl-1 { opacity: 0.006; transform: scale(1.12); }
  /* vl-2 starts at normal size, opposing phase */
  #vertigo-layer .vl-2 { opacity: 0.004; transform: scale(1.00); }

  @keyframes vl-swell-a { 0%,100% { transform: scale(1.12); } 50% { transform: scale(1.00); } }
  @keyframes vl-swell-b { 0%,100% { transform: scale(1.00); } 50% { transform: scale(1.12); } }

  body.vertigo-on #vertigo-layer {
    opacity: 1;
  }
  /* 38s per full cycle — slow, atmospheric, never quite in phase */
  body.vertigo-on .vl-1 { animation: vl-swell-a 38s ease-in-out infinite; transform-origin: center center; }
  body.vertigo-on .vl-2 { animation: vl-swell-b 38s ease-in-out infinite; transform-origin: 52% 48%; }

  @media (prefers-reduced-motion: reduce) {
    body.vertigo-on .vl-1, body.vertigo-on .vl-2 { animation: none; }
  }

  /* Circuit trace canvas - desktop only, pointer:coarse excluded via JS */
  /* z-index 116: above vignette (115) so edge traces aren't darkened, below grain (120) */
  #circuit-canvas {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 116;
  }

/* EARGASM WIDGET */
#eargasm-widget {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  font-family: 'JetBrains Mono', monospace;
  user-select: none;
}

#eargasm-trigger {
  position: relative;
  width: 64px;
  height: 64px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

#eargasm-img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 0 6px rgba(139,0,0,0));
  transition: filter 0.3s ease;
  animation: eargasmGlow 4s ease-in-out infinite;
}

@keyframes eargasmGlow {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(139,0,0,0.2)); }
  50% { filter: drop-shadow(0 0 12px rgba(139,0,0,0.7)); }
}

#eargasm-flash {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: var(--bone, #f2efe9);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
  text-shadow: 0 0 8px rgba(139,0,0,0.9);
}

#eargasm-panel {
  display: none;
  background: rgba(10,0,0,0.96);
  border: 1px solid rgba(139,0,0,0.4);
  border-top: none;
  padding: 16px;
  width: 220px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.8);
}

.eargasm-collapsed #eargasm-panel {
  display: none;
}

.eargasm-open #eargasm-panel {
  display: block;
}

.eargasm-headline {
  color: var(--bone, #f2efe9);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin: 0 0 8px 0;
}

.eargasm-body {
  color: var(--bone-dim, #8a8680);
  font-size: 10px;
  letter-spacing: 0.08em;
  line-height: 1.5;
  margin: 0 0 14px 0;
}

.eargasm-btn {
  display: block;
  background: var(--blood, #8b0000);
  color: var(--bone, #f2efe9);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  padding: 10px 8px;
  margin-bottom: 10px;
  transition: background 0.2s ease;
}

.eargasm-btn:hover {
  background: #a00000;
}

.eargasm-sub {
  color: var(--bone-dim, #8a8680);
  font-size: 9px;
  letter-spacing: 0.1em;
  text-align: center;
  margin: 0;
  opacity: 0.6;
}

/* FALL LINE SYSTEM */
.fall-line-system {
  position: absolute;
  top: 24px;
  left: 0;
  width: 100%;
  height: 0;
  pointer-events: none;
}

.fall-line {
  width: 1px;
  background: rgba(139, 0, 0, 0.25);
  position: absolute;
  top: 0;
  transform-origin: top center;
  overflow: hidden;
}

.fall-line::after {
  content: '';
  display: block;
  width: 3px;
  height: 18%;
  margin-left: -1px;
  background: radial-gradient(
    ellipse at center,
    #ffffff 0%,
    #ff3300 25%,
    #cc0000 55%,
    transparent 100%
  );
  box-shadow: 0 0 6px 2px rgba(204, 0, 0, 0.8),
              0 0 12px 4px rgba(139, 0, 0, 0.4);
  animation: fallPulse var(--fall-duration, 1.8s) ease-in-out infinite;
  animation-delay: var(--fall-delay, 0s);
  border-radius: 50%;
}

@keyframes fallPulse {
  0% { transform: translateY(-100%); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(250%); opacity: 0; }
}

/* Mobile thumbnail fallback for music embeds */
.mobile-thumb { display: none; }
@media (max-width: 960px) {
  .desktop-embed { display: none; }
  .mobile-thumb { display: block; }
}
/* Turnstile: hidden at rest, slides in on focus */
#turnstile-widget {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.4s ease;
}
#turnstile-widget.visible {
  max-height: 80px;
  opacity: 1;
}

/* === REFINE v1 START ===
   Editorial typography + hairline + hover layer. Black / blood / bone only.
   Fully revertible: delete this block. (REFINE v2: serif removed.)
   Locked elements untouched: Experience widget, circuit return, wordmark intro. */

/* A. Serif accent: REMOVED in REFINE v2. The Mission quote, catalog wound
      descriptors, catalog Roman numerals, and the Enter "wound." now use the
      site's existing fonts (no third typeface). */

/* B. Reading measure - About paragraphs + Mission quote (sizes unchanged). */
.about-body { max-width: 68ch; line-height: 1.7; }
.manifesto  { max-width: 68ch; line-height: 1.7; }

/* C. Label microtype - unify section label rows to one 0.2em tracking. */
.block-index,
.block-index .red-label { letter-spacing: 0.2em; }

/* D. Catalog Roman numerals: REMOVED in REFINE v2. The size/baseline bump only
      existed to balance the serif; with the serif gone the numerals revert to
      their original pre-REFINE size and alignment so nothing shifts. */

/* E. Mission as a formal blockquote - 1px blood left rule (0.35), text not moved
      (padding offset by negative margin), attribution in letter-spaced small caps. */
.manifesto {
  border-left: 1px solid rgba(196,0,18,0.35);
  padding-left: 32px;
  margin-left: -32px;
}
.mission-sign {
  font-variant: small-caps;
  text-transform: lowercase;
  letter-spacing: 0.18em;
}

/* F. Hairline rules - normalize content-section dividers to 1px bone @ 0.08. */
.mission-sign     { border-top-color: rgba(242,239,233,0.08); }
.reel-embed-links { border-top-color: rgba(242,239,233,0.08); }
.reel-embed-title { border-bottom-color: rgba(242,239,233,0.08); }

/* G. In-content text-link hover - 1px blood underline wiping left→right (0.25s).
      Replaces the prior background-fill hovers. Not on nav links or buttons. */
.wound-tag,
.listen-cell,
.reel-embed-links a,
.blog-link-row a,
.foot-col a { position: relative; }
.wound-tag::after,
.listen-cell::after,
.reel-embed-links a::after,
.blog-link-row a::after,
.foot-col a::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 1px;
  background: var(--blood);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.25s ease;
  pointer-events: none;
}
.wound-tag:hover::after,
.listen-cell:hover::after,
.reel-embed-links a:hover::after,
.blog-link-row a:hover::after,
.foot-col a:hover::after { transform: scaleX(1); }
/* Replace prior background-fill hovers so only the underline reads */
.listen-cell:hover       { background: var(--black); color: var(--bone); }
.reel-embed-links a:hover { background: transparent; color: var(--bone); }
.blog-link-row a:hover    { background: var(--black); }
@media (prefers-reduced-motion: reduce) {
  .wound-tag::after,
  .listen-cell::after,
  .reel-embed-links a::after,
  .blog-link-row a::after,
  .foot-col a::after { transition: none; }
}

/* H. Secondary text contrast - lift the gray ~15% lighter (accessibility:
      double vision). Overrides the variable here, original definition untouched. */
:root { --bone-dim: #9f9a93; }

/* === REFINE v1 END === */

/* === HEADER v1 START - mobile fixes, July 19 2026 === */
/* Eargasm widget: on mobile the fixed top-left jug sat on top of the AECYST
   mark in the header. Drop it below the (now taller) mobile header, over the
   dark hero. Desktop unchanged. Panel still opens from the widget. */
@media (max-width: 768px) {
  #eargasm-widget { top: 96px; left: 8px; }
}
/* === HEADER v1 END === */