:root { --cyan:#27efff; --pink:#ff4fd8; --violet:#8f62ff; --lime:#67f7c4; --gold:#ffc942; --ink:#050617; --panel:#0b0d24; }
* { box-sizing:border-box; }
html,body { background:#030411; }
body { color:#f6f7ff; background:radial-gradient(circle at 50% -10%,#1a1647 0,transparent 38%),linear-gradient(#050615,#02030b); }
body::before { content:''; position:fixed; inset:0; z-index:-1; opacity:.2; background-image:linear-gradient(rgba(39,239,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,79,216,.1) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(transparent,#000 30%,#000); }
#stage { width:100%; min-width:0; background:transparent; }
body:not(.in-game) #stage { position:fixed; inset:0; width:100vw; height:100dvh; }
#welcome { width:100%; max-width:none; padding:18px clamp(16px,2vw,34px) 70px; background:transparent; }
body:not(.in-game) #theme-toggle,body:not(.in-game) #about-btn,body:not(.in-game) #fullscreen-toggle,body:not(.in-game) #hamburger { display:none!important; }
.arc-scanlines { opacity:.055; }

.arc-main-nav { min-height:68px; display:grid; grid-template-columns:250px 1fr 220px; align-items:center; gap:18px; padding:8px 20px; border:1px solid rgba(143,98,255,.34); background:rgba(5,6,23,.9); box-shadow:inset 0 -2px 0 rgba(39,239,255,.1),0 12px 35px #0008; }
.nav-logo { display:flex; align-items:center; gap:12px; color:#fff; text-decoration:none; }
.nav-logo span { color:var(--cyan); font-size:33px; filter:drop-shadow(0 0 8px var(--cyan)); }
.nav-logo b { color:var(--pink); font:950 24px/1 monospace; letter-spacing:-2px; text-shadow:0 0 10px #ff4fd888; }
.nav-links { display:flex; justify-content:center; gap:6px; }
.nav-links button { padding:11px 15px; border:1px solid transparent; border-radius:7px; color:#c6c6e7; background:transparent; font-weight:800; }
.nav-links button:hover { color:#fff; border-color:#51408a; background:#151133; }
.nav-chain { color:#7e82a6; font:700 9px/1.45 monospace; letter-spacing:1px; text-align:right; }
.nav-chain b { color:#b8bedc; }
#arc-wallet-bar { position:fixed; z-index:60; top:27px; right:245px; padding:7px; border:1px solid var(--cyan); border-radius:8px; background:#07101e; box-shadow:0 0 20px #27efff66,inset 0 0 14px #27efff1a; }
.arc-network,#arc-balance { display:none; }
#arc-connect { min-width:150px; color:#fff; background:linear-gradient(135deg,#14cde0,#195687); }

#welcome-hero { position:relative; min-height:485px; align-items:flex-start!important; justify-content:center!important; margin:14px 0; padding:44px 31% 38px clamp(30px,4vw,74px); overflow:hidden; border:1px solid #27234f; background:linear-gradient(90deg,rgba(3,4,17,.96) 0%,rgba(3,4,17,.86) 29%,rgba(3,4,17,.2) 58%),url('images/arcadify-hero-neon.png') 62% center/cover no-repeat; box-shadow:0 0 40px #16114f88; }
.hero-copy { position:relative; z-index:2; width:min(680px,54vw); max-width:none; margin:0!important; align-self:flex-start!important; }
.hero-copy>small { color:#a9c9db; font:800 10px monospace; letter-spacing:3px; }
#welcome-hero h1 { margin:17px 0 7px; color:#eafaff; font:1000 clamp(48px,5vw,82px)/.9 monospace; letter-spacing:-5px; text-align:left; text-shadow:4px 4px 0 #164d6b,0 0 18px #27efff44; }
#welcome-hero h1 em { color:var(--pink); font-style:normal; text-shadow:4px 4px 0 #522474,0 0 18px #ff4fd866; }
#welcome-hero h2 { margin:18px 0 8px; font:900 24px/1.1 sans-serif; }
.arc-intro { max-width:580px; margin:0; color:#c0c4da; text-align:left; font-size:14px; line-height:1.55; }
.arc-hero-actions { display:flex; gap:10px; margin-top:20px; }
.arc-hero-actions button { min-width:178px; padding:13px 18px; border:1px solid var(--cyan); border-radius:6px; color:#051018; background:var(--cyan); font-weight:950; box-shadow:0 0 18px #27efff55; }
.arc-hero-actions .ghost { color:#e8eaff; border-color:#6952c2; background:#15102e; box-shadow:none; }
.hero-features { display:flex; gap:24px; margin-top:22px; color:#ccd0e6; font-size:10px; font-weight:800; }
.hero-status { position:absolute; z-index:3; top:20px; right:18px; width:225px; padding:15px; border:1px solid #4a3b84; background:rgba(8,7,29,.88); box-shadow:0 0 28px #6d52ff22; backdrop-filter:blur(10px); }
.hero-status>small { display:flex; justify-content:space-between; color:#afb5d4; font:800 9px monospace; }
.hero-status>small b { color:var(--lime); }
.hero-status div { display:flex; justify-content:space-between; align-items:end; margin-top:10px; padding:10px; border:1px solid #25204e; background:#0b0c25; }
.hero-status div span { color:#898eaf; font-size:9px; }
.hero-status div strong { color:var(--cyan); font:950 18px monospace; }
.hero-status p { margin:12px 2px 0; color:#8187a7; font-size:9px; line-height:1.4; }

.arc-gamefi-strip { width:100%; max-width:none; display:flex; align-items:center; gap:18px; margin:0 0 14px; padding:16px 20px; border:1px solid #43366f; background:linear-gradient(90deg,#0b0d25,#17103a,#0a1830); }
.arc-gamefi-strip>div:first-child { flex:1; display:grid; }
.arc-gamefi-strip small { color:var(--cyan); font:900 9px monospace; letter-spacing:2px; }
.arc-gamefi-strip strong { font-size:16px; }
.arc-gamefi-pills { display:flex; gap:7px; }
.arc-gamefi-pills span { padding:5px 8px; border:1px solid #35315a; color:#969ab8; font-size:9px; }
#arc-wager-preview { padding:11px 17px; border:1px solid var(--cyan); color:#061016; background:var(--cyan); font-weight:950; }

.arc-portal-grid { display:grid; grid-template-columns:1.35fr 1fr .9fr; gap:12px; margin-bottom:24px; }
.arc-portal-grid article { min-height:220px; border:1px solid #30295c; background:linear-gradient(145deg,#0c0e27,#08091c); box-shadow:0 10px 25px #0006; }
.arc-portal-grid header { display:flex; justify-content:space-between; padding:11px 14px; border-bottom:1px solid #2a2452; color:#dddffc; font:900 10px monospace; letter-spacing:1px; }
.arc-portal-grid header span { color:#8d93b6; font-size:8px; }
.mini-games { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:10px; }
.mini-games button { min-height:162px; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; padding:10px; border:1px solid #4b327e; color:#fff; background:linear-gradient(transparent 20%,#08091cee 76%),var(--mini) center/cover; text-align:left; }
.mini-games button:nth-child(1){--mini:url('images/game-covers/roboRescue.png')}.mini-games button:nth-child(2){--mini:url('images/game-covers/microRacer.png')}.mini-games button:nth-child(3){--mini:url('images/game-covers/emojiSurvivors.png')}
.mini-games b { color:var(--pink); font:950 13px monospace; }.mini-games small { color:#a4a8c0; font-size:8px; }
.portal-tournaments>div { margin:9px 12px; padding:11px; border:1px solid #27234e; background:#0e1028; }.portal-tournaments b{display:block;color:#f2f3ff;font-size:11px}.portal-tournaments small{color:#8f94b1;font-size:9px}
.portal-rewards { padding-bottom:14px; }.portal-rewards>*:not(header){margin-left:15px;margin-right:15px}.portal-rewards>strong{display:block;margin-top:28px;color:var(--cyan);font:950 23px monospace}.portal-rewards p{color:#9fa4bf;font-size:10px;line-height:1.5}.portal-rewards button{width:calc(100% - 30px);padding:11px;border:1px solid var(--pink);color:white;background:#39205f;font-weight:900}

.floor-section{max-width:none}.floor-section::before{content:'ALL ARCADE CABINETS';display:block;margin:18px 0 12px;color:#f5f6ff;font:950 22px monospace;letter-spacing:1px}.floor-controls{padding:12px;border:1px solid #302959;background:#090b21}.floor-grid{counter-reset:arc-cabinet;display:grid!important;grid-template-columns:repeat(3,minmax(270px,1fr))!important;gap:28px!important;padding:18px 2vw 60px!important;perspective:1200px}.floor-grid .tile{--machine:var(--cyan);counter-increment:arc-cabinet;position:relative;min-height:430px!important;display:flex!important;align-items:flex-end!important;overflow:visible!important;padding:0 24px 25px!important;border:3px solid var(--machine)!important;border-radius:24px 24px 10px 10px!important;background:linear-gradient(115deg,#10142d 0 56%,color-mix(in srgb,var(--machine) 23%,#0b0d20) 100%)!important;box-shadow:0 17px 0 #02030a,0 30px 44px #000b,0 0 28px color-mix(in srgb,var(--machine) 24%,transparent);text-align:left;clip-path:polygon(6% 0,94% 0,100% 11%,97% 18%,99% 100%,1% 100%,3% 18%,0 11%);transform:rotateY(-4deg);transform-style:preserve-3d;animation:cabinet-idle 5s ease-in-out infinite alternate}.floor-grid .tile:nth-child(3n+2){--machine:var(--pink);transform:rotateY(0);animation-delay:-1.6s}.floor-grid .tile:nth-child(3n){--machine:var(--lime);transform:rotateY(4deg);animation-delay:-3.2s}.floor-grid .tile::before{content:'ARCADIFY  //  0' counter(arc-cabinet);position:absolute;top:0;left:4%;right:4%;height:46px;display:grid;place-items:center;border-bottom:2px solid color-mix(in srgb,var(--machine) 62%,transparent);color:#fff;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--machine) 24%,transparent),transparent);font:950 11px monospace;letter-spacing:2px;text-shadow:0 0 9px var(--machine)}.floor-grid .tile::after{content:'●    ●     INSERT COIN';position:absolute;left:27px;right:27px;bottom:91px;height:42px;display:flex;align-items:center;justify-content:center;border:1px solid #292d4b;border-radius:7px;color:var(--gold);background:#070916;box-shadow:inset 0 0 13px #000,0 0 10px color-mix(in srgb,var(--machine) 20%,transparent);font:900 9px monospace;letter-spacing:1.5px}.floor-grid .tile .game-cover{display:block;position:absolute;top:61px;left:25px;right:25px;height:215px;border:8px solid #05060d;border-radius:14px;background:var(--cover) center/cover no-repeat;box-shadow:0 0 0 2px #323858,inset 0 0 30px #000,0 0 19px color-mix(in srgb,var(--machine) 32%,transparent)}.tile .emoji{display:none!important}.tile .info{position:relative;z-index:2;width:100%;min-height:72px;padding:11px 0 0}.tile .name{padding-right:95px;color:white!important;font:950 17px monospace!important;text-shadow:0 0 8px var(--machine)}.tile .desc{max-width:68%;color:#aeb3ca!important;font-size:9px!important}.tile .chips{margin-top:7px!important}.floor-grid .tile .info::after{content:'PLAY  ›';position:absolute;right:0;top:17px;padding:8px 10px;border:1px solid var(--machine);color:#061018;background:var(--machine);font:950 9px monospace;box-shadow:0 0 12px color-mix(in srgb,var(--machine) 44%,transparent)}.floor-grid .tile:hover{animation:none;transform:translateY(-10px) rotateY(0) scale(1.025)!important;border-color:#fff!important;box-shadow:0 17px 0 #02030a,0 38px 54px #000c,0 0 38px color-mix(in srgb,var(--machine) 58%,transparent)!important}@keyframes cabinet-idle{from{translate:0 0;rotate:0}to{translate:0 -5px;rotate:.45deg}}.row{max-width:none}

@media(max-width:980px){.arc-main-nav{grid-template-columns:1fr auto}.nav-links,.nav-chain{display:none}#arc-wallet-bar{top:24px;right:25px}#welcome-hero{padding:58px 25px 40px;background-position:62% center}.hero-status{display:none}.hero-copy{max-width:620px}.arc-portal-grid{grid-template-columns:1fr}.floor-grid{grid-template-columns:repeat(2,minmax(270px,1fr))!important}.hero-features{flex-wrap:wrap}}
@media(max-width:620px){#welcome{padding:8px 8px 50px}.arc-main-nav{min-height:58px;padding:6px 10px}.nav-logo b{font-size:19px}#arc-wallet-bar{top:17px;right:14px}#arc-connect{min-width:116px}.arc-main-nav{grid-template-columns:1fr 122px}#welcome-hero{min-height:600px;margin-top:8px;padding:55px 18px 25px;background-position:66% center}#welcome-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#030411ee,#03041199)}#welcome-hero h1{font-size:50px}.hero-copy{position:relative}.hero-features{gap:10px}.arc-gamefi-strip{align-items:stretch;flex-direction:column}.arc-gamefi-pills{flex-wrap:wrap}.mini-games{grid-template-columns:1fr}.floor-grid{grid-template-columns:1fr!important;padding-inline:8px!important}.floor-grid .tile{min-height:410px!important;transform:none!important}}
@media(prefers-reduced-motion:reduce){.floor-grid .tile{animation:none}}

/* Tall, clean, recognisable cabinet silhouette. These overrides intentionally
   replace the earlier card-like cabinet experiment without touching game flow. */
.floor-grid{grid-template-columns:repeat(3,minmax(280px,1fr))!important;gap:42px!important;padding:26px 3vw 80px!important;perspective:1500px}
.floor-grid .tile{min-height:570px!important;padding:0 17% 43px!important;border-width:2px!important;border-radius:22px 22px 8px 8px!important;background:linear-gradient(100deg,#0b0e20 0 63%,color-mix(in srgb,var(--machine) 18%,#080a17) 100%)!important;box-shadow:0 20px 0 #020309,0 38px 54px #000c,0 0 24px color-mix(in srgb,var(--machine) 20%,transparent);clip-path:polygon(12% 0,88% 0,94% 5%,91% 13%,90% 55%,100% 63%,88% 70%,82% 100%,18% 100%,12% 70%,0 63%,10% 55%,9% 13%,6% 5%)}
.floor-grid .tile::before{content:'ARCADIFY  0' counter(arc-cabinet);top:10px;left:11%;right:11%;height:56px;border:2px solid color-mix(in srgb,var(--machine) 70%,#fff);border-radius:12px 12px 5px 5px;background:radial-gradient(circle at center,color-mix(in srgb,var(--machine) 30%,#0a0b17),#070914 74%);font-size:14px;letter-spacing:3px;box-shadow:0 0 18px color-mix(in srgb,var(--machine) 34%,transparent),inset 0 0 18px #000}
.floor-grid .tile::after{content:'●';z-index:3;left:50%;right:auto;top:374px;bottom:auto;width:17px;height:17px;border:3px solid var(--machine);border-radius:50%;color:transparent;background:#080a13;box-shadow:-54px 3px 0 -5px var(--pink),54px 3px 0 -5px var(--lime),0 0 12px color-mix(in srgb,var(--machine) 45%,transparent)}
.floor-grid .tile .game-cover{top:82px;left:13%;right:13%;height:258px;border:12px solid #03040a;border-radius:17px;box-shadow:0 0 0 2px #303653,inset 0 0 35px #000,0 0 20px color-mix(in srgb,var(--machine) 28%,transparent)}
.floor-grid .tile .game-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.13),transparent 25% 78%,rgba(255,255,255,.03));pointer-events:none}
.floor-grid .tile .game-cover::before{content:'';position:absolute;z-index:3;left:50%;bottom:-74px;width:4px;height:52px;background:var(--machine);transform:translateX(-50%) rotate(-9deg);transform-origin:bottom;box-shadow:0 0 9px var(--machine)}
.floor-grid .tile .info{min-height:92px;padding:17px 0 0;border-top:1px solid #2d3150;text-align:center}
.floor-grid .tile .name{padding:0!important;font-size:17px!important}.floor-grid .tile .desc{max-width:none!important}.floor-grid .tile .chips{justify-content:center;margin-top:8px!important}
.floor-grid .tile .info::before{content:'INSERT COIN';display:block;margin:0 auto 10px;width:76px;padding:5px 7px;border:1px solid #3a3d58;border-radius:4px;color:var(--gold);background:#05060c;font:900 8px monospace;letter-spacing:1px;box-shadow:inset 0 0 8px #000}
.floor-grid .tile .info::after{left:50%;right:auto;top:auto;bottom:-27px;translate:-50% 0;padding:8px 16px;border-radius:4px}
.floor-grid .tile:hover{transform:translateY(-10px) rotateY(0) scale(1.018)!important;box-shadow:0 20px 0 #020309,0 42px 58px #000d,0 0 34px color-mix(in srgb,var(--machine) 50%,transparent)!important}
@media(max-width:980px){.floor-grid{grid-template-columns:repeat(2,minmax(280px,1fr))!important}}
@media(max-width:620px){.floor-grid{grid-template-columns:1fr!important;padding-inline:8px!important}.floor-grid .tile{min-height:540px!important;transform:none!important}}