:root {
  --bg: #050506;
  --panel: #0d0d11;
  --panel-2: #151119;
  --line: rgba(255,255,255,.13);
  --text: #fbf9ff;
  --muted: #8e8795;
  --pink: #ff208a;
  --pink-2: #ff4fa5;
  --cyan: #24edf2;
  --violet: #873eff;
  --green: #64ff89;
  --amber: #ffbe43;
  --red: #ff526d;
}

html { background: #050506; }
body {
  background:
    radial-gradient(circle at 104% 11%, rgba(255,32,138,.16), transparent 25%),
    radial-gradient(circle at -8% 55%, rgba(36,237,242,.09), transparent 27%),
    #050506;
}
body::before {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  opacity: .12;
  background-image:
    radial-gradient(rgba(255,255,255,.2) .55px, transparent .7px),
    linear-gradient(125deg, transparent 0 67%, rgba(255,32,138,.12) 67% 67.35%, transparent 67.5%);
  background-size: 4px 4px, 100% 100%;
  mix-blend-mode: screen;
}

.ambient { opacity: .09; filter: blur(92px); }
.ambient-one { background: var(--pink); }
.ambient-two { background: var(--cyan); }
.shell { max-width: 760px; padding-top: max(14px, env(safe-area-inset-top)); }
.topbar { width: 100%; margin-bottom: 20px; }
.brand-image {
  width: 100%;
  min-width: 0;
  display: grid;
  justify-items: stretch;
  gap: 0;
}
.brand-logo {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  filter: drop-shadow(0 8px 18px rgba(255,32,138,.14));
}
.brand-image small {
  justify-self: center;
  margin: -1px 0 0;
  font-size: 10px;
  letter-spacing: .22em;
}
.brand-mark {
  border-radius: 10px 18px 10px 18px;
  background: linear-gradient(135deg, var(--pink) 0 48%, var(--violet) 49% 100%);
  box-shadow: 6px 6px 0 rgba(36,237,242,.15), 0 14px 35px rgba(255,32,138,.16);
  transform: skew(-4deg);
}
.brand-mark::after { border-radius: 9px 17px 9px 17px; }
.brand-mark span { font-style: italic; font-weight: 1000; }
.brand strong { font-size: 17px; font-style: italic; font-weight: 950; letter-spacing: -.06em; text-transform: uppercase; }
.brand small { font-size: 10px; letter-spacing: .2em; }
.icon-button {
  border-color: rgba(255,32,138,.3);
  border-radius: 8px 15px 8px 15px;
  color: var(--pink);
  background: #0c090e;
}
.icon-button:active { border-color: var(--cyan); color: var(--cyan); }

.eyebrow, .page-heading small, .section-head small, .deposit-head small { color: var(--pink); }
.eyebrow { margin-left: 2px; }
.hero-card {
  min-height: 264px;
  align-items: flex-start;
  padding: 35px 18px 20px;
  border-color: rgba(255,32,138,.26);
  border-radius: 8px 26px 8px 26px;
  background: linear-gradient(125deg, rgba(21,11,20,.98), rgba(5,7,10,.98));
  box-shadow: 8px 8px 0 rgba(135,62,255,.1), 0 24px 60px rgba(0,0,0,.4);
}
.hero-card::before {
  content: "NIGHT HUNT / ACTIVE";
  z-index: 5;
  width: 150px;
  height: auto;
  right: auto;
  left: -34px;
  top: 18px;
  padding: 3px 0;
  border-radius: 0;
  color: #050506;
  background: var(--cyan);
  filter: none;
  opacity: 1;
  transform: rotate(-35deg);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .14em;
  text-align: center;
}
.hero-card::after {
  content: "";
  position: absolute;
  right: -28px;
  bottom: -30px;
  width: 155px;
  height: 110px;
  transform: rotate(-10deg);
  background: repeating-linear-gradient(0deg, rgba(255,32,138,.18) 0 2px, transparent 2px 7px);
  opacity: .46;
}
.hero-copy { max-width: 69%; }
.hero-copy small { color: #aaa2af; }
.hero-copy h1 {
  margin: 15px 0 16px;
  font-size: clamp(32px, 9.4vw, 45px);
  font-style: italic;
  font-weight: 1000;
  line-height: .86;
  letter-spacing: -.075em;
  text-transform: uppercase;
  text-shadow: 3px 3px 0 rgba(135,62,255,.3);
  transform: skew(-3deg);
}
.hero-copy h1 span {
  background: linear-gradient(90deg, var(--pink), #ff7651 55%, var(--cyan));
  -webkit-background-clip: text;
  background-clip: text;
}
.hero-copy p {
  width: fit-content;
  max-width: 215px;
  padding: 8px 9px;
  border-left: 3px solid var(--green);
  color: #c5bfca;
  background: rgba(255,255,255,.035);
  font-size: 12px;
  font-weight: 700;
}
.radar {
  width: 170px;
  height: 170px;
  right: -11px;
  bottom: -5px;
  border: 2px solid rgba(36,237,242,.28);
  background:
    repeating-radial-gradient(circle, transparent 0 20%, rgba(36,237,242,.11) 20.5% 21%, transparent 21.5% 40%),
    linear-gradient(90deg, transparent 49.6%, rgba(36,237,242,.13) 50%, transparent 50.4%),
    linear-gradient(transparent 49.6%, rgba(36,237,242,.13) 50%, transparent 50.4%),
    radial-gradient(circle, rgba(36,237,242,.08), #020708 73%);
  box-shadow: 0 0 0 5px rgba(255,32,138,.035), 0 0 32px rgba(36,237,242,.09);
  opacity: .92;
}
.radar::after {
  inset: -2px;
  background: conic-gradient(from -90deg, transparent 0 310deg, rgba(255,32,138,.02), rgba(255,32,138,.48) 354deg, #fff 359deg, transparent 360deg);
}
.radar span { top: 35px; right: 40px; background: #ff7a42; box-shadow: 0 0 0 3px rgba(255,122,66,.15), 0 0 15px #ff7a42; }

.balance-card {
  position: relative;
  border-color: rgba(255,255,255,.14);
  border-left: 3px solid var(--pink);
  border-radius: 6px 18px 6px 18px;
  background: #0b0a0d;
  box-shadow: 5px 5px 0 rgba(36,237,242,.04);
}
.balance-card strong { font-weight: 950; }
.balance-add {
  border: 0;
  border-radius: 7px 14px 7px 14px;
  background: linear-gradient(135deg, var(--pink), var(--violet));
  box-shadow: 4px 4px 0 rgba(36,237,242,.14);
}
.metrics-grid { margin-bottom: 18px; }
.metrics-grid article {
  border-radius: 6px 16px 6px 16px;
  background: #0d0c10;
}
.metrics-grid article:nth-child(1) { border-top: 2px solid var(--pink); }
.metrics-grid article:nth-child(2) { border-top: 2px solid var(--violet); }
.metrics-grid article:nth-child(3) { border-top: 2px solid var(--cyan); }
.metrics-grid article.accent { background: #0d0c10; }

.section-head {
  align-items: center;
  margin: 0;
  padding: 15px 14px 12px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 7px 22px 0 0;
  background: linear-gradient(90deg, rgba(255,32,138,.075), #0b0b0e 70%);
}
.section-head h2 { font-size: 19px; font-style: italic; text-transform: uppercase; }
.section-head > span { color: var(--amber); background: rgba(255,190,67,.1); }
.readiness-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  border-radius: 0 0 7px 22px;
  background: #0b0b0e;
}
.readiness-item {
  min-width: 0;
  gap: 9px;
  padding: 11px 12px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.readiness-item:nth-child(2n) { border-right: 0; }
.readiness-item:nth-last-child(-n+2) { border-bottom: 0; }
.readiness-item:last-child { border-bottom: 0; }
.readiness-item > div { min-width: 0; }
.readiness-item > i {
  position: relative;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  border-radius: 5px 10px 5px 10px;
  font-size: 0;
  line-height: 1;
}
.readiness-item.complete > i::before {
  content: "✓";
  display: block;
  font-size: 15px;
  line-height: 1;
  transform: translateY(-.5px);
}
.readiness-item.missing > i::before,
.readiness-item.missing > i::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 2px;
  border-radius: 2px;
  background: var(--red);
  transform: translate(-50%,-50%) rotate(45deg);
}
.readiness-item.missing > i::after { transform: translate(-50%,-50%) rotate(-45deg); }
.readiness-item b { overflow: hidden; font-size: 12px; line-height: 1.25; }
.readiness-item span { overflow: hidden; margin-top: 2px; font-size: 10px; line-height: 1.3; text-overflow: ellipsis; }

.primary-action {
  border-radius: 6px 18px 6px 18px;
  background: linear-gradient(100deg, var(--pink), #c72fff 58%, var(--violet));
  box-shadow: 6px 6px 0 rgba(36,237,242,.13), 0 15px 36px rgba(255,32,138,.16);
  font-style: italic;
  text-transform: uppercase;
}
.secondary-action { border-radius: 6px 15px 6px 15px; }
.page-heading h1, .deposit-head h2 { font-style: italic; font-weight: 950; letter-spacing: -.055em; text-transform: uppercase; }
.mini-action { border-radius: 7px 14px 7px 14px; background: rgba(255,32,138,.1); }
.notice { border-radius: 6px 16px 6px 16px; background: rgba(36,237,242,.035); }

.filter-card, .alert-card, .purchase-card, .activity-card, .profile-card,
.profile-balance-overview, .community-card, .language-card, .owner-funnel-card,
.owner-feedback-card, .detail-card, .referral-card, .support-card, .auth-state, .empty {
  border-radius: 7px 20px 7px 20px;
  background: linear-gradient(135deg, rgba(18,14,19,.98), rgba(7,8,11,.98));
  box-shadow: 5px 5px 0 rgba(135,62,255,.045);
}
.filter-card { border-top: 2px solid var(--pink); }
.alert-card { border-top: 2px solid var(--cyan); }
.purchase-card { border-top: 2px solid var(--violet); }
.activity-card { border-left: 2px solid var(--pink); }
.profile-card { border-top: 2px solid var(--cyan); }
.profile-balance-overview { border-left: 3px solid var(--pink); }
.filter-icon, .activity-icon, .avatar, .referral-card-icon, .support-card-icon, .referral-person-avatar,
.collection-thumb, .catalog-thumb, .model-card-image { border-radius: 6px 13px 6px 13px; }
.status, .tier { border-radius: 5px 10px 5px 10px; }
.trait-line span, .alert-traits span { border-radius: 4px 9px 4px 9px; background: rgba(255,255,255,.035); }
.filter-actions button, .alert-actions button, .purchase-actions button { border-radius: 5px 11px 5px 11px; }
.segmented { border-radius: 6px 15px 6px 15px; background: #09090c; }
.segmented button { border-radius: 4px 10px 4px 10px; }
.segmented button.active { background: linear-gradient(105deg, rgba(255,32,138,.72), rgba(135,62,255,.72)); }
.alert-economics > div, .invoice-details button { background: #0d0c10; }
.alert-reason { border-left-color: var(--pink); background: rgba(255,32,138,.04); }
.profile-card h2 { font-style: italic; text-transform: uppercase; }
.referral-card { border-color: rgba(255,32,138,.24); }
.referral-card-icon { color: #050506; background: linear-gradient(135deg, var(--cyan), #7affc7); }
.support-card { border-color: rgba(81,239,160,.2); }

.deposit-sheet {
  border-color: rgba(255,32,138,.22);
  border-radius: 10px 28px 0 0;
  background:
    radial-gradient(circle at 100% 0, rgba(135,62,255,.13), transparent 28%),
    #0c0b0f;
}
.sheet-handle { background: linear-gradient(90deg, var(--pink), var(--cyan)); }
.deposit-head > button { border-radius: 6px 13px 6px 13px; background: #151119; }
.amount-grid button, .amount-input > div, .invoice-status, .invoice-details,
.deposit-history-item, .referral-offer > div, .referral-link-card, .referral-metrics article,
.referral-rules, .referral-person, .field-label select, .field-label textarea,
.collection-trigger, .collection-search, .collection-grid > button, .model-grid > button,
.input-unit, .mode-grid, .setup-summary, .ton-connect-status, .confirmed-address {
  border-radius: 6px 15px 6px 15px;
  background-color: #0d0c10;
}
.amount-grid button.active { border-color: var(--pink); box-shadow: inset 0 0 0 1px rgba(255,32,138,.2); }
.invoice-status { background: rgba(255,190,67,.055); }
.invoice-details button, .deposit-history-item, .referral-person,
.collection-grid > button, .model-grid > button { background: #111015; }
.referral-offer > div { border-color: rgba(255,32,138,.22); }
.referral-progress i { background: linear-gradient(90deg, var(--pink), var(--violet), var(--cyan)); }
.mode-grid button.active { background: linear-gradient(105deg, rgba(255,32,138,.82), rgba(135,62,255,.82)); }
.collection-grid > button:active, .model-grid > button:active, .model-grid > button.selected {
  border-color: rgba(36,237,242,.45);
  background: rgba(36,237,242,.055);
}
.tonkeeper-action { background: linear-gradient(105deg, #168cff, var(--violet)); }
.ton-connect-action { background: linear-gradient(105deg, #168cff, var(--violet)); }

.bottom-nav {
  border-top-color: rgba(255,32,138,.25);
  background: rgba(5,5,6,.95);
  box-shadow: 0 -14px 40px rgba(0,0,0,.32);
}
.bottom-nav button.active { color: var(--cyan); }
.bottom-nav button.active::after {
  content: "";
  position: absolute;
  bottom: -2px;
  width: 28px;
  height: 2px;
  background: linear-gradient(90deg, var(--pink), var(--cyan));
  box-shadow: 0 0 9px var(--cyan);
}
.bottom-nav .nav-badge { background: var(--pink); }

@media (max-width: 374px) {
  .hero-card { min-height: 250px; padding-left: 15px; }
  .hero-copy { max-width: 73%; }
  .hero-copy h1 { font-size: 30px; }
  .hero-copy p { max-width: 185px; font-size: 11px; }
  .radar { width: 151px; height: 151px; right: -16px; }
  .readiness-item { padding: 10px 8px; gap: 7px; }
  .readiness-item > i { width: 23px; height: 23px; flex-basis: 23px; }
  .readiness-item b { font-size: 11px; }
  .readiness-item span { font-size: 10px; }
}

@media (min-width: 560px) {
  .hero-copy { max-width: 58%; }
  .radar { right: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .view { animation: none; }
}

/* Midnight Liquid Glass — second visual pass. Business behaviour stays in app.js. */
:root {
  --glass-edge: rgba(255,255,255,.115);
  --glass-highlight: rgba(255,255,255,.17);
  --glass-top: rgba(255,255,255,.105);
  --glass-mid: rgba(255,255,255,.035);
  --glass-bottom: rgba(12,10,18,.66);
  --glass-shadow-lg: 0 24px 58px rgba(0,0,0,.44), 0 8px 20px rgba(0,0,0,.29);
  --glass-shadow-md: 0 18px 42px rgba(0,0,0,.36), 0 6px 16px rgba(0,0,0,.24);
  --glass-shadow-sm: 0 12px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.2);
}

html { background: #060509; }
body {
  background:
    radial-gradient(circle at 88% 8%, rgba(255,45,150,.19), transparent 30%),
    radial-gradient(circle at 18% 38%, rgba(55,225,238,.11), transparent 34%),
    radial-gradient(circle at 64% 30%, rgba(132,78,255,.14), transparent 38%),
    radial-gradient(circle at 28% 82%, rgba(40,215,225,.10), transparent 35%),
    radial-gradient(circle at 40% 4%, rgba(255,145,74,.055), transparent 22%),
    #060509;
  background-attachment: fixed;
}
body::before {
  opacity: .032;
  background-image: radial-gradient(rgba(255,255,255,.58) .5px, transparent .7px);
  background-size: 4px 4px;
  mix-blend-mode: soft-light;
}
body::after {
  content: "";
  position: fixed;
  z-index: 0;
  inset: -18%;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 72% 27%, rgba(123,71,255,.12), transparent 27%),
    radial-gradient(ellipse at 18% 68%, rgba(34,220,230,.09), transparent 28%);
  filter: blur(42px);
}
.ambient { z-index: 0; opacity: .105; filter: blur(108px); }
.ambient-one { width: 330px; height: 330px; right: -210px; top: 4%; background: #ff2d96; }
.ambient-two { width: 340px; height: 340px; left: -245px; bottom: 16%; background: #2ad9e5; }
.shell { isolation: isolate; }

/* Shared large glass surfaces: blur is intentionally limited to these elements. */
.hero-card,
.balance-card,
.section-head,
.readiness-card,
.view[data-view="home"] > .primary-action,
.bottom-nav {
  border: 1px solid var(--glass-edge);
  background:
    linear-gradient(145deg, var(--glass-top) 0%, var(--glass-mid) 28%, rgba(20,16,29,.5) 70%, var(--glass-bottom) 100%);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  backdrop-filter: blur(22px) saturate(145%);
  box-shadow:
    var(--glass-shadow-md),
    inset 0 1px 0 var(--glass-highlight),
    inset 0 -1px 0 rgba(255,255,255,.025);
}

.hero-card {
  min-height: 288px;
  align-items: flex-start;
  padding: 55px 20px 24px;
  margin-top: 0;
  border-radius: 30px;
  background:
    radial-gradient(ellipse at 74% 82%, rgba(41,222,231,.085), transparent 37%),
    radial-gradient(ellipse at 28% 8%, rgba(255,255,255,.11), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032) 28%, rgba(22,17,32,.52) 70%, rgba(10,8,15,.7));
  box-shadow:
    0 30px 70px rgba(0,0,0,.48),
    0 9px 24px rgba(0,0,0,.31),
    0 0 42px rgba(126,73,255,.065),
    inset 0 1px 0 rgba(255,255,255,.2),
    inset 0 -1px 0 rgba(255,255,255,.025);
}
.hero-wrap {
  position: relative;
  margin-top: 10px;
}
.hero-wrap::before {
  content: "NIGHT HUNT / ACTIVE";
  position: absolute;
  z-index: 6;
  width: 145px;
  height: 23px;
  left: 18px;
  top: -9px;
  display: flex;
  align-items: center;
  padding: 0 12px 0 14px;
  border: 1px solid rgba(207,255,255,.26);
  color: rgba(240,255,255,.92);
  background: linear-gradient(90deg, rgba(64,225,232,.7), rgba(101,170,186,.42));
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
  box-shadow: 0 7px 18px rgba(37,218,228,.12), inset 0 1px 0 rgba(255,255,255,.38);
  transform: rotate(-2deg);
  pointer-events: none;
  white-space: nowrap;
  font-size: 11px;
  font-style: italic;
  font-weight: 700;
  letter-spacing: .08em;
  text-align: left;
}
.hero-card::before { content: none; }
.hero-card::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: 250px;
  height: 138px;
  right: -78px;
  bottom: -68px;
  border-radius: 50%;
  background: linear-gradient(105deg, rgba(34,221,231,.12), rgba(134,74,255,.08) 54%, rgba(255,45,150,.09));
  filter: blur(28px);
  opacity: .8;
  transform: rotate(-8deg);
  pointer-events: none;
}
.hero-copy { z-index: 3; max-width: 72%; }
.hero-copy small { color: rgba(232,226,239,.68); font-size: 13px; }
.hero-copy h1 {
  max-width: 232px;
  margin: 16px 0 18px;
  font-size: clamp(27px, 7.8vw, 35px);
  font-weight: 950;
  line-height: .93;
  letter-spacing: -.065em;
  text-shadow: 0 6px 18px rgba(110,61,222,.22);
  transform: none;
}
.hero-copy h1 span {
  background: linear-gradient(180deg, #fbf9ff 0 18%, #d9c9ff 50%, #ff58ad 78%, #3fe5eb 112%);
  -webkit-background-clip: text;
  background-clip: text;
}
.hero-autobuy-status {
  position: absolute;
  z-index: 4;
  left: 20px;
  bottom: 20px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: fit-content;
  max-width: 224px;
  padding: 0 13px 0 11px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  color: rgba(239,235,245,.78);
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.018)),
    rgba(7,10,12,.33);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 10px 24px rgba(0,0,0,.22);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1;
}
.hero-autobuy-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  margin: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 28%, #e8ffef 0 12%, #68f99a 32%, #20bd61 100%);
  border: 1px solid rgba(222,255,231,.5);
  box-shadow: 0 0 12px rgba(66,244,129,.5), inset 0 -2px 3px rgba(0,77,31,.28);
}
.hero-autobuy-text {
  display: block;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  line-height: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  transform: none;
}
.radar {
  z-index: 1;
  width: 190px;
  height: 190px;
  right: -18px;
  bottom: -5px;
  border: 1px solid rgba(74,231,238,.13);
  background:
    repeating-radial-gradient(circle, transparent 0 20%, rgba(52,222,231,.075) 20.5% 21%, transparent 21.5% 40%),
    linear-gradient(90deg, transparent 49.6%, rgba(53,221,230,.08) 50%, transparent 50.4%),
    linear-gradient(transparent 49.6%, rgba(53,221,230,.08) 50%, transparent 50.4%),
    radial-gradient(circle, rgba(35,218,227,.055), transparent 67%);
  box-shadow: 0 0 45px rgba(40,220,229,.075), inset 0 0 36px rgba(20,164,174,.035);
  opacity: .72;
  -webkit-mask-image: radial-gradient(circle, #000 48%, rgba(0,0,0,.78) 67%, transparent 78%);
  mask-image: radial-gradient(circle, #000 48%, rgba(0,0,0,.78) 67%, transparent 78%);
}
.radar::after {
  inset: -1px;
  background: conic-gradient(from -90deg, transparent 0 318deg, rgba(45,224,232,.018) 326deg, rgba(45,224,232,.16) 350deg, rgba(255,79,165,.3) 359deg, transparent 360deg);
}
.radar span { top: 42px; right: 48px; background: #ff4fa5; box-shadow: 0 0 0 3px rgba(255,79,165,.1), 0 0 13px rgba(255,79,165,.72); }

.balance-card {
  min-height: 88px;
  overflow: hidden;
  align-items: center;
  margin: 14px 0 12px;
  padding: 20px;
  border: 1px solid var(--glass-edge);
  border-radius: 24px;
  background:
    radial-gradient(ellipse at 100% 18%, rgba(255,45,150,.105), transparent 34%),
    radial-gradient(ellipse at 0 105%, rgba(38,222,230,.09), transparent 36%),
    linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.03) 35%, rgba(15,12,21,.65));
  box-shadow: var(--glass-shadow-md), inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(255,255,255,.025);
}
.balance-card::before {
  content: "";
  position: absolute;
  width: 170px;
  height: 34px;
  left: 20px;
  top: -24px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  filter: blur(15px);
  pointer-events: none;
}
.balance-card::after {
  content: "";
  position: absolute;
  width: 120px;
  height: 70px;
  right: -38px;
  bottom: -42px;
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(133,69,255,.12), rgba(255,45,150,.15));
  filter: blur(16px);
  pointer-events: none;
}
.balance-card > * { position: relative; z-index: 1; }
.balance-card strong { font-size: 27px; font-weight: 900; }
.balance-card strong em { color: #ff67b2; }
.balance-side { margin-left: auto; }
.balance-side b { color: rgba(251,249,255,.92); font-size: 14px; }
.balance-add {
  position: relative;
  width: 42px;
  height: 42px;
  margin-left: 13px;
  border: 1px solid rgba(224,250,255,.18);
  border-radius: 15px;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.32), transparent 28%),
    radial-gradient(circle at 76% 82%, rgba(255,44,157,.28), transparent 45%),
    linear-gradient(145deg, rgba(44,232,238,.22), rgba(91,53,145,.22) 58%, rgba(9,11,17,.62));
  box-shadow: 0 11px 25px rgba(0,0,0,.31), 0 0 20px rgba(48,224,233,.075), inset 0 1px 0 rgba(255,255,255,.28), inset 0 -3px 8px rgba(3,22,28,.32);
}

.metrics-grid { gap: 9px; margin-bottom: 18px; }
.metrics-grid article,
.metrics-grid article.accent {
  position: relative;
  overflow: hidden;
  min-height: 84px;
  padding: 15px 13px;
  border: 1px solid rgba(255,255,255,.095);
  border-radius: 19px;
  background:
    linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.02) 36%, rgba(13,11,18,.72));
  box-shadow: var(--glass-shadow-sm), inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(255,255,255,.02);
}
.metrics-grid article::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 0;
  width: 44%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.38), transparent);
}
.metrics-grid article::after {
  content: "";
  position: absolute;
  left: 13px;
  bottom: 0;
  width: 36px;
  height: 2px;
  border-radius: 3px 3px 0 0;
  opacity: .62;
  box-shadow: 0 0 11px currentColor;
}
.metrics-grid article:nth-child(1),
.metrics-grid article:nth-child(2),
.metrics-grid article:nth-child(3) { border-top: 1px solid rgba(255,255,255,.095); }
.metrics-grid article:nth-child(1)::after { color: #ff3f9f; background: #ff3f9f; }
.metrics-grid article:nth-child(2)::after { color: #985dff; background: #985dff; }
.metrics-grid article:nth-child(3)::after { color: #34dfe7; background: #34dfe7; }
.metrics-grid span { color: rgba(213,208,221,.64); font-size: 11.5px; }

.section-head {
  position: relative;
  overflow: hidden;
  align-items: center;
  min-height: 68px;
  margin: 0;
  padding: 17px 17px 14px;
  border: 1px solid var(--glass-edge);
  border-bottom-color: rgba(255,255,255,.045);
  border-radius: 25px 25px 0 0;
  background:
    radial-gradient(ellipse at 0 50%, rgba(41,221,230,.085), transparent 36%),
    radial-gradient(ellipse at 100% 30%, rgba(255,46,150,.06), transparent 31%),
    linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.03) 40%, rgba(14,11,20,.66));
  box-shadow: 0 20px 48px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.18);
}
.section-head::before {
  content: "";
  position: absolute;
  left: 28px;
  top: -24px;
  width: 190px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  filter: blur(16px);
  pointer-events: none;
}
.section-head > * { position: relative; z-index: 1; }
.section-head small { color: rgba(73,237,241,.88); }
.section-head h2 { margin-top: 6px; font-size: 16px; line-height: 1.12; }
.section-head > span {
  min-width: 42px;
  padding: 7px 10px;
  border: 1px solid rgba(255,237,190,.15);
  color: #ffd276;
  background: linear-gradient(180deg, rgba(255,234,175,.14), rgba(255,189,64,.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 8px 18px rgba(0,0,0,.22);
  text-align: center;
}
.readiness-card {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  overflow: hidden;
  min-height: 154px;
  border: 1px solid var(--glass-edge);
  border-top: 0;
  border-radius: 0 0 25px 25px;
  background:
    radial-gradient(ellipse at 0 70%, rgba(37,220,229,.075), transparent 34%),
    radial-gradient(ellipse at 100% 60%, rgba(255,45,150,.05), transparent 30%),
    linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.018) 42%, rgba(12,10,18,.7));
  box-shadow: 0 24px 54px rgba(0,0,0,.4), inset 0 -1px 0 rgba(255,255,255,.025);
}
.readiness-item {
  position: relative;
  min-width: 0;
  min-height: 77px;
  gap: 12px;
  padding: 16px 14px;
  border: 0;
}
.readiness-item:nth-child(odd)::after {
  content: "";
  position: absolute;
  top: 12px;
  right: 0;
  bottom: 12px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.11) 35% 65%, transparent);
}
.readiness-item:nth-child(-n+2)::before {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.1) 24% 76%, transparent);
}
.readiness-item > div { min-width: 0; }
.readiness-item b {
  overflow: visible;
  font-size: 12.5px;
  line-height: 1.22;
  text-wrap: balance;
}
.readiness-item span {
  overflow: visible;
  margin-top: 4px;
  color: rgba(213,208,221,.66);
  font-size: 11px;
  line-height: 1.3;
  text-overflow: clip;
}
.readiness-item > i {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  font-size: 0;
  line-height: 1;
}
.readiness-item.complete > i {
  border: 1px solid rgba(218,255,229,.47);
  background:
    linear-gradient(145deg, rgba(140,255,181,.94), rgba(74,242,139,.9) 42%, rgba(25,190,98,.93));
  box-shadow:
    0 9px 20px rgba(45,235,122,.16),
    0 4px 9px rgba(0,0,0,.3),
    inset 0 1px 1px rgba(255,255,255,.62),
    inset 0 -3px 7px rgba(0,76,37,.22);
}
.readiness-item.complete > i::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 31px;
  height: 13px;
  left: 4px;
  top: 2px;
  border-radius: 50%;
  background: rgba(255,255,255,.42);
  filter: blur(3px);
  transform: none;
}
.readiness-item.complete > i::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 36px;
  height: 18px;
  left: 2px;
  bottom: -8px;
  border-radius: 50%;
  background: rgba(0,91,43,.25);
  filter: blur(4px);
}
.readiness-item.complete > i svg {
  position: relative;
  z-index: 2;
  width: 21px;
  height: 21px;
  fill: none;
  stroke: #07552d;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.readiness-item.missing > i {
  border: 1px solid rgba(255,115,135,.22);
  background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,82,109,.1) 45%, rgba(44,12,20,.48));
  box-shadow: 0 8px 18px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.13);
}
.readiness-item.missing > i::before,
.readiness-item.missing > i::after { width: 14px; height: 2px; }

.view[data-view="home"] > .primary-action {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
  padding: 14px 58px 14px 52px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.04) 45%, rgba(0,0,0,.1)),
    linear-gradient(105deg, #f62a9a, #a23cff 56%, #317de8);
  box-shadow:
    0 20px 44px rgba(0,0,0,.39),
    0 9px 28px rgba(201,45,255,.16),
    0 0 28px rgba(255,42,154,.095),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -5px 16px rgba(28,7,63,.16);
  font-size: 14px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: -.01em;
  text-transform: uppercase;
  text-shadow: 0 2px 8px rgba(27,6,47,.32);
}
.view[data-view="home"] > .primary-action::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 6%;
  right: 14%;
  top: -18px;
  height: 31px;
  border-radius: 50%;
  background: rgba(255,255,255,.42);
  filter: blur(10px);
  pointer-events: none;
}
.view[data-view="home"] > .primary-action::after {
  content: "↗";
  position: absolute;
  right: 11px;
  top: 50%;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 14px;
  transform: translateY(-50%);
  color: rgba(255,255,255,.94);
  background: linear-gradient(145deg, rgba(255,255,255,.18), rgba(15,12,44,.18));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.26), 0 8px 18px rgba(25,8,57,.2);
  font-size: 15px;
  font-style: normal;
  pointer-events: none;
}
.view[data-view="home"] > .primary-action > span { position: absolute; left: 19px; margin: 0; font-size: 18px; }

.bottom-nav {
  left: 50%;
  bottom: calc(8px + var(--safe-bottom));
  width: min(calc(100% - 16px), 740px);
  padding: 6px;
  border: 1px solid rgba(255,255,255,.115);
  border-radius: 27px;
  transform: translateX(-50%);
  background:
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.025) 38%, rgba(8,7,13,.68)),
    rgba(8,7,13,.58);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
  box-shadow: 0 18px 50px rgba(0,0,0,.48), 0 -8px 28px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.17);
}
.bottom-nav button {
  min-height: 50px;
  gap: 1px;
  padding: 6px 3px;
  border: 1px solid transparent;
  border-radius: 19px;
  color: rgba(191,187,201,.62);
}
.bottom-nav i { height: 20px; font-size: 18px; }
.bottom-nav span { font-size: 11.5px; }
.bottom-nav button.active {
  color: #50edf1;
  border-color: rgba(193,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(44,222,229,.075));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -5px 12px rgba(10,92,99,.1), 0 8px 18px rgba(0,0,0,.2);
}
.bottom-nav button.active::before {
  content: "";
  position: absolute;
  top: 5px;
  right: calc(50% - 16px);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #54f4ef;
  box-shadow: 0 0 8px rgba(84,244,239,.7);
}
.bottom-nav button.active::after { display: none; }
.shell { padding-bottom: calc(112px + var(--safe-bottom)); }

.market-search,
.market-pulse article,
.market-note,
.market-collection-card,
.market-selected-collection,
.market-model-card,
.market-detail-hero,
.market-detail-stats article,
.market-detail-chart,
.market-listing-card {
  border-color: rgba(255,255,255,.105);
  background:
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.018) 36%, rgba(9,8,14,.72)),
    rgba(10,9,14,.68);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 14px 30px rgba(0,0,0,.22);
}
.market-collection-card:active { border-color: rgba(80,237,241,.34); transform: translateY(1px); }
.market-model-card { border-top: 1px solid rgba(80,237,241,.22); }
.market-model-actions button.snipe {
  border-color: rgba(80,237,241,.55);
  background: linear-gradient(105deg, #2cdde4, #7d8dff);
  box-shadow: 0 8px 18px rgba(44,221,228,.12), inset 0 1px 0 rgba(255,255,255,.35);
}
.market-selected-collection {
  background:
    radial-gradient(circle at 90% 10%, rgba(255,32,138,.13), transparent 38%),
    linear-gradient(135deg, rgba(36,237,242,.08), rgba(132,67,255,.075)),
    rgba(9,8,14,.72);
}
.market-back { text-transform: uppercase; letter-spacing: .08em; }
.bottom-nav span { font-size: 11px; }

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .hero-card,
  .balance-card,
  .section-head,
  .readiness-card,
  .view[data-view="home"] > .primary-action,
  .bottom-nav {
    background-color: rgba(17,14,24,.96);
  }
}

@media (max-width: 374px) {
  .hero-card { min-height: 278px; padding: 54px 17px 22px; }
  .hero-copy { max-width: 76%; }
  .hero-copy h1 { max-width: 218px; font-size: 27px; }
  .hero-autobuy-status { left: 17px; bottom: 18px; max-width: 205px; font-size: 10.5px; }
  .radar { width: 174px; height: 174px; right: -31px; bottom: -2px; }
  .balance-card { padding: 18px 16px; }
  .balance-card strong { font-size: 24px; }
  .balance-add { width: 40px; height: 40px; flex: 0 0 40px; }
  .metrics-grid { gap: 7px; }
  .metrics-grid article, .metrics-grid article.accent { padding: 14px 10px; }
  .readiness-item { min-height: 75px; gap: 9px; padding: 14px 10px; }
  .readiness-item > i { width: 36px; height: 36px; flex-basis: 36px; border-radius: 13px; }
  .readiness-item b { font-size: 11.5px; }
  .readiness-item span { font-size: 10px; }
  .view[data-view="home"] > .primary-action { padding-left: 46px; padding-right: 54px; font-size: 13px; }
  .view[data-view="home"] > .primary-action > span { left: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .radar::after { transform: rotate(22deg); }
}

/* Radar design system — extend the final Midnight Liquid Glass pass to every tab. */
:root {
  --tab-surface: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.025) 34%, rgba(14,11,20,.7));
  --tab-surface-soft: linear-gradient(150deg, rgba(255,255,255,.065), rgba(255,255,255,.016) 38%, rgba(11,9,16,.74));
  --tab-inner: rgba(7,7,12,.42);
  --tab-radius-lg: 25px;
  --tab-radius-md: 19px;
}

.view[data-view="filters"] { --view-accent: 255,63,159; --view-accent-2: 52,223,231; }
.view[data-view="market"] { --view-accent: 52,223,231; --view-accent-2: 255,63,159; }
.view[data-view="activity"] { --view-accent: 52,223,231; --view-accent-2: 152,93,255; }
.view[data-view="profile"] { --view-accent: 152,93,255; --view-accent-2: 255,63,159; }

.view[data-view="market"],
.view[data-view="filters"],
.view[data-view="activity"],
.view[data-view="profile"] {
  position: relative;
  padding-top: 2px;
}

.view[data-view="market"] > .page-heading,
.view[data-view="filters"] > .page-heading,
.view[data-view="activity"] > .page-heading,
.view[data-view="profile"] > .page-heading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 112px;
  align-items: center;
  margin: 0 0 14px;
  padding: 22px 20px;
  border: 1px solid var(--glass-edge);
  border-radius: 28px;
  background:
    radial-gradient(ellipse at 100% 5%, rgba(var(--view-accent),.14), transparent 42%),
    radial-gradient(ellipse at 0 100%, rgba(var(--view-accent-2),.095), transparent 43%),
    var(--tab-surface);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  backdrop-filter: blur(22px) saturate(145%);
  box-shadow:
    var(--glass-shadow-md),
    inset 0 1px 0 rgba(255,255,255,.19),
    inset 0 -1px 0 rgba(255,255,255,.025);
}
.view[data-view="market"] > .page-heading::before,
.view[data-view="filters"] > .page-heading::before,
.view[data-view="activity"] > .page-heading::before,
.view[data-view="profile"] > .page-heading::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 170px;
  height: 170px;
  right: -62px;
  bottom: -96px;
  border: 1px solid rgba(var(--view-accent-2),.11);
  border-radius: 50%;
  background:
    repeating-radial-gradient(circle, transparent 0 22px, rgba(var(--view-accent-2),.065) 23px 24px),
    linear-gradient(90deg, transparent 49.7%, rgba(var(--view-accent-2),.08) 50%, transparent 50.3%),
    linear-gradient(transparent 49.7%, rgba(var(--view-accent-2),.08) 50%, transparent 50.3%);
  opacity: .82;
}
.view[data-view="market"] > .page-heading::after,
.view[data-view="filters"] > .page-heading::after,
.view[data-view="activity"] > .page-heading::after,
.view[data-view="profile"] > .page-heading::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 170px;
  height: 36px;
  left: 24px;
  top: -26px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  filter: blur(16px);
}
.view[data-view="market"] > .page-heading > *,
.view[data-view="filters"] > .page-heading > *,
.view[data-view="activity"] > .page-heading > *,
.view[data-view="profile"] > .page-heading > * { position: relative; z-index: 1; }
.view[data-view="market"] > .page-heading small,
.view[data-view="filters"] > .page-heading small,
.view[data-view="activity"] > .page-heading small,
.view[data-view="profile"] > .page-heading small {
  color: rgba(var(--view-accent-2),.9);
  font-size: 11px;
}
.view[data-view="market"] > .page-heading h1,
.view[data-view="filters"] > .page-heading h1,
.view[data-view="activity"] > .page-heading h1,
.view[data-view="profile"] > .page-heading h1 {
  margin-top: 7px;
  font-size: clamp(27px, 8vw, 34px);
  text-shadow: 0 6px 18px rgba(var(--view-accent),.15);
}

.mini-action {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  color: #fff;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.3), transparent 30%),
    linear-gradient(145deg, rgba(var(--view-accent),.42), rgba(var(--view-accent-2),.15) 62%, rgba(8,8,14,.55));
  box-shadow: 0 12px 26px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.26);
}
.market-page-heading .mini-action {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.notice,
.segmented.activity-tabs {
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 20px;
  background: var(--tab-surface-soft);
  box-shadow: var(--glass-shadow-sm), inset 0 1px 0 rgba(255,255,255,.12);
}
.notice { align-items: center; padding: 14px; margin-bottom: 12px; }
.notice > span {
  width: 28px;
  height: 28px;
  flex-basis: 28px;
  border: 1px solid rgba(218,255,255,.32);
  color: #064a50;
  background: linear-gradient(145deg, #8affff, #34dfe7 55%, #1ca6b2);
  box-shadow: 0 8px 18px rgba(52,223,231,.14), inset 0 1px 0 rgba(255,255,255,.55);
}
.notice p { color: rgba(225,220,232,.7); }

.segmented.activity-tabs { gap: 5px; padding: 5px; margin-bottom: 13px; }
.segmented.activity-tabs button { min-height: 40px; border-radius: 15px; }
.segmented.activity-tabs button.active,
.owner-funnel-range button.active {
  border: 1px solid rgba(255,255,255,.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    linear-gradient(105deg, rgba(246,42,154,.86), rgba(133,61,255,.82));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 9px 20px rgba(0,0,0,.2);
}

.filter-card,
.alert-card,
.purchase-card,
.activity-card,
.profile-card,
.profile-balance-overview,
.referral-card,
.detail-card,
.community-card,
.language-card,
.owner-funnel-card,
.owner-feedback-card,
.support-card,
.empty {
  position: relative;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: var(--tab-radius-lg);
  background: var(--tab-surface-soft);
  box-shadow:
    var(--glass-shadow-sm),
    inset 0 1px 0 rgba(255,255,255,.13),
    inset 0 -1px 0 rgba(255,255,255,.018);
}

.filter-card,
.alert-card,
.purchase-card { overflow: hidden; padding: 16px; }
.filter-card::before,
.alert-card::before,
.purchase-card::before,
.activity-card::before,
.profile-card::before,
.profile-balance-overview::before,
.referral-card::before,
.support-card::before,
.community-card::before,
.language-card::before,
.owner-funnel-card::before,
.owner-feedback-card::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 0;
  width: 42%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.34), transparent);
  pointer-events: none;
}
.filter-card::after,
.alert-card::after,
.purchase-card::after,
.activity-card::after {
  content: "";
  position: absolute;
  left: 16px;
  bottom: 0;
  width: 42px;
  height: 2px;
  border-radius: 3px 3px 0 0;
  background: rgb(var(--view-accent));
  box-shadow: 0 0 12px rgba(var(--view-accent),.7);
  opacity: .72;
}
.filter-card,
.alert-card,
.purchase-card,
.activity-card,
.profile-card { border-top-width: 1px; }

.filter-icon,
.activity-icon,
.avatar,
.referral-card-icon {
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 15px;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.26), transparent 30%),
    linear-gradient(145deg, rgba(var(--view-accent),.34), rgba(var(--view-accent-2),.16) 60%, rgba(10,9,16,.62));
  box-shadow: 0 10px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.18);
}
.filter-icon { width: 42px; height: 42px; flex-basis: 42px; }
.filter-top small, .alert-title small, .purchase-title small { color: rgba(var(--view-accent-2),.9); }
.status, .tier {
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 11px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.trait-line span,
.alert-traits span {
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 10px;
  background: rgba(255,255,255,.035);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
}
.filter-numbers,
.alert-economics,
.purchase-details,
.community-details,
.owner-funnel-steps {
  border-color: rgba(255,255,255,.085);
  border-radius: 16px;
  background: rgba(255,255,255,.045);
}
.alert-economics > div,
.purchase-details > div,
.community-details > div,
.owner-funnel-step { background: rgba(7,7,12,.56); }
.filter-actions button,
.alert-actions button,
.purchase-actions button {
  min-height: 42px;
  border-color: rgba(255,255,255,.095);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085);
}
.filter-actions button.resume,
.alert-actions button.buy,
.purchase-actions button.send {
  border-color: rgba(126,255,170,.26);
  background: linear-gradient(145deg, rgba(127,255,174,.94), rgba(64,224,126,.88));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 8px 18px rgba(52,226,122,.1);
}
.activity-card { overflow: hidden; align-items: center; min-height: 70px; padding: 15px; border-left-width: 1px; }
.activity-icon { width: 42px; height: 42px; flex-basis: 42px; }
.alert-image,
.purchase-image {
  border-color: rgba(255,255,255,.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at 35% 20%, rgba(255,255,255,.14), transparent 34%),
    linear-gradient(145deg, rgba(var(--view-accent),.12), rgba(var(--view-accent-2),.07) 58%, rgba(8,8,13,.7));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.22);
}
.alert-reason,
.purchase-warning { border-radius: 0 12px 12px 0; background: rgba(var(--view-accent),.045); }

.profile-card { min-height: 86px; gap: 14px; padding: 15px 16px; }
.avatar { width: 58px; height: 58px; flex-basis: 58px; border-radius: 19px; }
.profile-card h2 { font-size: 18px; }
.tier {
  padding: 7px 9px;
  color: #64f4f4;
  background: linear-gradient(180deg, rgba(52,223,231,.14), rgba(52,223,231,.045));
}
.profile-balance-overview {
  overflow: hidden;
  min-height: 86px;
  align-items: center;
  padding: 16px;
  border-left-width: 1px;
  background:
    radial-gradient(ellipse at 0 100%, rgba(52,223,231,.105), transparent 40%),
    radial-gradient(ellipse at 100% 0, rgba(255,63,159,.105), transparent 37%),
    var(--tab-surface-soft);
}
.profile-balance-overview strong { font-size: 22px; }
.profile-balance-overview small { color: #4be7ed; }
.referral-card { overflow: hidden; min-height: 72px; padding: 14px; border-color: rgba(255,255,255,.105); }
.referral-card-icon { color: #052d31; background: linear-gradient(145deg, #8effff, #3de5e9 50%, #3be59a); }
.detail-card { background: var(--tab-surface-soft); }
.detail-card > div { padding: 14px 15px; border-color: rgba(255,255,255,.075); }
.detail-card i.ok,
.owner-launch-row b {
  border: 1px solid rgba(218,255,229,.22);
  color: #4ff492;
  background: linear-gradient(145deg, rgba(100,255,137,.16), rgba(30,160,84,.1));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.community-card,
.owner-funnel-card,
.owner-feedback-card { overflow: hidden; padding: 16px; }
.community-head small,
.owner-funnel-head small,
.language-card small { color: #4be7ed; }
.community-head > span.ready,
.owner-launch-head > span.ready {
  border: 1px solid rgba(100,255,137,.14);
  background: linear-gradient(180deg, rgba(100,255,137,.14), rgba(100,255,137,.035));
}
.community-actions .secondary-action,
.view[data-view="profile"] > .secondary-action {
  min-height: 48px;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 17px;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.02));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 10px 22px rgba(0,0,0,.2);
}
.language-card { overflow: hidden; min-height: 66px; padding: 13px 15px; background: var(--tab-surface-soft); }
.language-switch {
  padding: 4px;
  border-color: rgba(255,255,255,.09);
  border-radius: 14px;
  background: rgba(5,6,10,.48);
}
.language-switch button { border-radius: 10px; }
.language-switch button.active {
  border: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(105deg, rgba(246,42,154,.85), rgba(133,61,255,.82));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 8px 18px rgba(0,0,0,.2);
}
.owner-funnel-card {
  border-color: rgba(255,255,255,.105);
  background:
    radial-gradient(ellipse at 0 0, rgba(52,223,231,.09), transparent 36%),
    radial-gradient(ellipse at 100% 8%, rgba(152,93,255,.1), transparent 35%),
    var(--tab-surface-soft);
}
.owner-feedback-card {
  border-color: rgba(255,255,255,.105);
  background:
    radial-gradient(ellipse at 0 0, rgba(81,239,160,.09), transparent 36%),
    radial-gradient(ellipse at 100% 8%, rgba(52,223,231,.08), transparent 35%),
    var(--tab-surface-soft);
}
.owner-funnel-head > button {
  width: 38px;
  height: 38px;
  border-color: rgba(255,255,255,.1);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}
.owner-funnel-range { border-radius: 16px; background: rgba(5,6,10,.48); }
.owner-funnel-metric,
.owner-launch-row {
  border-color: rgba(255,255,255,.085);
  border-radius: 15px;
  background: linear-gradient(150deg, rgba(255,255,255,.055), rgba(255,255,255,.012) 42%, rgba(6,7,11,.56));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
}
.empty {
  padding: 40px 22px;
  border-style: solid;
  background:
    radial-gradient(ellipse at 50% 0, rgba(var(--view-accent),.09), transparent 44%),
    var(--tab-surface-soft);
}
.empty > i { color: rgb(var(--view-accent)); text-shadow: 0 0 18px rgba(var(--view-accent),.35); }
.empty button {
  min-height: 42px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    linear-gradient(105deg, #f62a9a, #873eff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 10px 24px rgba(0,0,0,.24);
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .view[data-view="filters"] > .page-heading,
  .view[data-view="market"] > .page-heading,
  .view[data-view="activity"] > .page-heading,
  .view[data-view="profile"] > .page-heading { background-color: rgba(17,14,24,.97); }
}

@media (max-width: 374px) {
  .view[data-view="filters"] > .page-heading,
  .view[data-view="market"] > .page-heading,
  .view[data-view="activity"] > .page-heading,
  .view[data-view="profile"] > .page-heading { min-height: 102px; padding: 18px 16px; }
  .view[data-view="filters"] > .page-heading h1,
  .view[data-view="market"] > .page-heading h1,
  .view[data-view="activity"] > .page-heading h1,
  .view[data-view="profile"] > .page-heading h1 { font-size: 25px; }
  .profile-balance-overview { grid-template-columns: 1.2fr 1fr 1fr; padding: 14px 12px; }
  .profile-balance-overview strong { font-size: 19px; }
  .filter-card, .alert-card, .purchase-card { padding: 14px; }
}

/* Nested market and filter flows use the same glass command-deck language as the main tabs. */
#marketModelsStep,
#marketModelDetailStep { position: relative; }
.market-back {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  margin-bottom: 11px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 13px;
  color: #58edf1;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 9px 20px rgba(0,0,0,.18);
}
.market-back:active { border-color: rgba(80,237,241,.34); background: rgba(80,237,241,.08); }
.market-selected-collection,
.market-detail-hero {
  border-radius: 22px;
  background:
    radial-gradient(ellipse at 92% 0, rgba(246,42,154,.13), transparent 39%),
    radial-gradient(ellipse at 0 100%, rgba(52,223,231,.1), transparent 42%),
    var(--tab-surface-soft);
}
.market-model-card,
.market-listing-card { border-radius: 20px; }

.setup-sheet {
  border: 1px solid rgba(255,255,255,.13);
  background:
    radial-gradient(ellipse at 100% 0, rgba(246,42,154,.13), transparent 34%),
    radial-gradient(ellipse at 0 32%, rgba(52,223,231,.08), transparent 38%),
    rgba(11,9,16,.94);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
  box-shadow: 0 -22px 60px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.15);
}
.setup-sheet .deposit-head {
  margin: 0 -2px 12px;
  padding: 3px 2px 12px;
  border-bottom: 1px solid rgba(255,255,255,.075);
}
.setup-sheet .collection-trigger,
.setup-sheet .trait-trigger,
.setup-sheet .collection-search,
.setup-sheet .field-label select,
.setup-sheet .input-unit,
.setup-sheet .mode-grid,
.setup-sheet .setup-summary {
  border-color: rgba(255,255,255,.105);
  background: linear-gradient(150deg, rgba(255,255,255,.065), rgba(255,255,255,.012) 42%, rgba(6,7,11,.62));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 10px 24px rgba(0,0,0,.16);
}
.setup-sheet .collection-grid > button,
.setup-sheet .model-grid > button,
.setup-sheet .trait-option-list > button {
  border-color: rgba(255,255,255,.105);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.014) 38%, rgba(8,8,13,.7));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 10px 22px rgba(0,0,0,.18);
}
.setup-sheet .model-grid > button.selected,
.setup-sheet .trait-option-list > button.selected {
  border-color: rgba(80,237,241,.42);
  background:
    linear-gradient(145deg, rgba(80,237,241,.12), rgba(135,62,255,.08) 52%, rgba(8,8,13,.7));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 1px rgba(80,237,241,.06), 0 12px 25px rgba(0,0,0,.2);
}

/* Liquid glass is shared by every application sheet, not only the Radar surface. */
.sheet-backdrop {
  background: rgba(3,3,7,.58);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  backdrop-filter: blur(10px) saturate(120%);
}
.deposit-sheet,
.referral-sheet,
.feedback-sheet,
.setup-sheet {
  border-color: rgba(255,255,255,.14);
  background:
    radial-gradient(ellipse at 96% 0, rgba(246,42,154,.14), transparent 34%),
    radial-gradient(ellipse at 0 38%, rgba(52,223,231,.09), transparent 40%),
    linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.012) 32%, rgba(8,7,13,.88)),
    rgba(10,8,15,.88);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  backdrop-filter: blur(26px) saturate(150%);
  box-shadow: 0 -26px 70px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.17);
}
.deposit-head > button,
.amount-grid button,
.amount-input > div,
.invoice-status,
.invoice-details,
.invoice-details button,
.deposit-history-item,
.referral-offer > div,
.referral-link-card,
.referral-metrics article,
.referral-rules,
.referral-person,
.feedback-history-item,
.owner-feedback-item,
.field-label textarea,
.collection-trigger,
.trait-trigger,
.collection-search,
.collection-grid > button,
.model-grid > button,
.trait-option-list > button,
.input-unit,
.mode-grid,
.setup-summary,
.ton-connect-status,
.confirmed-address {
  border-color: rgba(255,255,255,.105);
  background:
    linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.014) 42%, rgba(6,7,11,.56)),
    rgba(10,9,15,.62);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 10px 24px rgba(0,0,0,.16);
}
.trait-option-list > button > i {
  border-color: rgba(255,255,255,.13);
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.25), transparent 30%),
    linear-gradient(145deg, rgba(246,42,154,.3), rgba(135,62,255,.18) 58%, rgba(8,8,13,.66));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 8px 18px rgba(0,0,0,.18);
}

/* Filter builder mirrors the large liquid-glass header and cards from the main tabs. */
#filterSheet {
  padding: 10px 14px calc(24px + var(--safe-bottom));
  background:
    radial-gradient(ellipse at 92% 8%, rgba(246,42,154,.18), transparent 30%),
    radial-gradient(ellipse at 3% 44%, rgba(52,223,231,.1), transparent 34%),
    linear-gradient(165deg, rgba(255,255,255,.065), rgba(8,7,13,.92) 34%, rgba(6,6,10,.95));
}
#filterSheet .sheet-handle {
  width: 72px;
  height: 4px;
  margin-bottom: 10px;
  background: linear-gradient(90deg, transparent, #f62a9a 28%, #9e47ff 58%, #34dfe7 82%, transparent);
  box-shadow: 0 0 13px rgba(52,223,231,.34);
}
#filterSheet .deposit-head {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 112px;
  align-items: center;
  margin: 0 0 12px;
  padding: 21px 18px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 27px;
  background:
    radial-gradient(ellipse at 100% 4%, rgba(246,42,154,.18), transparent 43%),
    radial-gradient(ellipse at 0 100%, rgba(52,223,231,.11), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.11), rgba(255,255,255,.027) 35%, rgba(14,11,20,.72));
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
  box-shadow: 0 18px 44px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.21), inset 0 -1px 0 rgba(255,255,255,.025);
}
#filterSheet .deposit-head::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: -56px;
  bottom: -100px;
  width: 180px;
  height: 180px;
  border: 1px solid rgba(52,223,231,.11);
  border-radius: 50%;
  background:
    repeating-radial-gradient(circle, transparent 0 22px, rgba(52,223,231,.07) 23px 24px),
    linear-gradient(90deg, transparent 49.7%, rgba(52,223,231,.08) 50%, transparent 50.3%),
    linear-gradient(transparent 49.7%, rgba(52,223,231,.08) 50%, transparent 50.3%);
}
#filterSheet .deposit-head::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 22px;
  top: -28px;
  width: 170px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  filter: blur(17px);
}
#filterSheet .deposit-head > div,
#filterSheet .deposit-head > button { position: relative; z-index: 1; }
#filterSheet .deposit-head small { color: #54edf1; font-size: 11px; letter-spacing: .17em; }
#filterSheet .deposit-head h2 { margin-top: 7px; font-size: clamp(26px,7.5vw,33px); text-shadow: 0 7px 20px rgba(246,42,154,.17); }
#filterSheet .deposit-head > button {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  color: rgba(255,255,255,.72);
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.28), transparent 30%),
    linear-gradient(145deg, rgba(246,42,154,.25), rgba(135,62,255,.13) 58%, rgba(8,8,14,.62));
  box-shadow: 0 12px 26px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.22);
}
#filterSheet > .sheet-copy {
  margin-bottom: 13px;
  padding: 13px 14px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  color: rgba(226,221,232,.69);
  background: linear-gradient(150deg, rgba(255,255,255,.065), rgba(255,255,255,.012) 42%, rgba(6,7,11,.56));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 12px 26px rgba(0,0,0,.17);
}
#filterSheet .form-stack { gap: 14px; }
#filterSheet .field-label > span {
  margin: 0 0 7px 4px;
  color: rgba(211,204,218,.67);
  font-size: 11px;
  letter-spacing: .15em;
}
#filterSheet .collection-trigger {
  min-height: 64px;
  grid-template-columns: 46px minmax(0,1fr) 22px;
  padding: 8px 12px 8px 9px;
  border-radius: 20px;
}
#filterSheet .collection-thumb { width: 46px; height: 46px; border-radius: 15px; }
#filterSheet .collection-trigger b { font-size: 14px; }
#filterSheet .trait-trigger,
#filterSheet .input-unit {
  min-height: 47px;
  border-radius: 17px;
}
#filterSheet .trait-trigger { padding: 10px 12px; }
#filterSheet .trait-trigger b { font-size: 13px; }
#filterSheet .mode-grid {
  gap: 5px;
  padding: 5px;
  border-radius: 18px;
}
#filterSheet .mode-grid button { min-height: 39px; border-radius: 13px; }
#filterSheet .mode-grid button.active {
  border: 1px solid rgba(255,255,255,.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    linear-gradient(105deg, rgba(246,42,154,.9), rgba(135,61,255,.86));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 9px 20px rgba(0,0,0,.22);
}
#filterSheet .setup-summary {
  overflow: hidden;
  border-radius: 20px;
  background:
    radial-gradient(ellipse at 100% 0, rgba(52,223,231,.07), transparent 42%),
    linear-gradient(150deg, rgba(255,255,255,.07), rgba(255,255,255,.012) 42%, rgba(6,7,11,.62));
}
#filterSheet .setup-summary > div { min-height: 39px; align-items: center; padding: 9px 12px; border-color: rgba(255,255,255,.075); }
#filterSheet .setup-submit {
  min-height: 52px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    linear-gradient(105deg, #f62a9a, #873eff 68%, #5a53ff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 15px 34px rgba(80,22,118,.28);
}

/* Balance top-up follows the same liquid-glass language as Radar. */
#depositSheet {
  padding: 10px 14px calc(24px + var(--safe-bottom));
  border-color: rgba(255,255,255,.14);
  background:
    radial-gradient(ellipse at 92% 7%, rgba(246,42,154,.2), transparent 31%),
    radial-gradient(ellipse at 3% 48%, rgba(52,223,231,.11), transparent 34%),
    linear-gradient(165deg, rgba(255,255,255,.07), rgba(8,7,13,.93) 35%, rgba(6,6,10,.96));
  -webkit-backdrop-filter: blur(28px) saturate(155%);
  backdrop-filter: blur(28px) saturate(155%);
  box-shadow: 0 -28px 80px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17);
}
#depositSheet .sheet-handle {
  width: 72px;
  height: 4px;
  margin-bottom: 10px;
  background: linear-gradient(90deg, transparent, #f62a9a 28%, #9e47ff 58%, #34dfe7 82%, transparent);
  box-shadow: 0 0 13px rgba(52,223,231,.34);
}
#depositSheet .deposit-head {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 116px;
  align-items: center;
  margin: 0 0 12px;
  padding: 21px 18px;
  border: 1px solid var(--glass-edge);
  border-radius: 27px;
  background:
    radial-gradient(ellipse at 100% 5%, rgba(246,42,154,.19), transparent 43%),
    radial-gradient(ellipse at 0 100%, rgba(52,223,231,.12), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.115), rgba(255,255,255,.027) 36%, rgba(14,11,20,.72));
  box-shadow: var(--glass-shadow-md), inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(255,255,255,.03);
}
#depositSheet .deposit-head::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: -44px;
  bottom: -96px;
  width: 190px;
  height: 190px;
  border: 1px solid rgba(52,223,231,.11);
  border-radius: 50%;
  background:
    repeating-radial-gradient(circle, transparent 0 22px, rgba(52,223,231,.07) 23px 24px),
    linear-gradient(90deg, transparent 49.7%, rgba(52,223,231,.08) 50%, transparent 50.3%),
    linear-gradient(transparent 49.7%, rgba(52,223,231,.08) 50%, transparent 50.3%);
}
#depositSheet .deposit-head::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 22px;
  top: -29px;
  width: 170px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  filter: blur(17px);
}
#depositSheet .deposit-head > div,
#depositSheet .deposit-head > button { position: relative; z-index: 1; }
#depositSheet .deposit-head small { color: #54edf1; font-size: 11px; letter-spacing: .17em; }
#depositSheet .deposit-head h2 {
  margin-top: 7px;
  font-size: clamp(25px,7vw,32px);
  text-shadow: 0 7px 20px rgba(246,42,154,.18);
}
#depositSheet .deposit-head > button {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  color: rgba(255,255,255,.75);
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.28), transparent 30%),
    linear-gradient(145deg, rgba(246,42,154,.25), rgba(135,62,255,.13) 58%, rgba(8,8,14,.62));
  box-shadow: 0 12px 26px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.22);
}
#depositAmountStep,
#depositInvoiceStep:not(.hidden) {
  position: relative;
  overflow: hidden;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 23px;
  background:
    radial-gradient(ellipse at 100% 0, rgba(52,223,231,.065), transparent 40%),
    linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.014) 42%, rgba(6,7,11,.64));
  box-shadow: var(--glass-shadow-sm), inset 0 1px 0 rgba(255,255,255,.13);
}
#depositSheet .sheet-copy { margin: 0 1px 13px; color: rgba(226,221,232,.7); }
#depositSheet .amount-grid { gap: 9px; }
#depositSheet .amount-grid button {
  min-height: 50px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 17px;
  color: rgba(249,247,252,.92);
  background:
    radial-gradient(circle at 25% 15%, rgba(255,255,255,.13), transparent 31%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.015) 44%, rgba(8,8,13,.72));
  box-shadow: 0 10px 22px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.12);
}
#depositSheet .amount-grid button::after {
  content: " GRAM";
  color: rgba(52,223,231,.72);
  font-size: 10px;
  letter-spacing: .08em;
}
#depositSheet .amount-grid button.active {
  border-color: rgba(52,223,231,.36);
  background:
    linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.025)),
    linear-gradient(115deg, rgba(246,42,154,.35), rgba(135,62,255,.25) 60%, rgba(52,223,231,.18));
  box-shadow: 0 12px 27px rgba(43,12,74,.28), inset 0 1px 0 rgba(255,255,255,.24), 0 0 18px rgba(52,223,231,.06);
}
#depositSheet .amount-input { margin-top: 15px; }
#depositSheet .amount-input > span { margin-left: 4px; color: rgba(211,204,218,.67); }
#depositSheet .amount-input > div {
  min-height: 53px;
  border-radius: 18px;
  background:
    linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.012) 42%, rgba(6,7,11,.68));
}
#depositSheet .amount-input input { font-size: 17px; }
#depositSheet .amount-input b { color: #54edf1; letter-spacing: .1em; }
#depositSheet .deposit-create,
#depositSheet .tonkeeper-action {
  min-height: 52px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    linear-gradient(105deg, #f62a9a, #873eff 68%, #5a53ff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 15px 34px rgba(80,22,118,.28);
}
#depositSheet .invoice-status,
#depositSheet .invoice-details { border-radius: 18px; }
#depositSheet .invoice-amount {
  margin: 10px 0;
  padding: 16px 10px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.01));
}
#depositSheet .invoice-amount strong { font-size: 32px; }
#depositSheet .invoice-details button { min-height: 58px; }
#depositSheet .secondary-action { border-radius: 17px; }
#depositSheet .deposit-history {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 21px;
  background: linear-gradient(150deg, rgba(255,255,255,.065), rgba(255,255,255,.012) 42%, rgba(6,7,11,.6));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 12px 28px rgba(0,0,0,.17);
}
#depositSheet .deposit-history-head { margin: 0 1px 9px; }
#depositSheet .deposit-history-item { min-height: 54px; border-radius: 16px; }

@media (max-width: 380px) {
  #depositSheet .deposit-head { min-height: 104px; padding: 17px 15px; }
  #depositSheet .deposit-head h2 { font-size: 24px; }
  #depositAmountStep, #depositInvoiceStep:not(.hidden) { padding: 13px; }
  #depositSheet .amount-grid button { min-height: 46px; }
}

/* Shared liquid-glass loading, empty and error states. */
.ui-state {
  --state-accent: var(--view-accent, 52,223,231);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 176px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 28px 22px;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 24px;
  color: rgba(224,219,230,.69);
  background:
    radial-gradient(ellipse at 50% -5%, rgba(var(--state-accent),.13), transparent 50%),
    radial-gradient(ellipse at 100% 100%, rgba(246,42,154,.065), transparent 42%),
    linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.014) 42%, rgba(6,7,11,.68));
  box-shadow: var(--glass-shadow-sm), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -1px 0 rgba(255,255,255,.02);
  text-align: center;
}
.ui-state::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 17%;
  top: 0;
  width: 42%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.42), transparent);
}
.ui-state::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -52px;
  bottom: -74px;
  width: 150px;
  height: 150px;
  border: 1px solid rgba(var(--state-accent),.07);
  border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 18px, rgba(var(--state-accent),.045) 19px 20px);
}
.ui-state > div { max-width: 300px; }
.ui-state b { display: block; color: rgba(251,249,255,.94); font-size: 14px; line-height: 1.25; }
.ui-state p { margin: 6px 0 0; color: rgba(211,205,219,.61); font-size: 12px; line-height: 1.5; }
.ui-state-icon,
.ui-state-spinner {
  position: relative;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 17px;
  color: rgb(var(--state-accent));
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.25), transparent 31%),
    linear-gradient(145deg, rgba(var(--state-accent),.2), rgba(135,62,255,.12) 60%, rgba(8,8,14,.66));
  box-shadow: 0 12px 28px rgba(0,0,0,.25), 0 0 22px rgba(var(--state-accent),.08), inset 0 1px 0 rgba(255,255,255,.2);
  font-size: 22px;
  font-style: normal;
}
.ui-state-error { --state-accent: 255,79,117; }
.ui-state-error .ui-state-icon { color: #ff738a; }
.ui-state-spinner { display: flex; align-items: center; justify-content: center; gap: 4px; }
.ui-state-spinner i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgb(var(--state-accent));
  box-shadow: 0 0 9px rgba(var(--state-accent),.72);
  animation: stateDot 1.05s ease-in-out infinite;
}
.ui-state-spinner i:nth-child(2) { animation-delay: .14s; }
.ui-state-spinner i:nth-child(3) { animation-delay: .28s; }
.ui-state-shimmer {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(105deg, transparent 28%, rgba(255,255,255,.035) 43%, rgba(255,255,255,.09) 50%, rgba(255,255,255,.035) 57%, transparent 72%);
  transform: translateX(-100%);
  animation: stateShimmer 1.8s ease-in-out infinite;
  pointer-events: none;
}
.ui-state > button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 10px 17px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 14px;
  color: white;
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.025)),
    linear-gradient(105deg, #f62a9a, #873eff 72%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 10px 24px rgba(0,0,0,.24);
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}
.ui-state > button i { color: #62f4f5; font-size: 17px; font-style: normal; line-height: 1; }
.ui-state > button:active { transform: translateY(1px) scale(.99); }
.ui-state.compact {
  min-height: 116px;
  gap: 8px;
  padding: 18px 15px;
  border-radius: 18px;
}
.ui-state.compact .ui-state-icon,
.ui-state.compact .ui-state-spinner { width: 36px; height: 36px; flex-basis: 36px; border-radius: 13px; font-size: 17px; }
.ui-state.compact b { font-size: 13px; }
.ui-state.compact p { margin-top: 4px; font-size: 11px; }
.owner-funnel-content > .ui-state,
.owner-launch-content > .ui-state { margin-top: 8px; }

@keyframes stateDot {
  0%, 65%, 100% { opacity: .32; transform: translateY(0) scale(.82); }
  32% { opacity: 1; transform: translateY(-3px) scale(1); }
}
@keyframes stateShimmer {
  0% { transform: translateX(-105%); }
  68%, 100% { transform: translateX(105%); }
}

@media (prefers-reduced-motion: reduce) {
  .ui-state-spinner i,
  .ui-state-shimmer { animation: none; }
}

/* Responsive safety: fixed navigation and Telegram viewport never cover focused content. */
html {
  scroll-padding-top: max(14px, env(safe-area-inset-top));
  scroll-padding-bottom: calc(96px + var(--safe-bottom));
}
.shell { padding-bottom: calc(124px + var(--safe-bottom)); }
.view { scroll-margin-bottom: calc(96px + var(--safe-bottom)); }
.deposit-sheet {
  max-height: min(94vh, 94dvh);
  overscroll-behavior: contain;
  scroll-padding-top: 14px;
  scroll-padding-bottom: calc(28px + var(--safe-bottom));
}
.readiness-item,
.filter-card,
.alert-card,
.purchase-card,
.community-card,
.market-collection-card,
.market-model-card,
.market-listing-card { scroll-margin-bottom: calc(92px + var(--safe-bottom)); }

@media (max-width: 374px) {
  .bottom-nav { width: calc(100% - 12px); padding: 5px; border-radius: 24px; }
  .bottom-nav button { min-width: 0; min-height: 48px; padding-right: 1px; padding-left: 1px; }
  .bottom-nav span { max-width: 100%; overflow: hidden; font-size: 10.5px; white-space: nowrap; text-overflow: ellipsis; }
  .market-collection-card { grid-template-columns: 46px minmax(0,1fr) auto; gap: 8px; padding: 9px; }
  .market-collection-thumb { width: 46px; height: 46px; }
  .market-collection-main p { gap: 3px; }
  .market-collection-main p span { padding: 3px 4px; font-size: 10px; }
  .market-model-head { grid-template-columns: 52px minmax(0,1fr) auto; gap: 8px; padding: 9px; }
  .market-model-image { width: 52px; height: 52px; }
  .market-model-price small { font-size: 10px; }
  .market-listing-card { grid-template-columns: 44px minmax(0,1fr) auto; gap: 8px; padding: 9px; }
  .market-listing-image { width: 44px; height: 44px; }
  .purchase-head { grid-template-columns: 46px minmax(0,1fr) auto; gap: 7px; }
  .purchase-image { width: 46px; height: 46px; }
  .purchase-price > b { max-width: 82px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .status { max-width: 92px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
}