/* ===== Topbar (landing · hub · honrarias · assets) =====================
   visitante: logo | menu centralizado | Entrar · Criar conta
   logado:     logo + menu à esquerda ................ [Edição Beta] avatar ⚙  */

/* NexABuild · Início (hub) e landing */
body{overflow:auto;background:var(--bg0);color:var(--tx)}
.hub-top{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:14px;padding:12px 28px;background:var(--bg1);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .land-top {
    position: sticky;
    top: 0;
    z-index: 50;
    padding: 12px 28px;
    background: var(--bg1);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 16px;
  }
  .land-top .main-header {
    display: flex;
    align-items: center;
    gap: 18px;
    flex: 1;
  }
  .land-top .brand { flex: 0 0 auto; }

  /* visitante: menu centralizado, botões à direita */
  .land-top .land-nav {
    flex: 1;
    justify-content: center;
    gap: 20px;
    margin: 0;
    display: flex;
    align-items: center;
  }
  .land-nav a { color: var(--tx2); text-decoration: none; font-weight: 500; white-space: nowrap; }
  .land-nav a:hover { color: #fff; }
  .land-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; }

  /* logado: menu encosta na logo, conta fica na ponta direita */
  .land-top.is-auth .main-header { gap: 18px; flex: 0 0 auto; min-width: 0; }
  .land-top.is-auth .land-nav,
  .land-top.is-auth .hub-nav {
    flex: 0 0 auto;
    justify-content: flex-start;
    gap: 2px;
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
  }
  .land-top.is-auth .land-account { margin-left: auto; position: relative; flex: 0 0 auto; padding-left: 22px; }
  .land-top.is-auth .hn { padding: 7px 11px; font-size: 13.5px; }

  /* direita: Edição Beta · avatar · engrenagem */
  .land-right { display: flex; align-items: center; gap: 10px; }
  .beta-badge {
    display: inline-flex; align-items: center;
    padding: 5px 11px; border-radius: 9px;
    background: var(--bg2); border: 1px solid var(--line2);
    color: var(--tx2); font: 600 12px/1 var(--body);
    white-space: nowrap; user-select: none;
  }
  .beta-badge:hover { color: var(--pri); border-color: var(--pri); }
  /* compat: selo antigo renomeado de alpha-badge para beta-badge */
  .alpha-badge {
    display: inline-flex; align-items: center;
    padding: 5px 11px; border-radius: 9px;
    background: var(--bg2); border: 1px solid var(--line2);
    color: var(--tx2); font: 600 12px/1 var(--body);
    white-space: nowrap; user-select: none;
  }
  .alpha-badge:hover { color: var(--pri); border-color: var(--pri); }

  /* O avatar da conta vive em base.css — igual em todas as páginas do sistema. */
  .land-top .icon-btn { flex: 0 0 auto; }

  /* dropdown da conta (estilo ZEngine) */
  .land-menu {
    position: absolute; right: 0; top: calc(100% + 10px); z-index: 60;
    width: min(340px, calc(100vw - 24px)); padding: 8px;
    background: var(--bg2); border: 1px solid var(--line2);
    border-radius: 14px; box-shadow: 0 18px 44px #0009;
  }
  .land-menu-identity { display: flex; align-items: center; gap: 12px; padding: 10px 8px; }
  .land-menu-identity .av {
    flex: none; width: 44px; height: 44px; border-radius: 50%;
    background: var(--bg3); border: 1px solid var(--line2);
    display: grid; place-items: center; overflow: hidden;
  }
  .land-menu-identity .av img { width: 100%; height: 100%; object-fit: cover; }
  .land-menu-identity .id-txt { min-width: 0; }
  .land-menu-identity .id-name {
    display: block; font: 700 14px var(--head); color: var(--tx);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .land-menu-identity .id-user { display: block; color: var(--tx3); font-size: 12px; margin-top: 1px; }
  .lm-badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
  .lm-badge {
    display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 6px;
    font: 700 10px/1.5 var(--head); background: var(--bg4); color: var(--tx2);
  }
  .lm-badge.type { background: #3b82f622; color: #93c5fd; }
  .lm-badge.admin { background: #f59e0b22; color: var(--pri); }
  .lm-badge.plan { background: #8b5cf624; color: #c4b5fd; }
  .lm-badge.sup { background: #ef444422; color: #fda4af; }
  .land-menu-divider { height: 1px; background: var(--line); margin: 6px 0; }
  .land-menu-item {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 8px 9px; border: 0; border-radius: 8px;
    background: transparent; color: var(--tx); text-align: left;
    text-decoration: none; font: inherit; font-size: 13px; cursor: pointer;
  }
  .land-menu-item:hover { background: var(--bg3); }
  .land-menu-item.strong { color: var(--pri); font-weight: 600; }
  .land-menu-item:disabled { opacity: .55; cursor: wait; }
  .land-menu-item .u { color: var(--tx2); flex: none; }
  .land-menu-item.strong .u { color: var(--pri); }

  /* larguras intermediárias: encolhe o menu em vez de escondê-lo */
  @media (max-width:1150px){
    .land-top{padding:10px 18px}
    .land-top.is-auth .hn{padding:6px 9px;font-size:13px;gap:5px}
    .land-top.is-auth .main-header{gap:12px}
    .land-top.is-auth .land-account{padding-left:14px}
    .beta-badge,.alpha-badge{padding:5px 9px;font-size:11.5px}
  }
  @media (max-width:1024px){
    .land-top .brand .tagline{display:none}
  }
.hub-nav{display:flex;gap:4px;margin-left:12px}
.hn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:9px;color:var(--tx2);text-decoration:none;font-weight:600}
.hn:hover{background:var(--bg3);color:var(--tx)}.hn.on{color:var(--pri);background:#f59e0b14}
.hub{max-width:1200px;margin:0 auto;padding:28px 24px 60px}
.hub-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px 32px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(135deg,#f59e0b1c,#8b5cf61a);margin-bottom:34px}
.hub-hero h1{font-size:32px;font-weight:800;margin-bottom:6px}.hub-hero p{color:var(--tx2);margin:0;max-width:620px}
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:30px 0 14px}
.sec-h h2{display:flex;align-items:center;gap:10px;font-size:21px}.sec-h h2 svg{color:var(--pri)}
.proj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.proj{position:relative;display:flex;flex-direction:column;border-radius:16px;border:1px solid var(--line);background:var(--bg2);overflow:hidden;cursor:pointer;transition:transform .18s,border-color .18s;text-align:left;text-decoration:none;color:var(--tx);padding:0}
.proj:hover{transform:translateY(-3px);border-color:#f59e0b80}
.proj .thumb{aspect-ratio:16/9;background:var(--bg1) center/cover no-repeat;display:grid;place-items:center;color:var(--tx3);image-rendering:pixelated;border-bottom:1px solid var(--line)}
.proj .meta{padding:12px 14px}.proj .meta b{display:block;font:700 15px var(--head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.proj .meta small{color:var(--tx3)}
.proj .more{position:absolute;right:8px;bottom:12px}
.proj.new{align-items:center;justify-content:center;gap:8px;min-height:210px;border:2px dashed var(--line2);background:transparent;font:inherit;text-decoration:none}
.proj.new .ci,.tpl .ci,.feat .ci{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#f59e0b18;color:var(--pri)}
.proj.new small{color:var(--tx3)}
.tpl-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.tpl{display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:16px;border:1px solid var(--line);background:var(--bg2);text-decoration:none;color:var(--tx);transition:.18s}
.tpl:hover{border-color:#f59e0b80;transform:translateY(-2px)}.tpl small{color:var(--tx3)}
.shelf{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px}
.scard{flex:none;width:200px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--tx)}
.scard .cover{aspect-ratio:16/10;border-radius:14px;background:var(--bg3) center/cover;display:grid;place-items:center;color:var(--tx3);border:1px solid var(--line);image-rendering:pixelated}
.scard:hover .cover{border-color:var(--pri)}.scard small{color:var(--tx3)}
.feat-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:40px}
.feat{padding:20px;border-radius:16px;border:1px solid var(--line);background:var(--bg2)}.feat b{display:block;font:700 17px var(--head);margin:12px 0 6px}.feat p{color:var(--tx2);margin:0;font-size:13.5px}
/* landing */
.hero{max-width:1100px;margin:0 auto;padding:90px 24px 50px;text-align:center}
.hero h1{font-size:clamp(34px,5.4vw,62px);font-weight:800;line-height:1.08;margin:18px 0}
.hero p{color:var(--tx2);font-size:clamp(15px,1.8vw,19px);max-width:780px;margin:0 auto 32px}
.hero .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.pills{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.pills .pill svg{color:var(--pri)}
.band{max-width:1180px;margin:0 auto;padding:50px 24px}
.band h2{font-size:clamp(26px,3.4vw,38px);text-align:center;margin-bottom:10px}.band>p{text-align:center;color:var(--tx2);margin:0 auto 34px;max-width:700px}
.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.card-f{padding:26px;border-radius:18px;background:var(--bg2);border:1px solid var(--line);transition:.25s}.card-f:hover{border-color:#f59e0b66;transform:translateY(-4px)}
.card-f .ci{width:50px;height:50px;border-radius:13px;display:grid;place-items:center;background:#f59e0b18;color:var(--pri);margin-bottom:16px}
.card-f h3{font-size:19px;margin-bottom:8px}.card-f p{color:var(--tx2);margin:0;font-size:14px;line-height:1.6}
.modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.mode-c{border-radius:18px;border:1px solid var(--line);background:var(--bg2);overflow:hidden}.mode-c .vis{height:150px;background:var(--bg1);display:flex;flex-direction:column;gap:6px;padding:16px;justify-content:center}
.mode-c .txt{padding:18px 20px}.mode-c h3{display:flex;gap:8px;align-items:center;font-size:19px}.mode-c p{color:var(--tx2);margin:6px 0 0;font-size:14px}
.ln{display:flex;gap:6px;font:12px var(--mono)}.ln .c{flex:1;background:#1d2030;border-radius:6px;padding:6px 8px;color:#fde7c2}.ln .a{flex:1.3;background:#191b26;border-radius:6px;padding:6px 8px;color:var(--tx2)}
.bp{position:relative;height:100%}.bp i{position:absolute;border-radius:8px;background:#16161f;border:1px solid #30304a;font:600 11px var(--body);font-style:normal;color:var(--tx2);padding:6px 10px}
.bk{display:flex;flex-direction:column;gap:4px}.bk i{font-style:normal;font:700 12px var(--body);color:#fff;padding:7px 12px;border-radius:8px;width:max-content}
.plats{display:flex;flex-wrap:wrap;gap:30px;justify-content:center;margin-top:24px}.plat{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--tx2);font-size:13px}.plat svg{width:30px;height:30px;stroke:var(--tx2);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.plat em{font-style:normal;font-size:11px;color:var(--tx3)}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}.stat{padding:22px;border-radius:16px;background:var(--bg2);border:1px solid var(--line);text-align:center}.stat b{display:block;font:800 30px var(--head)}.stat small{color:var(--tx3)}
footer.land{border-top:1px solid var(--line);padding:30px 24px;text-align:center;color:var(--tx3);font-size:13px;margin-top:40px}
svg.u{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
@media (max-width:760px){.hub-nav,.land-top nav{display:none}.hub-top,.land-top{padding:10px 14px}.hub{padding:18px 14px}.hub-hero{padding:22px}}
.btn.morgan{background:linear-gradient(135deg,#8b5cf6,#ef4444);border:0;color:#fff}
/* honrarias */
.honra-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px}
.honra{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 18px;border-radius:18px;background:var(--bg2);border:1px solid var(--line);transition:.25s}
.honra:hover{border-color:#f59e0b66;transform:translateY(-4px)}
.honra img{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid #f59e0b;box-shadow:0 0 0 6px #f59e0b14;margin-bottom:14px;background:var(--bg3,#222)}
.honra b{font-size:16px}.honra small{color:var(--tx2);font-size:12px;margin-top:4px}
.honra p{color:var(--tx2);font-size:14px;line-height:1.55;margin:12px 0 0}
.honra.autor img{border-color:#8b5cf6;box-shadow:0 0 0 6px #8b5cf614}
.honra-note{text-align:center;color:var(--tx2);max-width:760px;margin:30px auto 0;font-style:italic}
.honra-more{display:flex;justify-content:center;margin-top:24px}

/* ===== Assets grátis ===== */
.asset-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:18px}
.asset-nav a{padding:8px 14px;border-radius:999px;border:1px solid var(--line,#2a2a33);background:var(--bg2,#131318);color:inherit;text-decoration:none;font-weight:600;font-size:14px}
.asset-nav a:hover{border-color:var(--accent,#f7931e)}
.asset-nav small{opacity:.6;margin-left:4px}
.asset-sec h2{margin:0 0 4px}
.asset-sec{scroll-margin-top:80px}
.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-top:16px}
.asset{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;border:1px solid var(--line,#2a2a33);background:var(--bg2,#131318);color:inherit;text-decoration:none;transition:transform .15s,border-color .15s}
.asset:hover,.asset:focus-visible{transform:translateY(-2px);border-color:var(--accent,#f7931e)}
.asset-ico{font-size:24px;width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:rgba(247,147,30,.1);flex:none}
.asset-t{display:grid;min-width:0;flex:1}
.asset-t b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.asset-t small{opacity:.6;font-size:12px;text-transform:capitalize}
.asset-go{font-size:13px;font-weight:700;color:var(--accent,#f7931e);white-space:nowrap}
.asset-how{max-width:820px;margin:0 auto;padding:22px;border-radius:16px;border:1px solid var(--line,#2a2a33);background:var(--bg2,#131318)}
.asset-how ol{line-height:1.7;padding-left:20px}
.asset-lic{font-size:13px;opacity:.8;border-top:1px solid var(--line,#2a2a33);padding-top:12px;margin-bottom:0}

/* ===== Loja desktop (loja.html) ========================================= */
.loja-page{max-width:1240px;margin:0 auto;padding:30px 24px 72px}
.loja-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:28px;align-items:center;padding:36px;border-radius:24px;border:1px solid var(--line);background:linear-gradient(135deg,#f59e0b1c,#8b5cf61a 55%,#22d3ee0d);overflow:hidden;margin-bottom:26px}
.loja-hero::before{content:"";position:absolute;z-index:-1;width:360px;height:360px;right:-90px;top:-170px;border-radius:50%;background:#8b5cf62e;filter:blur(60px)}
.loja-hero::after{content:"";position:absolute;z-index:-1;width:300px;height:300px;left:22%;bottom:-220px;border-radius:50%;background:#f59e0b1f;filter:blur(55px)}
.loja-kicker{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;border:1px solid var(--line2);background:var(--bg2);color:var(--pri);font:800 11px/1 var(--head);letter-spacing:.12em}
.loja-hero h1{font:800 clamp(30px,4.4vw,50px)/1.06 var(--head);letter-spacing:-.03em;margin:18px 0 12px;max-width:720px}
.loja-hero p{color:var(--tx2);font-size:15px;line-height:1.65;max-width:720px;margin:0}
.loja-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.loja-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.loja-stat{padding:18px 12px;border-radius:16px;border:1px solid var(--line);background:var(--bg2);text-align:center;box-shadow:0 10px 24px #0002}
.loja-stat b{display:block;font:800 clamp(24px,2.8vw,34px)/1 var(--head);letter-spacing:-.04em;color:var(--tx)}
.loja-stat small{display:block;margin-top:7px;color:var(--tx3);font-size:11px;line-height:1.3}
.loja-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:24px;align-items:start}
.loja-side{position:sticky;top:86px;display:flex;flex-direction:column;gap:14px}
.loja-side-card{padding:15px;border-radius:16px;border:1px solid var(--line);background:var(--bg2)}
.loja-side-title{font:800 11px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);margin:0 0 11px}
.loja-cats{display:flex;flex-direction:column;gap:3px}
.loja-cat{display:flex;align-items:center;gap:9px;width:100%;padding:8px 9px;border:0;border-radius:9px;background:transparent;color:var(--tx2);font:600 13px var(--body);text-align:left;cursor:pointer}
.loja-cat svg{color:var(--tx3);flex:none;transition:color .15s}
.loja-cat span{flex:1;min-width:0}
.loja-cat em{font-style:normal;font-size:11px;color:var(--tx3);background:var(--bg3);padding:2px 6px;border-radius:6px;min-width:24px;text-align:center}
.loja-cat:hover{background:var(--bg3);color:var(--tx)}
.loja-cat:hover svg,.loja-cat.on svg{color:var(--pri)}
.loja-cat.on{background:#f59e0b14;color:var(--pri)}
.loja-cat.on em{background:#f59e0b22;color:var(--pri)}
.loja-chips{display:flex;gap:6px;flex-wrap:wrap}
.loja-chip{padding:6px 10px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--tx2);font:700 11px var(--body);cursor:pointer}
.loja-chip:hover{color:var(--tx);border-color:var(--tx3)}
.loja-chip.on{background:var(--pri);border-color:var(--pri);color:#1a1205}
.loja-side-card.is-hidden{display:none}
.loja-library-card{display:flex;align-items:center;gap:10px;padding:13px;border-radius:16px;border:1px solid var(--line);background:linear-gradient(135deg,#8b5cf61c,#22d3ee0d);color:var(--tx);text-align:left;cursor:pointer}
.loja-library-card:hover,.loja-library-card.on{border-color:#8b5cf6aa;box-shadow:0 0 0 2px #8b5cf617}
.loja-library-ico{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:11px;background:#8b5cf624;color:#c4b5fd}
.loja-library-card>span:nth-child(2){display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.loja-library-card b{font:700 13px var(--head)}
.loja-library-card small{font-size:11px;color:var(--tx3);line-height:1.25}
.loja-library-card em{font-style:normal;font:800 12px var(--head);color:#c4b5fd;background:#8b5cf624;padding:3px 7px;border-radius:7px}
.loja-side-note{padding:15px;border-radius:16px;border:1px dashed var(--line2);background:transparent;color:var(--tx2)}
.loja-side-note b{display:block;color:var(--tx);font:700 13px var(--head)}
.loja-side-note p{margin:6px 0 10px;font-size:12px;line-height:1.5}
.loja-main{min-width:0}
.loja-toolbar{display:flex;flex-direction:column;gap:12px;margin-bottom:18px;scroll-margin-top:82px}
.loja-toolbar-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.loja-toolbar-head h2{font:800 23px/1.1 var(--head);letter-spacing:-.03em;margin:0}
.loja-toolbar-head small{font-size:12px}
.loja-toolbar-controls{display:flex;gap:10px;align-items:center}
.loja-search{position:relative;display:block;flex:1;min-width:0}
.loja-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--tx3);pointer-events:none}
.loja-search .inp{padding-left:38px;width:100%}
.loja-toolbar-controls>.inp{flex:0 0 auto;width:auto;min-width:160px}
.loja-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:18px}
.loja-card{position:relative;display:flex;flex-direction:column;border-radius:16px;border:1px solid var(--line);background:var(--bg2);overflow:hidden;cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s;text-align:left}
.loja-card:hover,.loja-card:focus-visible{transform:translateY(-3px);border-color:#f59e0b80;box-shadow:0 14px 30px #0003;outline:none}
.loja-card.owned{border-color:#22c55e55}
.loja-cover{position:relative;aspect-ratio:16/10;background:var(--bg1) center/cover no-repeat;display:grid;place-items:center;border-bottom:1px solid var(--line);image-rendering:auto;overflow:hidden}
.loja-cover-icon{color:var(--tx3);opacity:.8}
.loja-kind{position:absolute;left:9px;top:9px;display:inline-flex;align-items:center;gap:5px;max-width:calc(100% - 18px);padding:4px 8px;border-radius:7px;background:#0a0a0cd9;border:1px solid #ffffff1a;color:#fff;font:700 10px/1.2 var(--body);backdrop-filter:blur(6px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loja-price{position:absolute;right:9px;top:9px;padding:5px 9px;border-radius:8px;font:800 11px/1 var(--head);border:1px solid transparent;backdrop-filter:blur(6px)}
.loja-price.free{background:#22c55e2e;color:#86efac;border-color:#22c55e66}
.loja-price.paid{background:#f59e0b2e;color:#fcd34d;border-color:#f59e0b66}
.loja-price.owned{background:#8b5cf62e;color:#c4b5fd;border-color:#8b5cf666}
.loja-hover{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;background:linear-gradient(transparent,#000a);color:#fff;font:700 11px var(--body);opacity:0;transform:translateY(6px);transition:.18s;pointer-events:none}
.loja-card:hover .loja-hover,.loja-card:focus-visible .loja-hover{opacity:1;transform:none}
.loja-body{padding:12px 13px 13px;display:flex;flex-direction:column;gap:6px;min-height:126px}
.loja-title{font:700 14px/1.3 var(--head);color:var(--tx);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
.loja-author{font-size:11.5px;color:var(--tx3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loja-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:var(--tx3);min-width:0;margin-top:1px}
.loja-meta>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loja-rating{display:inline-flex;align-items:center;gap:4px;color:var(--pri);font-weight:700}
.loja-actions{margin-top:auto;padding-top:5px;display:flex;gap:6px}
.loja-actions .btn{width:100%;justify-content:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-flex;align-items:center;gap:5px}
.loja-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;padding:58px 20px;border:1px dashed var(--line2);border-radius:18px;background:var(--bg2)}
.loja-empty-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:17px;background:var(--bg3);color:var(--tx3);margin-bottom:4px}
.loja-empty b{font:800 19px var(--head)}
.loja-empty p{max-width:430px;margin:0;color:var(--tx2);font-size:13px;line-height:1.55}
.loja-empty .btn{margin-top:8px}
.loja-skel{pointer-events:none;cursor:default}
.loja-skel .loja-cover{background:var(--bg1)}
.loja-skel .loja-body{display:flex;flex-direction:column;gap:10px;min-height:126px}
.loja-skel .loja-body span{display:block;height:11px;border-radius:6px;background:linear-gradient(90deg,var(--bg3),var(--bg4),var(--bg3));background-size:200% 100%;animation:loja-shimmer 1.3s linear infinite}
.loja-skel .loja-body span:first-child{height:16px;width:82%}
.loja-skel .loja-body span:nth-child(2){width:58%}.loja-skel .loja-body span:nth-child(3){width:100%;margin-top:auto}
@keyframes loja-shimmer{to{background-position:-200% 0}}
.loja-detail{display:flex;flex-direction:column;gap:20px;max-height:min(72vh,760px);overflow:auto;padding-right:4px}
.loja-detail-main{display:grid;grid-template-columns:270px minmax(0,1fr);gap:22px;align-items:start}
.loja-detail-cover{position:relative;aspect-ratio:16/10;border-radius:14px;border:1px solid var(--line);background:var(--bg1) center/cover no-repeat;display:grid;place-items:center;color:var(--tx3);overflow:hidden}
.loja-detail-info{min-width:0}
.loja-detail-badges{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.loja-detail-badges .loja-kind{position:static;max-width:none;background:var(--bg3);border-color:var(--line);color:var(--tx2)}
.loja-detail-info h2{font:800 clamp(23px,3vw,34px)/1.1 var(--head);letter-spacing:-.03em;margin:10px 0 6px}
.loja-detail-info .loja-author{font-size:12.5px;margin:0 0 12px}
.loja-detail-desc{color:var(--tx2);font-size:13.5px;line-height:1.65;white-space:pre-wrap;margin:0 0 14px;max-height:180px;overflow:auto;padding-right:4px}
.loja-detail-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--tx3);padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:14px}
.loja-detail-actions{display:flex;gap:8px;flex-wrap:wrap}
.loja-detail-actions .btn{min-width:180px;justify-content:center}
.loja-detail-note{font-size:11.5px;color:var(--tx3);line-height:1.5;margin:10px 0 0}
.loja-detail-reviews{border-top:1px solid var(--line);padding-top:16px}
.loja-reviews-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.loja-reviews-head b{font:800 15px var(--head)}
.loja-reviews-head .loja-rating{font-size:12px}
.loja-review{padding:10px 0;border-bottom:1px solid var(--line)}
.loja-review:last-of-type{border-bottom:0}
.loja-review-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.loja-review-av{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--bg3);border:1px solid var(--line2);color:var(--tx2);font:800 10px var(--head)}
.loja-review-top>span:nth-child(2){display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.loja-review-top b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loja-review-top small{font-size:10px;color:var(--tx3)}
.loja-review-top .loja-rating{margin-left:auto;font-size:11px;letter-spacing:1px}
.loja-review p{margin:7px 0 0 38px;font-size:12.5px;line-height:1.55;color:var(--tx2)}
.loja-review-form{margin-top:14px;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--bg1)}
.loja-review-form-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.loja-review-form-top b{font:700 12.5px var(--head)}
.loja-review-form textarea{width:100%;box-sizing:border-box;resize:vertical;margin-bottom:8px}
.loja-review-form-foot{display:flex;justify-content:flex-end}
.loja-star-pick{display:flex;gap:2px}
.loja-star{border:0;background:transparent;color:var(--line2);font-size:20px;line-height:1;padding:0 1px;cursor:pointer;transition:.12s}
.loja-star:hover,.loja-star.on{color:var(--pri);transform:scale(1.06)}
html.ze-classic .loja-hero{background:linear-gradient(135deg,#f59e0b24,#f59e0b0f 60%,#f59e0b08)}
html.ze-classic .loja-kind{background:#111827e6;color:#fff}
html.ze-classic .loja-detail-badges .loja-kind{background:var(--bg3);color:var(--tx2)}
html.ze-classic .loja-price.free{background:#dcfce7;color:#166534;border-color:#86efac}
html.ze-classic .loja-price.paid{background:#fef3c7;color:#92400e;border-color:#fcd34d}
html.ze-classic .loja-price.owned{background:#ede9fe;color:#5b21b6;border-color:#c4b5fd}
html.ze-classic .loja-library-card{background:linear-gradient(135deg,#f5f3ff,#fffbeb)}
html.ze-classic .loja-library-ico{background:#ede9fe;color:#6d28d9}
html.ze-classic .loja-library-card em{background:#ede9fe;color:#6d28d9}
@media (max-width:1000px){
  .loja-layout{grid-template-columns:1fr}
  .loja-side{position:static;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:10px}
  .loja-cats{flex-direction:row;flex-wrap:wrap}
  .loja-cat{width:auto;flex:0 0 auto}
  .loja-cat span{flex:0 0 auto}
  .loja-library-card,.loja-side-note{grid-column:1/-1}
  .loja-side-note{display:none}
}
@media (max-width:760px){
  .loja-page{padding:18px 14px 52px}
  .loja-hero{grid-template-columns:1fr;padding:24px;border-radius:18px;gap:20px}
  .loja-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .loja-stat{padding:14px 8px;border-radius:12px}
  .loja-side{grid-template-columns:1fr}
  .loja-side-card{padding:12px}
  .loja-toolbar-controls{flex-wrap:wrap}
  .loja-detail-main{grid-template-columns:1fr}
  .loja-detail-cover{max-width:100%}
  .loja-detail{max-height:78vh}
}
@media (max-width:560px){
  .loja-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .loja-body{padding:9px 10px 10px;min-height:118px}
  .loja-title{font-size:12.5px;min-height:32px}
  .loja-author,.loja-meta{font-size:10px}
  .loja-actions .btn{font-size:10.5px;padding:5px 6px;border-radius:6px}
  .loja-cover .loja-kind{font-size:9px;padding:3px 6px;left:6px;top:6px}
  .loja-cover .loja-price{font-size:9px;padding:4px 6px;right:6px;top:6px}
  .loja-hover{display:none}
  .loja-toolbar-controls{flex-direction:column;align-items:stretch}
  .loja-toolbar-controls>.inp{width:100%}
  .loja-toolbar-head h2{font-size:20px}
  .loja-stat b{font-size:22px}
  .loja-stat small{font-size:9px}
  .loja-hero h1{font-size:28px}
  .loja-hero p{font-size:13px}
  .loja-hero-actions .btn{flex:1;justify-content:center}
  .loja-detail-info h2{font-size:24px}
  .loja-detail-actions .btn{min-width:0;flex:1}
  .loja-review p{margin-left:0}
}


/* Seletor de foco GameDev / WebApp no Hub */
.hub-mode-switch{display:inline-flex;align-items:center;background:var(--bg2,#1c1c24);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px;margin-top:14px}
.hub-mode-switch .mode-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:0;background:none;color:var(--tx2);font:inherit;font-size:13px;font-weight:600;border-radius:9px;cursor:pointer;transition:all .15s}
.hub-mode-switch .mode-btn:hover{color:var(--tx);background:var(--bg3,#2a2a36)}
.hub-mode-switch .mode-btn.on{background:var(--pri);color:#fff;box-shadow:0 2px 8px rgba(245,158,11,0.35)}

/* ===== Seção de Planos e Preços Oficiais (nab.sql) ===== */
.pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
  margin-top: 30px;
}
.price-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 28px 22px;
  border-radius: 18px;
  background: var(--bg2);
  border: 1px solid var(--line);
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.price-card:hover {
  transform: translateY(-4px);
  border-color: var(--pri);
  box-shadow: 0 12px 30px rgba(0,0,0,0.25);
}
.price-card.featured {
  border-color: var(--pri);
  box-shadow: 0 8px 28px rgba(245, 158, 11, 0.2);
}
.price-card.featured::before {
  content: "MAIS POPULAR";
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--pri);
  color: #1a1205;
  font: 800 10.5px/1 var(--head);
  letter-spacing: .1em;
  padding: 4px 12px;
  border-radius: 999px;
  white-space: nowrap;
}
.price-title {
  font: 800 20px/1.2 var(--head);
  margin-bottom: 6px;
}
.price-desc {
  font-size: 13px;
  color: var(--tx2);
  min-height: 38px;
  margin: 0 0 16px;
  line-height: 1.45;
}
.price-val {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 20px;
}
.price-val b {
  font: 800 32px/1 var(--head);
  color: var(--tx);
}
.price-val small {
  color: var(--tx3);
  font-size: 13px;
}
.price-feats {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.price-feats li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: var(--tx2);
  line-height: 1.4;
}
.price-feats li svg {
  width: 16px;
  height: 16px;
  color: var(--pri);
  flex: none;
  margin-top: 1px;
}
.price-combos-title {
  text-align: center;
  font: 800 22px var(--head);
  margin: 48px 0 16px;
}
.price-combos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.combo-card {
  padding: 18px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--bg2);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.combo-card b {
  font: 700 15px var(--head);
}
.combo-card p {
  margin: 0;
  font-size: 12.5px;
  color: var(--tx2);
  flex: 1;
}
.combo-card .combo-price {
  font: 800 17px var(--head);
  color: var(--pri);
  margin-top: 4px;
}