/* ============ TOKENS — monochrome dark red, no orange/amber ============ */
  :root{
    --void:         #0a0808;   /* base background */
    --panel:        #170c0b;   /* rusted-panel bg behind the poster */
    --panel-2:      #1f1210;   /* card surfaces */
    --dried-blood:  #3a0f0d;   /* deep secondary red */
    --blood:        #6e1512;   /* mid red, structural accent */
    --arterial:     #9c1c17;   /* brightest red — CTAs, stamps, live data */
    --bone:         #d9d0c4;   /* primary text */
    --bone-dim:     #8f8378;   /* secondary text */
    --line:         #3a211d;   /* hairline borders */
    --rivet:        #4a3530;

    --f-display: 'Anton', sans-serif;
    --f-mono:    'Space Mono', monospace;
    --f-body:    'Work Sans', sans-serif;

    --container: 1180px;
  }

  *,*::before,*::after{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *,*::before,*::after{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
  }

  body{
    margin:0;
    background:var(--void);
    color:var(--bone);
    font-family:var(--f-body);
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }
  ul{ margin:0; padding:0; list-style:none; }
  h1,h2,h3{ font-family:var(--f-display); margin:0; font-weight:400; }
  :focus-visible{ outline:2px solid var(--arterial); outline-offset:3px; }
  .container{ max-width:var(--container); margin:0 auto; padding:0 24px; }

  body::before{
    content:""; position:fixed; inset:0; pointer-events:none; z-index:999; opacity:0.05;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  }

  .eyebrow{
    font-family:var(--f-mono); font-size:12px; letter-spacing:0.18em;
    text-transform:uppercase; color:var(--arterial);
  }

  .stripe{
    height:9px;
    background:repeating-linear-gradient(135deg, var(--arterial) 0 16px, var(--void) 16px 32px);
  }

  /* ============ NAV ============ */
  .nav{ position:sticky; top:0; z-index:100; background:rgba(10,8,8,0.94); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
  .nav-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 24px; max-width:var(--container); margin:0 auto; }
  .brand{ display:flex; align-items:center; gap:10px; }
  .brand svg{ width:28px; height:28px; }
  .brand span{ font-family:var(--f-display); font-size:18px; letter-spacing:0.03em; text-transform:uppercase; }
  .nav-links{ display:flex; gap:26px; align-items:center; }
  .nav-links a{ font-family:var(--f-mono); font-size:13px; text-transform:uppercase; letter-spacing:0.05em; color:var(--bone-dim); transition:color .15s; }
  .nav-links a:hover{ color:var(--arterial); }
  .btn{
    display:inline-flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:13px; font-weight:700;
    text-transform:uppercase; letter-spacing:0.05em; padding:11px 20px; border:1px solid transparent; cursor:pointer;
    transition:transform .12s, background .15s, border-color .15s; clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
  }
  .btn:active{ transform:translateY(1px); }
  .btn-primary{ background:var(--arterial); color:var(--bone); }
  .btn-primary:hover{ background:#b52520; }
  .btn-outline{ background:transparent; color:var(--bone); border-color:var(--line); }
  .btn-outline:hover{ border-color:var(--arterial); color:var(--arterial); }
  .menu-toggle{ display:none; background:none; border:1px solid var(--line); color:var(--bone); padding:8px 10px; cursor:pointer; }
  .nav-links.open{ display:flex; position:absolute; top:100%; left:0; right:0; flex-direction:column; background:var(--panel-2); border-bottom:1px solid var(--line); padding:16px 24px; gap:16px; }

  /* ============ HERO — torn poster bolted to a rusted panel ============ */
  .hero{
    position:relative;
    padding:64px 20px 90px;
    background:
      radial-gradient(ellipse 700px 420px at 50% 10%, rgba(110,21,18,0.25), transparent 65%),
      repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0 2px, transparent 2px 4px),
      linear-gradient(180deg, rgba(10,8,8,0.55) 0%, rgba(10,8,8,0.85) 55%, var(--panel) 100%),
      url("og-image.jpg");
    background-size: cover, cover, cover, cover;
    background-position: center, center, center, center 30%;
    background-repeat: no-repeat;
    border-bottom:1px solid var(--line);
    overflow:hidden;
  }
  .poster{
    position:relative;
    max-width:640px; margin:0 auto;
    background:linear-gradient(160deg, var(--panel-2), var(--dried-blood));
    border:1px solid var(--blood);
    padding:52px 40px 44px;
    transform:rotate(-1.1deg);
    clip-path:polygon(
      0 1%, 3% 0, 97% 0.5%, 100% 2%,
      99% 30%, 100% 55%, 98.5% 78%,
      100% 92%, 94% 96%, 88% 100%,
      70% 97.5%, 50% 100%, 30% 97%,
      12% 100%, 4% 95%, 0 88%,
      1.5% 60%, 0 35%
    );
    box-shadow:0 40px 70px -30px rgba(0,0,0,0.7);
  }
  .rivet{ position:absolute; width:10px; height:10px; border-radius:50%; background:radial-gradient(circle at 35% 30%, #6b5750, var(--rivet) 65%); box-shadow:0 1px 2px rgba(0,0,0,0.6); }
  .rivet.tl{ top:16px; left:16px; } .rivet.tr{ top:16px; right:16px; }
  .rivet.bl{ bottom:16px; left:16px; } .rivet.br{ bottom:16px; right:16px; }

  .tape{
    position:absolute; width:120px; height:34px;
    background:repeating-linear-gradient(45deg, var(--arterial) 0 10px, var(--void) 10px 20px);
    opacity:0.85;
  }
  .tape.left{ top:-14px; left:-30px; transform:rotate(-40deg); }
  .tape.right{ top:-14px; right:-30px; transform:rotate(40deg); }

  .stamp{
    position:absolute; top:26px; right:-18px;
    width:112px; height:112px; border-radius:50%;
    border:3px double var(--arterial);
    display:flex; align-items:center; justify-content:center;
    transform:rotate(14deg);
    font-family:var(--f-mono); font-weight:700; font-size:12px; letter-spacing:0.05em;
    color:var(--arterial); text-align:center; text-transform:uppercase;
    line-height:1.3;
  }

  .poster-eyebrow{ font-family:var(--f-mono); font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:var(--bone-dim); }
  .poster h1{
    font-size:clamp(38px,7vw,64px); text-transform:uppercase; line-height:0.94; margin-top:10px; color:var(--bone);
  }
  .poster h1 .hl{ color:var(--arterial); }
  .poster .prize-line{
    display:flex; align-items:baseline; gap:10px; margin-top:22px; flex-wrap:wrap;
  }
  .prize-amount{ font-family:var(--f-display); font-size:clamp(48px,9vw,80px); color:var(--arterial); line-height:1; }
  .prize-label{ font-family:var(--f-mono); font-size:13px; text-transform:uppercase; letter-spacing:0.08em; color:var(--bone-dim); }
  .poster p.desc{ margin-top:18px; color:var(--bone-dim); max-width:440px; }

  .poster-meta{ display:flex; gap:26px; margin-top:26px; flex-wrap:wrap; }
  .poster-meta div{ font-family:var(--f-mono); }
  .poster-meta div span{ display:block; font-size:10px; text-transform:uppercase; letter-spacing:0.08em; color:var(--bone-dim); margin-bottom:4px; }
  .poster-meta div strong{ font-size:14px; color:var(--bone); font-weight:400; }

  .countdown{
    margin-top:30px; padding-top:24px; border-top:1px dashed var(--line);
  }
  .countdown span.label{ font-family:var(--f-mono); font-size:11px; text-transform:uppercase; letter-spacing:0.1em; color:var(--bone-dim); }
  .countdown .clock{
    font-family:var(--f-mono); font-size:clamp(30px,6vw,44px); color:var(--bone); margin-top:6px; letter-spacing:0.02em;
  }

  .poster-actions{ display:flex; gap:12px; margin-top:30px; flex-wrap:wrap; }

  .connect-box{
    margin-top:34px; display:flex; align-items:stretch; background:var(--void);
    border:1px solid var(--line); max-width:460px;
  }
  .connect-box code{ flex:1; font-family:var(--f-mono); font-size:13px; color:var(--bone); padding:13px 14px; overflow-x:auto; white-space:nowrap; }
  .copy-btn{
    display:flex; align-items:center; font-family:var(--f-mono); font-size:11px; text-transform:uppercase; letter-spacing:0.05em; font-weight:700;
    background:var(--arterial); color:var(--bone); border:none; padding:0 16px; cursor:pointer; transition:background .15s;
  }
  .copy-btn:hover{ background:#b52520; }
  .copy-btn.copied{ background:var(--blood); }

  /* ============ SECTION SHELL ============ */
  section{ padding:80px 0; }
  .section-head{ max-width:640px; margin:0 0 40px; }
  .section-head.center{ text-align:center; margin-left:auto; margin-right:auto; }
  .section-head h2{ font-size:clamp(26px,4vw,38px); text-transform:uppercase; margin-top:8px; color:var(--bone); }
  .section-head p{ color:var(--bone-dim); margin-top:10px; }

  /* ============ TOURNAMENT DETAILS — briefing cards ============ */
  .briefing-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
  .briefing-card{ background:var(--panel-2); padding:28px 24px; }
  .briefing-card .num{ font-family:var(--f-mono); font-size:11px; color:var(--arterial); letter-spacing:0.1em; }
  .briefing-card h3{ font-size:19px; text-transform:uppercase; color:var(--bone); margin-top:10px; font-family:var(--f-body); font-weight:600; }
  .briefing-card p{ color:var(--bone-dim); font-size:14px; margin-top:8px; }
  .briefing-card ul{ margin-top:10px; }
  .briefing-card li{ font-family:var(--f-mono); font-size:12.5px; color:var(--bone); padding:4px 0; }
  .briefing-card li::before{ content:"— "; color:var(--arterial); }

  /* ============ FEATURES ============ */
  .bento{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:minmax(170px,auto); gap:1px; background:var(--line); border:1px solid var(--line); }
  .card{ background:var(--panel-2); padding:24px; display:flex; flex-direction:column; justify-content:flex-end; }
  .card h3{ font-size:19px; text-transform:uppercase; color:var(--bone); font-family:var(--f-body); font-weight:600; }
  .card p{ color:var(--bone-dim); margin-top:8px; font-size:13.5px; }
  .card .icon{ font-family:var(--f-mono); font-size:11px; color:var(--arterial); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:8px; }
  .card-redzone{
    grid-column:span 2; grid-row:span 2; background:linear-gradient(180deg, rgba(156,28,23,0.1), transparent 40%), var(--panel-2);
    border-top:6px solid var(--arterial); padding-top:34px; position:relative;
  }
  .card-redzone h3{ font-size:26px; color:var(--arterial); font-family:var(--f-display); text-transform:uppercase; }
  .card-redzone p{ font-size:14.5px; max-width:420px; }
  .redzone-list{ margin-top:14px; display:flex; flex-direction:column; gap:7px; }
  .redzone-list li{ font-family:var(--f-mono); font-size:12.5px; color:var(--bone); }
  .redzone-list li::before{ content:"// "; color:var(--arterial); }

  /* ============ WIPE (secondary now) ============ */
  .wipe-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
  .wipe-card{ background:var(--panel-2); padding:26px 22px; text-align:center; }
  .wipe-day{ font-family:var(--f-body); font-weight:600; font-size:18px; text-transform:uppercase; letter-spacing:0.04em; color:var(--bone); }
  .wipe-timer{ font-family:var(--f-mono); font-size:clamp(26px,5vw,38px); color:var(--arterial); margin-top:12px; font-weight:700; }
  .wipe-sub{ font-family:var(--f-mono); font-size:11px; color:var(--bone-dim); margin-top:6px; text-transform:uppercase; letter-spacing:0.08em; }
  .wipe-note{ text-align:center; color:var(--bone-dim); font-size:13px; margin-top:18px; font-family:var(--f-mono); }

  /* ============ LEADERBOARD ============ */
  .leaderboard{ background:var(--panel-2); border:1px solid var(--line); overflow:hidden; }
  .lb-head{ display:flex; justify-content:space-between; align-items:center; padding:15px 20px; border-bottom:1px solid var(--line); background:var(--panel); }
  .lb-head .dot{ width:8px; height:8px; border-radius:50%; background:var(--arterial); display:inline-block; margin-right:8px; animation:blink 1.6s ease-in-out infinite; }
  @keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:0.25;} }
  .lb-head span.status{ font-family:var(--f-mono); font-size:11px; text-transform:uppercase; letter-spacing:0.07em; color:var(--bone-dim); }
  table{ width:100%; border-collapse:collapse; font-family:var(--f-mono); font-size:14px; }
  thead th{ text-align:left; padding:11px 20px; color:var(--bone-dim); text-transform:uppercase; font-size:10.5px; letter-spacing:0.07em; border-bottom:1px solid var(--line); }
  tbody td{ padding:12px 20px; border-bottom:1px solid var(--line); color:var(--bone); }
  tbody tr:last-child td{ border-bottom:none; }
  tbody tr:hover{ background:rgba(156,28,23,0.08); }
  .rank-1{ color:var(--arterial); font-weight:700; }
  td.points{ color:var(--arterial); text-align:right; }
  th.points-h{ text-align:right; }

  /* ============ DISCORD ============ */
  .discord-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); align-items:stretch; }
  .discord-copy{ background:var(--panel-2); padding:32px; display:flex; flex-direction:column; justify-content:center; }
  .discord-copy h2{ font-size:clamp(24px,4vw,32px); text-transform:uppercase; }
  .discord-copy p{ color:var(--bone-dim); margin-top:12px; max-width:380px; }
  .terminal{ background:var(--panel-2); }
  .terminal-bar{ display:flex; align-items:center; gap:6px; padding:10px 14px; background:var(--panel); border-bottom:1px solid var(--line); }
  .terminal-bar .tb-dot{ width:8px; height:8px; border-radius:50%; background:var(--line); }
  .terminal-bar span.label{ margin-left:8px; font-family:var(--f-mono); font-size:10.5px; color:var(--bone-dim); text-transform:uppercase; letter-spacing:0.08em; }
  .terminal iframe{ width:100%; height:320px; border:none; display:block; }

  /* ============ FOOTER ============ */
  footer{ border-top:1px solid var(--line); padding:52px 0 30px; background:var(--panel); }
  .footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:36px; }
  .footer-grid h4{ font-family:var(--f-mono); font-size:11px; text-transform:uppercase; letter-spacing:0.09em; color:var(--arterial); margin-bottom:12px; }
  .footer-grid ul li{ margin-bottom:8px; font-size:14px; color:var(--bone-dim); }
  .footer-grid ul li a:hover{ color:var(--bone); }
  .footer-brand{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
  .footer-brand svg{ width:24px; height:24px; }
  .footer-brand span{ font-family:var(--f-display); text-transform:uppercase; }
  .footer-bottom{ margin-top:36px; padding-top:22px; border-top:1px solid var(--line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-family:var(--f-mono); font-size:11.5px; color:var(--bone-dim); }

  .reveal{ opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease; }
  .reveal.in{ opacity:1; transform:none; }

  @media (max-width: 860px){
    .nav-links{ display:none; }
    .menu-toggle{ display:inline-flex; }
    .briefing-grid{ grid-template-columns:1fr; }
    .wipe-grid{ grid-template-columns:1fr; }
    .bento{ grid-template-columns:1fr; }
    .card-redzone{ grid-column:span 1; grid-row:span 1; }
    .discord-wrap{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr; gap:24px; }
    .poster{ padding:40px 24px 34px; }
    .stamp{ width:88px; height:88px; font-size:10.5px; right:-8px; top:16px; }
    .tape.left, .tape.right{ display:none; }
  }