/* THE CROOKS II — tokens measured from rockstargames.com/reddeadredemption2 (see refs in factory/references/landing/rdr2) */
@font-face{font-family:"Chalet Comprime";src:url(fonts/ChaletComprime-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Chalet Comprime";src:url(fonts/ChaletComprime-700.woff) format("woff");font-weight:700;font-display:swap}
@font-face{font-family:"Hapna Slab";src:url(fonts/HapnaSlabSerif-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Hapna Slab";src:url(fonts/HapnaSlabSerif-700.woff) format("woff");font-weight:700;font-display:swap}

:root{
  --bg:#0b0b0b; --bg-2:#111111; --panel:#151515; --line:rgba(255,255,255,.12); --line-2:rgba(255,255,255,.22);
  --ink:#ffffff; --ink-2:#e8e8e8; --ink-3:#989898; --ink-4:#5c5c5c;
  --red:#c8191f; --red-deep:#8e0c1c; --paper:#efe8d8; --paper-ink:#1b1712;
  --win:#5fb35a; --lose:#d0453d;
  --f-display:"Chalet Comprime","Arial Narrow",Impact,sans-serif;
  --f-body:"Hapna Slab",Rockwell,"Roboto Slab",Georgia,serif;
  --f-ui:"Helvetica Now Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  --wrap:1440px; --nav:88px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color-scheme:dark}
body{background:var(--bg);color:var(--ink-2);font:400 20px/32px var(--f-body);letter-spacing:-.5px;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}
img{display:block;max-width:100%}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input{font:inherit;color:inherit}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:2px solid #fff;outline-offset:3px}
.num{font-family:var(--f-ui);font-variant-numeric:tabular-nums lining-nums;letter-spacing:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s7)}

/* ============ NAV (RDR: 88px, logo plate left, uppercase 13.5/700 links, outline pill right) ============ */
.nav{position:fixed;inset:0 0 auto;height:var(--nav);z-index:50;display:flex;align-items:center;gap:var(--s6);padding:0 64px;background:linear-gradient(#000 0,rgba(0,0,0,.86) 70%,rgba(0,0,0,0));transition:background .2s var(--ease)}
.nav.solid{background:#000}
.brand{display:flex;align-items:center;gap:14px;flex:none}
.brand img{width:34px;height:34px}
.brand .sep{width:1px;height:28px;background:rgba(255,255,255,.6)}
.brand .wm{font:700 31px/1 var(--f-display);color:#fff;text-transform:uppercase;letter-spacing:.2px;filter:url(#rough-sm)}
.brand .wm i{font-style:normal;color:var(--red);margin-left:4px}
.links{display:flex;gap:6px;margin-left:var(--s6)}
.links a{font:700 13.5px/1 var(--f-ui);letter-spacing:.27px;text-transform:uppercase;color:rgba(255,255,255,.8);padding:10px 14px;border-radius:1000px;transition:color .15s var(--ease),background .15s var(--ease)}
.links a:hover{color:#fff;background:rgba(255,255,255,.08)}
.links a[aria-current=page]{color:#fff}
.links a[aria-current=page]::after{content:"";display:block;height:2px;background:var(--red);margin-top:6px;border-radius:2px}
.nav-r{margin-left:auto;display:flex;align-items:center;gap:var(--s3)}
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 24px;border-radius:1000px;font:700 14px/1 var(--f-ui);letter-spacing:-.2px;transition:background .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease),transform .15s var(--ease)}
.pill.outline{border:1px solid rgba(255,255,255,.7);color:#fff}
.pill.outline:hover{background:#fff;color:#000;border-color:#fff}
.pill.solid{background:#fff;color:#000}
.pill.solid:hover{background:var(--ink-2)}
.pill.red{background:var(--red);color:#fff}
.pill.red:hover{background:#dd2027}
.pill:active{transform:translateY(1px)}
.pill[disabled]{opacity:.38;cursor:not-allowed;transform:none}
.icon-btn{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:rgba(255,255,255,.95);transition:background .15s var(--ease)}
.icon-btn:hover{background:rgba(255,255,255,.1)}
.burger{display:none}

/* buy menu */
.buy{position:relative}
.buy-menu{position:absolute;right:0;top:48px;width:280px;background:#000;border:1px solid var(--line-2);padding:8px;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .15s var(--ease),transform .15s var(--ease)}
.buy.open .buy-menu{opacity:1;transform:none;pointer-events:auto}
.buy-menu a,.buy-menu .ca{display:flex;justify-content:space-between;align-items:center;padding:12px 12px;font:700 14px/1.2 var(--f-ui);letter-spacing:0;color:#fff;transition:background .12s var(--ease)}
.buy-menu a:hover{background:rgba(255,255,255,.08)}
.buy-menu a span{color:var(--ink-3);font-weight:400}
.buy-menu .ca{flex-direction:column;align-items:flex-start;gap:6px;border-top:1px solid var(--line);margin-top:6px;padding-top:14px;color:var(--ink-3);font-weight:400;font-size:13px}
.buy-menu .ca code{font:500 12px/1.4 ui-monospace,Consolas,monospace;color:#fff;word-break:break-all}

/* ============ VIEWS ============ */
.view{display:none;min-height:100vh}
.view.on{display:block;animation:viewIn .25s var(--ease)}
@keyframes viewIn{from{opacity:0}to{opacity:1}}

/* ============ HERO (RDR: full-bleed poster, wordmark plate left) ============ */
.hero{position:relative;height:min(42.4vw,1100px);min-height:560px;overflow:hidden;background:var(--red-deep)}
.hero img.art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.hero .torn-bottom{position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(rgba(11,11,11,0),var(--bg));pointer-events:none}
.hero-copy{position:absolute;left:64px;top:calc(var(--nav) + 40px);max-width:640px}
.presents{font:700 26px/1 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:.3px;margin-bottom:6px;filter:url(#rough-sm)}
.presents small{font-size:18px;margin-left:4px}
.plate{display:inline-flex;align-items:flex-end;gap:14px;background:#0b0b0b;padding:16px 22px 12px 18px;box-shadow:0 0 0 2px #0b0b0b}
.plate .w{font:700 clamp(64px,8.4vw,132px)/.8 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:-1px;filter:url(#rough-lg)}
.plate .w span{display:block}
.plate .bird{width:clamp(110px,13vw,200px);aspect-ratio:1;align-self:center;background:var(--red);-webkit-mask:url(img/mark.svg) center/contain no-repeat;mask:url(img/mark.svg) center/contain no-repeat;margin:0 4px 0 -6px}
.plate .ii{font:700 clamp(120px,16vw,250px)/.72 var(--f-display);color:var(--red);filter:url(#rough-lg);letter-spacing:-6px}
.hero-cta{display:flex;gap:var(--s3);margin-top:var(--s5)}

/* ============ INTRO (RDR: centered slab serif, 800 max, 20/32) ============ */
.intro{max-width:800px;margin:0 auto;padding:var(--s7) var(--s5) var(--s8);text-align:center;color:#fff}
.intro b{font-weight:700}

/* ============ TILE GRID (RDR: 3 cols, torn image, condensed label under) ============ */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6) var(--s5);max-width:1600px;margin:0 auto;padding:0 var(--s6) var(--s8)}
.tile{display:block;text-align:center;color:#fff}
.tile .img{position:relative;aspect-ratio:1/1;overflow:hidden;background:#000}
.tile .img img{width:100%;height:100%;object-fit:cover;transition:transform .35s var(--ease)}
.tile:hover .img img{transform:scale(1.035)}
.tile h3{font:400 30px/33px var(--f-display);margin-top:var(--s4);transition:color .15s var(--ease)}
.tile:hover h3{color:var(--red)}
.tile p{font:400 15px/22px var(--f-ui);letter-spacing:0;color:var(--ink-3);margin-top:2px}
.torn-a{clip-path:url(#torn-a)} .torn-b{clip-path:url(#torn-b)} .torn-c{clip-path:url(#torn-c)}
.tile .img.paper{background:var(--paper)}
.tile .img.paper img{object-fit:contain;padding:8%;mix-blend-mode:multiply}

/* ============ RED BAND ============ */
.band{position:relative;margin-top:var(--s5)}
.band .red{background:var(--red);clip-path:url(#band);padding:56px var(--s5) 52px;text-align:center}
.band h2{font:700 clamp(54px,7vw,104px)/.9 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:.5px;filter:url(#rough-lg)}
.band .stars{position:relative;margin-top:-18px;padding:56px var(--s5) 64px;text-align:center;background:#130506 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='150'%3E%3Cg fill='%23a5131b' opacity='.55'%3E%3Cpath transform='translate(30 20) rotate(-12)' d='M0-28 8-9 28-9 12 3 18 23 0 11-18 23-12 3-28-9-8-9Z'/%3E%3Cpath transform='translate(130 95) scale(.8) rotate(18)' d='M0-28 8-9 28-9 12 3 18 23 0 11-18 23-12 3-28-9-8-9Z'/%3E%3C/g%3E%3C/svg%3E");clip-path:url(#edge-bottom)}
.band .stars h3{font:700 40px/1 var(--f-display);text-transform:uppercase;color:#fff;filter:url(#rough-sm)}
.band .stars p{font:400 15px/22px var(--f-ui);letter-spacing:0;color:rgba(255,255,255,.8);margin-top:var(--s3)}
.band .stars .pill{margin-top:var(--s5)}

/* ============ APP SCREENS (subpages) ============ */
.screen{padding:calc(var(--nav) + var(--s6)) 0 var(--s9)}
.screen-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s5);padding-bottom:var(--s5);border-bottom:1px solid var(--line);margin-bottom:var(--s6)}
.screen-head h1{font:700 76px/.86 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:-.5px;filter:url(#rough-md)}
.screen-head .lede{max-width:520px;font-size:17px;line-height:27px;color:var(--ink-3);text-align:right}
.eyebrow{font:700 12px/1 var(--f-ui);letter-spacing:1.4px;text-transform:uppercase;color:var(--ink-3)}
.h2{font:700 44px/1 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:.2px}
.h3{font:700 28px/1.05 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:.3px}
.muted{color:var(--ink-3)}
.card{background:var(--panel);border:1px solid var(--line)}

/* ============ JOBS ============ */
.jobs-layout{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:var(--s6);align-items:start}
.jobs{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s5)}
.job{position:relative;text-align:left;color:#fff;display:block;width:100%}
.job .img{aspect-ratio:16/10;overflow:hidden;position:relative;background:#000}
.job .img img{width:100%;height:100%;object-fit:cover;transition:transform .35s var(--ease),filter .2s var(--ease);filter:saturate(.92)}
.job:hover .img img{transform:scale(1.03)}
.job .img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.78));pointer-events:none}
.job .odds{position:absolute;left:22px;bottom:16px;z-index:1;font:700 72px/.8 var(--f-display);filter:url(#rough-md)}
.job .odds small{font-size:28px;margin-left:2px}
.job .tag{position:absolute;right:20px;bottom:20px;z-index:1;font:700 12px/1 var(--f-ui);letter-spacing:1.2px;text-transform:uppercase;color:rgba(255,255,255,.85)}
.job .meta{display:flex;justify-content:space-between;align-items:baseline;padding:14px 2px 0}
.job .meta h3{font:400 30px/33px var(--f-display);transition:color .15s var(--ease)}
.job .meta .pays{font:700 15px/1 var(--f-ui);color:var(--ink-3)}
.job .meta .pays b{color:#fff;font-weight:700}
.job:hover .meta h3{color:var(--red)}
.job[aria-pressed=true] .meta h3{color:var(--red)}
.job[aria-pressed=true] .img{outline:3px solid var(--red);outline-offset:-3px}
.job .bar{height:3px;background:rgba(255,255,255,.12);margin-top:12px;position:relative}
.job .bar i{position:absolute;inset:0 auto 0 0;background:#fff}

.ride{position:sticky;top:calc(var(--nav) + 16px);padding:var(--s5)}
.ride .row{display:flex;justify-content:space-between;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--line);font:400 15px/1.3 var(--f-ui);letter-spacing:0;color:var(--ink-3)}
.ride .row b{color:#fff;font-weight:700}
.ride .who{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding-bottom:var(--s4);border-bottom:1px solid var(--line)}
.ride .who .addr{font:700 14px/1 var(--f-ui);color:#fff;letter-spacing:0}
.ride .who .wanted{display:flex;gap:3px}
.ride .who .wanted i{width:12px;height:12px;background:rgba(255,255,255,.14);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.ride .who .wanted i.on{background:var(--red)}
.ride h3{margin:var(--s5) 0 var(--s3)}
.stake{display:flex;align-items:center;border:1px solid var(--line-2);height:56px;padding:0 var(--s4);transition:border-color .15s var(--ease)}
.stake:focus-within{border-color:#fff}
.stake input{flex:1;min-width:0;background:none;border:0;outline:0;font:700 26px/1 var(--f-ui);font-variant-numeric:tabular-nums;color:#fff;letter-spacing:-.5px}
.stake span{font:700 13px/1 var(--f-ui);color:var(--ink-3);letter-spacing:.6px;text-transform:uppercase}
.chips{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}
.chips button{height:34px;border:1px solid var(--line);font:700 12.5px/1 var(--f-ui);letter-spacing:.4px;color:var(--ink-2);transition:border-color .12s var(--ease),background .12s var(--ease)}
.chips button:hover{border-color:var(--line-2);background:rgba(255,255,255,.05)}
.ride .go{width:100%;height:52px;margin-top:var(--s4);font-size:15px}
.receipt{margin-top:var(--s4);padding:var(--s4);background:#0d0d0d;border:1px solid var(--line);font:400 12.5px/1.55 ui-monospace,Consolas,monospace;letter-spacing:0;color:var(--ink-3);word-break:break-all}
.receipt b{color:var(--ink-2);font-weight:500}
.receipt .k{display:block;font:700 10.5px/1 var(--f-ui);letter-spacing:1.2px;text-transform:uppercase;color:var(--ink-4);margin:10px 0 4px}
.receipt .k:first-child{margin-top:0}
.verdict{margin-top:var(--s4);padding:var(--s4) var(--s4) var(--s4);text-align:center}
.verdict .big{font:700 64px/.9 var(--f-display);text-transform:uppercase;filter:url(#rough-md)}
.verdict.win .big{color:#fff}
.verdict.lose .big{color:var(--lose)}
.verdict .line{font:400 15px/1.4 var(--f-ui);letter-spacing:0;color:var(--ink-3);margin-top:8px}
.rollbar{position:relative;height:10px;background:rgba(255,255,255,.1);margin-top:var(--s4)}
.rollbar .zone{position:absolute;inset:0 auto 0 0;background:rgba(255,255,255,.26)}
.rollbar .mark{position:absolute;top:-6px;width:2px;height:22px;background:var(--red);transition:left .6s var(--ease)}
.rollbar-scale{display:flex;justify-content:space-between;font:400 11px/1 var(--f-ui);color:var(--ink-4);margin-top:6px;letter-spacing:0}
.after{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:var(--s4)}
.err{margin-top:var(--s3);font:400 14px/1.4 var(--f-ui);letter-spacing:0;color:var(--lose);min-height:20px}
.connect-alt{margin-top:var(--s3)}
.connect-alt summary{cursor:pointer;font:400 13px/1 var(--f-ui);letter-spacing:0;color:var(--ink-3);list-style:none}
.connect-alt summary:hover{color:#fff}
.connect-alt input{width:100%;height:44px;margin-top:10px;padding:0 12px;background:#0d0d0d;border:1px solid var(--line-2);font:400 13px/1 ui-monospace,Consolas,monospace;outline:0}
.connect-alt input:focus{border-color:#fff}

.gate{display:grid;place-items:center;text-align:center;padding:var(--s7) var(--s5);border:1px dashed var(--line-2)}
.gate p{font:400 15px/1.5 var(--f-ui);letter-spacing:0;color:var(--ink-3);max-width:320px;margin-top:var(--s3)}

/* ============ GANG ============ */
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s5)}
.filters button{height:36px;padding:0 16px;border-radius:1000px;border:1px solid var(--line-2);font:700 12.5px/1 var(--f-ui);letter-spacing:.5px;text-transform:uppercase;color:var(--ink-2);transition:all .15s var(--ease)}
.filters button:hover{border-color:#fff;color:#fff}
.filters button[aria-pressed=true]{background:#fff;color:#000;border-color:#fff}
.filters button .num{opacity:.55;margin-left:6px}
.gang-layout{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:var(--s6);align-items:start}
.gang{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4)}
.mate{display:block;text-align:center;color:#fff}
.mate .img{aspect-ratio:1/1;background:var(--paper);position:relative;overflow:hidden}
.mate .img img{width:100%;height:100%;object-fit:contain;padding:6%;mix-blend-mode:multiply;transition:transform .3s var(--ease)}
.mate:hover .img img{transform:translateY(-3px) scale(1.03)}
.mate[aria-pressed=true] .img{box-shadow:inset 0 0 0 4px var(--red)}
.mate .nm{font:400 21px/1 var(--f-display);margin-top:10px;transition:color .15s var(--ease)}
.mate:hover .nm,.mate[aria-pressed=true] .nm{color:var(--red)}
.rar{position:absolute;left:10px;top:10px;font:700 10px/1 var(--f-ui);letter-spacing:1.2px;text-transform:uppercase;padding:5px 7px;background:#0b0b0b;color:#fff}
.rar.legendary{background:var(--red)}
.rar.gold{background:#b8891d}
.rar.silver{background:#8d9196}
.mate-pane{position:sticky;top:calc(var(--nav) + 16px)}
.mate-pane .img{aspect-ratio:1/1;background:var(--paper)}
.mate-pane .img img{width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply}
.mate-pane .body{padding:var(--s5)}
.mate-pane .h2{margin:8px 0 var(--s3)}
.mate-pane p{font-size:17px;line-height:27px;color:var(--ink-2)}
.mate-pane .row{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line);font:400 14px/1.3 var(--f-ui);letter-spacing:0;color:var(--ink-3);margin-top:0}
.mate-pane .row:first-of-type{margin-top:var(--s4)}
.mate-pane .row b{color:#fff}

/* ============ VAULT / TOKENOMICS ============ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);margin-bottom:var(--s7)}
.stat{padding:var(--s5);border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat .v{font:700 44px/1 var(--f-display);color:#fff;margin-top:12px;letter-spacing:.3px}
.stat .v.num{font:700 34px/1.1 var(--f-ui);letter-spacing:-1px}
.stat .s{font:400 13px/1.4 var(--f-ui);letter-spacing:0;color:var(--ink-3);margin-top:6px}
.rules{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--line)}
.rule{display:grid;grid-template-columns:64px 1fr;gap:var(--s4);padding:var(--s5) var(--s5) var(--s5) 0;border-bottom:1px solid var(--line)}
.rule:nth-child(odd){border-right:1px solid var(--line)}
.rule:nth-child(even){padding-left:var(--s5)}
.rule .n{font:700 15px/1 var(--f-ui);color:var(--red);padding-top:8px;font-variant-numeric:tabular-nums}
.rule h3{font:700 30px/1 var(--f-display);text-transform:uppercase;color:#fff;letter-spacing:.3px}
.rule p{font-size:17px;line-height:27px;color:var(--ink-2);margin-top:8px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--s7);margin-top:var(--s8)}
.flow{display:flex;flex-direction:column;gap:0;border:1px solid var(--line)}
.flow div{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line);font:400 15px/1.3 var(--f-ui);letter-spacing:0;color:var(--ink-3)}
.flow div:last-child{border-bottom:0}
.flow div b{color:#fff;font-weight:700}
.flow div.hot{background:rgba(200,25,31,.12)}
.flow div.hot b{color:#fff}
.table{width:100%;border-collapse:collapse;font:400 14px/1.3 var(--f-ui);letter-spacing:0}
.table th{text-align:left;font:700 11px/1 var(--f-ui);letter-spacing:1.2px;text-transform:uppercase;color:var(--ink-4);padding:12px 12px;border-bottom:1px solid var(--line-2)}
.table td{padding:13px 12px;border-bottom:1px solid var(--line);color:var(--ink-2);font-variant-numeric:tabular-nums}
.table td.r,.table th.r{text-align:right}
.table tr:hover td{background:rgba(255,255,255,.03)}
.empty{padding:var(--s7) var(--s5);text-align:center;font:400 15px/1.5 var(--f-ui);letter-spacing:0;color:var(--ink-3);border-bottom:1px solid var(--line)}
.empty b{display:block;font:700 26px/1 var(--f-display);color:#fff;text-transform:uppercase;margin-bottom:8px}
.win{color:var(--win)} .lose{color:var(--lose)}

/* ============ FAIR ============ */
.fair-layout{display:grid;grid-template-columns:1fr 520px;gap:var(--s7);align-items:start}
.steps{counter-reset:s;list-style:none}
.steps li{position:relative;padding:0 0 var(--s5) 56px;font-size:18px;line-height:29px;color:var(--ink-2)}
.steps li::before{counter-increment:s;content:counter(s,decimal-leading-zero);position:absolute;left:0;top:2px;font:700 15px/1 var(--f-ui);color:var(--red);font-variant-numeric:tabular-nums}
.steps li b{color:#fff}
code.i{font:400 .82em/1 ui-monospace,Consolas,monospace;background:#1b1b1b;border:1px solid var(--line);padding:2px 6px;color:#fff;letter-spacing:0}
.verify{padding:var(--s5)}
.verify label{display:block;font:700 11px/1 var(--f-ui);letter-spacing:1.2px;text-transform:uppercase;color:var(--ink-3);margin:var(--s4) 0 8px}
.verify label:first-of-type{margin-top:var(--s3)}
.verify input,.verify select{width:100%;height:44px;padding:0 12px;background:#0d0d0d;border:1px solid var(--line-2);font:400 13px/1 ui-monospace,Consolas,monospace;color:#fff;outline:0;letter-spacing:0;border-radius:0;appearance:none}
.verify input:focus,.verify select:focus{border-color:#fff}
.verify .grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.verify .out{margin-top:var(--s5)}

/* ============ DOCS ============ */
.docs-layout{display:grid;grid-template-columns:220px minmax(0,760px);gap:var(--s8)}
.toc{position:sticky;top:calc(var(--nav) + 24px);align-self:start;display:flex;flex-direction:column;gap:2px}
.toc button{text-align:left;padding:8px 0;font:700 13px/1.2 var(--f-ui);letter-spacing:.3px;text-transform:uppercase;color:var(--ink-3);transition:color .12s var(--ease)}
.toc button:hover{color:#fff}
.doc h2{font:700 40px/1 var(--f-display);text-transform:uppercase;color:#fff;margin:var(--s8) 0 var(--s4);letter-spacing:.3px;scroll-margin-top:calc(var(--nav) + 24px)}
.doc h2:first-child{margin-top:0}
.doc h4{font:700 14px/1 var(--f-ui);letter-spacing:1px;text-transform:uppercase;color:#fff;margin:var(--s6) 0 var(--s3)}
.doc p{font-size:18px;line-height:30px;color:var(--ink-2);margin-bottom:var(--s4)}
.doc p b{color:#fff}
.doc .lede{font-size:22px;line-height:34px;color:#fff}
.doc pre{background:#0d0d0d;border:1px solid var(--line);padding:var(--s4) var(--s5);font:400 13px/1.7 ui-monospace,Consolas,monospace;color:var(--ink-2);overflow-x:auto;margin-bottom:var(--s4);letter-spacing:0}
.doc .table{margin-bottom:var(--s5)}
.log-entry{display:grid;grid-template-columns:120px 1fr;gap:var(--s4);padding:var(--s4) 0;border-top:1px solid var(--line)}
.log-entry .d{font:700 13px/1.6 var(--f-ui);color:var(--ink-3);letter-spacing:0}
.log-entry p{margin:0}

/* ============ FOOTER (RDR) ============ */
footer{padding:var(--s7) 64px var(--s6);border-top:1px solid #1a1a1a;margin-top:0}
footer .top{display:flex;justify-content:space-between;align-items:center;gap:var(--s5)}
footer nav{display:flex;gap:var(--s5);flex-wrap:wrap}
footer nav a{font:700 15px/1 var(--f-ui);letter-spacing:-.2px;color:#fff;transition:color .12s var(--ease)}
footer nav a:hover{color:var(--ink-3)}
footer .bot{display:flex;justify-content:space-between;margin-top:var(--s7);font:400 13px/1.5 var(--f-ui);letter-spacing:0;color:var(--ink-3)}

/* toast */
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,12px);background:#fff;color:#000;font:700 14px/1 var(--f-ui);letter-spacing:0;padding:14px 20px;opacity:0;pointer-events:none;transition:opacity .18s var(--ease),transform .18s var(--ease);z-index:90}
.toast.on{opacity:1;transform:translate(-50%,0)}

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

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
}

/* ============ RESPONSIVE ============ */
@media (max-width:1280px){
  .links a{padding:10px 9px}
  .jobs-layout,.gang-layout{grid-template-columns:minmax(0,1fr) 360px}
  .gang{grid-template-columns:repeat(3,1fr)}
  .fair-layout{grid-template-columns:1fr 440px}
}
@media (max-width:1080px){
  .nav{padding:0 24px}
  .links{display:none}
  .burger{display:grid}
  .nav.menu-open .links{display:flex;position:fixed;top:var(--nav);left:0;right:0;flex-direction:column;background:#000;padding:12px 16px 20px;margin:0;border-bottom:1px solid var(--line)}
  .nav.menu-open .links a{padding:16px 8px;font-size:15px}
  .nav.menu-open .links a[aria-current=page]::after{display:none}
  .wrap{padding:0 24px}
  .hero-copy{left:24px}
  .jobs-layout,.gang-layout,.fair-layout,.split{grid-template-columns:minmax(0,1fr)}
  .ride,.mate-pane{position:static}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .rules{grid-template-columns:1fr}
  .rule:nth-child(odd){border-right:0}
  .rule:nth-child(even){padding-left:0}
  .docs-layout{grid-template-columns:minmax(0,1fr)}
  .toc{display:none}
  footer{padding:var(--s7) 24px var(--s6)}
}
@media (max-width:720px){
  body{font-size:17px;line-height:28px}
  :root{--nav:68px}
  .brand .wm{font-size:24px}
  .nav-r .pill{height:34px;padding:0 16px}
  .hero{height:auto;min-height:0;aspect-ratio:auto;padding-top:var(--nav)}
  .hero img.art{position:relative;height:auto;aspect-ratio:4/3;object-position:78% 50%}
  .hero-copy{position:relative;left:auto;top:auto;padding:0 16px;margin-top:-64px;max-width:none}
  .hero .torn-bottom{display:none}
  .presents{font-size:20px}
  .tiles{grid-template-columns:1fr 1fr;gap:var(--s5) var(--s3);padding:0 16px var(--s7)}
  .tile h3{font-size:24px;line-height:26px;margin-top:10px}
  .tile p{display:none}
  .screen-head{flex-direction:column;align-items:flex-start}
  .screen-head h1{font-size:56px}
  .screen-head .lede{text-align:left}
  .wrap{padding:0 16px}
  .jobs{grid-template-columns:minmax(0,1fr)}
  .gang{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:1fr}
  .stat{border-right:0!important;border-bottom:1px solid var(--line)}
  .stat:last-child{border-bottom:0}
  .verify .grid2{grid-template-columns:1fr}
  .log-entry{grid-template-columns:1fr;gap:4px}
  footer .top,footer .bot{flex-direction:column;align-items:flex-start;gap:var(--s4)}
  .table .hide-sm{display:none}
  .table th,.table td{padding:11px 6px}
  .doc pre{white-space:pre-wrap;word-break:break-all}
  .doc .table{font-size:13px}
}
