/* Street-design system — original transit signage, fight dossiers and arcade controls. */
:root{--ink:#0a1018;--slate:#142534;--orange:#f7a65b;--paper:#ffe5bd;--muted:#aebcca;--line:#567184}
body{background:radial-gradient(ellipse at 85% 8%,#233d47 0,#0a1018 36%),#0a1018;color:var(--paper)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:30;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 3px,#000 4px 5px)}
header{height:88px;background:#0b1723eb;border-bottom:4px solid #bd744b;box-shadow:0 8px 0 #07111bcc;position:relative;z-index:20;padding:0 4.5%}
header:after{content:"";position:absolute;left:4.5%;right:4.5%;bottom:-11px;height:3px;background:repeating-linear-gradient(90deg,#d99c57 0 18px,transparent 18px 30px)}
.wordmark{display:flex;align-items:center;gap:12px;transform:skew(-5deg);font:900 italic 22px/.76 'Barlow Condensed',Impact,sans-serif;text-shadow:2px 3px #050b12;min-width:max-content}
.wordmark .mark-icon{display:grid;place-items:center;width:45px;height:45px;clip-path:polygon(19% 0,100% 0,100% 77%,81% 100%,0 100%,0 23%);background:#f8a954;color:#17202b;font:900 italic 39px/1 Impact,sans-serif;box-shadow:inset 0 0 0 5px #603b2d}
.wordmark .mark-text{display:grid;color:#ffebd1;font-size:20px}.wordmark .mark-text strong{font-size:30px;color:#f7a65b}
nav{align-items:center;gap:8px}nav a{font:800 12px/1 'Barlow Condensed',Impact,sans-serif;letter-spacing:.13em;padding:13px 12px;color:#d4c5b4;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px));background:#1b2d3a;border-bottom:2px solid #6b8290;transition:background .15s,transform .15s}nav a:hover{background:#b45f3a;color:#fff;transform:translateY(-2px)}
.release-badge{background:#1d2b36;border:1px solid #d6975a;border-left:5px solid #e69d58;clip-path:polygon(0 0,93% 0,100% 18%,100% 100%,0 100%);padding:10px 19px;color:#f5b56c}
.hero{min-height:780px;display:grid;grid-template-columns:minmax(0,1fr) 300px;align-items:center;gap:4%;padding:90px 7% 110px;background:linear-gradient(90deg,#07111aec 0%,#0c1b27cb 44%,#12243145 100%),linear-gradient(0deg,#06121a 1%,transparent 42%),url('assets/city-keyart.png') center/cover;isolation:isolate;overflow:hidden}
.hero:before{content:"";position:absolute;inset:17px;border:2px solid #e2a26254;clip-path:polygon(0 0,25% 0,25% 2px,75% 2px,75% 0,100% 0,100% 100%,0 100%);pointer-events:none}
.hero:after{content:"BLOCK 01 • RECLAIM THE CITY";position:absolute;left:0;right:0;bottom:0;height:42px;display:flex;align-items:center;padding-left:7%;background:#c68147;color:#1b2127;font:900 16px Impact,sans-serif;letter-spacing:.35em;border-top:4px solid #ffcf82}
.hero-grid{position:absolute;inset:0;pointer-events:none;opacity:.12;background:repeating-linear-gradient(90deg,transparent 0 104px,#f5ba8055 105px 106px)}
.hero-copy{max-width:780px;z-index:1}.hero .eyebrow{font:900 15px 'Barlow Condensed',sans-serif;color:#eeb57a;letter-spacing:.23em;margin-top:35px}.hero h1{font-size:clamp(66px,7.7vw,132px);line-height:.78;letter-spacing:-.025em;color:#fff0d7;text-shadow:5px 7px 0 #050e17,7px 10px 0 #a25934}.hero h1 em{color:#ffc676;text-shadow:4px 5px #6a382b}.hero-copy>p:not(.eyebrow){max-width:530px;color:#e4d5c5;font-size:20px;background:#0c1924b9;border-left:5px solid #e8a360;padding:15px 18px;margin:36px 0 22px}
.route-chip{display:inline-flex;align-items:center;gap:12px;background:#162632;border:1px solid #af835e;border-left:5px solid #e8a360;padding:7px 12px;font:800 11px monospace;letter-spacing:.06em;color:#ffe5bd}.route-chip span{color:#ec8059}.route-chip b{background:#a45639;padding:4px 7px;color:white;font-size:9px}
.hero-street-panel{align-self:center;background:#0a1724e6;border:2px solid #a87451;box-shadow:9px 9px 0 #07121a,0 0 30px #f49d4335;transform:rotate(2deg);z-index:1}.street-panel-head{display:flex;justify-content:space-between;background:#cd8a50;color:#172433;padding:13px;font:900 12px 'Barlow Condensed',sans-serif;letter-spacing:.1em}.street-panel-head strong{font-family:monospace}.street-panel-route{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:7px;padding:15px 12px;border-bottom:1px dashed #567184;font:800 13px 'Barlow Condensed',sans-serif}.street-panel-route i{font-style:normal;color:#e9a862}.street-panel-route b{font:700 9px monospace;color:#85c99f}.street-panel-route:not(:nth-child(2)) b{color:#87939b}.street-panel-foot{display:flex;justify-content:space-between;padding:13px;background:#172c38;font:700 11px monospace;color:#eac293}
.stage-label{bottom:58px;right:7%;background:#0c1823c7;border-top:2px solid #d59b62;padding:8px 13px}
.button,.district-tabs button,.rarities button,.catalog-link{clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,15px 100%,0 calc(100% - 15px));border:0!important;border-bottom:5px solid #693d2b!important;background:linear-gradient(135deg,#ffd196 0%,#e18e4a 58%,#bd663d 100%)!important;color:#172431!important;box-shadow:inset 0 3px #fff5c0,5px 6px 0 #050c13!important;font:900 15px 'Barlow Condensed',Impact,sans-serif;letter-spacing:.14em;transform:none;transition:filter .15s,translate .15s}
.button:hover,.district-tabs button:hover,.rarities button:hover{filter:brightness(1.13);translate:0 -3px}.button-code{font:700 10px monospace;background:#172431;color:#ffd49a;padding:5px 7px;letter-spacing:0}.button-chevron{font-size:25px}.text-link{display:inline-block;background:#152a36;border-bottom:3px solid #e9a763;padding:10px 13px;color:#ffcf8e;font:900 13px 'Barlow Condensed',sans-serif;letter-spacing:.13em;clip-path:polygon(0 0,100% 0,100% 80%,92% 100%,0 100%)}.text-link:hover{background:#28414e}
.ticker{background:#1b3441;color:#f5d8af;border-block:4px solid #d99b5f;justify-content:space-around;padding:20px;font:900 14px 'Barlow Condensed',sans-serif;letter-spacing:.12em}.ticker i{color:#eb985c}
.section{position:relative;border-bottom:5px solid #243d49;padding-top:105px;padding-bottom:110px}.section:before{content:"";position:absolute;top:28px;right:7%;width:130px;height:5px;background:repeating-linear-gradient(90deg,#e6a464 0 20px,transparent 20px 29px)}.section:nth-of-type(2n){background:#10202e}.section h2{color:#ffe4b9;text-shadow:3px 4px #060f17;font-size:clamp(48px,5.1vw,83px);letter-spacing:-.025em}.eyebrow{font:900 13px 'Barlow Condensed',sans-serif;color:#f2a966;letter-spacing:.22em}
.steps li{background:#152a37;border-left:5px solid #d78d51;margin:9px 0;padding:18px 21px!important;box-shadow:6px 6px #08121a}.steps>li>span{font-size:32px}.steps h3{font-size:32px}.steps p{color:#b7c6ce}
.district{background:#101e2a}.district-tabs button{background:#1f3542!important;color:#dce1db!important;border-bottom:4px solid #55707d!important;box-shadow:none!important;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}.district-tabs button[aria-pressed=true]{background:#e8a160!important;color:#15222c!important;border-bottom-color:#a55a39!important}.district-scene{border:3px solid #bc8452;box-shadow:10px 10px #050d14}.district-caption{background:#162a36;border-left:4px solid #b78353}.district-caption h3{color:#f2c28d}.district-caption b{color:#f6ad67}
.crew-art,.fighter-card,.enemy-lineup article,.systems-grid article,.rules article{clip-path:polygon(0 0,93% 0,100% 10%,100% 100%,0 100%);border:2px solid #8d704f;background:linear-gradient(140deg,#1b3340,#0e1b29)!important;box-shadow:6px 6px #07111a}.crew-art{border-top:7px solid var(--tier)}.crew-art canvas{filter:drop-shadow(0 12px 5px #050b13)}.rarities button{background:#1b303d!important;color:var(--tier)!important;border-bottom:4px solid var(--tier)!important;box-shadow:none!important;padding:10px 14px}.rarities button[aria-pressed=true]{background:var(--tier)!important;color:#111d29!important}.rarity-detail{border-left:6px solid var(--orange);padding:16px 20px;background:#152b38;box-shadow:5px 5px #07131c}
.fighter-lineup{gap:14px}.fighter-card{padding:13px 9px 20px;border-top:5px solid var(--tier);box-shadow:6px 6px #06101a}.fighter-card canvas{background:radial-gradient(ellipse at 50% 80%,color-mix(in srgb,var(--tier) 25%,transparent),transparent 65%);border-bottom:2px solid var(--tier);margin:13px 0}.fighter-card h3{font-size:29px}.dossier-number{font:700 10px monospace;color:#e6b879}.enemy-lineup article{border-top:5px solid #b96656}.systems-grid article{border-top:5px solid #df9e5b}.rules article{padding:27px!important;border-right:3px solid #a07550}.rules strong{color:#ffbe77}.boss-card-art{clip-path:polygon(15% 0,100% 0,100% 85%,85% 100%,0 100%,0 15%)}.market-note,.withdrawal{background:#162a36;border-left:6px solid #dc9656;padding:25px}.faq details{background:#152a36;margin:8px 0;padding:20px;border-left:4px solid #84654d}.faq details[open]{border-left-color:#e0a069}.last-call{background:linear-gradient(90deg,#08151eea,#142b37c9),url('assets/city-keyart.png') center/cover;border-block:5px solid #c5854f}.last-call h2{text-shadow:5px 5px #060c13}.last-call .button{margin:auto}footer{background:#08141d;border-top:5px solid #d39054}
.guide-content{background:linear-gradient(120deg,#142b39,#0c1b27);border:2px solid #8c7558;box-shadow:9px 9px #071119;margin-top:45px;margin-bottom:45px}.guide-content h2{border-left:5px solid #ecaa69;padding:12px 18px;background:#1a3441;font-size:36px}.guide-content p,.guide-content li{color:#c5d0d3}
@media(max-width:1050px){.hero{grid-template-columns:1fr}.hero-street-panel{max-width:340px;transform:none;margin-top:20px}.hero{padding-bottom:110px}nav{gap:3px}nav a{padding:10px 6px}}
@media(max-width:720px){header{height:auto;padding:15px 18px 19px;gap:12px}header:after{left:18px;right:18px}nav{order:3;overflow:auto;width:100%;justify-content:flex-start;padding-bottom:4px}nav a{white-space:nowrap;padding:9px}.release-badge{margin-left:auto;font-size:9px}.hero{min-height:0;padding:65px 23px 100px;background-position:63% center}.hero h1{font-size:clamp(62px,15vw,104px)}.hero-copy>p:not(.eyebrow){font-size:16px}.hero-street-panel{display:none}.hero .text-link{margin:20px 0}.stage-label{bottom:47px;left:23px;right:auto}.section{padding:74px 23px}.section:before{right:23px}.fighter-lineup{gap:10px}.fighter-card h3{font-size:23px}.ticker{font-size:11px}.wordmark .mark-icon{width:38px;height:38px;font-size:32px}}
@media(prefers-reduced-motion:reduce){.button,.district-tabs button,.rarities button,nav a{transition:none!important}}