:root{
  --baize:#123A2C;
  --baize-deep:#0C2A20;
  --ivory:#F4F0E4;
  --vermilion:#D8452F;
  --brass:#C9A227;
  --moss:#7A9186;
  --dim:#C6D2CA;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--baize);color:var(--ivory);
  font-family:'Archivo',system-ui,sans-serif;
  min-height:100vh;display:flex;flex-direction:column;
  padding:clamp(22px,4.5vw,48px) clamp(16px,4vw,40px) 0;
}
.mono{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.24em;
      text-transform:uppercase;color:var(--moss)}

header{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;
       border-bottom:1px solid rgba(244,240,228,.14);padding-bottom:14px}
.mark{font-family:'Archivo Black',sans-serif;font-size:15px;letter-spacing:-.01em}
.mark span{color:var(--brass)}

main{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;
     padding:clamp(40px,8vw,88px) 0 0}

h1{font-family:'Archivo Black',sans-serif;font-size:clamp(34px,6.4vw,68px);
   line-height:1.02;letter-spacing:-.028em;max-width:15ch}
h1 em{font-style:normal;color:var(--brass)}
.thesis{margin-top:18px;max-width:46ch;font-size:clamp(15px,1.9vw,18px);
        line-height:1.7;color:var(--dim)}

.held{margin-top:clamp(44px,7vw,76px);margin-bottom:16px}
.held strong{color:var(--ivory);font-weight:500}

.slot{
  width:min(620px,100%);aspect-ratio:2/1;
  background:var(--ivory);color:var(--baize-deep);
  border:1px solid rgba(244,240,228,.25);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  position:relative;box-shadow:0 24px 60px rgba(0,0,0,.35);
  text-decoration:none;
}
.slot::after{content:'';position:absolute;inset:9px;
             border:1px solid rgba(18,58,44,.16);pointer-events:none}
.slot-name{font-family:'Archivo Black',sans-serif;font-size:clamp(20px,4vw,30px);
           padding:0 18px;text-align:center}
.slot-url{font-family:'IBM Plex Mono',monospace;font-size:13px;color:#4A6B5D}
.slot.empty{background:rgba(244,240,228,.06);color:var(--dim);
            border-style:dashed;box-shadow:none}
.slot.empty .slot-url{color:var(--moss)}

.price-label{margin-top:clamp(30px,5vw,48px)}
.price{font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;font-weight:600;
       font-size:clamp(54px,12vw,116px);line-height:1;letter-spacing:-.04em;margin-top:6px}
.price em{font-style:normal;color:var(--brass)}

.take{
  margin-top:clamp(22px,4vw,34px);
  background:var(--vermilion);color:var(--ivory);border:none;
  font-family:'Archivo',sans-serif;font-weight:600;font-size:17px;
  padding:17px 40px;cursor:pointer;
  transition:transform .12s ease, background .12s ease;
}
.take:hover:not(:disabled){background:#C43B26}
.take:active:not(:disabled){transform:translateY(1px)}
.take:disabled{opacity:.5;cursor:default}
.take:focus-visible{outline:3px solid var(--brass);outline-offset:3px}
.norefund{margin-top:14px;font-size:14px;color:var(--moss);max-width:36ch}

.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
       gap:clamp(20px,4vw,44px);max-width:840px;width:100%;
       margin-top:clamp(52px,9vw,96px);text-align:left;
       border-top:1px solid rgba(244,240,228,.16);padding-top:26px}
.rule h3{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.2em;
         text-transform:uppercase;color:var(--brass);font-weight:500;margin-bottom:8px}
.rule p{font-size:14px;line-height:1.65;color:var(--dim)}

.record-label{margin-top:clamp(48px,8vw,84px);padding-bottom:10px}
.tape{margin-left:calc(-1 * clamp(16px,4vw,40px));
      margin-right:calc(-1 * clamp(16px,4vw,40px));
      background:var(--baize-deep);border-top:1px solid rgba(201,162,39,.3);
      overflow:hidden;padding:13px 0}
.tape-track{display:flex;gap:44px;white-space:nowrap;width:max-content;
            animation:slide 42s linear infinite;
            font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--moss)}
.tape-track b{color:var(--ivory);font-weight:500}
.tape-track i{font-style:normal;color:var(--brass)}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.tape-track{animation:none}}

footer{text-align:center;padding:16px 0 22px}

/* ---- claim dialog ---- */
dialog{
  border:none;padding:clamp(22px,4vw,34px);
  width:min(460px,92vw);
  background:var(--ivory);color:var(--baize-deep);
  box-shadow:0 30px 90px rgba(0,0,0,.5);
}
dialog::backdrop{background:rgba(8,26,20,.72)}
.close-row{display:flex;justify-content:flex-end;margin:-8px -8px 0 0}
.close{background:none;border:none;font-size:17px;color:#4A6B5D;cursor:pointer;padding:4px 6px}
.close:focus-visible{outline:2px solid var(--vermilion);outline-offset:2px}
dialog h2{font-family:'Archivo Black',sans-serif;font-size:23px;letter-spacing:-.02em}
.dialog-price{font-family:'IBM Plex Mono',monospace;font-size:14px;color:#4A6B5D;
              margin:6px 0 20px}
dialog label{display:block;font-family:'IBM Plex Mono',monospace;font-size:10.5px;
             letter-spacing:.18em;text-transform:uppercase;color:#4A6B5D;margin:14px 0 5px}
dialog label .opt{color:#8AA396;letter-spacing:.1em}
dialog input{width:100%;padding:12px 13px;font-family:'Archivo',sans-serif;font-size:15px;
             border:1px solid rgba(18,58,44,.28);background:#FBF9F1;color:var(--baize-deep)}
dialog input:focus{outline:2px solid var(--vermilion);outline-offset:-1px}
.fine{margin-top:20px;font-size:12.5px;line-height:1.65;color:#4A6B5D}
.errors{margin-top:14px;font-size:13.5px;color:#9A2B18;line-height:1.5}
dialog .take{width:100%;margin-top:16px}

.consent{display:flex;gap:10px;align-items:flex-start;margin-top:16px;cursor:pointer}
.consent input{width:17px;height:17px;flex-shrink:0;margin-top:2px;accent-color:var(--vermilion);cursor:pointer}
.consent span{font-size:12.5px;line-height:1.6;color:#4A6B5D}
.consent a{color:var(--vermilion)}
footer .mono a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(122,145,134,.4)}
footer .mono a:hover{color:var(--ivory)}
footer{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}