@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#0b0e17;--panel:#121724;--text:#f0f1f5;--muted:#8b91a5;--line:#252b3b;--accent:#d8ff3e;--orange:#ff754d;--purple:#9d84ff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'Space Grotesk',sans-serif;overflow-x:hidden}.noise{position:fixed;inset:0;opacity:.035;pointer-events:none;z-index:10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.topbar{height:82px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 5vw;gap:5vw;position:relative;z-index:2;background:rgba(11,14,23,.82);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-weight:700;letter-spacing:-1px;font-size:20px}.brand span:last-child span{color:var(--accent)}.brand-mark{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--accent);color:var(--accent);font-size:12px;border-radius:50%;padding-left:2px}.topbar nav{display:flex;gap:30px;flex:1}.topbar nav a{color:var(--muted);text-decoration:none;font-size:13px}.topbar nav a:hover{color:var(--text)}.header-actions{display:flex;gap:12px;align-items:center}.ghost-btn,.filter-btn{border:1px solid var(--line);background:transparent;color:var(--text);border-radius:5px;padding:11px 15px;font:500 12px 'DM Mono',monospace}.ghost-btn span{color:var(--accent);margin-left:8px}.icon-btn{display:none;background:none;border:0;color:var(--text);font-size:22px}.hero{max-width:1280px;margin:0 auto;padding:95px 5vw 80px;min-height:520px;display:flex;justify-content:space-between;position:relative;overflow:hidden}.hero-copy{max-width:590px;position:relative;z-index:1}.eyebrow,.drawer-kicker{font:500 11px 'DM Mono',monospace;letter-spacing:1.4px;color:var(--accent)}.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin-right:6px;box-shadow:0 0 12px var(--accent)}h1{font-size:clamp(48px,7vw,88px);line-height:.98;letter-spacing:-5px;margin:25px 0;color:#fafafa}h1 em{color:var(--accent);font-style:normal}p{color:var(--muted);line-height:1.6;font-size:15px}.hero-copy>p{max-width:420px}.hero-cta{display:flex;gap:22px;align-items:center;margin-top:30px}.primary-btn{background:var(--accent);color:#0b0e17;text-decoration:none;padding:14px 18px;border-radius:4px;font-weight:700;font-size:13px}.primary-btn span{font-size:18px;margin-left:20px}.hero-note{font:11px 'DM Mono',monospace;color:var(--muted)}.hero-art{width:430px;height:350px;position:relative;margin-right:4vw}.art-card{position:absolute;width:265px;height:330px;border-radius:8px;transform:rotate(8deg)}.card-back{background:#252c46;right:30px;top:18px;opacity:.65;transform:rotate(17deg)}.card-main{background:linear-gradient(150deg,#ff704a,#9d68e9);right:85px;top:5px;padding:20px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:30px 25px 70px #0008}.card-top,.card-bottom{display:flex;justify-content:space-between;font:10px 'DM Mono',monospace}.card-game{height:190px;background:#111628;border-radius:4px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;transform:rotate(-8deg)}.card-game strong{font-size:23px;line-height:.9;text-align:center;letter-spacing:-1px}.pixel-face{width:54px;height:54px;border:4px solid var(--accent);color:var(--accent);display:grid;place-items:center;font-size:30px}.orbit{border:1px dashed #41485b;border-radius:50%;position:absolute}.o1{width:380px;height:180px;top:60px;left:0;transform:rotate(-26deg)}.o2{width:300px;height:140px;top:90px;left:30px;transform:rotate(34deg)}.orb{position:absolute;z-index:1;color:var(--bg);display:grid;place-items:center}.orb-a{background:var(--accent);width:35px;height:35px;border-radius:50%;top:24px;right:100px}.orb-b{background:var(--orange);width:27px;height:27px;transform:rotate(45deg);bottom:35px;left:54px;font-size:12px}.orb-c{background:var(--purple);width:18px;height:18px;border-radius:50%;top:55px;left:45px;font-size:9px}.toolbar{max-width:1180px;margin:0 auto;padding:24px 5vw;border-top:1px solid var(--line);display:flex;align-items:center;gap:22px}.section-label{font:500 11px 'DM Mono',monospace;letter-spacing:1px;white-space:nowrap}.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--orange);margin-right:8px}.search-wrap{margin-left:auto;max-width:270px;display:flex;gap:10px;align-items:center;border-bottom:1px solid var(--line);padding:8px 0}.search-wrap span{font-size:22px;color:var(--accent)}.search-wrap input{background:none;border:0;color:var(--text);outline:none;font:13px 'Space Grotesk',sans-serif;width:220px}.category-bar{max-width:1180px;margin:0 auto;padding:0 5vw 25px;display:flex;gap:8px;overflow:auto}.cat-pill{border:1px solid var(--line);background:transparent;color:var(--muted);font:11px 'DM Mono',monospace;padding:9px 12px;border-radius:3px;white-space:nowrap;cursor:pointer}.cat-pill.active,.cat-pill:hover{background:var(--accent);border-color:var(--accent);color:#0b0e17}.game-grid{max-width:1180px;margin:0 auto;padding:0 5vw 20px;display:grid;grid-template-columns:repeat(4,1fr);gap:22px 14px}.game-card{text-decoration:none;color:var(--text);min-width:0;cursor:pointer}.thumb{aspect-ratio:1.35;overflow:hidden;background:#171c2b;border-radius:4px;position:relative;border:1px solid transparent;transition:.3s}.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.45s}.thumb:after{content:'JUGAR →';position:absolute;inset:auto 10px 10px auto;background:var(--accent);color:#0b0e17;padding:7px 8px;font:700 10px 'DM Mono',monospace;opacity:0;transform:translateY(5px);transition:.25s}.game-card:hover .thumb{border-color:var(--accent)}.game-card:hover .thumb img{transform:scale(1.06);opacity:.72}.game-card:hover .thumb:after{opacity:1;transform:none}.placeholder{height:100%;display:grid;place-items:center;font-size:38px;color:#343c58;background:linear-gradient(130deg,#1a2031,#101421)}.game-info{padding-top:10px}.game-title{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.game-meta{display:flex;gap:10px;color:var(--muted);font:10px 'DM Mono',monospace;margin-top:6px;text-transform:uppercase}.game-meta span:first-child{color:var(--accent)}.load-more-wrap{text-align:center;padding:25px 0 85px}.load-more{border:1px solid var(--line);color:var(--text);background:transparent;padding:13px 20px;font:11px 'DM Mono',monospace;cursor:pointer}.load-more:hover{border-color:var(--accent);color:var(--accent)}footer{border-top:1px solid var(--line);padding:35px 5vw;display:flex;align-items:center;gap:18px;color:var(--muted);font-size:12px}footer p{margin:0;font-size:12px}.footer-meta{margin-left:auto;font:10px 'DM Mono',monospace;color:#596076}.footer-brand{display:flex;align-items:center;gap:7px;color:var(--text)}.footer-brand .brand-mark{width:20px;height:20px;font-size:9px}.drawer{position:fixed;inset:0;background:#080a10cc;backdrop-filter:blur(8px);z-index:20;display:none}.drawer.open{display:block}.drawer-inner{background:var(--panel);border-left:1px solid var(--line);position:absolute;right:0;top:0;height:100%;width:min(390px,100%);padding:40px;box-shadow:-20px 0 80px #0008}.close{position:absolute;right:28px;top:25px;background:none;border:0;color:var(--muted);font-size:30px}.drawer h2{font-size:38px;line-height:1;letter-spacing:-2px;margin:25px 0 35px}.drawer-options{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:800px){.topbar{padding:0 20px}.topbar nav{display:none}.icon-btn{display:block}.ghost-btn{display:none}.hero{padding:70px 20px 60px;min-height:600px}.hero-art{position:absolute;opacity:.45;right:-170px;top:220px}.hero-copy{max-width:100%}.hero-cta{align-items:flex-start;flex-direction:column;gap:16px}.toolbar{padding:20px;flex-wrap:wrap}.search-wrap{order:3;width:100%;max-width:none;margin:0}.search-wrap input{width:100%}.category-bar{padding:0 20px 20px}.game-grid{padding:0 20px;grid-template-columns:repeat(2,1fr);gap:22px 10px}.game-title{font-size:13px}footer{padding:30px 20px;flex-wrap:wrap}.footer-meta{width:100%;margin:0}}
