:root{
  --pia-bg-deep:#050816;
  --pia-bg-navy:#081120;
  --pia-bg-panel:#0b1020;
  --pia-glass:rgba(10,18,34,.68);
  --pia-glass-strong:rgba(12,23,42,.82);
  --pia-glass-soft:rgba(255,255,255,.055);
  --pia-text:#f2f7ff;
  --pia-muted:#a7b6d4;
  --pia-dim:#6f7f9f;
  --pia-cyan:#22d3ee;
  --pia-blue:#3b82f6;
  --pia-aqua:#2dd4bf;
  --pia-purple:#a855f7;
  --pia-green:#34d399;
  --pia-pink:#fb7185;
  --pia-line:rgba(170,210,255,.14);
  --pia-line-bright:rgba(34,211,238,.34);
  --pia-radius:26px;
  --pia-radius-sm:18px;
  --pia-shadow:0 24px 70px rgba(0,0,0,.42),0 0 36px rgba(34,211,238,.055);
  --pia-shadow-hover:0 30px 85px rgba(0,0,0,.5),0 0 44px rgba(168,85,247,.1);
}

html{background:var(--pia-bg-deep)}

body{
  position:relative;
  color:var(--pia-text)!important;
  font-family:Inter,"SF Pro Display","Plus Jakarta Sans","DM Sans",Manrope,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  background:
    radial-gradient(circle at 18% -6%,rgba(34,211,238,.16),transparent 30%),
    radial-gradient(circle at 88% 4%,rgba(168,85,247,.16),transparent 32%),
    radial-gradient(circle at 54% 102%,rgba(45,212,191,.11),transparent 34%),
    linear-gradient(180deg,#050816 0%,#081120 48%,#030611 100%)!important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 22% 28%,rgba(255,255,255,.08) 0 1px,transparent 1.6px),
    radial-gradient(circle at 74% 42%,rgba(34,211,238,.09) 0 1px,transparent 1.8px),
    linear-gradient(120deg,transparent 0 36%,rgba(34,211,238,.055) 44%,rgba(168,85,247,.045) 52%,transparent 64%);
  background-size:180px 180px,240px 240px,100% 100%;
  opacity:.62;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.28));
}

body > *{
  position:relative;
  z-index:1;
}

*{
  letter-spacing:0!important;
  scrollbar-color:rgba(34,211,238,.48) rgba(255,255,255,.04);
}

a{color:inherit}

.sidebar,
.mobile-topbar,
.app-topbar,
.topbar,
.nav,
.app-topbar,
.filters,
.composer,
.mobile-install-banner,
.status-pill,
.topbar-credit-chip,
.install-chip,
.launch-action{
  backdrop-filter:blur(22px) saturate(1.2)!important;
}

.sidebar{
  background:linear-gradient(180deg,rgba(8,17,32,.86),rgba(5,8,18,.92))!important;
  border-color:var(--pia-line)!important;
  box-shadow:18px 0 54px rgba(0,0,0,.3)!important;
}

.mobile-topbar,
.app-topbar{
  background:linear-gradient(180deg,rgba(8,17,32,.9),rgba(5,8,18,.74))!important;
  border-color:var(--pia-line)!important;
  box-shadow:0 16px 46px rgba(0,0,0,.32)!important;
}

.brand-mark,
.logo-mark,
.mark,
.avatar,
.launch-logo{
  border-radius:18px!important;
  background:
    radial-gradient(circle at 30% 18%,rgba(255,255,255,.34),transparent 28%),
    linear-gradient(135deg,rgba(34,211,238,.92),rgba(168,85,247,.76))!important;
  color:#04111f!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 0 26px rgba(34,211,238,.18),inset 0 1px 0 rgba(255,255,255,.34)!important;
}

.brand-copy small,
.logo-copy small,
.brand small,
.section-tag,
.eyebrow,
.hero-kicker,
.action-kicker,
.item-type,
.metric small,
.stat small,
.brand-item small,
label,
.status-pill small,
.topbar-credit-chip .label{
  color:#9eeaff!important;
}

h1,h2,h3,h4,
.brand-copy h2,
.logo h2,
.brand strong,
.section-title,
.hero-copy h1,
.account-header h1{
  color:var(--pia-text)!important;
  text-wrap:balance;
}

p,.sub,.muted,
.hero-copy p,
.hero p,
.section-copy,
.section-head p,
.action-card p,
.pulse-sub,
.focus-item p,
.journey p,
.item-date,
.item-text,
.dialog-copy,
.share-note,
.empty,
.plan,
.logout,
.hero-chip,
.chip,
.action-pill{
  color:var(--pia-muted)!important;
}

.hero-copy h1 span,
.logo h2 span,
.brand-copy h2 span,
.accent,
.val.teal,
.val.purple{
  color:#b8fff3!important;
  text-shadow:0 0 22px rgba(34,211,238,.16);
}

.hero,
.account-header,
.card,
.panel,
.brand-card,
.stat,
.metric,
.pulse-card,
.focus-card,
.summary-card,
.action-card,
.journey,
.brand-item,
.check,
.utility,
.intent-card,
.generator-shell,
.workspace,
.tool-panel,
.result-panel,
.prompt-card,
.result,
.item,
.modal-card,
.dialog-card,
.bonus-box,
.plan-card,
.proof-tile,
.feature,
.step,
.showcase-card,
.composer,
.filters,
.sidebar-bottom,
.side-user,
.profile,
.box,
.steps,
.topbar,
.status-pill,
.mobile-install-banner{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035) 46%,rgba(9,17,32,.74))!important;
  border:1px solid var(--pia-line)!important;
  border-radius:var(--pia-radius)!important;
  box-shadow:0 20px 58px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055)!important;
  color:var(--pia-text)!important;
}

.hero::after,
.account-header::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    radial-gradient(circle at 82% 10%,rgba(34,211,238,.12),transparent 30%),
    linear-gradient(135deg,rgba(255,255,255,.08),transparent 26%,transparent 78%,rgba(168,85,247,.07));
  opacity:.42;
}

.hero > *,
.account-header > *{
  position:relative;
  z-index:1;
}

.hero{
  background:
    radial-gradient(circle at 78% 16%,rgba(34,211,238,.2),transparent 26%),
    radial-gradient(circle at 94% 0,rgba(168,85,247,.18),transparent 32%),
    linear-gradient(145deg,rgba(14,26,48,.92),rgba(4,8,18,.98))!important;
}

.result,
.item{
  border-radius:24px!important;
}

.result img,
.item-img img,
.showcase-card img{
  filter:saturate(1.08) contrast(1.05);
}

.result-meta,
.item-menu,
.site-toast{
  background:rgba(5,10,22,.74)!important;
  border:1px solid rgba(170,210,255,.16)!important;
  border-radius:18px!important;
  box-shadow:0 18px 52px rgba(0,0,0,.42),0 0 24px rgba(34,211,238,.07)!important;
  backdrop-filter:blur(18px)!important;
}

.section-tag,
.eyebrow,
.hero-kicker,
.hero-chip,
.chip,
.action-pill,
.project-tag,
.pill,
.bot-chip{
  border-radius:999px!important;
  background:linear-gradient(135deg,rgba(34,211,238,.12),rgba(168,85,247,.08))!important;
  border:1px solid rgba(34,211,238,.22)!important;
  color:#c8f9ff!important;
}

.btn,
.btn-login,
.btn-tg,
.btn-filter,
.share-btn,
.ia-btn,
.btn-plan,
.mobile-credit-chip,
button,
input,
select,
textarea{
  border-radius:16px!important;
}

.btn,
.btn-login,
.btn-filter,
.btn-plan,
.share-btn,
.ia-btn,
.topbar-new-visual-btn,
.mobile-install-btn,
.launch-action{
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .24s ease!important;
}

.btn.primary,
.btn-primary,
.btn-login,
.btn-plan:not(.alt),
.ia-dl,
.ia-copy,
.ia-share,
.share-btn.primary,
.mobile-install-btn,
.composer-submit,
.generate-btn{
  color:#04111f!important;
  border-color:rgba(255,255,255,.18)!important;
  background:
    radial-gradient(circle at 24% 18%,rgba(255,255,255,.42),transparent 28%),
    linear-gradient(135deg,var(--pia-cyan),var(--pia-aqua) 44%,var(--pia-purple))!important;
  box-shadow:0 16px 36px rgba(34,211,238,.2),0 0 28px rgba(168,85,247,.12)!important;
  font-weight:850!important;
}

.btn.secondary,
.btn.ghost,
.btn-tg,
.btn-plan.alt,
.ia-neutral,
.filters .btn-filter,
.share-btn,
.topbar-new-visual-btn{
  color:var(--pia-text)!important;
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(170,210,255,.16)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
}

.btn:hover,
.btn-login:hover,
.btn-filter:hover,
.share-btn:hover,
.ia-btn:hover,
.action-card:hover,
.item:hover,
.launch-action:hover{
  transform:translateY(-2px)!important;
  border-color:var(--pia-line-bright)!important;
  box-shadow:var(--pia-shadow-hover)!important;
}

button:active,
.btn:active,
.share-btn:active,
.ia-btn:active{
  transform:translateY(1px) scale(.985)!important;
}

.nav a{
  color:#a9b8d5!important;
  background:transparent!important;
  border:1px solid transparent!important;
  border-radius:18px!important;
}

.nav a.active,
.nav a:hover{
  color:#f8fdff!important;
  background:linear-gradient(135deg,rgba(34,211,238,.13),rgba(168,85,247,.1))!important;
  border-color:rgba(34,211,238,.2)!important;
  box-shadow:0 0 24px rgba(34,211,238,.08)!important;
}

input,
select,
textarea,
.filters input,
.filters select,
.field input,
.dialog-field input{
  background:rgba(3,8,18,.78)!important;
  color:var(--pia-text)!important;
  border:1px solid rgba(170,210,255,.15)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
}

input:focus,
select:focus,
textarea:focus,
.field input:focus{
  border-color:rgba(34,211,238,.6)!important;
  outline:2px solid rgba(34,211,238,.12)!important;
}

input::placeholder,
textarea::placeholder{color:#7889aa!important}

.tg-bottom-nav{
  background:linear-gradient(180deg,rgba(12,24,44,.82),rgba(4,7,16,.92))!important;
  border:1px solid rgba(170,210,255,.16)!important;
  border-radius:28px!important;
  box-shadow:0 18px 52px rgba(0,0,0,.48),0 0 34px rgba(34,211,238,.08)!important;
  backdrop-filter:blur(22px) saturate(1.25)!important;
}

body.tg-miniapp .tg-bottom-nav,
body.mobile-miniapp .tg-bottom-nav{
  left:12px!important;
  right:12px!important;
  bottom:10px!important;
  padding:8px 8px calc(env(safe-area-inset-bottom,0px) + 10px)!important;
  border-radius:28px!important;
}

.tg-bottom-nav a{
  color:#9eafcf!important;
  border-radius:18px!important;
}

.tg-bottom-nav a.active,
.tg-bottom-nav a:hover{
  color:#f8fdff!important;
  background:rgba(34,211,238,.11)!important;
}

.tg-bottom-nav .tg-nav-primary{
  color:#f8fdff!important;
  animation:piaCorePulse 2.8s ease-in-out infinite;
}

.tg-bottom-nav .tg-nav-primary .tg-nav-icon{
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.44),transparent 28%),
    linear-gradient(135deg,var(--pia-cyan),var(--pia-purple))!important;
  color:#03101c!important;
  box-shadow:0 0 28px rgba(34,211,238,.34),0 0 52px rgba(168,85,247,.18),inset 0 1px 0 rgba(255,255,255,.42)!important;
}

.item-img,
.result .fallback{
  background:
    linear-gradient(180deg,rgba(3,8,18,.28),rgba(3,8,18,.72)),
    radial-gradient(circle at 72% 20%,rgba(34,211,238,.16),transparent 34%),
    #0b1020!important;
}

.item-img::after,
.result::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 46%,rgba(3,8,18,.76));
  opacity:.5;
}

.modal-backdrop{
  background:rgba(2,6,15,.74)!important;
  backdrop-filter:blur(12px)!important;
}

@keyframes piaCorePulse{
  0%,100%{filter:drop-shadow(0 0 0 rgba(34,211,238,0));transform:translateY(-4px) scale(1)}
  50%{filter:drop-shadow(0 0 18px rgba(34,211,238,.34));transform:translateY(-6px) scale(1.035)}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

@media(max-width:760px){
  .main{padding-inline:14px!important}
  .hero,
  .card,
  .panel,
  .brand-card,
  .filters{
    border-radius:22px!important;
  }
  h1,
  .hero-copy h1{
    line-height:1.05!important;
  }
}
