/* Tema UpDreamer (estilo do topo da página inicial) aplicado ao site inteiro por cima do visual do bundle. Formas e animações valem nos dois temas; as cores escuras só no escuro. */ :root{--dr-ink:#0b0a10;--dr-panel:#14121b;--dr-line:#ffffff12;--dr-violet:#a57bef;--dr-grad:linear-gradient(135deg,#8455ee,#6d3fd8)} /* Fundo: grade discreta e brilho roxo no topo da página */ /* O fundo fica no html (tela inteira); o body transparente deixa a grade aparecer. */ html:not([data-theme="light"]){background:var(--dr-ink) radial-gradient(1100px 520px at 50% -140px,#2b1d48 0%,transparent 72%) no-repeat!important} html:not([data-theme="light"]) body{background:transparent!important} html:not([data-theme="light"]) body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(#ffffff06 1px,transparent 1px),linear-gradient(90deg,#ffffff06 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:linear-gradient(to bottom,#000 0%,transparent 75%);mask-image:linear-gradient(to bottom,#000 0%,transparent 75%)} /* Cabeçalho translúcido */ html:not([data-theme="light"]) .app-shell>header{background:#0b0a10c4!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--dr-line)!important} .app-shell>header .header-search{border-radius:12px} /* Títulos */ .section-heading h2,.game-market-heading h1,.seller-banner h2{font-family:Manrope,"DM Sans",Inter,system-ui,sans-serif;font-weight:800;letter-spacing:-.035em} .section-heading h2{font-size:clamp(24px,2.3vw,34px)} /* Botões principais */ html:not([data-theme="light"]) .app-shell button.primary,html:not([data-theme="light"]) .app-shell a.primary{background:var(--dr-grad)!important;border-color:transparent!important;color:#fff!important;box-shadow:none;transition:transform .2s,box-shadow .2s} .app-shell button.primary:not(:disabled):hover,.app-shell a.primary:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:none} /* Categorias populares */ .universe-tile{border-radius:12px!important;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s!important} .universe-tile:hover{transform:translateY(-4px)!important;border-color:#b794f6!important;box-shadow:0 0 0 1px #b794f655} .universe-cover{border-radius:12px!important} .universe-tile:hover .game-icon{scale:1.08} /* Cartões de anúncio */ .product-card{border-radius:12px!important;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s!important} html:not([data-theme="light"]) .product-card{background:linear-gradient(180deg,#18151f,#110f16)!important;border:1px solid var(--dr-line)!important} .product-card:hover{transform:translateY(-4px)!important;border-color:#b794f6aa!important;box-shadow:none!important} .product-card .product-art{border-radius:0!important;overflow:hidden} .product-card .product-art img{transition:scale .5s ease} .product-card:hover .product-art img{scale:1.06} html:not([data-theme="light"]) .product-card .price-row strong{color:#fff;font-weight:800;letter-spacing:-.02em} /* Página de categoria: cabeçalho vira painel no estilo do topo */ .game-market-heading{position:relative;overflow:hidden;padding:30px 30px!important;margin:10px 0 22px!important;border:1px solid var(--dr-line)!important;border-radius:12px} html:not([data-theme="light"]) .game-market-heading{background:radial-gradient(90% 120% at 0% 0%,#2b1d48 0%,#15121c 55%,#0f0d14 100%)} .game-market-heading::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000);mask-image:linear-gradient(90deg,transparent 30%,#000)} .game-market-heading>*{position:relative;z-index:1} .game-market-heading h1{font-size:clamp(30px,3.4vw,48px)!important} .game-market-cover,.game-market-heading .game-icon{border-radius:12px!important;box-shadow:none} .game-filters{border-radius:12px!important} html:not([data-theme="light"]) .game-filters{background:var(--dr-panel)!important;border-color:var(--dr-line)!important} .game-results-tools .search,.game-results-tools .select-trigger{border-radius:12px!important} /* Banner "Venda na UpDreamer" */ .seller-banner{border-radius:12px!important;overflow:hidden} /* Entrada suave das seções */ @media (prefers-reduced-motion:no-preference){ .app-shell>main>section{animation:dr-section .7s ease-out both} .app-shell>main>section:nth-child(2){animation-delay:.08s} .app-shell>main>section:nth-child(3){animation-delay:.16s} @keyframes dr-section{from{opacity:0;translate:0 16px}} } /* Cabeçalho mais limpo: sem o gladiador animado no logo e sem o atalho "P" na busca */ .app-shell>header .dr-gladiator{display:none!important} .app-shell>header .header-search kbd{display:none!important} /* Botão Anunciar preenchido (pílula roxa) */ .app-shell>header .sell-nav.dr-anunciar{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 22px!important;border:0!important;border-radius:999px!important;background:var(--dr-grad)!important;color:#fff!important;font-weight:700!important;font-size:14px;box-shadow:none;animation:none!important;transition:transform .2s,box-shadow .2s,filter .2s} .app-shell>header .sell-nav.dr-anunciar::before,.app-shell>header .sell-nav.dr-anunciar::after{display:none!important} .app-shell>header .sell-nav.dr-anunciar svg{display:none} .app-shell>header .sell-nav.dr-anunciar:hover{transform:translateY(-1px);filter:brightness(1.08)} /* O tema do bundle deixa o Anunciar transparente em :hover/:active (fica "preto"): mantém o roxo em todos os estados, nos dois temas. */ html[data-theme] .app-shell>header .sell-nav.dr-anunciar:is(:hover,:active,:focus,:focus-visible), html:not([data-theme]) .app-shell>header .sell-nav.dr-anunciar:is(:hover,:active,:focus,:focus-visible){background:var(--dr-grad)!important;color:#fff!important;border:0!important;outline:none} html .app-shell>header .sell-nav.dr-anunciar:active{transform:translateY(0) scale(.97)} html .app-shell>header .sell-nav.dr-anunciar:focus-visible{box-shadow:0 0 0 3px #b794f666!important} /* Painel (tabelas do admin/moderação): botões de ação discretos, lado a lado */ .cc-panel td>.dr-staff-entry{display:inline-flex;margin:0 4px 4px 0} .cc-panel td>.row-actions{display:inline-flex;flex-wrap:wrap;gap:4px;margin:0 4px 4px 0} .cc-panel td button.secondary{display:inline-flex;align-items:center;height:28px;min-height:0;padding:0 10px!important;border:1px solid transparent!important;border-radius:8px!important;font-size:12.5px!important;font-weight:500!important;letter-spacing:0;line-height:1;white-space:nowrap;box-shadow:none!important;transition:background .15s,color .15s,border-color .15s} .cc-panel td button.dr-instant{margin:0 4px 4px 0} html:not([data-theme="light"]) .cc-panel td button.secondary{background:#ffffff0a!important;color:#cfc9da!important} html:not([data-theme="light"]) .cc-panel td button.secondary:hover:not(:disabled){background:#ffffff14!important;border-color:#ffffff1a!important;color:#fff!important} html:not([data-theme="light"]) .cc-panel td .row-actions button.secondary:last-child:hover:not(:disabled){background:#ff5a6a1a!important;border-color:#ff5a6a33!important;color:#ff9aa5!important} html[data-theme="light"] .cc-panel td button.secondary{background:#f3f0f8!important;color:#3b3050!important} html[data-theme="light"] .cc-panel td button.secondary:hover:not(:disabled){background:#e9e3f4!important} .cc-panel td button.secondary:disabled{opacity:.45} /* Página inicial: sem o bloco "Explore as categorias" (links de SEO). Nas categorias ele continua. */ html.dr-home-hero .dr-seo-discovery{display:none!important} /* Topo mais baixo no computador (64 px) */ @media (min-width:1100px){ .app-shell>header{height:64px!important;min-height:0!important} .app-shell>header>.header-search{height:40px!important} .app-shell>header .sell-nav.dr-anunciar{height:36px!important;padding:0 18px!important;font-size:13.5px!important} .app-shell>header .brand{font-size:27px!important} .app-shell>header .dr-theme-toggle,.app-shell>header .account{min-height:36px!important;height:36px!important} } /* Botão de tema no topo (também logado) */ .app-shell>header .dr-theme-toggle{display:inline-grid;place-items:center;width:36px;height:36px;padding:0!important;border-radius:10px!important;border:1px solid transparent!important;background:transparent!important;color:inherit;cursor:pointer} .app-shell>header .dr-theme-toggle:hover{background:#ffffff0f!important} html[data-theme="light"] .app-shell>header .dr-theme-toggle:hover{background:#0000000a!important} /* Rodapé compacto. As colunas são