/*
  Trenches visual system.
  Presentation only: shared across ZerpSwap and partner-branded public pages.
*/
:root{
  --trench-ink:#070b0d;
  --trench-panel:#10171a;
  --trench-panel-2:#0b1114;
  --trench-steel:#273438;
  --trench-amber:#d8a24a;
  --trench-amber-rgb:216,162,74;
  --trench-green:var(--partner-primary,#55f5c2);
  --trench-green-rgb:var(--partner-primary-rgb,85,245,194);
  --trench-text:#edf3ed;
  --trench-muted:#98a79f;
  --trench-map:url("/brand/trenches-command-map-v1.jpg?v=1");
  --trench-dugout:url("/brand/trenches-dugout-banner-v1.jpg?v=1");
}

html{background:var(--trench-ink)}

body.mode-tokens,
body.wallet-radar-page,
body.security-page,
body.terms-page,
body.zerps-trade-shell{
  position:relative;
  isolation:isolate;
  background:
    linear-gradient(180deg,rgba(4,8,9,.58),rgba(4,7,8,.90)),
    radial-gradient(circle at 84% -8%,rgba(var(--trench-green-rgb),.10),transparent 34%),
    var(--trench-map) center top/1024px 1024px repeat,
    var(--trench-ink) !important;
  color:var(--trench-text) !important;
}

body.mode-tokens::before,
body.wallet-radar-page::before,
body.security-page::before,
body.terms-page::before,
body.zerps-trade-shell::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px) 0 0/80px 80px,
    linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px) 0 0/80px 80px,
    radial-gradient(circle at 50% 0,transparent 0,rgba(0,0,0,.14) 64%,rgba(0,0,0,.42) 100%);
  opacity:.72;
}

body.mode-tokens .embed-meta,
body.wallet-radar-page .embed-meta,
body.security-page .embed-meta,
body.terms-page .embed-meta,
body.zerps-trade-shell .embed-meta{
  border:1px solid rgba(var(--trench-green-rgb),.20) !important;
  border-bottom-color:rgba(var(--trench-amber-rgb),.42) !important;
  border-radius:12px !important;
  background:linear-gradient(90deg,rgba(11,19,21,.97),rgba(12,21,24,.90)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 -2px 0 rgba(var(--trench-amber-rgb),.07),
    0 14px 38px rgba(0,0,0,.32) !important;
}

.embed-logo-wrap{
  border:1px solid rgba(var(--trench-green-rgb),.34) !important;
  border-radius:10px !important;
  background:linear-gradient(145deg,rgba(var(--trench-green-rgb),.12),rgba(0,0,0,.3)) !important;
  box-shadow:inset 0 0 0 3px rgba(2,7,8,.72),0 0 18px rgba(var(--trench-green-rgb),.10) !important;
}

.embed-logo{border-radius:8px !important}

.site-slogan{
  border-radius:5px !important;
  border-color:rgba(var(--trench-amber-rgb),.34) !important;
  background:rgba(12,18,17,.86) !important;
  color:#e8d6ad !important;
  box-shadow:inset 3px 0 0 rgba(var(--trench-amber-rgb),.62) !important;
}

.tabbar .tab-btn{
  min-height:38px !important;
  border-radius:7px !important;
  border-color:rgba(145,174,163,.20) !important;
  background:linear-gradient(180deg,rgba(26,36,38,.92),rgba(10,16,18,.96)) !important;
  color:#bfcac4 !important;
  letter-spacing:.075em !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035) !important;
  transition:border-color .16s ease,color .16s ease,transform .16s ease,background .16s ease !important;
}

.tabbar .tab-btn:hover,
.tabbar .tab-btn:focus-visible{
  border-color:rgba(var(--trench-green-rgb),.46) !important;
  color:#fff !important;
  transform:translateY(-1px);
}

.tabbar .tab-btn.active{
  border-color:rgba(var(--trench-green-rgb),.58) !important;
  background:linear-gradient(180deg,rgba(var(--trench-green-rgb),.18),rgba(11,27,25,.96)) !important;
  color:#f5fff9 !important;
  box-shadow:inset 0 -2px 0 rgba(var(--trench-green-rgb),.65),0 8px 18px rgba(0,0,0,.22) !important;
}

.header-search-wrap,
.top-wallet-chip{
  border-radius:7px !important;
  border-color:rgba(145,174,163,.25) !important;
  background:rgba(7,14,16,.92) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.header-search-wrap:focus-within{
  border-color:rgba(var(--trench-green-rgb),.62) !important;
  box-shadow:0 0 0 3px rgba(var(--trench-green-rgb),.08) !important;
}

.top-wallet-chip .dot,
.site-footer-network i,
.market-strip-label i{
  background:var(--trench-green) !important;
  box-shadow:0 0 12px rgba(var(--trench-green-rgb),.65) !important;
}

.shared-market-strip{
  border:1px solid rgba(145,174,163,.18) !important;
  border-radius:10px !important;
  background:linear-gradient(90deg,rgba(9,16,18,.95),rgba(13,21,22,.90)) !important;
  box-shadow:inset 0 -1px 0 rgba(var(--trench-amber-rgb),.13),0 10px 24px rgba(0,0,0,.20) !important;
}

.market-strip-label{
  color:#d9c9a4 !important;
  letter-spacing:.085em !important;
}

.tokens-ticker-item{
  border-color:rgba(145,174,163,.16) !important;
  border-radius:7px !important;
  background:rgba(8,15,17,.78) !important;
}

.tokens-panel,
.stalk-command-deck,
.stalk-panel,
.escrow-hero,
.escrow-card,
.security-hero,
.security-wrap .card,
.security-wrap .trust-strip,
.terms-shell,
.token-wallet-hub,
.token-wallet-hub-card,
.token-wallet-asset-panel,
.tokens-change-dialog{
  border-color:rgba(145,174,163,.20) !important;
  border-radius:11px !important;
  background:linear-gradient(145deg,rgba(16,24,26,.97),rgba(8,13,15,.98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    inset 4px 0 0 rgba(var(--trench-green-rgb),.035),
    0 16px 38px rgba(0,0,0,.26) !important;
}

.tokens-panel,
.stalk-command-deck,
.stalk-panel,
.escrow-hero,
.escrow-card,
.security-hero,
.security-wrap .card,
.terms-shell{
  position:relative;
  overflow:hidden;
}

.tokens-panel::after,
.stalk-command-deck::after,
.escrow-hero::after,
.security-hero::after,
.terms-shell::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0 0 auto 0;
  height:190px;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(5,9,10,.42),rgba(5,9,10,.05) 48%,rgba(5,9,10,.24)),
    linear-gradient(180deg,rgba(5,9,10,.01),rgba(5,9,10,.62)),
    var(--trench-dugout) center 58%/cover no-repeat;
  opacity:.98;
  filter:saturate(1.08) contrast(1.06) brightness(1.72);
}

body.mode-tokens .tokens-head{
  min-height:118px;
  align-items:flex-start;
}

body.mode-tokens .tokens-title,
body.mode-tokens .tokens-sub,
body.mode-tokens .tokens-controls{
  text-shadow:0 2px 9px rgba(0,0,0,.96),0 0 18px rgba(0,0,0,.72);
}

.tokens-panel > *,
.stalk-command-deck > *,
.escrow-hero > *,
.security-hero > *,
.terms-shell > *{
  position:relative;
  z-index:1;
}

.tokens-panel::before,
.stalk-panel::before,
.escrow-card::before,
.security-wrap .card::before,
.terms-shell::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:2px;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(var(--trench-green-rgb),.75),rgba(var(--trench-amber-rgb),.45),transparent 72%);
  opacity:.52;
}

.tokens-title,
.stalk-panel-title,
.escrow-title,
.card-title,
.security-wrap h1,
.security-wrap h2,
.terms-shell h1,
.terms-shell h2,
.token-wallet-hub-title{
  color:var(--trench-text) !important;
  letter-spacing:.025em !important;
}

.tokens-sub,
.stalk-panel-subtitle,
.card-note,
.step-copy,
.security-wrap p,
.terms-shell p,
.token-wallet-hub-note{
  color:var(--trench-muted) !important;
}

input,
select,
textarea,
.tokens-search,
.stalk-input,
.token-wallet-hub input,
.token-wallet-hub select{
  border-color:rgba(145,174,163,.22) !important;
  border-radius:7px !important;
  background:rgba(4,10,12,.90) !important;
  color:var(--trench-text) !important;
}

input:focus,
select:focus,
textarea:focus{
  border-color:rgba(var(--trench-green-rgb),.58) !important;
  box-shadow:0 0 0 3px rgba(var(--trench-green-rgb),.075) !important;
  outline:none !important;
}

.tokens-search-submit,
.stalk-btn,
.escrow-page button,
.security-page button,
.terms-page button,
.token-wallet-hub button,
.token-wallet-asset-panel button,
.tokens-change-dialog button{
  border-radius:7px !important;
  border-color:rgba(var(--trench-green-rgb),.38) !important;
  background:linear-gradient(180deg,rgba(var(--trench-green-rgb),.18),rgba(10,26,23,.94)) !important;
  color:#f2fff9 !important;
  font-weight:850 !important;
  letter-spacing:.025em !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 8px 16px rgba(0,0,0,.16) !important;
}

.tokens-search-submit:hover,
.stalk-btn:hover,
.escrow-page button:hover,
.security-page button:hover,
.terms-page button:hover,
.token-wallet-hub button:hover,
.token-wallet-asset-panel button:hover,
.tokens-change-dialog button:hover{
  border-color:rgba(var(--trench-green-rgb),.70) !important;
  filter:brightness(1.08);
}

.tokens-table-wrap{
  border:1px solid rgba(145,174,163,.16) !important;
  border-radius:8px !important;
  background:rgba(5,10,12,.72) !important;
}

.tokens-table thead th{
  border-bottom-color:rgba(var(--trench-amber-rgb),.28) !important;
  background:rgba(14,22,23,.98) !important;
  color:#c8b98f !important;
  font-size:11px !important;
  letter-spacing:.075em !important;
  text-transform:uppercase !important;
}

.tokens-table tbody tr{background:rgba(9,15,17,.62) !important}
.tokens-table tbody tr:nth-child(even){background:rgba(14,21,22,.62) !important}
.tokens-table tbody tr:hover{
  background:rgba(var(--trench-green-rgb),.065) !important;
  box-shadow:inset 3px 0 0 rgba(var(--trench-green-rgb),.55) !important;
}

.token-wallet-hub-backdrop,
.token-wallet-asset-backdrop,
.tokens-change-backdrop{
  background:rgba(1,4,5,.82) !important;
  backdrop-filter:blur(7px) saturate(.75) !important;
}

.tokens-swap-dialog.token-chooser-active .tokens-swap-top{
  z-index:0 !important;
  pointer-events:none !important;
}

.tokens-swap-dialog.token-chooser-active #tokenSwapFocusStage{
  z-index:8 !important;
}

.token-wallet-hub-tabs,
.stalk-main-tabs,
.stalk-subtabs,
.token-wallet-add-switch{
  border-color:rgba(145,174,163,.15) !important;
  background:rgba(5,11,13,.72) !important;
}

.token-wallet-hub-tab.active,
.stalk-main-tab.active,
.token-wallet-add-switch button.active{
  color:#f4fff9 !important;
  border-color:rgba(var(--trench-green-rgb),.48) !important;
  background:rgba(var(--trench-green-rgb),.12) !important;
  box-shadow:inset 0 -2px 0 rgba(var(--trench-green-rgb),.62) !important;
}

.step-card,
.simple-summary,
.advanced-box,
.hero-card,
.secure-pill,
.truth,
.check,
.stat,
.asset-row,
.tx-row,
.token-wallet-asset-row,
.token-wallet-trustline-row,
.token-wallet-nft-card{
  border-color:rgba(145,174,163,.16) !important;
  border-radius:8px !important;
  background:rgba(7,13,15,.72) !important;
}

.step-num,
.fact .num,
.escrow-badge,
.status-pill,
.answer-chip,
.stalk-value-mode,
.stalk-history-count{
  border-radius:5px !important;
  border-color:rgba(var(--trench-amber-rgb),.32) !important;
  background:rgba(var(--trench-amber-rgb),.09) !important;
  color:#e8d6ad !important;
}

.site-footer{
  border-top-color:rgba(var(--trench-amber-rgb),.24) !important;
  background:rgba(7,12,14,.86) !important;
}

@media(max-width:920px){
  body.mode-tokens,
  body.wallet-radar-page,
  body.security-page,
  body.terms-page,
  body.zerps-trade-shell{
    background-size:auto,auto,768px 768px,auto !important;
  }
  .tabbar .tab-btn{min-height:36px !important;border-radius:6px !important}
  .tokens-panel,
  .stalk-command-deck,
  .stalk-panel,
  .escrow-hero,
  .escrow-card,
  .security-hero,
  .security-wrap .card,
  .terms-shell{border-radius:9px !important}
  .tokens-panel::after,
  .stalk-command-deck::after,
  .escrow-hero::after,
  .security-hero::after,
  .terms-shell::after{
    height:142px;
    opacity:.94;
    background-position:center 58%;
    filter:saturate(1.04) contrast(1.04) brightness(1.55);
  }
  body.mode-tokens .tokens-head{min-height:104px}
}

@media(prefers-reduced-motion:reduce){
  .tabbar .tab-btn{transition:none !important}
}