.xhero{min-height:clamp(480px,62vh,660px);display:flex;align-items:center;justify-content:center}
.xhero .banner-center{max-width:860px;gap:14px}
.xhero h1{text-transform:none;font-size:clamp(2.6rem,6vw,4.8rem);letter-spacing:-.035em}
.xhero h1 .grad{background:var(--spectrum);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.xhero .banner-center p{max-width:54ch;line-height:1.55}

.xhero .prompt{display:flex;align-items:center;gap:10px;width:100%;max-width:680px;margin-top:14px;
  background:rgba(5,13,19,.62);border:1px solid rgba(255,255,255,.16);border-radius:100px;
  padding:8px 8px 8px 22px;backdrop-filter:blur(12px);transition:.25s;text-align:left}
.xhero .prompt:focus-within{border-color:rgba(120,199,239,.6);box-shadow:0 0 0 1px rgba(120,199,239,.35),0 0 44px -10px rgba(120,199,239,.55)}
.xhero .prompt .ic{color:#9fc8de;font-size:16px;flex:none}
.xhero .prompt input{flex:1;min-width:0;background:transparent;border:none;outline:none;color:#fff;
  font-family:'Inter',sans-serif;font-size:15px}
.xhero .prompt input::placeholder{color:rgba(213,236,249,.45)}
.xhero .prompt .btn-brand{flex:none;border:0;cursor:pointer;border-radius:100px;padding:12px 22px;font-size:12.5px}

.xhero .suggest{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;align-items:center;margin-top:4px;
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.xhero .suggest .try{color:rgba(213,236,249,.55)}
.xhero .suggest a{color:#d5ecf9;background:rgba(5,13,19,.5);border:1px solid rgba(255,255,255,.18);
  border-radius:100px;padding:6px 12px;transition:.2s;backdrop-filter:blur(6px)}
.xhero .suggest a:hover{background:#A1EB1A;border-color:#A1EB1A;color:#000}

.xbar{position:sticky;top:84px;z-index:40;padding:6px 0}
.xbar-in{display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:rgba(12,12,14,.8);border:1px solid rgba(255,255,255,.1);border-radius:16px;
  padding:10px 14px;backdrop-filter:blur(16px)}
.pills{display:flex;gap:8px;flex-wrap:wrap;overflow-x:auto;scrollbar-width:none}
.pills::-webkit-scrollbar{display:none}
.pills button{flex:none;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;color:#ddd;
  background:rgba(18,18,20,.72);border:1px solid rgba(255,255,255,.14);padding:8px 15px;border-radius:100px;
  cursor:pointer;transition:.2s;display:inline-flex;gap:8px;align-items:center;white-space:nowrap}
.pills button .c{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--faint)}
.pills button:hover{border-color:rgba(255,255,255,.32);color:#fff}
.pills button.on{background:#A1EB1A;color:#000;border-color:#A1EB1A}
.pills button.on .c{color:#000;opacity:.6}
.xbar .count{flex:none;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--grey)}

.wall-sec{padding-bottom:26px}
.wall-sec .tile{cursor:pointer;transition:border-color .3s}
.wall-sec .tile:hover{border-color:rgba(255,255,255,.26)}
.wall-sec .tile.hide{display:none}

.tmeta{position:absolute;top:12px;left:12px;z-index:2;font-family:'JetBrains Mono',monospace;font-size:9px;
  font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(6px);padding:5px 10px;border-radius:100px}

.wall-sec .tbar h4{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wall-sec .tdur{flex:none;font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:500;
  letter-spacing:.08em;padding:5px 10px}
.wall-sec .gen{flex:none}

.wall-empty{display:none;text-align:center;color:var(--faint);font-family:'JetBrains Mono',monospace;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:70px 0}
.wall-empty.show{display:block}

.xclose{min-height:clamp(340px,44vh,460px);display:flex;align-items:center;justify-content:center}
.xclose .banner-center h2{font-size:clamp(2.4rem,5.6vw,4.4rem)}

@media(max-width:880px){
  .xbar .count{display:none}
}
@media(max-width:700px){
  .xbar{top:66px}
  .pills{flex-wrap:nowrap;justify-content:flex-start}
  .xhero .prompt .ic{display:none}
  .xhero .prompt .btn-brand{padding:11px 16px}
}