@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { color-scheme:dark; --ink:#f7f4ff; --muted:#b8afcc; --paper:#160f25; --card:#251a3b; --surface:#302247; --accent:#ffaf40; --violet:#bca5ff; --primary:#7048e8; --line:#49365f; --shadow:0 18px 50px rgba(0,0,0,.3); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:radial-gradient(ellipse at 80% 8%,#34205288,transparent 42%),var(--paper); font-family:'DM Sans',sans-serif; }
button,input,select { font:inherit; color:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.noise { position:fixed; inset:0; pointer-events:none; opacity:.07; 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='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E"); }
.shell { width:min(1180px,calc(100% - 40px)); margin-inline:auto; }
.nav { height:84px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); font:800 18px 'Manrope'; text-decoration:none; }
.brand-mark { width:38px; height:38px; display:grid; place-items:center; background:var(--accent); color:var(--accent); border-radius:11px; font-size:13px; transform:rotate(-3deg); }
nav { display:flex; align-items:center; gap:30px; }
nav a { color:var(--muted); text-decoration:none; font-weight:600; font-size:14px; }
.watch-button { border:1px solid var(--ink); background:transparent; border-radius:999px; padding:10px 15px; cursor:pointer; font-weight:700; }
.watch-button span { display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 5px; border-radius:20px; color:#fff; background:var(--primary); font-size:11px; }
.login-button,.user-chip { border:0; border-radius:999px; padding:11px 15px; color:#fff; background:var(--primary); cursor:pointer; font-weight:800; font-size:12px; }.user-chip { display:flex; align-items:center; gap:7px; padding:5px 11px 5px 5px; }.user-chip img { width:30px; height:30px; border-radius:50%; }
.hero { min-height:590px; display:grid; grid-template-columns:1.12fr .88fr; align-items:center; gap:40px; }
.eyebrow { margin:0 0 18px; text-transform:uppercase; letter-spacing:.13em; font-size:12px; font-weight:800; color:var(--muted); }
.eyebrow span { display:inline-block; width:24px; height:3px; margin:0 8px 3px 0; background:var(--primary); border-radius:4px; }
h1,h2,h3 { font-family:'Manrope',sans-serif; }
h1 { margin:0; font-size:clamp(50px,6.4vw,88px); line-height:.98; letter-spacing:-.065em; }
h1 em { color:var(--violet); font-style:normal; }
.intro { max-width:640px; margin:26px 0 28px; color:var(--muted); font-size:18px; line-height:1.65; }
.search { max-width:650px; display:grid; grid-template-columns:24px 1fr auto; align-items:center; gap:10px; padding:7px 7px 7px 18px; background:var(--card); border:1px solid var(--line); border-radius:17px; box-shadow:0 15px 40px rgba(35,31,25,.09); }
.search svg { width:22px; fill:none; stroke:#757982; stroke-width:1.8; }
.search input { min-width:0; padding:12px 4px; border:0; outline:0; font-size:15px; }
.search button { padding:13px 23px; border:0; border-radius:12px; color:white; background:var(--accent); font-weight:800; cursor:pointer; }
.trust-row { display:flex; gap:25px; margin-top:20px; color:var(--muted); font-size:12px; }
.hero-art { position:relative; height:440px; display:grid; place-items:center; }
.hero-art::before { content:''; position:absolute; width:330px; height:330px; border-radius:46% 54% 59% 41%; background:radial-gradient(circle,#8850cb88,#60348c22); transform:rotate(-10deg); }
.hero-art { min-width:0; overflow:hidden; }
.supplier-button { display:block; margin-top:12px; padding:9px 12px; border:1px solid var(--violet); border-radius:8px; background:transparent; color:var(--violet); cursor:pointer; font-weight:700; }
.admin-profile { margin:24px 0; padding:20px; border:1px solid var(--line); border-radius:14px; }
.admin-profile[hidden] { display:none; }
.admin-profile p { font-size:13px; color:var(--muted); line-height:1.5; }
.admin-add { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.admin-add input { flex:1; min-width:120px; width:100%; padding:10px; border:1px solid var(--line); border-radius:8px; }
.admin-add button,.admin-account button { padding:9px 12px; border:0; border-radius:8px; background:var(--accent); color:white; cursor:pointer; }
.admin-account { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 0; border-bottom:1px solid var(--line); }
.admin-account span { min-width:0; overflow-wrap:anywhere; }
.admin-account small { display:block; color:var(--violet); }
.cover-window { position:relative; z-index:2; width:100%; overflow:hidden; padding:28px 0; transform:rotate(-6deg); -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
.cover-track { display:flex; width:max-content; will-change:transform; animation:cover-scroll 40s linear infinite; }
@media(hover:hover) and (pointer:fine) { .cover-window:hover .cover-track { animation-play-state:paused; } }
.cover-group { display:flex; flex:none; gap:16px; padding-right:16px; }
.hero-cover { position:relative; flex:0 0 185px; width:185px; height:270px; overflow:hidden; border:5px solid var(--surface); border-radius:18px; background:linear-gradient(145deg,#191b22,#5c41df); box-shadow:0 14px 24px #191b2226; }
.hero-cover img { width:100%; height:100%; object-fit:cover; }
.hero-cover span { position:absolute; inset:auto 0 0; padding:35px 12px 14px; background:linear-gradient(transparent,#111e); color:white; font:800 13px 'Manrope',sans-serif; line-height:1.4; }
@keyframes cover-scroll { from { transform:translate3d(0,0,0); } to { transform:translate3d(-50%,0,0); } }
@media(prefers-reduced-motion:reduce) { .cover-track { animation:none; } }
.orbit { position:absolute; border:1px solid rgba(188,165,255,.22); border-radius:50%; }
.orbit-one { width:420px; height:280px; transform:rotate(28deg); }.orbit-two { width:290px; height:430px; transform:rotate(62deg); }
.float-card { position:relative; z-index:2; width:250px; padding:13px; background:var(--card); border:1px solid var(--line); border-radius:25px; box-shadow:var(--shadow); transform:rotate(5deg); }
.cover-placeholder { height:230px; display:grid; place-items:center; overflow:hidden; border-radius:17px; background:radial-gradient(circle at 70% 25%,#b9aaff,transparent 25%),linear-gradient(145deg,#191b22,#5c41df); color:white; font:800 43px 'Manrope'; letter-spacing:-.08em; }
.deal-card .discount { position:absolute; right:-15px; top:24px; padding:9px 12px; border-radius:9px; background:var(--accent); color:var(--accent); font-weight:800; }
.deal-card>div:last-child { display:grid; grid-template-columns:1fr auto; align-items:end; padding:15px 5px 4px; }.deal-card small { grid-column:1/-1; color:#777; font-weight:700; }.deal-card strong { font:800 27px 'Manrope'; }.old-price { color:#999; text-decoration:line-through; }
.mini-tag { position:absolute; z-index:3; padding:10px 15px; border:1px solid var(--ink); background:var(--paper); border-radius:99px; font:800 11px 'Manrope'; }.tag-one { left:5%; top:24%; transform:rotate(-12deg); }.tag-two { right:4%; bottom:20%; transform:rotate(9deg); }
.offers { padding:80px 0 100px; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:25px; }.section-head h2,.how h2 { margin:0; font-size:clamp(35px,4vw,54px); letter-spacing:-.045em; }
.sort-label { color:var(--muted); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.sort-label select { display:block; min-width:180px; margin-top:7px; padding:11px 36px 11px 13px; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--ink); }
.chips { display:flex; gap:9px; overflow-x:auto; padding-bottom:25px; }.chips button { white-space:nowrap; padding:10px 16px; border:1px solid var(--line); background:transparent; border-radius:99px; cursor:pointer; font-weight:700; color:var(--muted); }.chips button.active { color:#fff; border-color:var(--ink); background:var(--accent); }
.status { min-height:24px; color:var(--muted); font-size:14px; }
.game-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:14px; }
.game-card { min-width:0; position:relative; overflow:hidden; background:var(--card); border:1px solid var(--line); border-radius:18px; transition:transform .25s,box-shadow .25s; }.game-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); }
.game-cover { aspect-ratio:16/10; width:100%; object-fit:cover; display:block; background:#262834; }.card-discount { position:absolute; left:12px; top:12px; padding:7px 9px; color:var(--ink); background:var(--accent); border-radius:8px; font-weight:800; font-size:12px; }
.heart { position:absolute; right:10px; top:10px; width:34px; height:34px; display:grid; place-items:center; border:0; border-radius:50%; background:rgba(22,15,37,.92); cursor:pointer; font-size:19px; }.heart.saved { color:var(--violet); }
.card-body { padding:15px; }.store { color:var(--violet); text-transform:uppercase; letter-spacing:.08em; font-size:10px; font-weight:800; }.card-body h3 { min-height:44px; margin:8px 0 15px; font-size:16px; line-height:1.35; letter-spacing:-.02em; }
.price-row { display:flex; align-items:end; justify-content:space-between; gap:10px; }.price small { display:block; margin-bottom:1px; color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }.price strong { display:block; font:800 23px 'Manrope'; }.price del { color:#999; font-size:12px; }.compare { border:0; padding:10px 14px; border-radius:9px; background:var(--accent); color:#20112e; cursor:pointer; font-weight:800; font-size:12px; text-decoration:none; }
.load-more { display:block; margin:34px auto 0; padding:13px 20px; border:1px solid var(--ink); border-radius:12px; background:transparent; font-weight:800; }
.skeleton { height:325px; border-radius:18px; background:linear-gradient(100deg,#251a3b 20%,#392850 35%,#251a3b 50%); background-size:300% 100%; animation:shimmer 1.4s infinite; }@keyframes shimmer{to{background-position:-150% 0}}
.how { padding:80px 0; border-top:1px solid var(--line); display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; }.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }.steps article { padding:25px 20px; border-top:3px solid var(--ink); }.steps b { color:var(--violet); font:800 12px 'Manrope'; }.steps h3 { margin:25px 0 8px; }.steps p { margin:0; color:var(--muted); line-height:1.5; font-size:14px; }
footer { min-height:150px; display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; gap:30px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }footer p:last-child{text-align:right}
dialog { width:min(720px,calc(100% - 30px)); max-height:85vh; padding:0; border:0; border-radius:22px; box-shadow:0 30px 100px rgba(0,0,0,.3); }dialog::backdrop { background:rgba(15,16,20,.65); backdrop-filter:blur(5px); }.dialog-close { position:absolute; right:14px; top:14px; z-index:2; width:35px; height:35px; border:0; border-radius:50%; background:var(--surface); font-size:24px; cursor:pointer; }.dialog-head { display:grid; grid-template-columns:150px 1fr; gap:20px; padding:25px; background:var(--paper); }.dialog-head img { width:100%; border-radius:12px; }.dialog-head h2 { margin:10px 0; font-size:29px; }.deal-list { padding:12px 25px 25px; }.deal-row { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:18px; padding:15px 0; border-bottom:1px solid var(--line); }.deal-row strong { font:800 18px 'Manrope'; }.buy { padding:10px 14px; color:#fff; background:var(--accent); border-radius:9px; text-decoration:none; font-size:12px; font-weight:800; }.buy.whatsapp { background:#138f4e; text-align:center; }
.account-dialog,.alert-dialog { width:min(560px,calc(100% - 28px)); }.account-content,.alert-form { padding:32px; }.account-content h2,.alert-form h2 { margin:0 0 24px; font-size:31px; }.setup-note,.empty-state { padding:18px; border-radius:12px; background:var(--surface); color:var(--muted); line-height:1.5; }.account-user { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px 0 20px; border-bottom:1px solid var(--line); }.account-user button,.alert-form>button { border:0; padding:11px 16px; border-radius:10px; color:#fff; background:var(--accent); cursor:pointer; font-weight:800; }.saved-row { display:grid; grid-template-columns:60px 1fr auto; align-items:center; gap:13px; padding:13px 0; border-bottom:1px solid var(--line); }.saved-row img { width:60px; height:42px; border-radius:8px; object-fit:cover; }.saved-row b,.saved-row span { display:block; }.saved-row span { margin-top:4px; color:var(--muted); font-size:12px; }.saved-row button { border:0; background:transparent; color:#999; font-size:22px; cursor:pointer; }.alert-form label { display:block; font-weight:800; }.alert-form>p { color:var(--muted); font-size:13px; }.crc-input { display:flex; align-items:center; gap:8px; margin-top:8px; padding:4px 14px; border:1px solid var(--line); border-radius:12px; }.crc-input input { width:100%; padding:10px 0; border:0; outline:0; font-size:18px; }.alert-form>button { width:100%; margin-top:12px; background:var(--primary); }
@media(max-width:950px){.hero{grid-template-columns:1fr; padding-top:75px}.hero-art{height:280px;max-width:580px;width:100%;justify-self:center}.hero-art::before{width:230px;height:230px}.hero-art .orbit{display:none}.hero-art .mini-tag{display:none}.hero-cover{height:220px;flex-basis:155px;width:155px}.game-grid{grid-template-columns:repeat(3,1fr)}.how{grid-template-columns:1fr;gap:40px}}
@media(max-width:700px){.shell{width:min(100% - 24px,1180px)}.nav{height:68px}.nav nav>a{display:none}.nav nav{gap:6px}.brand>span:last-child{display:none}.login-button{padding:9px 10px;font-size:10px}.hero{min-height:560px;padding-top:45px}.trust-row{flex-wrap:wrap;gap:8px 15px}.search{grid-template-columns:22px 1fr}.search button{grid-column:1/-1}.section-head{align-items:flex-start;flex-direction:column}.game-grid{grid-template-columns:repeat(2,1fr);gap:10px}.card-body{padding:12px}.card-body h3{font-size:14px}.steps{grid-template-columns:1fr}.how{padding:60px 0}footer{grid-template-columns:1fr;padding:35px 0}footer p:last-child{text-align:left}.dialog-head{grid-template-columns:95px 1fr}.deal-row{grid-template-columns:1fr auto}.deal-row .discount-copy{display:none}}
@media(max-width:420px){.game-grid{grid-template-columns:1fr}.game-cover{aspect-ratio:2/1}}

.currency-control { display:grid; gap:3px; font-size:10px; font-weight:700; color:var(--muted); }
.currency-control select { background:var(--card); border:1px solid var(--line); padding:7px 9px; border-radius:9px; color:var(--ink); font-weight:700; }
.registration-country,.profile-preferences { display:grid; gap:9px; font-size:14px; font-weight:700; }
.registration-country select,.profile-preferences select { width:100%; padding:11px; border:1px solid var(--line); border-radius:10px; background:var(--card); }
.profile-preferences { padding:20px 0; border-bottom:1px solid var(--line); }
.profile-preferences button { justify-self:start; padding:10px 14px; border:0; border-radius:9px; background:var(--accent); color:white; cursor:pointer; }
.account-note,.profile-preferences p { font-size:12px; line-height:1.6; color:var(--muted); font-weight:400; }
.account-note a,.legal-body a { color:var(--violet); }
.error { color:#ff9898; }
.legal-links { display:flex; flex-wrap:wrap; gap:12px; }
.legal-links a { font-size:12px; color:var(--muted); }
.back-link { color:var(--ink); font-size:14px; text-decoration:none; }
.legal-page { max-width:860px; padding:70px 0 80px; }
.legal-page h1 { font-size:clamp(38px,6vw,68px); line-height:1.08; letter-spacing:-.045em; }
.legal-intro { color:var(--muted); font-size:21px; line-height:1.5; }
.legal-date { color:var(--muted); font-size:12px; }
.legal-tabs { display:flex; gap:10px; flex-wrap:wrap; margin:30px 0; }
.legal-tabs a { padding:10px 15px; border:1px solid var(--line); border-radius:99px; color:var(--ink); text-decoration:none; }
.legal-tabs a[aria-current="page"] { background:var(--accent); color:white; }
.legal-body { background:var(--card); padding:clamp(22px,5vw,44px); border:1px solid var(--line); border-radius:22px; }
.legal-body section+section { border-top:1px solid var(--line); margin-top:28px; padding-top:20px; }
.legal-body h2 { font-size:22px; line-height:1.4; letter-spacing:-.025em; }
.legal-body p,.legal-contact p { color:var(--muted); font-size:15px; line-height:1.85; }
.legal-contact { margin-top:28px; padding:28px; border-radius:18px; background:var(--surface); }
.legal-contact h2 { font-size:23px; }
.legal-contact .buy { display:inline-block; margin-top:10px; }
.price-row { flex-wrap:wrap; }
.price strong { font-size:clamp(18px,2vw,23px); overflow-wrap:anywhere; }
@media(max-width:1100px){.nav nav{gap:12px}.nav nav>a{display:none}}
@media(max-width:700px){.nav{height:auto;min-height:76px;padding-block:12px;gap:8px}.nav nav{flex-wrap:wrap;justify-content:flex-end;gap:6px}.watch-button{font-size:12px;padding:8px 10px}.currency-control{font-size:9px}.legal-page{padding-top:40px}.legal-links{gap:10px}.back-link{font-size:12px}}
.platform-tabs { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.platform-tabs button { padding:12px 24px; border:1px solid var(--line); border-radius:12px; background:var(--card); cursor:pointer; font-weight:800; color:var(--ink); }
.platform-tabs button.active { color:white; background:var(--accent); border-color:var(--ink); }
.platform-tabs button[data-platform="playstation"].active { background:#1649bc; border-color:#1649bc; }
.platform-tabs button[data-platform="xbox"].active { background:#107c10; border-color:#107c10; }
.console-info { margin-bottom:20px; padding:18px; border:1px solid var(--line); border-radius:14px; }
.console-info p { color:var(--muted); line-height:1.6; margin:0 0 12px; }
.console-info .buy { display:inline-block; }
.console-cover { aspect-ratio:16/10; padding:24px; display:flex; flex-direction:column; justify-content:space-between; background:linear-gradient(135deg,#122d6b,#1c62cf); color:white; }
.xbox .console-cover { background:linear-gradient(135deg,#073b20,#128431); }
.console-cover span { font-size:11px; font-weight:700; letter-spacing:.08em; }
.console-cover strong { font:800 25px 'Manrope',sans-serif; line-height:1.15; }
.console-price { color:var(--muted); margin:0 0 18px; font-size:15px; }
.console-card .buy-card { display:inline-block; }
[hidden] { display:none !important; }

/* Warm purchase accents on deep purple surfaces. */
.brand-mark { color:#20112e; }
.watch-button,.load-more { color:var(--ink); border-color:var(--line); background:var(--card); }
.search input,.crc-input input { color:var(--ink); background:transparent; }
input::placeholder { color:var(--muted); opacity:1; }
.search button,.admin-add button,.admin-account button,.account-user button,
.profile-preferences button,.buy,.chips button.active,.platform-tabs button.active,
.legal-tabs a[aria-current="page"] { color:#20112e; }
.alert-form>button,.buy.whatsapp,.platform-tabs button[data-platform="playstation"].active,
.platform-tabs button[data-platform="xbox"].active { color:white; }
.platform-tabs button.active,.chips button.active { border-color:var(--accent); }
.mini-tag { border-color:var(--line); background:var(--card); color:var(--ink); }
dialog { color:var(--ink); background:var(--card); border:1px solid var(--line); }
.registration-country select,.profile-preferences select { color:var(--ink); }
.price strong { color:var(--accent); }
.compare:hover,.search button:hover { background:#ffc26b; }
.login-button:hover,.alert-form>button:hover { background:#8058ef; }
:where(a,button,input,select):focus-visible { outline:2px solid var(--accent); outline-offset:4px; }