/* AKUSHA 2.0 — red chrome product layer
   Loaded after app.css so existing application behaviour remains intact. */

:root {
  --ink-0: #060304;
  --ink-1: #0a0607;
  --panel: #100b0d;
  --panel-2: #151012;
  --panel-3: #1c1518;
  --line: rgba(255, 255, 255, .075);
  --line-2: rgba(255, 48, 77, .24);
  --text: #f5f2f3;
  --muted: #968e92;
  --faint: #625b5e;
  --accent: #e31a38;
  --accent-2: #ff3853;
  --accent-deep: #690714;
  --accent-soft: rgba(227, 26, 56, .13);
  --violet: #78152e;
  --cyan: #c7c7cd;
  --radius: 10px;
  --shadow: 0 28px 85px rgba(0, 0, 0, .68);
  --glow: 0 0 35px rgba(227, 26, 56, .28);
  --chrome: linear-gradient(180deg, #fff 0%, #737378 22%, #f8f8f9 41%, #333337 53%, #e2e2e5 69%, #761223 82%, #f6f6f7 100%);
}

html {
  background: #060304;
}

body {
  background:
    radial-gradient(circle at 62% -12%, rgba(139, 7, 29, .19), transparent 33%),
    #060304;
}

body::before {
  background:
    radial-gradient(45% 38% at 76% 5%, rgba(198, 12, 43, .22), transparent 65%),
    radial-gradient(38% 42% at 8% 100%, rgba(103, 4, 22, .19), transparent 66%),
    #060304;
  filter: saturate(1.08);
}

body::after {
  opacity: .2;
  background-image:
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(255, 255, 255, .025) 4px),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: auto, 54px 54px, 54px 54px;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid #ff4962;
  outline-offset: 3px;
}

::selection {
  color: white;
  background: #a70b24;
}

/* ---------- global chrome primitives ---------- */
.btn {
  min-height: 44px;
  border: 1px solid rgba(255, 85, 108, .54);
  border-radius: 6px;
  background: linear-gradient(135deg, #7b0719, #e21b39 48%, #8a091d);
  box-shadow: 0 12px 30px rgba(174, 9, 35, .23), inset 0 1px rgba(255, 255, 255, .2);
  font-family: var(--ui);
  font-size: 12px;
  letter-spacing: .045em;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.btn:hover {
  border-color: rgba(255, 154, 169, .75);
  box-shadow: 0 16px 38px rgba(198, 10, 40, .35), inset 0 1px rgba(255, 255, 255, .25);
  transform: translateY(-2px);
}

.btn--ghost {
  border-color: rgba(255, 255, 255, .11);
  color: #bdb6b9;
  background: rgba(255, 255, 255, .035);
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}

.btn--ghost:hover {
  border-color: rgba(255, 255, 255, .25);
  color: #fff;
  background: rgba(255, 255, 255, .07);
}

.btn--sm {
  min-height: 34px;
  padding-inline: 13px;
  font-size: 10px;
}

.field label {
  color: #8c7f84;
  font-family: var(--ui);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.field input,
.field textarea,
.field select,
select {
  border-color: rgba(255,255,255,.09);
  border-radius: 7px;
  background: rgba(5, 3, 4, .68);
}

.field input:focus,
.field textarea:focus,
.field select:focus {
  border-color: rgba(238, 36, 67, .6);
  box-shadow: 0 0 0 3px rgba(227, 26, 56, .1);
}

.card,
.stat-card {
  border-color: rgba(255,255,255,.075);
  border-radius: 9px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.028), transparent 38%),
    linear-gradient(180deg, rgba(19,14,16,.91), rgba(10,7,8,.94));
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}

.card:hover,
.stat-card:hover {
  border-color: rgba(235, 44, 72, .28);
  box-shadow: 0 22px 55px rgba(0,0,0,.35), 0 0 35px rgba(193,11,40,.08);
}

/* ---------- landing / marketing ---------- */
.land--v2 {
  position: relative;
  height: 100dvh;
  color: #f5f2f3;
  background:
    radial-gradient(circle at 80% 10%, rgba(137, 8, 29, .13), transparent 26%),
    #060304;
  scroll-behavior: smooth;
}

.land--v2::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.017) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.017) 1px, transparent 1px);
  background-size: 62px 62px;
  mask-image: linear-gradient(to bottom, #000, transparent 78%);
}

.land--v2 > *:not(.land-aurora) {
  position: relative;
  z-index: 2;
}

.land-aurora {
  position: fixed;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}

.land-aurora i {
  position: absolute;
  width: 42vw;
  height: 42vw;
  border-radius: 50%;
  background: rgba(198, 14, 44, .13);
  filter: blur(120px);
  animation: ak-drift 16s ease-in-out infinite alternate;
}

.land-aurora i:nth-child(1) { top: -32%; right: -9%; }
.land-aurora i:nth-child(2) { top: 35%; left: -32%; opacity: .52; animation-delay: -6s; }
.land-aurora i:nth-child(3) { right: -28%; bottom: -34%; opacity: .34; animation-delay: -11s; }

.land--v2 .lnav {
  position: sticky;
  top: 12px;
  width: min(1240px, calc(100% - 32px));
  max-width: none;
  min-height: 62px;
  margin: 12px auto 0;
  padding: 8px 9px 8px 13px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 9px;
  background: rgba(9, 6, 7, .78);
  box-shadow: 0 18px 55px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.03);
  backdrop-filter: blur(24px) saturate(1.25);
}

.land--v2 .lnav__logo {
  gap: 9px;
}

.land--v2 .lnav__logo img {
  width: 39px;
  height: 39px;
  border: 1px solid rgba(255, 53, 84, .25);
  border-radius: 6px;
  object-fit: cover;
  box-shadow: 0 0 22px rgba(225, 24, 55, .2);
}

.lnav__word {
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: var(--display);
  font-size: 16px;
  letter-spacing: .14em;
}

.land--v2 .lnav__logo small {
  align-self: flex-end;
  margin: 0 0 8px -7px;
  color: #8e303f;
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: .08em;
}

.land--v2 .lnav__links {
  gap: 7px;
}

.land--v2 .lnav__links a {
  padding: 9px 11px;
  border-radius: 5px;
  color: #827b7e;
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 600;
}

.land--v2 .lnav__links a:hover {
  color: white;
  background: rgba(255,255,255,.045);
}

.lnav__actions {
  display: flex;
  align-items: center;
  gap: 5px;
}

.lnav__login {
  padding: 10px 13px;
  color: #8c8588;
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 600;
}

.land--v2 .lnav__cta {
  min-height: 42px;
  padding: 0 17px;
  border: 1px solid rgba(255,77,101,.5);
  border-radius: 5px;
  background: linear-gradient(135deg, #760718, #d81735 50%, #89081d);
  box-shadow: 0 9px 28px rgba(178,8,34,.25), inset 0 1px rgba(255,255,255,.18);
  font-family: var(--ui);
  font-size: 10px;
  letter-spacing: .045em;
}

.land--v2 .lhero {
  display: grid;
  width: min(1240px, calc(100% - 40px));
  max-width: none;
  min-height: calc(100dvh - 74px);
  grid-template-columns: minmax(0, .88fr) minmax(480px, 1.12fr);
  align-items: center;
  margin: 0 auto;
  padding: 72px 0 64px;
  gap: clamp(30px, 5vw, 78px);
  text-align: left;
}

.lhero__copy {
  min-width: 0;
  position: relative;
  z-index: 4;
  container-type: inline-size;
}

.land--v2 .lbanner {
  display: inline-flex;
  align-items: center;
  margin: 0 0 22px;
  padding: 6px 8px;
  gap: 7px;
  border-color: rgba(233, 38, 68, .23);
  border-radius: 4px;
  color: #a15b65;
  background: rgba(92, 6, 20, .12);
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: .16em;
}

.land--v2 .lbanner i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #ee2744;
  box-shadow: 0 0 8px #ee2744;
  animation: ak-pulse 1.5s ease infinite;
}

.land--v2 .lbanner span {
  padding: 2px 4px;
  color: #ef8091;
  background: rgba(226, 24, 55, .14);
}

.lhero__overline,
.section-code {
  color: #913b49;
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .24em;
}

.land--v2 .lhero h1 {
  margin: 12px 0 0;
  font-family: var(--display);
  font-weight: 700;
  line-height: .88;
}

.chrome-wordmark {
  display: inline-block;
  width: 100%;
  padding-right: .12em;
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  font-size: clamp(64px, 22cqw, 132px);
  letter-spacing: -.045em;
  white-space: nowrap;
  filter: drop-shadow(0 18px 32px rgba(0,0,0,.65)) drop-shadow(0 0 20px rgba(225,24,55,.13));
}

.land--v2 .lhero h1 small {
  display: block;
  margin-top: 15px;
  color: #f1edef;
  font-family: var(--ui);
  font-size: clamp(36px, 4.4vw, 64px);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: .92;
}

.land--v2 .lhero h1 em {
  background: linear-gradient(90deg, #fff, #8a8588 40%, #ff2c48 76%, #fff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-style: normal;
}

.land--v2 .lhero .lsub {
  max-width: 590px;
  margin: 24px 0 26px;
  color: #8d8589;
  font-size: 14px;
  line-height: 1.75;
}

.land--v2 .lclaim {
  width: min(100%, 560px);
  min-height: 55px;
  margin: 0;
  padding: 6px 6px 6px 15px;
  border-color: rgba(255,255,255,.11);
  border-radius: 6px;
  background: rgba(5,3,4,.72);
  box-shadow: 0 14px 40px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.025);
}

.land--v2 .lclaim:focus-within {
  border-color: rgba(233, 40, 70, .55);
  box-shadow: 0 0 0 3px rgba(227,26,56,.09), 0 14px 40px rgba(0,0,0,.24);
}

.land--v2 .lclaim span {
  color: #6e6669;
  font-size: 12px;
}

.land--v2 .lclaim input {
  min-width: 80px;
  flex: 1;
  font-size: 13px;
}

.land--v2 .lclaim button {
  min-height: 41px;
  padding: 0 15px;
  border: 1px solid rgba(255,70,95,.4);
  border-radius: 4px;
  background: linear-gradient(135deg, #7f081b, #d91836);
  font-family: var(--ui);
  font-size: 9px;
  letter-spacing: .05em;
}

.land--v2 .lhero__btns {
  justify-content: flex-start;
  margin-top: 12px;
  gap: 8px;
}

.land--v2 .lhero__btns .btn {
  width: auto;
  min-height: 40px;
  padding: 0 16px;
  font-size: 9px;
}

.lhero__proof {
  display: flex;
  flex-wrap: wrap;
  margin-top: 26px;
  gap: 19px;
  color: #5f585b;
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: .05em;
}

.lhero__proof span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.lhero__proof b {
  color: #9c3c4c;
  font-size: 9px;
}

.lhero__visual {
  --hero-rx: 0deg;
  --hero-ry: 0deg;
  position: relative;
  min-height: 610px;
  perspective: 1400px;
  transform-style: preserve-3d;
}

.lhero__visual::before {
  content: '';
  position: absolute;
  top: 8%;
  left: 7%;
  width: 86%;
  height: 86%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(215,19,51,.2), rgba(95,3,18,.06) 42%, transparent 70%);
  filter: blur(18px);
}

.hero-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotateX(68deg) rotateZ(18deg);
  box-shadow: 0 0 55px rgba(220,20,52,.06), inset 0 0 55px rgba(220,20,52,.05);
  animation: ak-orbit 19s linear infinite;
}

.hero-orbit::before,
.hero-orbit::after {
  content: '';
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ef2c48;
  box-shadow: 0 0 14px #ef2c48;
}

.hero-orbit::before { top: 57px; left: 70px; }
.hero-orbit::after { right: 38px; bottom: 94px; }
.hero-orbit--two { width: 610px; height: 360px; border-color: rgba(225,25,56,.13); transform: translate(-50%, -50%) rotateX(72deg) rotateZ(-27deg); animation-direction: reverse; animation-duration: 25s; }

.hero-profile {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  width: min(430px, 72%);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  background: rgba(10,6,7,.82);
  box-shadow: 0 44px 100px rgba(0,0,0,.65), 0 0 70px rgba(181,9,37,.15), inset 0 1px rgba(255,255,255,.08);
  transform: translate(-48%, -49%) rotateX(var(--hero-rx)) rotateY(var(--hero-ry)) rotateZ(1.4deg);
  transform-style: preserve-3d;
  transition: transform .12s ease-out;
  backdrop-filter: blur(22px) saturate(1.2);
}

.hero-profile::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(112deg, transparent 22%, rgba(255,255,255,.08) 45%, transparent 58%);
  transform: translateX(-90%);
  animation: ak-sheen 6s ease-in-out infinite;
}

.hero-profile__banner {
  position: relative;
  height: 142px;
  overflow: hidden;
}

.hero-profile__banner::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(8,4,5,.92), transparent 58%);
}

.hero-profile__banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.86) contrast(1.08);
}

.hero-profile__banner > span {
  position: absolute;
  z-index: 2;
  top: 12px;
  right: 12px;
  padding: 4px 6px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 3px;
  color: #d7cfd2;
  background: rgba(0,0,0,.44);
  font-family: var(--mono);
  font-size: 6px;
  letter-spacing: .13em;
}

.hero-profile__body {
  position: relative;
  padding: 42px 24px 17px;
  text-align: left;
}

.hero-profile__avatar {
  position: absolute;
  top: -47px;
  left: 22px;
  width: 84px;
  height: 84px;
  padding: 4px;
  border: 4px solid #0b0708;
  border-radius: 50%;
  background: #0b0708;
  box-shadow: 0 0 0 1px rgba(239,40,69,.5), 0 15px 35px rgba(0,0,0,.5);
}

.hero-profile__avatar img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}

.hero-profile__avatar i {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 15px;
  height: 15px;
  border: 3px solid #0b0708;
  border-radius: 50%;
  background: #3bc66d;
}

.hero-profile__badges {
  position: absolute;
  top: 9px;
  right: 18px;
  display: flex;
  padding: 5px 7px;
  gap: 6px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 5px;
  color: #d3cdd0;
  background: rgba(0,0,0,.35);
}

.hero-profile__badges b:first-child { color: #ed2945; }
.hero-profile__badges b:nth-child(2) { color: #d0a448; }
.hero-profile__body h2 { display: flex; align-items: center; margin: 4px 0 1px; gap: 6px; font-family: var(--display); font-size: 21px; letter-spacing: .045em; }
.hero-profile__body h2 span { color: #ed2945; font-size: 13px; }
.hero-profile__body > p { color: #777073; font-family: var(--mono); font-size: 7px; }
.hero-profile__bio { margin: 14px 0; padding: 13px 0; border-top: 1px solid rgba(255,255,255,.07); border-bottom: 1px solid rgba(255,255,255,.07); color: #aaa2a6; font-size: 10px; line-height: 1.55; }
.hero-profile__socials { display: flex; gap: 6px; }
.hero-profile__socials i { display: grid; width: 31px; height: 31px; place-items: center; border: 1px solid rgba(255,255,255,.08); border-radius: 6px; color: #a39b9e; background: rgba(255,255,255,.03); font-style: normal; }
.hero-profile__track { display: grid; grid-template-columns: 29px 1fr; align-items: center; margin-top: 12px; padding: 9px 10px 13px; gap: 8px; border: 1px solid rgba(232,35,65,.13); border-radius: 6px; background: rgba(72,5,17,.13); }
.hero-profile__track button { display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #7e2031; border-radius: 50%; color: #ef3651; font-size: 7px; }
.hero-profile__track > span { display: flex; flex-direction: column; font-family: var(--mono); }
.hero-profile__track > span b { font-size: 7px; letter-spacing: .11em; }
.hero-profile__track > span small { margin-top: 2px; color: #5c5558; font-size: 6px; }
.hero-profile__track > i { position: absolute; right: 34px; bottom: 42px; left: 86px; height: 2px; overflow: hidden; background: rgba(255,255,255,.09); }
.hero-profile__track > i b { display: block; width: 41%; height: 100%; background: #e62340; box-shadow: 0 0 7px #e62340; }
.hero-profile__body footer { display: flex; justify-content: space-between; margin-top: 12px; color: #514a4d; font-family: var(--mono); font-size: 6px; letter-spacing: .05em; }

.hero-float {
  position: absolute;
  z-index: 5;
  display: flex;
  flex-direction: column;
  padding: 11px 13px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 6px;
  background: rgba(10,6,7,.82);
  box-shadow: 0 16px 45px rgba(0,0,0,.4);
  backdrop-filter: blur(16px);
  animation: ak-float 5s ease-in-out infinite;
}

.hero-float b { font-family: var(--display); font-size: 15px; }
.hero-float span { margin-top: 3px; color: #70696c; font-family: var(--mono); font-size: 6px; letter-spacing: .11em; }
.hero-float--views { top: 21%; left: 1%; transform: rotate(-4deg); }
.hero-float--live { right: 0; bottom: 20%; flex-direction: row; align-items: center; gap: 6px; color: #bcb5b8; animation-delay: -2s; }
.hero-float--live i { width: 6px; height: 6px; border-radius: 50%; background: #3bc76e; box-shadow: 0 0 8px #3bc76e; }
.hero-float--live b { font-family: var(--mono); font-size: 7px; letter-spacing: .09em; }

.hero-shard {
  position: absolute;
  z-index: 2;
  width: 34px;
  height: 64px;
  clip-path: polygon(50% 0, 100% 35%, 68% 100%, 0 67%);
  background: linear-gradient(135deg, #efedef, #3b3a3e 35%, #fff 53%, #6d0718 77%, #d7d7d9);
  filter: drop-shadow(0 0 12px rgba(238,33,64,.22));
  animation: ak-shard 7s ease-in-out infinite;
}

.hero-shard--one { top: 12%; right: 12%; transform: rotate(22deg); }
.hero-shard--two { bottom: 10%; left: 12%; width: 22px; height: 42px; animation-delay: -3s; }
.hero-shard--three { top: 46%; right: 4%; width: 18px; height: 33px; animation-delay: -5s; }

.signal-strip {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(255,255,255,.07);
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(7,4,5,.84);
}

.signal-strip > div {
  position: relative;
  display: grid;
  min-height: 112px;
  grid-template-columns: 1fr auto;
  align-content: center;
  padding: 0 clamp(20px, 3vw, 44px);
  border-right: 1px solid rgba(255,255,255,.07);
}

.signal-strip > div:last-child { border-right: 0; }
.signal-strip span { grid-column: 1 / -1; margin-bottom: 4px; color: #71303b; font-family: var(--mono); font-size: 7px; letter-spacing: .14em; }
.signal-strip b { font-family: var(--display); font-size: clamp(23px, 3vw, 34px); font-weight: 700; letter-spacing: .03em; }
.signal-strip small { align-self: center; color: #5a5356; font-family: var(--mono); font-size: 6px; letter-spacing: .1em; }

.world {
  display: grid;
  width: min(1200px, calc(100% - 40px));
  min-height: 760px;
  grid-template-columns: minmax(0, .78fr) minmax(520px, 1.22fr);
  align-items: center;
  margin: 0 auto;
  padding: 110px 0;
  gap: clamp(45px, 7vw, 100px);
}

.world--social {
  width: min(1340px, calc(100% - 40px));
  grid-template-columns: minmax(620px, 1.35fr) minmax(320px, .65fr);
}

.world__copy h2,
.feature-lab__head h2,
.lfoot-cta h2 {
  margin: 13px 0 20px;
  font-family: var(--ui);
  font-size: clamp(42px, 5vw, 69px);
  font-weight: 700;
  letter-spacing: -.055em;
  line-height: .92;
}

.world__copy h2 span {
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.world__copy > p:not(.section-code) {
  color: #857d81;
  font-size: 13px;
  line-height: 1.75;
}

.world__copy ul {
  display: grid;
  margin: 25px 0;
  gap: 10px;
  list-style: none;
}

.world__copy li {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #b4adb0;
  font-size: 11px;
}

.world__copy li::before {
  content: '';
  width: 14px;
  height: 1px;
  background: #d31a36;
  box-shadow: 0 0 7px rgba(211,26,54,.6);
}

.text-link {
  display: inline-flex;
  align-items: center;
  padding: 10px 0;
  gap: 8px;
  color: #c7495d;
  font-family: var(--mono);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .11em;
  transition: color .15s ease, gap .15s ease;
}

.text-link:hover {
  gap: 13px;
  color: #ff526b;
}

.world__scene {
  position: relative;
  min-height: 520px;
  perspective: 1400px;
}

.profile-scene::before {
  content: '';
  position: absolute;
  inset: 7%;
  border: 1px solid rgba(229,30,60,.13);
  border-radius: 50%;
  transform: rotateX(68deg);
  box-shadow: 0 0 80px rgba(226,25,56,.09);
}

.profile-scene__back {
  position: absolute;
  inset: 13% 6%;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 12px;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    rgba(255,255,255,.015);
  background-size: 32px 32px;
  transform: rotateY(-8deg) rotateX(5deg) translateZ(-50px);
}

.profile-scene__card {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: min(510px, 83%);
  min-height: 310px;
  grid-template-columns: 42% 1fr;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 12px;
  background: rgba(10,6,7,.9);
  box-shadow: 0 35px 90px rgba(0,0,0,.65), 0 0 55px rgba(166,8,33,.13);
  transform: translate(-50%, -50%) rotateY(-8deg) rotateX(5deg);
  transform-style: preserve-3d;
}

.profile-scene__card::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 26%, rgba(255,255,255,.09) 45%, transparent 61%);
  transform: translateX(-100%);
  animation: ak-sheen 7s ease-in-out infinite;
}

.profile-scene__card > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.08) saturate(.86);
}

.profile-scene__card > div {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 28px 23px;
  background: linear-gradient(120deg, rgba(8,4,5,.45), #0b0708);
}

.profile-scene__card span { color: #85404b; font-family: var(--mono); font-size: 6px; letter-spacing: .13em; }
.profile-scene__card h3 { margin: 7px 0 1px; background: var(--chrome); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: var(--display); font-size: 38px; letter-spacing: -.02em; }
.profile-scene__card p { color: #6e6669; font-size: 9px; }
.profile-scene__ring { position: absolute; top: 34px; right: 49px; width: 115px; height: 115px; border: 1px solid rgba(234,34,64,.28); border-radius: 50%; box-shadow: 0 0 40px rgba(234,34,64,.11), inset 0 0 25px rgba(234,34,64,.07); }

.scene-control {
  position: absolute;
  z-index: 5;
  right: 1%;
  bottom: 13%;
  display: grid;
  width: 170px;
  grid-template-columns: 1fr auto;
  align-items: center;
  padding: 11px 12px;
  gap: 7px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 6px;
  background: rgba(10,6,7,.85);
  box-shadow: 0 18px 40px rgba(0,0,0,.4);
  backdrop-filter: blur(14px);
}

.scene-control > span { color: #7a7175; font-family: var(--mono); font-size: 6px; letter-spacing: .12em; }
.scene-control > strong { color: #b33f52; font-family: var(--mono); font-size: 7px; }
.scene-control > i { grid-column: 1 / -1; height: 2px; background: #30282b; }
.scene-control > i b { display: block; width: 92%; height: 100%; background: #dc1d39; box-shadow: 0 0 8px #dc1d39; }
.scene-control--two { top: 15%; right: auto; bottom: auto; left: 1%; width: 150px; }
.scene-control--two > i b { width: 78%; background: #9c9699; box-shadow: none; }

.social-demo {
  display: grid;
  height: 560px;
  grid-template-columns: 50px 178px minmax(280px, 1fr) 145px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 10px;
  background: #090607;
  box-shadow: 0 42px 100px rgba(0,0,0,.58), 0 0 60px rgba(167,8,33,.1);
  transform: perspective(1800px) rotateY(5deg) rotateX(1.5deg);
  transform-style: preserve-3d;
}

.social-demo__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 9px 0;
  gap: 7px;
  border-right: 1px solid rgba(255,255,255,.065);
  background: #050304;
}

.social-demo__rail > b,
.social-demo__rail > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  color: #777073;
  background: #130e10;
  font-family: var(--ui);
  font-size: 11px;
}

.social-demo__rail > b { color: white; background: linear-gradient(145deg,#720718,#d41936); box-shadow: 0 0 18px rgba(220,25,56,.3); }
.social-demo__rail > i { width: 22px; height: 1px; background: #2a2426; }
.social-demo__rail > span:nth-of-type(2) { color: white; border-color: rgba(232,35,65,.35); background: #4b0915; }

.social-demo__channels {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding-bottom: 49px;
  border-right: 1px solid rgba(255,255,255,.065);
  background: #0d090a;
}

.social-demo__channels > header,
.social-demo__chat > header {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  border-bottom: 1px solid rgba(255,255,255,.065);
  font-family: var(--ui);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .05em;
}

.social-demo__invite {
  display: flex;
  min-height: 75px;
  flex-direction: column;
  justify-content: flex-end;
  margin: 8px 7px;
  padding: 9px;
  border: 1px solid rgba(225,29,59,.14);
  border-radius: 4px;
  color: #853b47;
  background: linear-gradient(135deg, rgba(97,6,21,.72), rgba(7,4,5,.75)), url('/banner-1600.jpg') center/cover;
  font-family: var(--mono);
  font-size: 5px;
  letter-spacing: .11em;
}

.social-demo__invite b { margin-top: 3px; color: #e1dadd; font-family: var(--ui); font-size: 8px; letter-spacing: .03em; }
.social-demo__channels > p,
.social-demo__members > p { margin: 11px 10px 3px; color: #574f52; font-family: var(--mono); font-size: 5px; letter-spacing: .13em; }
.social-demo__channels > a { display: flex; margin: 0 5px; padding: 6px 8px; border-radius: 3px; color: #696164; font-size: 8px; }
.social-demo__channels > a.on { color: white; background: linear-gradient(90deg, rgba(135,8,29,.45), transparent); box-shadow: inset 2px 0 #e41e3c; }
.social-demo__channels > a i { margin-left: auto; padding: 1px 4px; border-radius: 99px; color: white; background: #bd112d; font-style: normal; font-size: 5px; }
.social-demo__channels > footer { position: absolute; right: 0; bottom: 0; left: 0; display: grid; height: 44px; grid-template-columns: 27px 1fr 20px; align-items: center; padding: 0 7px; gap: 5px; border-top: 1px solid rgba(255,255,255,.065); background: #080506; }
.social-demo__channels > footer > span { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; color: white; background: #b8102b; font-family: var(--ui); font-size: 7px; }
.social-demo__channels > footer b { display: flex; flex-direction: column; font-size: 7px; }
.social-demo__channels > footer small { color: #3ebc6b; font-size: 5px; }
.social-demo__channels > footer i { color: #645d60; font-style: normal; font-size: 8px; }

.social-demo__chat {
  display: flex;
  min-width: 0;
  flex-direction: column;
  background: #090607;
}

.social-demo__chat > header {
  justify-content: flex-start;
  gap: 8px;
}

.social-demo__chat > header span { min-width: 0; flex: 1; overflow: hidden; padding-left: 8px; border-left: 1px solid rgba(255,255,255,.07); color: #5b5457; font-family: var(--font); font-size: 6px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.social-demo__chat > header i { color: #625b5e; font-style: normal; }
.social-demo__chat > main { min-height: 0; flex: 1; overflow: hidden; padding: 0 5px; }
.demo-origin { padding: 73px 10px 18px; }
.demo-origin > b { display: grid; width: 39px; height: 39px; place-items: center; border: 1px solid #58202a; border-radius: 50%; color: #a82b40; background: #190b0e; }
.demo-origin h3 { margin: 9px 0 2px; font-size: 12px; }
.demo-origin p { color: #5d5659; font-size: 6px; }
.social-demo__chat article { display: grid; grid-template-columns: 30px 1fr; padding: 7px 6px; gap: 7px; border-radius: 4px; }
.social-demo__chat article:hover { background: rgba(255,255,255,.025); }
.demo-av { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid #842137; border-radius: 50%; color: white; background: #651024; font-family: var(--ui); font-size: 7px; font-style: normal; }
.demo-av.silver { border-color: #5e5b60; background: #29272a; }
.social-demo__chat article > div > header { display: flex; align-items: center; gap: 5px; }
.social-demo__chat article header b { font-size: 7px; }
.social-demo__chat article header em { padding: 1px 3px; border: 1px solid #6f2030; border-radius: 2px; color: #bf4053; font-family: var(--mono); font-size: 4px; font-style: normal; }
.social-demo__chat article time { color: #494245; font-size: 5px; }
.social-demo__chat article p { margin-top: 3px; color: #9b9397; font-size: 7px; }
.social-demo__chat article small { display: inline-block; margin-top: 4px; padding: 2px 4px; border: 1px solid rgba(225,31,61,.15); border-radius: 3px; color: #9d8f93; background: #13080b; font-size: 6px; }
.social-demo__chat > footer { display: grid; min-height: 38px; grid-template-columns: 24px 1fr 20px 20px; align-items: center; margin: 0 9px 10px; padding: 0 5px; gap: 3px; border: 1px solid rgba(255,255,255,.08); border-radius: 5px; color: #5c5558; background: #171214; font-size: 7px; }
.social-demo__chat > footer b,
.social-demo__chat > footer i { display: grid; place-items: center; font-style: normal; }

.social-demo__members {
  padding: 48px 5px 0;
  border-left: 1px solid rgba(255,255,255,.065);
  background: #0d090a;
}

.social-demo__members > div { display: grid; grid-template-columns: 28px 1fr; align-items: center; padding: 5px; gap: 5px; }
.social-demo__members > div > i { position: relative; display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid #4a4246; border-radius: 50%; color: #c0b9bc; background: #262023; font-family: var(--ui); font-size: 6px; font-style: normal; }
.social-demo__members > div > i.red { border-color: #842137; background: #651024; }
.social-demo__members > div > i b { position: absolute; right: -1px; bottom: -1px; width: 7px; height: 7px; border: 2px solid #0d090a; border-radius: 50%; background: #3abb69; }
.social-demo__members > div > span { display: flex; min-width: 0; flex-direction: column; color: #a0989b; font-size: 6px; }
.social-demo__members small { overflow: hidden; margin-top: 2px; color: #4d4649; font-size: 4.5px; text-overflow: ellipsis; white-space: nowrap; }

.feature-lab {
  width: min(1200px, calc(100% - 40px));
  margin: 0 auto;
  padding: 110px 0;
}

.feature-lab__head {
  max-width: 720px;
  margin-bottom: 40px;
}

.feature-lab__head h2 {
  margin-bottom: 13px;
}

.feature-lab__head > p:last-child {
  color: #7e767a;
  font-size: 13px;
  line-height: 1.65;
}

.feature-mosaic {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 11px;
}

.feature-panel {
  position: relative;
  min-height: 310px;
  grid-column: span 4;
  padding: 25px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 8px;
  background:
    radial-gradient(circle at 95% 5%, rgba(125,8,28,.14), transparent 35%),
    linear-gradient(145deg, rgba(255,255,255,.025), transparent 38%),
    #0c0809;
  box-shadow: inset 0 1px rgba(255,255,255,.025);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.feature-panel:hover {
  border-color: rgba(231,36,66,.28);
  box-shadow: 0 25px 55px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.04);
  transform: translateY(-4px);
}

.feature-panel--wide {
  min-height: 360px;
  grid-column: span 8;
}

.feature-panel--accent {
  grid-column: span 8;
  background:
    radial-gradient(circle at 88% 14%, rgba(240,38,69,.24), transparent 31%),
    linear-gradient(135deg, #310711, #10080a 69%);
}

.feature-panel > span {
  color: #8d3b49;
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: .16em;
}

.feature-panel h3 {
  max-width: 470px;
  margin: 13px 0 10px;
  font-family: var(--ui);
  font-size: clamp(25px, 3vw, 40px);
  letter-spacing: -.04em;
  line-height: .98;
}

.feature-panel p {
  max-width: 530px;
  color: #756e71;
  font-size: 11px;
  line-height: 1.65;
}

.feature-panel a {
  position: absolute;
  bottom: 25px;
  left: 25px;
  color: #e24a60;
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .1em;
}

.effect-samples {
  position: absolute;
  right: 5%;
  bottom: 10%;
  display: flex;
  width: 42%;
  height: 150px;
  align-items: center;
  justify-content: center;
}

.effect-samples i {
  position: absolute;
  width: 85px;
  height: 85px;
  border: 1px solid rgba(255,255,255,.13);
  background: linear-gradient(145deg, #e5e5e7, #333337 42%, #8d0a20 76%, #f0f0f1);
  clip-path: polygon(50% 0, 100% 37%, 77% 100%, 14% 84%, 0 27%);
  filter: drop-shadow(0 0 14px rgba(230,30,60,.18));
  transform: translateX(calc((var(--i, 0) - 2) * 37px)) rotate(calc((var(--i, 0) - 2) * 12deg)) scale(var(--sample-scale, 1));
}

.effect-samples i:nth-child(1) { --i: 0; --sample-scale: .8; left: 4%; opacity: .42; }
.effect-samples i:nth-child(2) { --i: 1; --sample-scale: .9; left: 22%; opacity: .7; }
.effect-samples i:nth-child(3) { --i: 2; left: 43%; z-index: 2; }
.effect-samples i:nth-child(4) { --i: 3; --sample-scale: .9; right: 16%; opacity: .7; }
.effect-samples i:nth-child(5) { --i: 4; --sample-scale: .8; right: 0; opacity: .42; }

.pulse-map {
  position: relative;
  height: 130px;
  margin: 22px 0 5px;
}

.pulse-map::before,
.pulse-map::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(230,31,61,.15);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.pulse-map::before { width: 100px; height: 100px; animation: ak-pulse-ring 2.4s ease infinite; }
.pulse-map::after { width: 65px; height: 65px; }
.pulse-map b { position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; border-radius: 50%; background: #ec2946; box-shadow: 0 0 18px #ec2946; transform: translate(-50%,-50%); }
.pulse-map i { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #9a9396; box-shadow: 0 0 8px rgba(255,255,255,.25); }
.pulse-map i:nth-child(1) { top: 14%; left: 23%; }
.pulse-map i:nth-child(2) { top: 25%; right: 12%; }
.pulse-map i:nth-child(3) { bottom: 13%; left: 12%; }
.pulse-map i:nth-child(4) { right: 28%; bottom: 8%; }

.waveform {
  display: flex;
  height: 110px;
  align-items: center;
  margin: 20px 0;
  gap: 3px;
}

.waveform i {
  width: 3px;
  height: var(--h);
  border-radius: 2px;
  background: linear-gradient(#f23954, #6f0a1a);
  box-shadow: 0 0 5px rgba(239,37,68,.24);
  animation: ak-wave 1s ease-in-out infinite alternate;
  animation-delay: calc(var(--h) * -8ms);
}

.permission-stack {
  position: absolute;
  right: 25px;
  bottom: 25px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
}

.permission-stack i {
  display: block;
  padding: 5px 8px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 3px;
  color: #756e71;
  background: #080506;
  font-family: var(--mono);
  font-size: 6px;
  font-style: normal;
  letter-spacing: .08em;
}

.permission-stack i:first-child { color: #d5a847; border-color: rgba(213,168,71,.27); }
.permission-stack i:nth-child(2) { color: #d34459; border-color: rgba(211,68,89,.27); }

.land--v2 .lpricing {
  width: min(1000px, calc(100% - 40px));
  max-width: none;
  margin: 0 auto;
  padding: 110px 0;
  text-align: left;
}

.land--v2 .lprice-grid {
  gap: 11px;
  margin-top: 0;
}

.land--v2 .lprice {
  min-height: 530px;
  padding: 32px;
  border-color: rgba(255,255,255,.08);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.025), transparent 38%),
    #0d090a;
}

.land--v2 .lprice--pro {
  border-color: rgba(234,38,68,.45);
  background:
    radial-gradient(circle at 95% 5%, rgba(218,21,52,.24), transparent 33%),
    linear-gradient(145deg, #21080e, #0d090a 68%);
  box-shadow: 0 0 55px rgba(200,12,42,.1), inset 0 1px rgba(255,255,255,.04);
}

.land--v2 .lprice__tag {
  top: 18px;
  right: 18px;
  padding: 5px 8px;
  border: 1px solid rgba(255,67,94,.35);
  border-radius: 3px;
  color: #f38192;
  background: rgba(114,7,24,.45);
  font-family: var(--mono);
  font-size: 6px;
  letter-spacing: .11em;
}

.plan-code {
  color: #71303b;
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: .16em;
}

.land--v2 .lprice h3 {
  margin: 20px 0 12px;
  font-size: 30px;
}

.land--v2 .lprice__p {
  font-size: 45px;
  letter-spacing: -.04em;
}

.land--v2 .lprice__p s {
  margin-right: 6px;
  color: #51494c;
  font-size: 18px;
}

.land--v2 .lprice ul {
  margin: 24px 0 30px;
}

.land--v2 .lprice li {
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.055);
  color: #a9a1a5;
  font-size: 11px;
}

.land--v2 .lprice li i {
  margin-right: 7px;
  color: #d32340;
  font-style: normal;
}

.land--v2 .lprice .btn {
  width: 100%;
}

.land--v2 .lfaq {
  width: min(920px, calc(100% - 40px));
  max-width: none;
  margin: 0 auto;
  padding: 110px 0;
  text-align: left;
}

.land--v2 .lfaq-list {
  gap: 6px;
}

.land--v2 .lfaq-item {
  border-color: rgba(255,255,255,.075);
  border-radius: 6px;
  background: #0d090a;
}

.land--v2 .lfaq-q {
  width: 100%;
  padding: 18px 19px;
  color: #c8c1c4;
  font-size: 13px;
  text-align: left;
}

.land--v2 .lfaq-q span {
  color: #a83a4b;
  font-family: var(--mono);
  font-size: 16px;
}

.land--v2 .lfaq-item.open .lfaq-q span {
  transform: rotate(45deg);
}

.land--v2 .lfaq-a {
  color: #766f72;
  font-size: 11px;
}

.land--v2 .lfoot {
  margin-top: 0;
  border-color: rgba(255,255,255,.075);
  background: #070405;
}

.land--v2 .lfoot-cta {
  max-width: none;
  min-height: 520px;
  padding: 115px 20px;
  background:
    radial-gradient(circle at 50% 40%, rgba(165,8,34,.22), transparent 30%),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: auto, 50px 50px, 50px 50px;
}

.land--v2 .lfoot-cta h2 {
  margin: 18px 0;
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-size: clamp(54px, 8vw, 105px);
  line-height: .85;
  text-transform: uppercase;
}

.land--v2 .lfoot-cta .lclaim {
  margin: 20px auto 0;
}

.land--v2 .lfoot-bar {
  width: min(1200px, calc(100% - 40px));
  max-width: none;
  padding: 55px 0;
}

.land--v2 .lfoot-cols h4 {
  color: #b9b1b5;
  font-size: 11px;
}

.land--v2 .lfoot-cols a {
  color: #625b5e;
  font-size: 10px;
}

.land--v2 .lfoot-copy {
  display: flex;
  justify-content: space-between;
  padding: 20px max(20px, calc((100vw - 1200px) / 2));
  color: #484144;
  font-family: var(--mono);
  font-size: 6px;
  letter-spacing: .1em;
}

.reveal {
  opacity: 0;
  transform: translateY(35px);
  transition: opacity .75s ease, transform .75s cubic-bezier(.2,.9,.3,1);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* ---------- authenticated shell / Social ---------- */
.shell {
  grid-template-columns: 72px 244px minmax(0, 1fr);
  height: 100dvh;
  background: #080506;
}

.rail {
  padding: 12px 0;
  gap: 7px;
  border-right-color: rgba(255,255,255,.065);
  background: #050304;
}

.rail__logo {
  width: 47px;
  height: 47px;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(229,35,65,.27);
  border-radius: 15px;
  background: #120609;
  box-shadow: 0 0 24px rgba(224,25,56,.19);
}

.rail__logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rail-item {
  width: 45px;
  height: 45px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  color: #767073;
  background: #130f10;
}

.rail-item:hover {
  border-color: rgba(231,41,69,.22);
  border-radius: 10px;
  color: white;
  background: #3b0912;
  transform: translateY(-1px);
}

.rail-item.on {
  border-color: rgba(255,78,103,.42);
  border-radius: 10px;
  background: linear-gradient(145deg, #710718, #d01935);
  box-shadow: 0 8px 22px rgba(149,7,31,.26), inset 0 1px rgba(255,255,255,.17);
}

.rail-item.on::before {
  left: -14px;
  width: 4px;
  height: 34px;
  background: #f12e4a;
  box-shadow: 0 0 11px rgba(241,46,74,.7);
}

.rail-tip {
  position: fixed;
  z-index: 200;
  left: 64px;
  width: max-content;
  max-width: 150px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 4px;
  color: #d8d2d5;
  background: #090607;
  box-shadow: 0 12px 35px rgba(0,0,0,.48);
  font-family: var(--ui);
  font-size: 9px;
  font-weight: 600;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-4px);
  transition: opacity .14s ease, transform .14s ease;
}

.rail-item:hover .rail-tip {
  opacity: 1;
  transform: translateX(0);
}

.rail__sep {
  width: 28px;
  height: 1px;
}

.side {
  border-right-color: rgba(255,255,255,.065);
  background: #0d090a;
  backdrop-filter: none;
}

.side__head {
  min-height: 57px;
  padding: 0 14px;
  font-size: 13px;
  letter-spacing: .055em;
  box-shadow: 0 5px 16px rgba(0,0,0,.14);
}

.side__head::after {
  content: '⌄';
  color: #625b5e;
  font-family: var(--mono);
  font-size: 10px;
}

.side__scroll {
  padding: 8px 7px;
}

.social-network-card {
  margin: 2px 2px 14px;
  overflow: hidden;
  border: 1px solid rgba(231,35,65,.16);
  border-radius: 6px;
  background: #100b0d;
}

.social-network-card__art {
  position: relative;
  height: 80px;
  overflow: hidden;
}

.social-network-card__art::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, #100b0d, transparent 70%);
}

.social-network-card__art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.75) contrast(1.05);
}

.social-network-card__art span {
  position: absolute;
  z-index: 2;
  top: 8px;
  left: 8px;
  display: flex;
  align-items: center;
  padding: 4px 5px;
  gap: 4px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 3px;
  color: #dfd8db;
  background: rgba(0,0,0,.46);
  font-family: var(--mono);
  font-size: 5px;
  letter-spacing: .1em;
}

.social-network-card__art span i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #3dc06d;
  box-shadow: 0 0 7px #3dc06d;
}

.social-network-card > div:last-child {
  display: flex;
  flex-direction: column;
  margin-top: -7px;
  padding: 0 10px 10px;
}

.social-network-card > div:last-child b {
  font-family: var(--ui);
  font-size: 10px;
  letter-spacing: .04em;
}

.social-network-card > div:last-child small {
  margin-top: 2px;
  color: #5a5356;
  font-size: 7px;
}

.cat {
  min-height: 21px;
  margin: 12px 7px 3px;
  color: #595255;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .12em;
}

.cat > span {
  flex: 1;
}

.cat > button {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  color: #5d5659;
  font-size: 12px;
}

.cat > button:hover {
  color: #bbb4b7;
}

.chan {
  min-height: 34px;
  margin: 0 1px;
  padding: 0 9px;
  gap: 7px;
  border-radius: 4px;
  color: #756f72;
  font-size: 12px;
}

.chan:hover {
  color: #ccc6c9;
  background: rgba(255,255,255,.035);
}

.chan.on {
  color: #f3f0f1;
  background: linear-gradient(90deg, rgba(121,8,27,.45), rgba(255,255,255,.02));
  box-shadow: inset 2px 0 #e1213d;
}

.chan .hash {
  width: 18px;
  color: #544d50;
  font-size: 16px;
  text-align: center;
}

.chan.voice .hash {
  color: #777174;
  font-size: 11px;
}

.chan__name {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chan__meta {
  color: #4f484b;
  font-size: 9px;
}

.dock {
  min-height: 55px;
  padding: 7px 8px;
  border-top-color: rgba(255,255,255,.065);
  gap: 7px;
  background: #080506;
}

.dock .who b {
  font-size: 11px;
}

.dock .who small {
  color: #3dbf6c;
  font-size: 8px;
}

.dock .icons {
  gap: 0;
}

.dock .icons button {
  width: 27px;
  height: 27px;
  border-radius: 4px;
}

.av {
  box-shadow: 0 3px 12px rgba(0,0,0,.35), inset 0 0 16px rgba(0,0,0,.18);
}

.av--sm {
  width: 33px;
  height: 33px;
  font-size: 11px;
}

.av--md {
  width: 39px;
  height: 39px;
  font-size: 13px;
}

.dot {
  width: 10px;
  height: 10px;
  border-color: #0d090a;
}

.main {
  background:
    radial-gradient(circle at 75% 0%, rgba(92,5,20,.07), transparent 28%),
    #090607;
}

.topbar {
  height: 57px;
  padding: 0 15px;
  border-bottom-color: rgba(255,255,255,.065);
  background: rgba(10,7,8,.94);
  box-shadow: 0 6px 18px rgba(0,0,0,.13);
  backdrop-filter: blur(16px);
}

.topbar .title {
  font-size: 13px;
}

.channel-symbol {
  color: #5d5659;
  font-size: 21px;
  font-weight: 400;
}

.topbar .topic {
  max-width: 42%;
  color: #70696c;
  font-size: 9px;
}

.topbar-network {
  display: inline-flex;
  min-width: max-content;
  align-items: center;
  gap: 6px;
  margin-left: 3px;
  color: #756c70;
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: .16em;
}

.topbar-network i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #ef2746;
  box-shadow: 0 0 10px rgba(239,39,70,.8);
  animation: live-blink 1.8s ease-in-out infinite;
}

@keyframes live-blink {
  0%, 100% { opacity: .42; transform: scale(.84); }
  50% { opacity: 1; transform: scale(1); }
}

.topbar .tb-btn {
  position: relative;
  width: 33px;
  height: 33px;
  border-radius: 4px;
}

.topbar .tb-btn:hover {
  background: rgba(255,255,255,.04);
}

#channel-notices i {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 5px;
  height: 5px;
  border: 1px solid #0a0708;
  border-radius: 50%;
  background: #eb2744;
}

.channel-search {
  display: grid;
  width: 170px;
  height: 30px;
  grid-template-columns: 17px 1fr auto;
  align-items: center;
  padding: 0 7px;
  gap: 4px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 4px;
  color: #5e575a;
  background: #060405;
}

.channel-search input {
  min-width: 0;
  border: 0;
  outline: 0;
  color: #c8c1c4;
  background: transparent;
  font-size: 8px;
}

.channel-search input::placeholder {
  color: #514a4d;
}

.channel-search kbd {
  color: #4d4649;
  font-family: var(--mono);
  font-size: 6px;
}

.cwrap {
  background: #090607;
}

.ccol {
  position: relative;
}

.msgs {
  padding: 12px 0 16px;
  gap: 0;
}

.channel-origin {
  padding: clamp(65px, 12vh, 130px) 24px 22px;
}

.channel-origin > div {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid #55202a;
  border-radius: 50%;
  color: #a92b41;
  background: #190b0e;
  font-family: var(--ui);
  font-size: 26px;
}

.channel-origin h2 {
  margin: 14px 0 3px;
  font-family: var(--ui);
  font-size: 24px;
}

.channel-origin p {
  color: #686164;
  font-size: 10px;
}

.msg {
  gap: 11px;
  min-height: 56px;
  padding: 7px 22px;
  border-radius: 0;
}

.msg:hover {
  background: rgba(255,255,255,.018);
}

.msg__head {
  gap: 6px;
}

.msg__head b {
  font-size: 12px;
}

.msg__head time {
  color: #4f484b;
  font-size: 7px;
}

.msg__head .bot-tag {
  padding: 2px 4px;
  border-radius: 2px;
  font-size: 6px;
}

.msg__text {
  color: #aaa3a6;
  font-size: 11px;
  line-height: 1.55;
}

.msg-link {
  color: #e85a70;
  text-decoration: underline;
  text-decoration-color: rgba(232,90,112,.34);
  text-underline-offset: 3px;
}

.msg-link:hover {
  color: #fff;
  text-decoration-color: #ef2746;
}

.msg__actions {
  top: -11px;
  right: 18px;
  padding: 2px;
  border-color: rgba(255,255,255,.09);
  border-radius: 4px;
  background: #100c0d;
}

.msg__actions button {
  width: 28px;
  height: 27px;
  border-radius: 3px;
  font-size: 10px;
}

.react {
  padding: 2px 6px;
  border-color: rgba(225,31,61,.18);
  border-radius: 4px;
  color: #a39b9f;
  background: #15090c;
  font-size: 9px;
}

.typing {
  height: 19px;
  padding: 2px 22px;
  color: #5d5659;
  font-size: 8px;
  font-style: normal;
}

.composer {
  padding: 7px 18px 18px;
}

.composer__box {
  min-height: 47px;
  align-items: center;
  padding: 5px 6px;
  gap: 3px;
  border-color: rgba(255,255,255,.09);
  border-radius: 7px;
  background: #181315;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
}

.composer__box:focus-within {
  border-color: rgba(229,35,65,.38);
  box-shadow: 0 0 0 3px rgba(227,26,56,.07), 0 12px 30px rgba(0,0,0,.22);
}

.composer textarea {
  padding: 8px 5px;
  color: #d2cccf;
  font-size: 11px;
}

.composer__tool {
  display: grid;
  width: 33px;
  height: 33px;
  flex: none;
  place-items: center;
  border-radius: 4px;
  color: #756e71;
  font-size: 16px;
}

.composer__tool:hover {
  color: white;
  background: rgba(255,255,255,.04);
}

.composer__tool:disabled {
  opacity: .4;
  cursor: wait;
}

.composer .send {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,76,101,.34);
  border-radius: 4px;
  background: linear-gradient(145deg,#79081a,#ce1733);
  box-shadow: 0 6px 16px rgba(161,8,33,.24);
}

.emoji-picker {
  display: grid;
  grid-template-columns: repeat(5, 28px);
  padding: 3px;
  gap: 2px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 5px;
  background: #0d090a;
  box-shadow: 0 12px 35px rgba(0,0,0,.45);
}

.emoji-picker button {
  width: 28px;
  height: 28px;
  border-radius: 3px;
  font-size: 14px;
}

.emoji-picker button:hover {
  background: rgba(255,255,255,.07);
}

.members {
  width: 232px;
  padding: 9px 7px;
  border-left-color: rgba(255,255,255,.065);
  background: #0d090a;
}

.members .cat {
  margin-top: 14px;
}

.member {
  gap: 8px;
  min-height: 43px;
  padding: 5px 7px;
  border-radius: 4px;
  color: #8f888b;
  font-size: 11px;
}

.member:hover {
  background: rgba(255,255,255,.035);
}

.member > span {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
}

.member > span > b {
  display: flex;
  max-width: 100%;
  align-items: center;
  overflow: hidden;
  font-size: 10px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.member > span > small {
  display: block;
  width: 100%;
  overflow: hidden;
  color: #4f484b;
  font-family: var(--font);
  font-size: 7px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---------- profile / guns-style depth ---------- */
.biolink {
  background: #050304;
}

.bl-bg-overlay {
  background:
    radial-gradient(circle at 50% 20%, transparent 0, rgba(4,2,3,.2) 36%, rgba(4,2,3,.78) 100%) !important;
}

.bl-enter {
  background:
    radial-gradient(circle at 50% 40%, rgba(117,6,24,.2), rgba(5,3,4,.82) 45%, #050304),
    rgba(5,3,4,.7);
}

.bl-enter::before {
  content: '';
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(255,255,255,.055);
  pointer-events: none;
}

.bl-enter-word {
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-size: clamp(22px, 3vw, 35px);
  font-weight: 700;
  letter-spacing: .22em;
  filter: drop-shadow(0 0 20px rgba(231,31,62,.25));
}

.bl-card {
  width: min(460px, calc(100% - 30px));
  padding: 38px 32px 29px;
  border-color: rgba(255,255,255,.13);
  border-radius: 15px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.045), transparent 35%),
    rgba(10,6,7,.62);
  box-shadow: 0 38px 100px rgba(0,0,0,.72), 0 0 70px rgba(176,8,35,.12), inset 0 1px rgba(255,255,255,.07);
  backdrop-filter: blur(22px) saturate(1.2);
}

.bl-card::before {
  content: 'AKUSHA / PUBLIC SIGNAL';
  position: absolute;
  top: 13px;
  left: 15px;
  color: rgba(255,255,255,.25);
  font-family: var(--mono);
  font-size: 5px;
  letter-spacing: .13em;
}

.bl-avatar .av {
  border: 4px solid rgba(7,4,5,.75);
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(236,36,66,.5), 0 16px 40px rgba(0,0,0,.52), 0 0 40px color-mix(in srgb, var(--accent) 22%, transparent);
}

.bl-name {
  margin-top: 2px;
  font-family: var(--display);
  font-size: 34px;
  letter-spacing: .015em;
}

.fx-chrome {
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
}

.bl-badges {
  margin: 11px 0;
}

.bl-badge {
  width: 28px;
  height: 28px;
  border-radius: 5px;
  background: rgba(0,0,0,.45);
  font-size: 13px;
}

.bl-loc {
  color: #776f73;
  font-family: var(--mono);
  font-size: 8px;
}

.bl-bio {
  margin: 14px 0 6px;
  color: #c1babe;
  font-size: 12px;
}

.bl-socials {
  margin: 17px 0 8px;
  gap: 7px;
}

.bl-social {
  width: 39px;
  height: 39px;
  border-radius: 6px;
  background: rgba(255,255,255,.045);
}

.bl-social:hover {
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.09);
  transform: translateY(-3px);
}

.bl-meta {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid rgba(255,255,255,.07);
  color: #5d5659;
  font-size: 8px;
}

.bl-player {
  border-color: rgba(255,255,255,.12);
  border-radius: 8px;
  background: rgba(10,6,7,.82);
  box-shadow: 0 20px 60px rgba(0,0,0,.5), 0 0 35px rgba(171,8,34,.11);
}

.bl-vol {
  border-color: rgba(255,255,255,.1);
  border-radius: 6px;
  background: rgba(10,6,7,.72);
}

/* ---------- auth and dashboard refinement ---------- */
.auth {
  background: #070405;
}

.auth__hero {
  border-right: 1px solid rgba(255,255,255,.065);
  background:
    linear-gradient(90deg, transparent, rgba(7,4,5,.32)),
    radial-gradient(circle at 50% 48%, rgba(129,7,27,.2), transparent 38%);
}

.auth__hero .hero-grid {
  opacity: .26;
}

.auth__hero .orb--1,
.auth__hero .orb--2 {
  background: radial-gradient(circle at 35% 35%, #ef576d, #7d0a1a 55%, transparent 72%);
  box-shadow: 0 0 120px rgba(225,28,59,.35);
}

.auth__hero .orb--2 {
  background: radial-gradient(circle at 35% 35%, #dddde0, #690b1d 55%, transparent 72%);
}

.chrome-word {
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 15px 38px rgba(0,0,0,.6)) drop-shadow(0 0 24px rgba(226,28,58,.15));
}

.auth__card {
  border-color: rgba(255,255,255,.1);
  border-radius: 10px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.035), transparent 38%),
    rgba(12,8,9,.9);
}

.auth__logo b {
  border-radius: 7px;
  background: linear-gradient(145deg, #e7e7e9, #5b5b60 38%, #e8e8ea 58%, #850b20);
}

.auth__tabs {
  border-radius: 6px;
}

.auth__tabs button {
  border-radius: 4px;
}

.auth__tabs button.on {
  background: linear-gradient(145deg,#650715,#ba102b);
}

.dash {
  max-width: 1180px;
  margin: 0 auto;
}

.dash-h {
  font-size: 24px;
}

.stat-card {
  border-radius: 8px;
}

.stat-card .n {
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------- command palette / pointer / micro-interaction ---------- */
.ak-cursor {
  position: fixed;
  z-index: 9998;
  left: var(--ak-x, -100px);
  top: var(--ak-y, -100px);
  width: 170px;
  height: 170px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(233,31,62,.075), transparent 68%);
  mix-blend-mode: screen;
  transform: translate(-50%,-50%);
}

.ak-command-layer {
  position: fixed;
  inset: 0;
  z-index: 9995;
  display: grid;
  place-items: start center;
  padding: 12vh 16px 20px;
  background: rgba(3,2,2,.68);
  backdrop-filter: blur(10px);
  animation: ak-fade .15s ease;
}

.ak-command {
  width: min(590px, 100%);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 8px;
  background: #0d090a;
  box-shadow: 0 35px 110px rgba(0,0,0,.72), 0 0 70px rgba(164,8,33,.11);
}

.ak-command__search {
  display: grid;
  grid-template-columns: 25px 1fr auto;
  align-items: center;
  padding: 15px;
  gap: 8px;
  border-bottom: 1px solid rgba(255,255,255,.075);
}

.ak-command__mark {
  color: #c83a50;
  font-family: var(--mono);
  font-size: 14px;
}

.ak-command__search input {
  border: 0;
  outline: 0;
  color: white;
  background: transparent;
  font-size: 13px;
}

.ak-command kbd {
  padding: 3px 5px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 3px;
  color: #5c5558;
  background: #070405;
  font-family: var(--mono);
  font-size: 6px;
}

.ak-command__list {
  max-height: 360px;
  overflow-y: auto;
  padding: 9px;
}

.ak-command__label {
  display: block;
  padding: 4px 8px 7px;
  color: #5c5558;
  font-family: var(--mono);
  font-size: 6px;
  letter-spacing: .13em;
}

.ak-command__item {
  display: grid;
  width: 100%;
  grid-template-columns: 33px 1fr auto;
  align-items: center;
  padding: 7px;
  gap: 7px;
  border-radius: 4px;
  color: #91898d;
  text-align: left;
}

.ak-command__item:hover,
.ak-command__item.is-active {
  color: white;
  background: linear-gradient(90deg, rgba(117,8,26,.58), rgba(255,255,255,.025));
}

.ak-command__item i {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border: 1px solid rgba(225,31,61,.18);
  border-radius: 4px;
  color: #bb354a;
  background: #15090c;
  font-family: var(--mono);
  font-size: 8px;
  font-style: normal;
}

.ak-command__item span {
  display: flex;
  flex-direction: column;
}

.ak-command__item b {
  font-family: var(--ui);
  font-size: 10px;
}

.ak-command__item small {
  margin-top: 2px;
  color: #554e51;
  font-size: 7px;
}

.ak-command__item > em {
  color: #4d4649;
  font-family: var(--mono);
  font-size: 7px;
  font-style: normal;
}

.ak-command__empty {
  padding: 28px;
  color: #5d5659;
  font-size: 10px;
  text-align: center;
}

.ak-command footer {
  display: flex;
  padding: 9px 14px;
  gap: 12px;
  border-top: 1px solid rgba(255,255,255,.075);
  color: #514a4d;
  background: #080506;
  font-size: 7px;
}

.ak-command footer span {
  display: flex;
  align-items: center;
  gap: 4px;
}

.ak-command footer b {
  margin-left: auto;
  color: #70202e;
  font-family: var(--mono);
  font-size: 6px;
  letter-spacing: .1em;
}

.ak-ripple {
  position: fixed;
  z-index: 9999;
  width: 12px;
  height: 12px;
  border: 1px solid rgba(255,71,98,.72);
  border-radius: 50%;
  pointer-events: none;
  animation: ak-ripple .55s ease-out forwards;
}

@keyframes ak-drift { to { transform: translate3d(7%,4%,0) scale(1.08); } }
@keyframes ak-pulse { 50% { opacity: .35; transform: scale(.75); } }
@keyframes ak-orbit { to { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(378deg); } }
@keyframes ak-sheen { 0%, 30% { transform: translateX(-110%); } 60%, 100% { transform: translateX(110%); } }
@keyframes ak-float { 50% { translate: 0 -8px; } }
@keyframes ak-shard { 50% { translate: 0 -14px; rotate: 9deg; } }
@keyframes ak-pulse-ring { 50% { width: 126px; height: 126px; opacity: .3; } }
@keyframes ak-wave { to { height: 18%; opacity: .45; } }
@keyframes ak-fade { from { opacity: 0; } }
@keyframes ak-ripple { to { opacity: 0; transform: scale(7); } }

/* ---------- responsive ---------- */
@media (max-width: 1340px) {
  .topbar-network { display: none; }
}

@media (max-width: 1180px) {
  .land--v2 .lhero {
    grid-template-columns: minmax(0, 1fr) minmax(400px, .85fr);
  }
  .lhero__visual { min-height: 560px; }
  .world { grid-template-columns: 1fr 1.15fr; gap: 45px; }
  .world--social { grid-template-columns: 1fr; }
  .world--social .world__copy { max-width: 620px; grid-row: 1; }
  .social-demo { grid-row: 2; }
}

@media (max-width: 980px) {
  .land--v2 .lnav__links { display: none; }
  .land--v2 .lhero {
    min-height: auto;
    grid-template-columns: 1fr;
    padding-top: 95px;
  }
  .lhero__copy { max-width: 680px; }
  .lhero__visual { min-height: 630px; }
  .chrome-wordmark { font-size: clamp(72px, 19cqw, 128px); }
  .world { grid-template-columns: 1fr; padding: 85px 0; }
  .world--identity .world__copy { max-width: 650px; }
  .world__scene { min-height: 560px; }
  .feature-panel { grid-column: span 6; }
  .feature-panel--wide,
  .feature-panel--accent { grid-column: span 12; }
}

@media (max-width: 860px) {
  .shell { grid-template-columns: 64px minmax(0,1fr); }
  .side {
    position: fixed;
    z-index: 80;
    top: 0;
    bottom: 0;
    left: 64px;
    width: 244px;
    box-shadow: 25px 0 65px rgba(0,0,0,.55);
    transform: translateX(-102%);
    transition: transform .22s ease;
  }
  body[data-view="social"] .side,
  body[data-view="community"] .side,
  body[data-view="voice"] .side {
    transform: none;
  }
  body[data-view="social"] .main,
  body[data-view="community"] .main,
  body[data-view="voice"] .main {
    margin-left: 244px;
  }
  .members { display: none; }
}

@media (max-width: 720px) {
  .ak-cursor { display: none; }
  .land--v2 .lnav {
    width: calc(100% - 18px);
    margin-top: 9px;
  }
  .land--v2 .lnav__login { display: none; }
  .land--v2 .lnav__cta { padding: 0 12px; }
  .lnav__word { font-size: 13px; }
  .land--v2 .lhero {
    width: calc(100% - 26px);
    padding-top: 80px;
  }
  .chrome-wordmark {
    font-size: clamp(52px, 19cqw, 72px);
    letter-spacing: -.055em;
  }
  .land--v2 .lhero h1 small { font-size: clamp(35px, 11vw, 54px); }
  .land--v2 .lhero .lsub { font-size: 12px; }
  .land--v2 .lclaim { align-items: stretch; flex-wrap: wrap; padding: 8px; }
  .land--v2 .lclaim span { padding: 10px 0 0 5px; }
  .land--v2 .lclaim input { width: 120px; padding-top: 8px; }
  .land--v2 .lclaim button { width: 100%; }
  .lhero__proof { gap: 10px; }
  .lhero__visual { min-height: 530px; }
  .hero-profile { width: min(400px, 90%); }
  .hero-orbit { width: 420px; height: 420px; }
  .hero-orbit--two { width: 470px; height: 310px; }
  .hero-float--views { left: -3%; }
  .hero-float--live { right: -2%; }
  .signal-strip { grid-template-columns: repeat(2, 1fr); }
  .signal-strip > div { min-height: 91px; border-bottom: 1px solid rgba(255,255,255,.07); }
  .signal-strip > div:nth-child(even) { border-right: 0; }
  .world,
  .world--social,
  .feature-lab,
  .land--v2 .lpricing,
  .land--v2 .lfaq {
    width: calc(100% - 26px);
    padding: 75px 0;
  }
  .world__copy h2,
  .feature-lab__head h2 { font-size: clamp(39px, 12vw, 58px); }
  .profile-scene__card { width: 92%; min-height: 270px; grid-template-columns: 42% 1fr; }
  .scene-control { right: -2%; }
  .scene-control--two { left: -2%; }
  .social-demo {
    height: 570px;
    grid-template-columns: 43px 155px minmax(255px,1fr);
    overflow-x: auto;
    transform: none;
  }
  .social-demo__members { display: none; }
  .feature-panel,
  .feature-panel--wide,
  .feature-panel--accent { grid-column: 1 / -1; min-height: 290px; }
  .effect-samples { width: 48%; opacity: .7; }
  .land--v2 .lprice-grid { grid-template-columns: 1fr; }
  .land--v2 .lprice { min-height: auto; }
  .land--v2 .lfoot-copy { gap: 10px; }
  .land--v2 .lfoot-copy span:nth-child(2) { display: none; }
}

@media (max-width: 620px) {
  .shell {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0,1fr) 58px;
  }
  .main {
    grid-row: 1;
    min-width: 0;
  }
  .rail {
    position: fixed;
    z-index: 100;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    width: 100%;
    height: 58px;
    flex-direction: row;
    justify-content: space-around;
    padding: 6px 8px;
    border-top: 1px solid rgba(255,255,255,.075);
    border-right: 0;
    overflow: hidden;
    background: rgba(6,3,4,.95);
    backdrop-filter: blur(16px);
  }
  .rail__logo,
  .rail__sep,
  .rail__spacer,
  .rail-item[data-rail="customize"],
  .rail-item[data-rail="discover"],
  .desktop-only {
    display: none;
  }
  .rail-item {
    width: 42px;
    height: 42px;
  }
  .rail-item.on::before {
    top: auto;
    bottom: -7px;
    left: 50%;
    width: 24px;
    height: 2px;
    transform: translateX(-50%);
  }
  .rail-tip { display: none; }
  .side {
    left: 0;
    bottom: 58px;
    width: min(252px, 84vw);
  }
  body[data-view="social"] .main,
  body[data-view="community"] .main,
  body[data-view="voice"] .main { margin-left: 0; }
  body[data-view="social"] .side,
  body[data-view="community"] .side,
  body[data-view="voice"] .side { transform: translateX(-102%); }
  body.mobile-channels-open .side { transform: none; }
  .topbar { height: 53px; padding: 0 9px; }
  .topbar .topic { display: none; }
  .topbar-network { display: none; }
  .channel-search { width: 34px; grid-template-columns: 1fr; border-color: transparent; background: transparent; }
  .channel-search input,
  .channel-search kbd { display: none; }
  .channel-search svg { margin: auto; }
  .composer { padding: 6px 9px 66px; }
  .composer__tool:first-child { display: none; }
  .msg { padding-inline: 12px; }
  .channel-origin { padding-inline: 14px; }
  .typing { padding-inline: 13px; }
  .bl-card { padding: 34px 21px 26px; }
  .bl-player { right: 10px; bottom: 12px; left: 10px; width: auto; }
  .lhero__visual { min-height: 470px; }
  .hero-profile { width: 96%; }
  .hero-profile__banner { height: 120px; }
  .hero-float { display: none; }
  .hero-orbit { width: 355px; height: 355px; }
  .profile-scene__card { min-height: 235px; }
  .profile-scene__card > div { padding: 18px 14px; }
  .profile-scene__card h3 { font-size: 27px; }
  .scene-control { width: 135px; }
  .world__scene { min-height: 430px; }
  .social-demo { grid-template-columns: 42px 145px 255px; }
  .land--v2 .lfoot-copy span:last-child { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .land-aurora i,
  .hero-orbit,
  .hero-profile::after,
  .hero-float,
  .hero-shard,
  .profile-scene__card::after,
  .waveform i {
    animation: none !important;
  }
  .reveal {
    opacity: 1;
    transform: none;
  }
}

@media (pointer: coarse) {
  .ak-cursor { display: none; }
}

/* ---------- profile designer v3 / optimized rich themes ---------- */
.bl-card {
  width: min(var(--bl-card-width, 430px), 92%);
  padding: 0;
  overflow: hidden;
  border-radius: var(--bl-radius, 26px);
  contain: layout paint style;
}
.bl-card__banner { position: relative; height: 112px; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,.1); background: #25050b; }
.bl-card__banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6,3,4,.88), transparent 72%), linear-gradient(120deg, transparent, rgba(255,255,255,.08), transparent); }
.bl-card__banner img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85) contrast(1.08); }
.bl-card__banner span { position: absolute; z-index: 2; right: 11px; bottom: 8px; color: rgba(255,255,255,.65); font: 7px/1 var(--mono); letter-spacing: .15em; }
.bl-card__body { padding: 0 30px 30px; }
.bl-card__banner + .bl-card__body .bl-avatar { margin-top: -49px; }
.bl-avatar { margin-bottom: 10px; isolation: isolate; }
.bl-avatar .av { width: 94px; height: 94px; }
.avatar-square .bl-avatar .av, .avatar-square .bl-deco { border-radius: 15px; }
.avatar-hex .bl-avatar .av, .avatar-hex .bl-deco { border-radius: 0; clip-path: polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%); }
.avatar-diamond .bl-avatar .av, .avatar-diamond .bl-deco { border-radius: 13px; clip-path: polygon(50% 0,100% 50%,50% 100%,0 50%); }
.links-pill .bl-social { width: 54px; height: 38px; border-radius: 999px; }
.links-square .bl-social { border-radius: 3px; background: rgba(0,0,0,.4); }
.layout-wide .bl-card__banner { height: 132px; }
.layout-wide .bl-card__body { padding-inline: 42px; }
.layout-terminal .bl-card { border-radius: 4px; }
.layout-terminal .bl-card__banner { height: 84px; filter: grayscale(.35); }
.layout-terminal .bl-name, .layout-terminal .bl-bio, .layout-terminal .bl-meta { font-family: var(--mono); }
.layout-terminal .bl-name::before { content: '> '; color: var(--accent); }
.layout-shrine .bl-card__banner { height: 145px; clip-path: polygon(0 0,100% 0,100% 77%,50% 100%,0 77%); }
.layout-shrine .bl-card__banner + .bl-card__body .bl-avatar { margin-top: -35px; }
.layout-split .bl-card__body { display: grid; grid-template-columns: 116px minmax(0,1fr); align-items: center; column-gap: 18px; text-align: left; }
.layout-split .bl-avatar { grid-row: 1 / span 5; grid-column: 1; margin: -32px auto 0; }
.layout-split .bl-name, .layout-split .bl-badges, .layout-split .bl-loc, .layout-split .bl-bio { grid-column: 2; justify-content: flex-start; }
.layout-split .bl-socials, .layout-split .bl-meta, .layout-split .bl-actions { grid-column: 1 / -1; justify-content: center; text-align: center; }

/* Frame families are intentionally CSS-only: sharp detail with no image cost. */
.bl-card.frame-cathedral { border: 1px solid #ff304f; box-shadow: inset 0 0 0 3px #21050a, inset 0 0 34px rgba(255,25,58,.16), 0 0 38px rgba(255,25,58,.38), 0 34px 90px #000; }
.bl-card.frame-terminal { border: 1px solid var(--accent); box-shadow: inset 0 0 22px rgba(255,34,67,.1), 8px 8px 0 rgba(255,34,67,.13), 0 30px 80px #000; }
.bl-card.frame-chaos, .bl-card.frame-hex, .bl-card.frame-darkhold { border: 2px solid #ec1744; box-shadow: 0 0 0 1px #3b000d, 0 0 46px rgba(236,23,68,.55), inset 0 0 50px rgba(126,0,28,.18), 0 32px 90px #000; }
.bl-card.frame-armor { border: 2px solid #d6a731; box-shadow: 0 0 0 4px #6c1309, 0 0 0 5px #ffe06d, 0 0 38px rgba(58,220,255,.32), 0 32px 90px #000; }
.bl-card.frame-web { border: 2px solid #e9364c; box-shadow: 0 0 0 3px #102e65, 0 0 32px rgba(50,132,255,.38), 0 32px 90px #000; }
.bl-card.frame-symbiote { border: 2px solid #dce4f0; box-shadow: inset 0 0 70px #000, 0 0 28px rgba(220,228,240,.24), 0 32px 90px #000; }
.bl-card.frame-mystic { border: 1px solid #42eadb; box-shadow: 0 0 0 3px #a43c1c, 0 0 35px rgba(66,234,219,.42), inset 0 0 42px rgba(255,105,45,.12), 0 32px 90px #000; }
.bl-card.frame-asgard { border: 2px solid #dcb34e; box-shadow: 0 0 0 2px #14402d, 0 0 32px rgba(48,210,132,.32), 0 32px 90px #000; }
.bl-card.frame-storm { border: 2px solid #9ecfff; box-shadow: 0 0 45px rgba(90,165,255,.58), inset 0 0 32px rgba(110,180,255,.14), 0 32px 90px #000; }
.bl-card.frame-vibranium { border: 2px solid #a579ff; box-shadow: 0 0 0 4px #261347, 0 0 42px rgba(155,102,255,.58), inset 0 0 34px rgba(125,70,240,.15), 0 32px 90px #000; }
.bl-card.frame-moon, .bl-card.frame-steel { border: 2px solid #cbd5e6; box-shadow: 0 0 0 3px #30394a, 0 0 34px rgba(200,215,240,.28), 0 32px 90px #000; }
.bl-card.frame-hellfire, .bl-card.frame-phoenix { border: 2px solid #ff9b28; box-shadow: 0 0 12px #ff3c00, 0 0 45px rgba(255,70,0,.58), inset 0 0 38px rgba(255,66,0,.14), 0 32px 90px #000; }
.bl-card.frame-merc { border: 2px dashed #e33a48; box-shadow: 7px 7px 0 #111, 0 32px 90px #000; }
.bl-card.frame-cosmic, .bl-card.frame-infinity { border: 2px solid #e2c06d; box-shadow: 0 0 0 3px #30194f, 0 0 42px rgba(123,92,255,.48), inset 0 0 42px rgba(70,170,255,.12), 0 32px 90px #000; }
.bl-card.frame-synthezoid { border: 2px solid #ff55c8; box-shadow: 0 0 0 3px #bda13d, 0 0 36px rgba(255,75,194,.4), 0 32px 90px #000; }
.bl-card.frame-radar { border: 1px solid #ff334d; box-shadow: 0 0 0 4px #280309, 0 0 30px rgba(255,40,65,.43), 0 32px 90px #000; }

.bl-deco { pointer-events: none; }
.deco-blood-orbit, .deco-chaos-crown, .deco-hex-orbit, .deco-rune-ring { background: repeating-conic-gradient(from 0deg, #ff3156 0 8deg, transparent 8deg 27deg); animation: spin 9s linear infinite; filter: drop-shadow(0 0 5px #ef1742); }
.deco-chrome-halo, .deco-steel-star { border: 4px double #eaf1ff; box-shadow: 0 0 16px #b6c8e8; background: linear-gradient(135deg, transparent, rgba(255,255,255,.24), transparent); }
.deco-blood-moon, .deco-moon-crescent { border: 4px solid #e6ebfa; border-left-color: transparent; box-shadow: 6px 0 16px rgba(235,240,255,.7); animation: spin 10s linear infinite; }
.deco-scan-ring, .deco-radar-ring, .deco-target-lock { border: 2px dashed var(--accent); box-shadow: 0 0 14px var(--accent); animation: spin 7s steps(12) infinite; }
.deco-arc-reactor, .deco-mind-stone, .deco-binary-star { background: repeating-conic-gradient(#7af4ff 0 9deg, transparent 9deg 21deg); box-shadow: 0 0 24px #61eaff; animation: spin 6s linear infinite; }
.deco-web-orbit { border: 2px solid #e8384d; background: repeating-conic-gradient(transparent 0 14deg, rgba(86,158,255,.8) 15deg 16deg); box-shadow: 0 0 18px #347bff; animation: spin 12s linear infinite; }
.deco-symbiote { background: repeating-conic-gradient(#e8edf5 0 4deg, transparent 4deg 19deg); filter: blur(2px); animation: spin 14s ease-in-out infinite alternate; }
.deco-mystic-rune, .deco-timeline, .deco-cosmic-orbit, .deco-infinity-stones { border: 3px dotted var(--accent); box-shadow: 0 0 20px var(--accent), inset 0 0 15px var(--accent); animation: spin 8s linear infinite; }
.deco-lightning, .deco-vibranium { background: repeating-conic-gradient(from 30deg, var(--accent) 0 3deg, transparent 3deg 25deg); filter: drop-shadow(0 0 7px var(--accent)); animation: decopulse 1.7s ease-in-out infinite; }
.deco-hellfire, .deco-phoenix { inset: -12px; background: conic-gradient(#ff2f00,#ffb326,#fff09a,#ff4010,#ff2f00); filter: blur(4px); animation: spin 3.8s linear infinite; }

/* Signature relics use distinct silhouettes rather than recoloured rings. */
.bl-deco.deco-scarlet-crown,
.bl-deco.deco-loki-crown,
.bl-deco.deco-storm-crown,
.bl-deco.deco-panther-crown,
.bl-deco.deco-iron-halo,
.bl-deco.deco-mystic-mandala {
  inset: -14px;
  z-index: 3;
  overflow: visible;
  border-radius: 50%;
  clip-path: none;
  background: none;
  filter: none;
  animation: relic-float 4.6s ease-in-out infinite;
}
.bl-deco.deco-scarlet-crown { border: 2px solid rgba(255,29,77,.5); box-shadow: 0 0 22px rgba(255,22,69,.7), inset 0 0 17px rgba(255,22,69,.36); }
.deco-scarlet-crown::before { content: ''; position: absolute; top: -27px; left: 9%; width: 82%; height: 49px; clip-path: polygon(0 100%,7% 36%,28% 70%,50% 0,72% 70%,93% 36%,100% 100%); background: linear-gradient(180deg,#fff 0 5%,#ff9ab1 6% 18%,#ff2453 19% 50%,#7e0019 72%,#240006); filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 10px #ff1748); }
.deco-scarlet-crown::after { content: ''; position: absolute; top: -10px; left: calc(50% - 5px); width: 10px; height: 10px; transform: rotate(45deg); border: 1px solid #ffdbe4; background: #ff234f; box-shadow: 0 0 14px #ff315d; }
.bl-deco.deco-loki-crown { border: 2px solid rgba(230,190,76,.68); box-shadow: 0 0 22px rgba(67,224,142,.45), inset 0 0 14px rgba(224,183,68,.28); }
.deco-loki-crown::before,.deco-loki-crown::after { content: ''; position: absolute; top: -37px; width: 37px; height: 61px; background: linear-gradient(90deg,#6f4910,#fff0a0 45%,#b57b1c 67%,#422909); filter: drop-shadow(0 0 7px rgba(226,189,75,.75)); }
.deco-loki-crown::before { left: 2px; clip-path: polygon(78% 100%,35% 82%,4% 45%,0 8%,24% 31%,46% 54%,100% 72%); }
.deco-loki-crown::after { right: 2px; transform: scaleX(-1); clip-path: polygon(78% 100%,35% 82%,4% 45%,0 8%,24% 31%,46% 54%,100% 72%); }
.bl-deco.deco-storm-crown { border: 2px solid #a9d8ff; box-shadow: 0 0 22px #5ba8ff, inset 0 0 18px rgba(136,199,255,.55); animation-duration: 2.8s; }
.deco-storm-crown::before { content: ''; position: absolute; top: -26px; left: 18%; width: 64%; height: 50px; clip-path: polygon(45% 0,76% 0,57% 34%,86% 34%,35% 100%,48% 53%,17% 53%); background: linear-gradient(160deg,#fff,#a8dcff 40%,#347de5); filter: drop-shadow(0 0 10px #75b8ff); }
.deco-storm-crown::after { content: ''; position: absolute; inset: -8px; border: 1px dashed rgba(183,222,255,.7); border-radius: 50%; animation: spin 8s linear infinite; }
.bl-deco.deco-panther-crown { border: 2px solid #a878ff; box-shadow: 0 0 24px rgba(150,91,255,.75), inset 0 0 18px rgba(99,40,210,.45); }
.deco-panther-crown::before { content: ''; position: absolute; top: -25px; left: 9%; width: 82%; height: 42px; clip-path: polygon(0 90%,5% 4%,28% 42%,50% 17%,72% 42%,95% 4%,100% 90%,76% 68%,50% 100%,24% 68%); background: linear-gradient(180deg,#d5bfff,#8d55f3 35%,#2c1154 86%); filter: drop-shadow(0 0 9px #9d68ff); }
.deco-panther-crown::after { content: '◇'; position: absolute; top: -17px; left: 0; width: 100%; color: #f0e8ff; font: 700 17px/1 var(--mono); text-align: center; text-shadow: 0 0 10px #a878ff; }
.bl-deco.deco-iron-halo { border: 3px solid #f0c650; background: repeating-conic-gradient(from 0deg,#54e8ff 0 6deg,transparent 6deg 19deg,#f3c956 19deg 23deg,transparent 23deg 30deg); box-shadow: 0 0 20px #54e8ff, inset 0 0 15px rgba(255,200,70,.55); animation: spin 9s linear infinite; }
.deco-iron-halo::after { content: ''; position: absolute; inset: 8px; border: 1px solid rgba(111,239,255,.8); border-radius: 50%; box-shadow: 0 0 14px #50e8ff; }
.bl-deco.deco-mystic-mandala { inset: -18px; border: 2px dotted #54e6d5; background: repeating-conic-gradient(from 0deg,rgba(255,132,65,.86) 0 2deg,transparent 2deg 15deg); box-shadow: 0 0 20px #45d9ca, inset 0 0 18px rgba(255,112,45,.46); animation: spin 12s linear infinite; }
.deco-mystic-mandala::before { content: ''; position: absolute; inset: 8px; border: 2px dashed #ff7842; border-radius: 50%; animation: spin 5s linear infinite reverse; }
.deco-mystic-mandala::after { content: ''; position: absolute; inset: 16px; border: 1px solid #77fff0; transform: rotate(45deg); box-shadow: 0 0 10px #55ead9; }
@keyframes relic-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

/* Themed frame engraving: a separate ornament layer for every hero family. */
.bl-card.frame-chaos::after,.bl-card.frame-hex::after,.bl-card.frame-darkhold::after,.bl-card.frame-armor::after,.bl-card.frame-web::after,.bl-card.frame-symbiote::after,.bl-card.frame-mystic::after,.bl-card.frame-asgard::after,.bl-card.frame-storm::after,.bl-card.frame-vibranium::after,.bl-card.frame-moon::after,.bl-card.frame-hellfire::after,.bl-card.frame-merc::after,.bl-card.frame-cosmic::after,.bl-card.frame-synthezoid::after,.bl-card.frame-steel::after,.bl-card.frame-radar::after,.bl-card.frame-phoenix::after,.bl-card.frame-infinity::after { content: ''; position: absolute; z-index: 8; inset: 5px; pointer-events: none; border-radius: calc(var(--bl-radius,26px) - 6px); }
.bl-card.frame-chaos::after,.bl-card.frame-hex::after { background: linear-gradient(135deg,#ff3158 0 2px,transparent 2px) 0 0/34px 34px,linear-gradient(315deg,#ff3158 0 2px,transparent 2px) 100% 100%/34px 34px; box-shadow: inset 0 0 25px rgba(255,21,67,.16); }
.bl-card.frame-darkhold::after { border: 1px dashed rgba(235,43,76,.52); background: repeating-linear-gradient(90deg,transparent 0 28px,rgba(224,30,63,.12) 29px 30px); }
.bl-card.frame-armor::after { border: 1px solid rgba(255,215,87,.72); clip-path: polygon(0 0,38% 0,43% 8px,57% 8px,62% 0,100% 0,100% 100%,62% 100%,57% calc(100% - 8px),43% calc(100% - 8px),38% 100%,0 100%); }
.bl-card.frame-web::after { opacity: .45; background: repeating-conic-gradient(from 0deg at 50% 50%,transparent 0 14deg,rgba(83,150,255,.48) 14deg 15deg); }
.bl-card.frame-symbiote::after { border: 2px solid rgba(235,241,250,.52); border-radius: 38% 62% 46% 54%/55% 38% 62% 45%; }
.bl-card.frame-mystic::after { border: 1px dashed rgba(82,240,221,.72); box-shadow: inset 0 0 18px rgba(255,113,58,.2); }
.bl-card.frame-asgard::after { border: 1px solid rgba(232,190,80,.72); background: linear-gradient(90deg,transparent 46%,rgba(69,224,145,.18) 47% 53%,transparent 54%); }
.bl-card.frame-storm::after { background: linear-gradient(118deg,transparent 47%,rgba(190,225,255,.35) 48% 49%,transparent 50%); animation: frame-storm 4.2s ease-in-out infinite; }
.bl-card.frame-vibranium::after { border: 1px solid rgba(176,134,255,.52); clip-path: polygon(7% 0,93% 0,100% 7%,100% 93%,93% 100%,7% 100%,0 93%,0 7%); }
.bl-card.frame-moon::after { box-shadow: inset -14px 0 22px rgba(226,235,255,.18); }
.bl-card.frame-hellfire::after,.bl-card.frame-phoenix::after { box-shadow: inset 0 -12px 25px rgba(255,77,0,.34); animation: frame-fire 2.6s ease-in-out infinite; }
.bl-card.frame-merc::after { border: 1px dashed rgba(255,255,255,.34); transform: rotate(-.35deg); }
.bl-card.frame-cosmic::after,.bl-card.frame-infinity::after { background: radial-gradient(circle at 9% 12%,#ffd96b 0 2px,transparent 3px),radial-gradient(circle at 91% 16%,#66cfff 0 2px,transparent 3px),radial-gradient(circle at 8% 86%,#b184ff 0 2px,transparent 3px),radial-gradient(circle at 92% 88%,#ff638c 0 2px,transparent 3px); }
.bl-card.frame-synthezoid::after { border: 1px solid rgba(255,211,83,.55); background: linear-gradient(135deg,transparent 49%,rgba(255,80,200,.13) 50%,transparent 51%); }
.bl-card.frame-steel::after { border: 1px solid rgba(230,238,248,.38); background: linear-gradient(100deg,transparent 42%,rgba(255,255,255,.08) 50%,transparent 58%); }
.bl-card.frame-radar::after { border: 1px dashed rgba(255,47,72,.52); box-shadow: inset 0 0 0 9px rgba(255,37,66,.025); }
@keyframes frame-storm { 0%,88%,100% { opacity: .18; } 90% { opacity: 1; } 92% { opacity: .28; } 95% { opacity: .9; } }
@keyframes frame-fire { 50% { box-shadow: inset 0 -20px 38px rgba(255,104,0,.48); } }

.bl-socials.glow .bl-social { box-shadow: 0 0 16px color-mix(in srgb,var(--accent) 42%,transparent),inset 0 0 12px rgba(255,255,255,.035); }

.eff-chaos .bl-bg-overlay { background: radial-gradient(circle at 50% 40%, rgba(255,0,58,.2), rgba(3,0,1,.62)) !important; }
.eff-webs .bl-bg-overlay { background-image: repeating-conic-gradient(from 0deg at 50% 50%, transparent 0 14deg, rgba(90,150,255,.07) 14deg 15deg) !important; }
.eff-symbiote .bl-bg-overlay { background: radial-gradient(ellipse at 50% 25%, rgba(230,238,255,.08), rgba(0,0,0,.78) 55%) !important; }
.eff-mystic .bl-bg-overlay { background: repeating-radial-gradient(circle at 50% 50%, transparent 0 55px, rgba(55,230,215,.08) 56px 58px) !important; }
.eff-cosmic .bl-bg-overlay { background: radial-gradient(circle at 70% 20%, rgba(80,135,255,.22), transparent 35%), radial-gradient(circle at 25% 75%, rgba(180,65,255,.16), transparent 32%), rgba(1,2,8,.55) !important; }
.eff-radar .bl-bg-overlay { background: repeating-radial-gradient(circle, transparent 0 50px, rgba(255,35,65,.08) 51px 52px), rgba(5,0,1,.66) !important; }

/* Full-scene effects: one composited layer, no per-frame DOM churn. */
.bl-effect-layer { position: absolute; z-index: 3; inset: -12%; overflow: hidden; pointer-events: none; transform: translateZ(0); }
.bl-effect-layer::before,.bl-effect-layer::after { content: ''; position: absolute; pointer-events: none; }
.eff-nighttime .bl-effect-layer { inset: 0; background: radial-gradient(circle at 82% 15%,#f8fbff 0 13px,#9aa9c8 14px 17px,rgba(225,234,255,.2) 18px 31px,transparent 32px),radial-gradient(circle at 12% 20%,rgba(255,255,255,.8) 0 1px,transparent 2px),radial-gradient(circle at 66% 42%,rgba(255,255,255,.65) 0 1px,transparent 2px),radial-gradient(circle at 31% 71%,rgba(255,255,255,.5) 0 1px,transparent 2px); animation: night-breathe 7s ease-in-out infinite; }
.eff-chaos .bl-effect-layer::before { inset: 7%; border: 1px solid rgba(255,35,78,.25); background: repeating-conic-gradient(from 0deg,rgba(255,25,70,.13) 0 2deg,transparent 2deg 17deg); clip-path: polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); animation: scene-spin 26s linear infinite; }
.eff-chaos .bl-effect-layer::after { inset: 24%; border: 1px dashed rgba(255,105,130,.35); border-radius: 50%; box-shadow: 0 0 80px rgba(255,0,55,.22),inset 0 0 45px rgba(255,0,55,.15); animation: scene-spin 15s linear infinite reverse; }
.eff-webs .bl-effect-layer { inset: 0; opacity: .28; background: repeating-radial-gradient(circle at 50% 50%,transparent 0 49px,rgba(145,190,255,.48) 50px 51px),repeating-conic-gradient(from 0deg at 50% 50%,transparent 0 14deg,rgba(124,176,255,.52) 14deg 15deg); animation: web-pulse 5s ease-in-out infinite; }
.eff-symbiote .bl-effect-layer::before,.eff-symbiote .bl-effect-layer::after { width: 48%; height: 75%; border: 2px solid rgba(222,232,245,.15); border-radius: 37% 63% 58% 42%/61% 36% 64% 39%; background: radial-gradient(circle at 50% 30%,rgba(234,241,250,.09),rgba(0,0,0,.34) 63%); }
.eff-symbiote .bl-effect-layer::before { left: -13%; top: 6%; animation: symbiote-drift 12s ease-in-out infinite alternate; }
.eff-symbiote .bl-effect-layer::after { right: -10%; bottom: -13%; animation: symbiote-drift 15s ease-in-out infinite alternate-reverse; }
.eff-mystic .bl-effect-layer::before { inset: 12%; border: 2px dashed rgba(65,234,216,.3); border-radius: 50%; background: repeating-conic-gradient(from 0deg,rgba(255,114,55,.2) 0 1deg,transparent 1deg 11deg); box-shadow: inset 0 0 80px rgba(57,229,211,.12),0 0 70px rgba(255,100,40,.1); animation: scene-spin 32s linear infinite; }
.eff-mystic .bl-effect-layer::after { inset: 28%; border: 1px solid rgba(255,132,70,.33); transform: rotate(45deg); animation: mystic-drift 8s ease-in-out infinite; }
.eff-lightning .bl-effect-layer::before { top: -5%; left: 16%; width: 18%; height: 82%; opacity: 0; clip-path: polygon(47% 0,100% 0,63% 42%,91% 42%,9% 100%,35% 54%,0 54%); background: linear-gradient(90deg,#fff,#a8d8ff 45%,#4b8dff); filter: drop-shadow(0 0 12px #7cbcff); animation: lightning-strike 5.5s steps(1) infinite; }
.eff-lightning .bl-effect-layer::after { inset: 0; opacity: 0; background: rgba(180,220,255,.24); animation: lightning-flash 5.5s steps(1) infinite; }
.eff-embers .bl-effect-layer { inset: 0; background: radial-gradient(ellipse at 50% 105%,rgba(255,55,0,.3),transparent 48%); }
.eff-embers .bl-effect-layer::before { inset: 0; opacity: .55; background-image: radial-gradient(circle at 10% 90%,#ffc24a 0 2px,transparent 3px),radial-gradient(circle at 35% 78%,#ff6020 0 1px,transparent 2px),radial-gradient(circle at 68% 91%,#ffd67a 0 2px,transparent 3px),radial-gradient(circle at 88% 73%,#ff4c18 0 1px,transparent 2px); animation: ember-rise 6s ease-in-out infinite; }
.eff-cosmic .bl-effect-layer::before { inset: 3%; border: 1px solid rgba(135,173,255,.2); border-radius: 50%; box-shadow: inset 0 0 100px rgba(118,70,255,.14); transform: rotateX(65deg); animation: cosmic-orbit-scene 38s linear infinite; }
.eff-cosmic .bl-effect-layer::after { top: 12%; right: 12%; width: 72px; height: 72px; border-radius: 50%; background: radial-gradient(circle at 35% 32%,#fff,#75baff 8%,#45258d 42%,#06030b 70%); box-shadow: 0 0 45px rgba(103,145,255,.45); animation: cosmic-float 8s ease-in-out infinite; }
.eff-radar .bl-effect-layer { inset: 0; background: conic-gradient(from 0deg at 50% 50%,transparent 0 320deg,rgba(255,34,66,.03) 330deg,rgba(255,34,66,.3) 359deg,transparent 360deg); animation: scene-spin 7s linear infinite; }
.eff-radar .bl-effect-layer::after { inset: 10%; border: 1px solid rgba(255,45,72,.12); border-radius: 50%; box-shadow: inset 0 0 0 80px rgba(255,30,60,.01),inset 0 0 0 160px rgba(255,30,60,.012); }

/* Effect completion pass: every selectable scene has a visible, composited
   treatment even on devices where the canvas particle layer is quality-capped. */
.eff-blackhole .bl-effect-layer,.eff-void .bl-effect-layer { inset:0; background:radial-gradient(circle at 50% 50%,#020104 0 11%,rgba(31,5,52,.72) 12%,transparent 34%),repeating-radial-gradient(ellipse at 50% 50%,transparent 0 34px,rgba(150,90,255,.12) 35px 37px); animation:void-breathe 9s ease-in-out infinite; }
.eff-eclipse .bl-effect-layer { inset:0; background:radial-gradient(circle at 50% 44%,#020103 0 62px,rgba(255,55,73,.95) 64px 67px,rgba(255,48,68,.18) 69px 100px,transparent 180px); animation:eclipse-pulse 5s ease-in-out infinite; }
.eff-matrix .bl-effect-layer,.eff-cyberstorm .bl-effect-layer { inset:0; opacity:.32; background:repeating-linear-gradient(90deg,transparent 0 17px,rgba(70,255,151,.16) 18px 19px),linear-gradient(180deg,rgba(5,255,110,.12),transparent 40%); animation:matrix-scan 4.5s linear infinite; }
.eff-glitch .bl-effect-layer,.eff-hologram .bl-effect-layer { inset:0; opacity:.4; background:repeating-linear-gradient(0deg,rgba(120,238,255,.12) 0 1px,transparent 1px 5px),linear-gradient(110deg,transparent 26%,rgba(255,48,93,.18) 27% 32%,transparent 33%); animation:glitch-sweep 3.2s steps(2) infinite; }
.eff-prism .bl-effect-layer,.eff-lasergrid .bl-effect-layer { inset:0; opacity:.4; background:linear-gradient(130deg,transparent 35%,rgba(90,237,255,.28) 36% 38%,transparent 39%),linear-gradient(48deg,transparent 57%,rgba(255,68,174,.24) 58% 60%,transparent 61%),repeating-linear-gradient(90deg,transparent 0 48px,rgba(125,80,255,.15) 49px 50px); animation:prism-drift 8s ease-in-out infinite alternate; }
.eff-bloodrain .bl-effect-layer,.eff-meteor .bl-effect-layer { inset:-20%; opacity:.52; background:repeating-linear-gradient(108deg,transparent 0 62px,rgba(255,36,68,.48) 63px 65px,transparent 66px 112px); animation:rain-shear 3.5s linear infinite; }
.eff-spectral .bl-effect-layer,.eff-frost .bl-effect-layer { inset:0; background:radial-gradient(circle at 20% 36%,rgba(208,244,255,.3),transparent 18%),radial-gradient(circle at 76% 68%,rgba(179,213,255,.24),transparent 21%),linear-gradient(180deg,rgba(191,237,255,.1),transparent); animation:spectral-float 10s ease-in-out infinite alternate; }
.eff-inferno .bl-effect-layer,.eff-plasma .bl-effect-layer { inset:0; background:radial-gradient(ellipse at 48% 108%,rgba(255,51,8,.6),transparent 51%),radial-gradient(ellipse at 20% 100%,rgba(255,180,21,.34),transparent 38%); animation:inferno-breathe 4s ease-in-out infinite; }
.eff-gothic .bl-effect-layer,.eff-ravens .bl-effect-layer,.eff-chains .bl-effect-layer,.eff-thorns .bl-effect-layer { inset:0; opacity:.36; background:linear-gradient(90deg,transparent 0 11%,rgba(255,42,72,.1) 12% 13%,transparent 14% 86%,rgba(255,42,72,.1) 87% 88%,transparent 89%),repeating-linear-gradient(135deg,transparent 0 48px,rgba(50,4,13,.72) 50px 53px,transparent 55px 104px); animation:gothic-shift 11s ease-in-out infinite alternate; }
.eff-runic .bl-effect-layer,.eff-portal .bl-effect-layer,.eff-quantum .bl-effect-layer,.eff-sonic .bl-effect-layer { inset:12%; border:1px dashed rgba(255,137,154,.5); border-radius:50%; background:repeating-radial-gradient(circle,transparent 0 28px,rgba(255,54,91,.13) 29px 30px); box-shadow:0 0 70px rgba(244,30,68,.18),inset 0 0 70px rgba(244,30,68,.12); animation:scene-spin 28s linear infinite; }
.eff-nebula .bl-effect-layer,.eff-dreamwave .bl-effect-layer,.eff-toxic .bl-effect-layer { inset:0; background:radial-gradient(ellipse at 24% 28%,rgba(157,100,255,.27),transparent 34%),radial-gradient(ellipse at 72% 72%,rgba(77,255,190,.18),transparent 38%),linear-gradient(180deg,transparent,rgba(7,2,12,.5)); animation:nebula-drift 14s ease-in-out infinite alternate; }
.video-fallback .bl-bg { background:radial-gradient(circle at 50% 26%,color-mix(in srgb,var(--accent) 34%,transparent),transparent 38%),#060304 !important; }
.bl-bg-video.is-unavailable { display:none; }
@keyframes void-breathe { 50% { transform:scale(1.06); filter:hue-rotate(16deg); } }
@keyframes eclipse-pulse { 50% { transform:scale(1.045); filter:brightness(1.35); } }
@keyframes matrix-scan { to { background-position:0 0,0 520px; } }
@keyframes glitch-sweep { 50% { transform:translateX(1.5%); opacity:.23; } }
@keyframes prism-drift { to { transform:translate3d(2%,-2%,0) rotate(2deg); } }
@keyframes rain-shear { to { transform:translate3d(-8%,18%,0); } }
@keyframes spectral-float { to { transform:translate3d(3%,-3%,0) scale(1.05); } }
@keyframes inferno-breathe { 50% { transform:scale(1.07); filter:saturate(1.45); } }
@keyframes gothic-shift { to { transform:translateX(2%) scale(1.04); } }
@keyframes nebula-drift { to { transform:translate3d(-3%,2%,0) scale(1.07); filter:hue-rotate(18deg); } }
@keyframes scene-spin { to { transform: rotate(360deg); } }
@keyframes cosmic-orbit-scene { to { transform: rotateX(65deg) rotateZ(360deg); } }
@keyframes night-breathe { 50% { opacity: .72; } }
@keyframes web-pulse { 50% { opacity: .42; transform: scale(1.035); } }
@keyframes symbiote-drift { to { transform: translate3d(18%,6%,0) rotate(12deg); border-radius: 63% 37% 39% 61%/42% 62% 38% 58%; } }
@keyframes mystic-drift { 50% { transform: rotate(135deg) scale(.9); opacity: .55; } }
@keyframes lightning-strike { 0%,8%,12%,100% { opacity: 0; } 9%,11% { opacity: .92; } }
@keyframes lightning-flash { 0%,8%,12%,100% { opacity: 0; } 9% { opacity: .7; } 11% { opacity: .32; } }
@keyframes ember-rise { 50% { transform: translate3d(2%,-16%,0) scale(1.08); opacity: .88; } }
@keyframes cosmic-float { 50% { transform: translate3d(-18px,14px,0) scale(1.08); } }

/* Illustrated scene plates sit behind the glass UI and remain a single GPU layer. */
.bl-theme-art { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; opacity: .88; }
.bl-theme-art::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 42%,transparent 12%,rgba(3,1,2,.05) 49%,rgba(3,1,2,.36) 100%),linear-gradient(180deg,rgba(2,1,2,0),rgba(2,1,2,.22)); }
.bl-theme-art img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.025); animation: theme-art-breathe 18s ease-in-out infinite alternate; }
.eff-darkhold .bl-theme-art { opacity: 1; filter:saturate(1.18) contrast(1.14); }.eff-mystic .bl-theme-art { opacity: .9; }.eff-timeline .bl-theme-art { opacity: 1; filter:saturate(1.2) contrast(1.16); }.eff-cosmic .bl-theme-art,.eff-infinity .bl-theme-art,.eff-vibranium .bl-theme-art,.eff-quantum .bl-theme-art,.eff-reactor .bl-theme-art { opacity: .96; filter:saturate(1.12) contrast(1.1); }

/* Layout vault: genuinely different compositions rather than width presets. */
.layout-poster .bl-card { --bl-radius: 10px; max-width: 390px; transform: rotate(-.3deg); }
.layout-poster .bl-card__banner { height: 188px; clip-path: polygon(0 0,100% 0,100% 91%,63% 100%,0 94%); }
.layout-poster .bl-card__body { padding: 0 24px 32px; }.layout-poster .bl-name { font-family: var(--display); font-size: clamp(24px,5vw,38px); letter-spacing: -.045em; text-transform: uppercase; }
.layout-orbit .bl-card { max-width: 520px; border-radius: 48px; }
.layout-orbit .bl-card__banner { height: 162px; clip-path: ellipse(78% 76% at 50% 15%); }
.layout-orbit .bl-card__banner + .bl-card__body .bl-avatar { margin-top: -29px; }.layout-orbit .bl-avatar .av { width: 108px; height: 108px; }
.layout-orbit .bl-card__body { padding-inline: 42px; }.layout-orbit .bl-socials { padding: 4px 0; }
.layout-dossier .bl-card { max-width: 600px; border-radius: 8px; }
.layout-dossier .bl-card__banner { height: 104px; clip-path: polygon(0 0,100% 0,100% 76%,72% 100%,0 100%); }
.layout-dossier .bl-card__body { display: grid; grid-template-columns: 122px minmax(0,1fr); align-items: center; column-gap: 22px; padding: 0 32px 30px; text-align: left; }
.layout-dossier .bl-avatar { grid-column: 1; grid-row: 1 / span 5; margin: -32px auto 0; }.layout-dossier .bl-name,.layout-dossier .bl-badges,.layout-dossier .bl-loc,.layout-dossier .bl-bio { grid-column: 2; justify-content: flex-start; }
.layout-dossier .bl-socials,.layout-dossier .bl-meta,.layout-dossier .bl-actions { grid-column: 1 / -1; justify-content: center; text-align: center; }
.layout-dossier .bl-name::after { content: ' // IDENTITY FILE'; color: var(--accent); font: 6px/1 var(--mono); letter-spacing: .12em; vertical-align: middle; }
.layout-cinematic .bl-card { max-width: 620px; border-radius: 22px; }
.layout-cinematic .bl-card__banner { height: 205px; }.layout-cinematic .bl-card__body { padding-inline: 54px; }
.layout-cinematic .bl-card__banner + .bl-card__body .bl-avatar { margin-top: -56px; }.layout-cinematic .bl-name { font-size: clamp(26px,5vw,42px); }
.layout-comic .bl-card { max-width: 540px; overflow: hidden; border-width: 3px; border-radius: 3px; clip-path: polygon(0 0,97% 0,100% 4%,100% 96%,96% 100%,3% 100%,0 96%); transform: rotate(.2deg); box-shadow: 8px 8px 0 color-mix(in srgb,var(--accent) 32%,#000),0 30px 90px #000; }
.layout-comic .bl-card__banner { height: 148px; clip-path: polygon(0 0,100% 0,100% 82%,62% 100%,0 90%); }
.layout-comic .bl-card__body { padding-inline: 38px; }.layout-comic .bl-name { font-family: var(--display); font-size: clamp(25px,5vw,40px); font-style: italic; text-transform: uppercase; text-shadow: 3px 3px 0 #000,0 0 15px var(--accent); }

/* Darkhold grimoire: scarlet pages, etched sigils, suspended ring. */
.eff-darkhold .bl-bg-overlay { background: radial-gradient(circle at 50% 50%,rgba(223,15,55,.14),rgba(12,0,3,.18) 47%,rgba(2,0,1,.52) 100%) !important; }
.eff-darkhold .bl-effect-layer::before { inset: 7%; border: 2px solid rgba(255,69,102,.72); border-radius: 50%; background: repeating-conic-gradient(from 0deg,rgba(255,29,70,.42) 0 1deg,transparent 1deg 8deg); box-shadow: 0 0 120px rgba(230,0,48,.62),inset 0 0 72px rgba(230,0,48,.34); animation: darkhold-rotate 38s linear infinite; }
.eff-darkhold .bl-effect-layer::after { inset: 19%; border: 2px dashed rgba(255,210,217,.68); clip-path: polygon(50% 0,61% 35%,98% 35%,68% 56%,79% 94%,50% 70%,21% 94%,32% 56%,2% 35%,39% 35%); background: radial-gradient(circle,rgba(255,33,73,.46),transparent 62%); filter:drop-shadow(0 0 18px #ff3156); animation: darkhold-pulse 5.6s ease-in-out infinite; }
/* Arc reactor: stable concentric machinery and a cool luminous core. */
.eff-reactor .bl-bg-overlay { background: radial-gradient(circle at 50% 48%,rgba(80,231,255,.18),transparent 19%),radial-gradient(circle at 50% 48%,transparent 0 35%,rgba(109,29,14,.2) 58%,rgba(2,2,4,.72)) !important; }
.eff-reactor .bl-effect-layer::before { inset: 14%; border: 2px solid rgba(119,241,255,.42); border-radius: 50%; background: repeating-conic-gradient(from 0deg,rgba(255,207,84,.34) 0 3deg,transparent 3deg 16deg),radial-gradient(circle,rgba(226,252,255,.8) 0 3%,rgba(77,225,255,.45) 4% 8%,transparent 9% 31%,rgba(84,231,255,.15) 32% 33%,transparent 34%); box-shadow: 0 0 60px rgba(69,223,255,.28),inset 0 0 60px rgba(67,220,255,.2); animation: reactor-core 18s linear infinite; }
.eff-reactor .bl-effect-layer::after { inset: 28%; border: 1px dashed rgba(255,215,102,.52); border-radius: 50%; animation: scene-spin 11s linear infinite reverse; }
/* Timeline: a branching green-gold current crossing the cosmic plate. */
.eff-timeline .bl-bg-overlay { background: linear-gradient(90deg,rgba(1,9,5,.42),rgba(5,25,14,.06) 50%,rgba(3,7,5,.38)) !important; }
.eff-timeline .bl-effect-layer::before { inset: 4% -12%; background: linear-gradient(175deg,transparent 44%,rgba(239,207,95,.9) 48%,#dfffc8 49%,#4dff9a 50%,rgba(64,225,135,.76) 52%,transparent 56%),linear-gradient(188deg,transparent 37%,rgba(68,229,139,.6) 39%,transparent 43%),linear-gradient(163deg,transparent 59%,rgba(238,196,71,.55) 61%,transparent 65%); filter: drop-shadow(0 0 22px rgba(91,255,163,1)); animation: timeline-flow 9s ease-in-out infinite alternate; }
.eff-timeline .bl-effect-layer::after { left: 50%; top: 6%; width: 3px; height: 88%; background: linear-gradient(transparent,#e9c766,#dcffab,#7bffbd,#e9c766,transparent); box-shadow: 0 0 28px #83ffbd,0 0 66px rgba(90,255,165,.5); animation: timeline-pulse 4s ease-in-out infinite; }
/* Vibranium: clean kinetic hex lattice with pressure waves. */
.eff-vibranium .bl-bg-overlay { background: radial-gradient(circle at 50% 50%,rgba(151,89,255,.18),rgba(12,3,28,.66) 67%) !important; }
.eff-vibranium .bl-effect-layer { inset: 0; opacity: .46; background-image: linear-gradient(30deg,rgba(174,130,255,.28) 12%,transparent 12.5%,transparent 87%,rgba(174,130,255,.28) 87.5%),linear-gradient(150deg,rgba(174,130,255,.28) 12%,transparent 12.5%,transparent 87%,rgba(174,130,255,.28) 87.5%),linear-gradient(30deg,rgba(174,130,255,.28) 12%,transparent 12.5%,transparent 87%,rgba(174,130,255,.28) 87.5%),linear-gradient(150deg,rgba(174,130,255,.28) 12%,transparent 12.5%,transparent 87%,rgba(174,130,255,.28) 87.5%),linear-gradient(60deg,rgba(197,166,255,.18) 25%,transparent 25.5%,transparent 75%,rgba(197,166,255,.18) 75%); background-position: 0 0,0 0,32px 56px,32px 56px,0 0; background-size: 64px 112px; animation: vibranium-pulse 6s ease-in-out infinite; }
/* Infinity: six spectral stones locked to an orbit over the dimensional rift. */
.eff-infinity .bl-bg-overlay { background: radial-gradient(circle at 50% 48%,transparent 0 12%,rgba(4,2,12,.24) 40%,rgba(1,1,5,.72) 100%) !important; }
.eff-infinity .bl-effect-layer::before { inset: 12%; border: 1px solid rgba(231,207,137,.35); border-radius: 50%; background: radial-gradient(circle at 50% 2%,#ffe161 0 4px,transparent 6px),radial-gradient(circle at 91% 28%,#66bfff 0 5px,transparent 7px),radial-gradient(circle at 84% 77%,#ee4e55 0 5px,transparent 7px),radial-gradient(circle at 50% 98%,#ff9a38 0 5px,transparent 7px),radial-gradient(circle at 9% 73%,#67ef8c 0 5px,transparent 7px),radial-gradient(circle at 9% 27%,#ad6cff 0 5px,transparent 7px); box-shadow: inset 0 0 80px rgba(131,78,255,.12),0 0 50px rgba(91,154,255,.16); animation: infinity-orbit 28s linear infinite; }
.eff-infinity .bl-effect-layer::after { inset: 31%; border: 1px dashed rgba(255,224,134,.35); border-radius: 50%; box-shadow: 0 0 35px rgba(255,209,94,.19); animation: scene-spin 14s linear infinite reverse; }
@keyframes theme-art-breathe { to { transform: scale(1.07) translate3d(-1%,.5%,0); } }
@keyframes darkhold-rotate { to { transform: rotate(360deg) scale(1.03); } }
@keyframes darkhold-pulse { 50% { opacity: .55; transform: scale(.9) rotate(9deg); } }
@keyframes reactor-core { to { transform: rotate(360deg); } }
@keyframes timeline-flow { to { transform: translate3d(3%,-2%,0) scale(1.06); } }
@keyframes timeline-pulse { 50% { opacity: .45; transform: scaleY(.88); } }
@keyframes vibranium-pulse { 50% { opacity: .74; transform: scale(1.025); } }
@keyframes infinity-orbit { to { transform: rotate(360deg); } }

.template-grid { grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); }
.template-tools { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); }
.template-tools input { flex: 1; max-width: 480px; padding: 11px 13px; border: 1px solid var(--line-2); border-radius: 6px; color: #fff; background: #080506; outline: none; }
.template-tools input:focus { border-color: var(--accent); }
.template-tools span { color: var(--faint); font: 9px/1.3 var(--mono); letter-spacing: .05em; }
.template-tools b, .template-uses b { color: var(--accent); }
.tmpl-card[hidden] { display: none; }
.tmpl-prev--pro { height: 190px; isolation: isolate; background: radial-gradient(circle at 50% 42%, color-mix(in srgb,var(--ta) 34%,transparent), transparent 31%), linear-gradient(145deg,var(--tp1),var(--tp2)); }
.tmpl-prev--pro::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size: 24px 24px; mask-image: linear-gradient(to bottom,#000,transparent); }
.tmpl-art { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .7; }
.tmpl-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent,#050304); }
.tmpl-orbit { position: absolute; width: 125px; height: 125px; border: 1px dashed var(--ta); border-radius: 50%; box-shadow: 0 0 24px color-mix(in srgb,var(--ta) 50%,transparent); animation: spin 12s linear infinite; }
.tmpl-mark { position: absolute; top: 14px; right: 14px; color: var(--ta); font: 700 16px/1 var(--mono); text-shadow: 0 0 12px var(--ta); }
.tmpl-avatar { width: 78px; height: 78px; border: 2px solid var(--ta); border-radius: 50%; background: radial-gradient(circle at 40% 30%,#fff,var(--ta) 8%,var(--tp1) 40%,#050304 72%); box-shadow: 0 0 24px var(--ta); }
.tmpl-prev--pro .tmpl-name { position: absolute; bottom: 30px; max-width: 90%; text-align: center; text-shadow: 0 2px 12px #000,0 0 14px var(--ta); }
.tmpl-prev--pro small { position: absolute; bottom: 11px; color: rgba(255,255,255,.55); font: 7px/1 var(--mono); text-transform: uppercase; letter-spacing: .13em; }

.analytics-primary { grid-template-columns: 2fr 1fr; }
.analytics-days { display: grid; grid-template-columns: repeat(7,1fr); margin: 8px 0 12px; color: var(--faint); font: 8px/1.3 var(--mono); text-align: center; }
.analytics-days span { display: grid; gap: 3px; }
.analytics-days b { color: var(--text); font-size: 10px; }
.analytics-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 13px; }
.analytics-legend span { display: flex; align-items: center; gap: 5px; color: var(--muted); font: 9px/1 var(--mono); text-transform: capitalize; }
.analytics-legend i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 7px var(--accent); }
.analytics-legend .dev-mobile { background: #8a5aff; }.analytics-legend .dev-tablet { background: #42d9d0; }
.analytics-list { display: grid; gap: 6px; }.analytics-empty { padding: 28px; }

/* Paint less, not differently: off-screen landing/catalog regions skip work. */
.land--v2 section:not(.lhero):not(.signal-strip), .lfoot { content-visibility: auto; contain-intrinsic-size: auto 760px; }
.tmpl-card, .badge-card, .usercard { content-visibility: auto; contain-intrinsic-size: auto 360px; }
.social-network-card__art img, .hero-profile__banner img, .bl-card__banner img { image-rendering: auto; }

@media (max-width: 760px), (pointer: coarse) {
  .biolink .bl-card, .biolink .bl-player, .biolink .bl-vol { backdrop-filter: none; }
  .biolink .bl-card { background-color: rgba(9,5,6,.88) !important; }
  .bl-card__body { padding: 0 20px 24px; }
  .layout-split .bl-card__body,.layout-dossier .bl-card__body { display: block; padding-inline: 20px; text-align: center; }
  .layout-split .bl-avatar,.layout-dossier .bl-avatar { margin-top: -42px; }
  .layout-split .bl-badges,.layout-split .bl-socials,.layout-split .bl-meta,.layout-split .bl-actions,.layout-dossier .bl-badges,.layout-dossier .bl-socials,.layout-dossier .bl-meta,.layout-dossier .bl-actions { justify-content: center; }
  .layout-cinematic .bl-card__body,.layout-orbit .bl-card__body,.layout-comic .bl-card__body { padding-inline: 20px; }
  .layout-cinematic .bl-card__banner { height: 154px; }.layout-poster .bl-card__banner { height: 154px; }
  .template-tools { align-items: stretch; flex-direction: column; }
  .template-tools input { max-width: none; }
  .analytics-primary { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .bl-deco,.tmpl-orbit,.bl-card,.bl-theme-art img,.bl-effect-layer,.bl-effect-layer::before,.bl-effect-layer::after,.cust-preview__stage::before,.cust-effect-picker button > i::after { animation: none !important; transition: none !important; }
}

/* ---------- Akusha desktop frame / custom system surfaces ---------- */
.ak-desktop-bar {
  position: fixed; z-index: 10000; inset: 0 0 auto; display: grid; height: 38px;
  grid-template-columns: auto minmax(120px,1fr) auto; align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.075); color: #c9c2c5;
  background: linear-gradient(180deg,#120d0f,#090607); box-shadow: 0 8px 28px rgba(0,0,0,.35);
  -webkit-app-region: drag; user-select: none;
}
.ak-desktop-brand { display: flex; height: 100%; align-items: center; padding: 0 12px; gap: 8px; border-right: 1px solid rgba(255,255,255,.06); }
.ak-desktop-brand img { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; box-shadow: 0 0 12px rgba(239,30,62,.28); }
.ak-desktop-brand span { color: #fff; font: 700 10px/1 var(--display); letter-spacing: .12em; }
.ak-desktop-brand small, .ak-desktop-drag span { color: #5f575a; font: 6px/1 var(--mono); letter-spacing: .14em; }
.ak-desktop-drag { display: flex; justify-content: center; align-items: center; gap: 10px; }
.ak-desktop-drag i { width: 44px; height: 1px; background: linear-gradient(90deg,transparent,#4e121c); }
.ak-desktop-drag i:last-child { transform: scaleX(-1); }
.ak-window-controls { display: flex; height: 100%; -webkit-app-region: no-drag; }
.ak-window-controls button { position: relative; width: 48px; height: 100%; color: #847c80; }
.ak-window-controls button:hover { color: #fff; background: rgba(255,255,255,.06); }
.ak-window-controls button[data-win="close"]:hover { background: #bd1630; }
.ak-window-controls i { position: absolute; inset: 50% auto auto 50%; width: 10px; height: 10px; transform: translate(-50%,-50%); }
.ak-window-controls [data-win="min"] i { height: 1px; border-bottom: 1px solid currentColor; }
.ak-window-controls [data-win="max"] i { border: 1px solid currentColor; }
.ak-window-controls [data-win="close"] i::before, .ak-window-controls [data-win="close"] i::after { content: ''; position: absolute; top: 5px; left: -1px; width: 12px; height: 1px; background: currentColor; transform: rotate(45deg); }
.ak-window-controls [data-win="close"] i::after { transform: rotate(-45deg); }
.ak-desktop-bar.is-maximized .ak-window-controls [data-win="max"] i { box-shadow: -3px 3px 0 -2px #090607, -3px 3px 0 -1px currentColor; }
body.is-desktop #app { height: calc(100dvh - 38px); margin-top: 38px; }
body.is-desktop .shell, body.is-desktop .land, body.is-desktop .auth { height: 100%; min-height: 100%; }
body.is-desktop .land--v2 .lnav { top: 48px; }

.ak-dialog-copy { display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 13px; }
.ak-dialog-copy > i { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(235,39,70,.3); border-radius: 50%; color: #ed3853; background: #1e090d; font: 700 12px/1 var(--mono); font-style: normal; box-shadow: 0 0 20px rgba(229,28,59,.12); }
.ak-dialog-copy p, .ak-dialog-message { color: #aaa2a6; font-size: 12px; line-height: 1.65; }
.btn--danger { background: linear-gradient(145deg,#ef2948,#760817); }
.ak-upload-zone { position: relative; display: grid; min-height: 270px; place-items: center; align-content: center; padding: 28px; gap: 9px; overflow: hidden; border: 1px dashed rgba(238,53,81,.35); border-radius: 8px; outline: 0; background: radial-gradient(circle at 50% 30%,rgba(180,15,43,.12),transparent 45%),#090607; text-align: center; cursor: pointer; }
.ak-upload-zone::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: 24px 24px; mask-image: radial-gradient(circle,#000,transparent 72%); }
.ak-upload-zone.is-dragging { border-color: #ff3654; box-shadow: inset 0 0 45px rgba(241,37,69,.13),0 0 34px rgba(235,32,63,.12); }
.ak-upload-glyph { display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid #7b1727; border-radius: 50%; color: #ed3451; background: #1a080b; font: 300 25px/1 var(--ui); }
.ak-upload-zone b { position: relative; color: #eee9eb; font: 700 11px/1 var(--ui); letter-spacing: .11em; }
.ak-upload-zone span { position: relative; color: #756e72; font-size: 10px; }
.ak-upload-zone small { position: relative; color: #4e474a; font: 6px/1 var(--mono); letter-spacing: .12em; }
.ak-upload-zone .btn { position: relative; width: auto; margin: 8px 0 3px; }
.ak-upload-zone > i { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: #e5213e; transform: scaleX(0); transform-origin: left; }
.ak-upload-zone.is-uploading > i { animation: ak-upload 1.2s ease-in-out infinite; }
@keyframes ak-upload { 0% { transform: scaleX(0); transform-origin: left; } 50% { transform: scaleX(1); transform-origin: left; } 51% { transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; } }

/* ---------- signed-in landing / build trust ---------- */
.lnav__member { display: flex; align-items: center; gap: 7px; }
.lnav__member .av { width: 29px; height: 29px; border: 1px solid rgba(235,42,72,.32); }
.lnav__member > span { display: flex; min-width: 90px; flex-direction: column; color: #d9d3d6; font: 700 9px/1.1 var(--ui); }
.lnav__member small { margin-bottom: 2px; color: #6c6367; font: 5px/1 var(--mono); letter-spacing: .14em; }
.lmember-card { display: flex; max-width: 560px; align-items: center; justify-content: space-between; margin: 25px 0 17px; padding: 11px; border: 1px solid rgba(233,43,72,.22); border-radius: 7px; background: linear-gradient(90deg,rgba(111,8,25,.28),rgba(255,255,255,.018)); box-shadow: inset 2px 0 #e62543; }
.lmember-card > div { display: flex; align-items: center; gap: 10px; }
.lmember-card > div > span { display: flex; flex-direction: column; }
.lmember-card small { color: #d4304b; font: 6px/1 var(--mono); letter-spacing: .13em; }
.lmember-card b { margin-top: 3px; color: #fff; font: 700 12px/1.2 var(--ui); }
.lmember-card em { margin-top: 2px; color: #766e72; font: 8px/1.2 var(--mono); font-style: normal; }
.lmember-card > i { color: #8c7f84; font: 6px/1 var(--mono); font-style: normal; letter-spacing: .09em; }
.lmember-card--footer { max-width: 610px; margin-inline: auto; }
.lmember-card--footer .btn { width: auto; margin: 0; }
.ltrust { display: grid; width: min(1240px,calc(100% - 60px)); grid-template-columns: .8fr 1.2fr; align-items: center; margin: 0 auto; padding: 110px 0; gap: 75px; }
.ltrust__copy h2 { margin: 14px 0 20px; font: 700 clamp(39px,5vw,68px)/.98 var(--ui); letter-spacing: -.05em; }
.ltrust__copy h2 span { color: #a8a0a4; }
.ltrust__copy > p:not(.section-code) { max-width: 540px; color: #777074; font-size: 12px; line-height: 1.75; }
.ltrust__actions { display: flex; margin-top: 25px; gap: 9px; }
.ltrust__actions .btn { width: auto; }
.ltrust__terminal { overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; background: #090607; box-shadow: 0 30px 90px rgba(0,0,0,.5),0 0 50px rgba(174,8,35,.1); }
.ltrust__terminal header { display: flex; align-items: center; padding: 11px 13px; gap: 5px; border-bottom: 1px solid rgba(255,255,255,.07); background: #0e0a0b; }
.ltrust__terminal header i { width: 6px; height: 6px; border-radius: 50%; background: #6e1826; }
.ltrust__terminal header span { margin-left: auto; color: #665e62; font: 6px/1 var(--mono); letter-spacing: .14em; }
.ltrust__status { display: flex; align-items: center; padding: 22px; gap: 16px; border-bottom: 1px solid rgba(255,255,255,.06); background: linear-gradient(90deg,rgba(24,129,91,.1),transparent); }
.ltrust__status > b { color: #5ed4a7; font: 700 26px/1 var(--display); }
.ltrust__status span { display: flex; flex-direction: column; }
.ltrust__status strong { color: #7de1bb; font: 700 8px/1 var(--mono); letter-spacing: .1em; }
.ltrust__status small { margin-top: 5px; color: #645d60; font-size: 8px; }
.ltrust__terminal code { display: block; min-height: 90px; padding: 17px 20px; overflow-wrap: anywhere; color: #a59da1; background: #060405; font: 7px/1.8 var(--mono); white-space: pre-wrap; }
.ltrust__terminal footer { display: flex; justify-content: space-between; padding: 12px 15px; gap: 12px; border-top: 1px solid rgba(255,255,255,.06); color: #554d51; font: 6px/1.4 var(--mono); }
.ltrust__terminal footer a { color: #d44158; }

/* ---------- profile studio ---------- */
.cust-page { max-width: 1440px; }
.cust-intro { display: flex; min-height: 135px; align-items: center; justify-content: space-between; padding: 24px 27px; gap: 30px; overflow: hidden; border: 1px solid rgba(238,43,73,.17); border-radius: 8px; background: radial-gradient(circle at 90% 20%,rgba(195,12,43,.18),transparent 28%),linear-gradient(145deg,#140b0e,#0b0708); }
.cust-intro span { color: #b62b41; font: 7px/1 var(--mono); letter-spacing: .15em; }
.cust-intro h2 { margin: 8px 0 5px; font: 700 25px/1 var(--ui); }
.cust-intro p { color: #6c6569; font-size: 10px; }
.cust-health { width: min(260px,32%); padding: 13px; border-left: 1px solid rgba(255,255,255,.08); }
.cust-health b, .cust-health small { display: block; }
.cust-health b { color: #e7dfe2; font: 700 8px/1 var(--mono); letter-spacing: .1em; }
.cust-health small { margin: 5px 0 9px; color: #625a5e; font-size: 8px; }
.cust-health > i { display: block; height: 3px; overflow: hidden; background: #24070d; }
.cust-health em { display: block; height: 100%; background: linear-gradient(90deg,#8b0b20,#f02c4a); box-shadow: 0 0 9px #e62240; }
.cust-tabs { position: sticky; z-index: 5; top: 0; display: grid; grid-template-columns: repeat(7,1fr); margin: 14px 0; border: 1px solid rgba(255,255,255,.075); border-radius: 7px; overflow: hidden; background: rgba(9,6,7,.94); backdrop-filter: blur(12px); }
.cust-tabs button { display: flex; min-height: 47px; align-items: center; justify-content: center; gap: 7px; border-right: 1px solid rgba(255,255,255,.055); color: #686064; font: 700 9px/1 var(--ui); letter-spacing: .05em; }
.cust-tabs button:last-child { border-right: 0; }
.cust-tabs button i { color: #4e1e27; font: 6px/1 var(--mono); font-style: normal; }
.cust-tabs button:hover { color: #b9b1b5; background: rgba(255,255,255,.02); }
.cust-tabs button.on { color: #fff; background: linear-gradient(180deg,rgba(143,9,31,.42),rgba(92,6,21,.2)); box-shadow: inset 0 -2px #e62442; }
.cust-tabs button.on i { color: #ef435e; }
.cust-studio-grid { display: grid; grid-template-columns: minmax(0,1fr) 400px; align-items: start; gap: 16px; }
.cust-controls { min-width: 0; }
.cust-panel { display: none; animation: ak-panel-in .18s ease; }
.cust-panel.on { display: block; }
@keyframes ak-panel-in { from { opacity: 0; transform: translateY(5px); } }
.cust-panel .cust-h { margin-top: 5px; color: #ddd6d9; font-size: 13px; }
.cust-panel .cust-sec, .cust-panel .cust-assets { min-height: 250px; }
.cust-save-state { display: inline-flex; align-items: center; margin-right: 3px; gap: 5px; color: #655e61; font: 6px/1 var(--mono); letter-spacing: .09em; }
.cust-save-state i { width: 5px; height: 5px; border-radius: 50%; background: #3cb875; }
.cust-save-state.dirty { color: #c99840; }.cust-save-state.dirty i { background: #e8a532; }
.cust-save-state.saving i { background: #e32b48; animation: live-blink .8s infinite; }.cust-save-state.error { color: #e44a60; }.cust-save-state.error i { background: #e42d49; }
.cust-assets { grid-template-columns: repeat(2,minmax(0,1fr)); }
.cust-asset { min-width: 0; padding: 13px; border: 1px solid rgba(255,255,255,.07); border-radius: 7px; background: rgba(255,255,255,.015); }
.cust-asset label { display: flex; justify-content: space-between; }
.cust-asset label span { color: #4dac7d; font: 6px/1 var(--mono); }
.cust-asset__box { position: relative; height: 142px; border-radius: 6px; background-color: #090607; background-size: cover; background-position: center; }
.cust-asset__box.has-file svg { display: none; }
.cust-asset__box > b { position: relative; z-index: 2; padding: 6px; border: 1px solid rgba(255,255,255,.1); border-radius: 3px; color: #d3cbcf; background: rgba(0,0,0,.55); font: 7px/1 var(--mono); }
.cust-asset__box.is-dragging { border-color: #e92b48; box-shadow: inset 0 0 28px rgba(233,39,70,.16); }
.cust-upload-state { position: absolute; inset: auto 0 0; height: 2px; overflow: hidden; }
.cust-asset__actions { display: flex; margin-top: 8px; gap: 6px; }
.cust-asset__actions .btn { width: auto; flex: 1; padding: 8px 10px; font-size: 8px; }
.cust-clear { padding: 0 9px; border: 1px solid rgba(255,255,255,.07); border-radius: 5px; color: #756d71; font-size: 8px; }
.cust-clear:hover:not(:disabled) { color: #ff526a; border-color: rgba(240,47,77,.3); }.cust-clear:disabled { opacity: .3; cursor: default; }
.cust-page select { appearance: none; background-image: linear-gradient(45deg,transparent 50%,#6b6266 50%),linear-gradient(135deg,#6b6266 50%,transparent 50%); background-position: calc(100% - 15px) 50%,calc(100% - 10px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
.cust-preview { position: sticky; top: 62px; overflow: hidden; border: 1px solid rgba(255,255,255,.085); border-radius: 8px; background: #0b0708; box-shadow: 0 25px 65px rgba(0,0,0,.32); }
.cust-preview > header { display: flex; height: 42px; align-items: center; justify-content: space-between; padding: 0 11px; border-bottom: 1px solid rgba(255,255,255,.065); }
.cust-preview > header > span { display: flex; align-items: center; gap: 6px; color: #777074; font: 6px/1 var(--mono); letter-spacing: .13em; }
.cust-preview > header > span i { width: 5px; height: 5px; border-radius: 50%; background: #42c77e; box-shadow: 0 0 8px #42c77e; }
.cust-preview > header div { display: flex; gap: 2px; }.cust-preview > header button { width: 27px; height: 25px; border-radius: 3px; color: #5c5558; font-size: 12px; }.cust-preview > header button.on { color: #fff; background: #321018; }
.cust-preview__stage { --preview-accent:#ff2233; position: relative; display: grid; height: 485px; place-items: center; overflow: hidden; background-size: cover; background-position: center; perspective: 900px; transition: .2s; }
.cust-preview__stage::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(rgba(3,1,2,.08),rgba(3,1,2,.5)); }
.cust-preview__stage.is-mobile { width: 245px; margin-inline: auto; border-inline: 1px solid rgba(255,255,255,.07); }
.cust-preview__orb { position: absolute; z-index: 1; width: 220px; height: 220px; border: 1px solid color-mix(in srgb,var(--preview-accent) 38%,transparent); border-radius: 50%; transform: rotateX(67deg); box-shadow: 0 0 40px color-mix(in srgb,var(--preview-accent) 20%,transparent); animation: spin 18s linear infinite; }
.cust-preview__orb.two { width: 280px; height: 170px; animation-direction: reverse; }
.cust-preview__card { position: relative; z-index: 2; width: 275px; overflow: hidden; border: 1px solid rgba(255,255,255,.15); border-radius: 15px; background: rgba(12,7,9,.66); box-shadow: 0 25px 70px rgba(0,0,0,.6),0 0 30px color-mix(in srgb,var(--preview-accent) 20%,transparent); backdrop-filter: blur(7px); transition: width .2s,border-radius .2s,transform .2s; transform: rotateX(2deg) rotateY(-3deg); }
.cust-preview__card[data-frame="chrome"] { border: 2px double #dfe4ec; }.cust-preview__card[data-frame="gold"] { border: 2px solid #e7bb55; }.cust-preview__card[data-frame="crimson"],.cust-preview__card[data-frame="chaos"] { border: 2px solid #ef2345; box-shadow: 0 0 33px rgba(238,28,63,.5),0 25px 70px #000; }.cust-preview__card[data-frame="vibranium"],.cust-preview__card[data-frame="infinity"] { border: 2px solid #9f72ff; box-shadow: 0 0 33px rgba(139,88,255,.5),0 25px 70px #000; }
.cust-preview__banner { height: 83px; overflow: hidden; }.cust-preview__banner img { width: 100%; height: 100%; object-fit: cover; }
.cust-preview__body { padding: 0 20px 17px; text-align: center; }
.cust-preview__avatar { position: relative; width: 70px; height: 70px; margin: -35px auto 7px; }
.cust-preview__avatar img { position: relative; z-index: 2; width: 70px; height: 70px; object-fit: cover; border: 3px solid #100a0c; border-radius: 50%; background: #100a0c; }
.cust-preview__avatar img[data-shape="square"] { border-radius: 12px; }.cust-preview__avatar img[data-shape="hex"] { border-radius: 0; clip-path: polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%); }.cust-preview__avatar img[data-shape="diamond"] { border-radius: 10px; clip-path: polygon(50% 0,100% 50%,50% 100%,0 50%); }
#cust-preview-deco:not([data-deco="none"]) { position: absolute; z-index: 1; inset: -6px; border: 2px dashed var(--preview-accent); border-radius: 50%; box-shadow: 0 0 15px var(--preview-accent); animation: spin 8s linear infinite; }
#cust-preview-deco[data-deco="scarlet-crown"],#cust-preview-deco[data-deco="loki-crown"],#cust-preview-deco[data-deco="storm-crown"],#cust-preview-deco[data-deco="panther-crown"] { inset: -8px; border-style: solid; animation: relic-float 4s ease-in-out infinite; }
#cust-preview-deco[data-deco="scarlet-crown"]::before { content: ''; position: absolute; top: -16px; left: 16%; width: 68%; height: 29px; clip-path: polygon(0 100%,7% 34%,28% 68%,50% 0,72% 68%,93% 34%,100% 100%); background: linear-gradient(#ff9fb5,#ee1745 45%,#56000f); filter: drop-shadow(0 0 6px #ff315d); }
#cust-preview-deco[data-deco="loki-crown"] { border-color: #d6ae47; box-shadow: 0 0 15px #38ce7d; }
#cust-preview-deco[data-deco="loki-crown"]::before,#cust-preview-deco[data-deco="loki-crown"]::after { content: ''; position: absolute; top: -25px; width: 27px; height: 43px; background: linear-gradient(90deg,#6f4811,#f8dd7b,#60400d); clip-path: polygon(75% 100%,20% 76%,0 8%,30% 36%,100% 72%); }
#cust-preview-deco[data-deco="loki-crown"]::before { left: 0; }#cust-preview-deco[data-deco="loki-crown"]::after { right: 0; transform: scaleX(-1); }
#cust-preview-deco[data-deco="storm-crown"] { border-color: #acd9ff; box-shadow: 0 0 16px #69aefb; }#cust-preview-deco[data-deco="storm-crown"]::before { content: ''; position: absolute; top: -18px; left: 25%; width: 50%; height: 35px; clip-path: polygon(45% 0,85% 0,60% 38%,90% 38%,20% 100%,42% 56%,8% 56%); background: #e8f7ff; filter: drop-shadow(0 0 7px #79baff); }
#cust-preview-deco[data-deco="panther-crown"] { border-color: #a578ff; box-shadow: 0 0 16px #8d54ee; }#cust-preview-deco[data-deco="panther-crown"]::before { content: ''; position: absolute; top: -18px; left: 9%; width: 82%; height: 29px; clip-path: polygon(0 90%,6% 0,29% 45%,50% 15%,71% 45%,94% 0,100% 90%,50% 76%); background: linear-gradient(#d9c6ff,#8244e8,#2e1057); }
#cust-preview-deco[data-deco="iron-halo"] { border: 2px solid #f2cc5a; background: repeating-conic-gradient(#5ceaff 0 7deg,transparent 7deg 20deg); box-shadow: 0 0 17px #55e7ff; }
#cust-preview-deco[data-deco="mystic-mandala"] { inset: -10px; border: 2px dotted #5aebdb; background: repeating-conic-gradient(#ff7842 0 2deg,transparent 2deg 17deg); box-shadow: 0 0 16px #4de1d1; }
#cust-preview-name { display: block; color: #fff; font: 700 17px/1.1 var(--ui); text-shadow: 0 0 12px var(--preview-accent); }
#cust-preview-name[data-fx="gradient"],#cust-preview-name[data-fx="chrome"],#cust-preview-name[data-fx="rainbow"] { background: linear-gradient(90deg,#fff,var(--preview-accent),#fff); background-clip: text; color: transparent; }
#cust-preview-handle { display: block; margin-top: 3px; color: #756d71; font: 6px/1 var(--mono); }
#cust-preview-bio { min-height: 30px; margin: 10px 0; color: #b0a8ac; font-size: 8px; line-height: 1.45; }
.cust-preview__socials { display: flex; justify-content: center; gap: 6px; }.cust-preview__socials i { width: 21px; height: 21px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; background: rgba(255,255,255,.045); }
.cust-preview__body footer { display: flex; justify-content: space-between; margin-top: 12px; color: #585155; font: 5px/1 var(--mono); }.cust-preview__body footer em { font-style: normal; }
.cust-preview__meta { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid rgba(255,255,255,.065); border-bottom: 1px solid rgba(255,255,255,.065); }.cust-preview__meta div { padding: 10px; border-right: 1px solid rgba(255,255,255,.055); }.cust-preview__meta div:last-child { border-right: 0; }.cust-preview__meta span,.cust-preview__meta b { display: block; }.cust-preview__meta span { color: #4d4649; font: 5px/1 var(--mono); letter-spacing: .1em; }.cust-preview__meta b { margin-top: 4px; overflow: hidden; color: #a69ea2; font: 7px/1 var(--ui); text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
.cust-preview > p { display: flex; align-items: center; padding: 11px; gap: 6px; color: #514a4e; font-size: 7px; }.cust-preview > p i { width: 5px; height: 5px; border-radius: 50%; background: #bc2b42; }

.cust-relic-picker { grid-column: 1/-1; padding-top: 4px; }
.cust-relic-picker > label { display: block; color: #d8d1d4; font: 700 10px/1 var(--ui); text-transform: uppercase; letter-spacing: .11em; }
.cust-relic-picker > p { margin: 6px 0 12px; color: #71696d; font-size: 11px; }
.cust-relic-picker > div { display: grid; grid-template-columns: repeat(3,minmax(82px,1fr)); gap: 7px; }
.cust-relic-picker button { display: grid; min-height: 86px; place-items: center; align-content: center; gap: 7px; border: 1px solid rgba(255,255,255,.075); border-radius: 6px; color: #8a8186; background: #0c0809; transition: border-color .15s,color .15s,transform .15s,background .15s; }
.cust-relic-picker button:hover,.cust-relic-picker button.on { transform: translateY(-2px); border-color: var(--accent); color: #fff; background: rgba(110,10,27,.2); box-shadow: 0 9px 22px rgba(0,0,0,.28),0 0 16px rgba(235,31,62,.11); }
.cust-relic-picker button i { position: relative; display: block; width: 38px; height: 32px; }
.cust-relic-picker button span { font: 600 7px/1.1 var(--ui); text-align: center; }
.relic-scarlet-crown i { clip-path: polygon(0 100%,8% 34%,28% 68%,50% 0,72% 68%,92% 34%,100% 100%); background: linear-gradient(#ff98b0,#e31b45,#52000d); filter: drop-shadow(0 0 5px #ff315d); }
.relic-loki-crown i::before,.relic-loki-crown i::after { content: ''; position: absolute; top: 0; width: 20px; height: 32px; background: linear-gradient(90deg,#755017,#f1d269,#58400f); clip-path: polygon(80% 100%,25% 80%,0 0,35% 43%,100% 75%); }.relic-loki-crown i::before { left: 0; }.relic-loki-crown i::after { right: 0; transform: scaleX(-1); }
.relic-storm-crown i { clip-path: polygon(46% 0,82% 0,59% 37%,91% 37%,19% 100%,42% 55%,9% 55%); background: #dff3ff; filter: drop-shadow(0 0 6px #6bafff); }
.relic-panther-crown i { clip-path: polygon(0 92%,7% 0,29% 42%,50% 14%,71% 42%,93% 0,100% 92%,50% 76%); background: linear-gradient(#d7c1ff,#8149e5,#2c0e53); filter: drop-shadow(0 0 5px #9e68ff); }
.relic-iron-halo i,.relic-mystic-mandala i { border: 2px solid #f0c64e; border-radius: 50%; background: repeating-conic-gradient(#56eaff 0 8deg,transparent 8deg 22deg); box-shadow: 0 0 9px #53e6ff; }.relic-mystic-mandala i { border-style: dotted; border-color: #53e5d4; background: repeating-conic-gradient(#ff7540 0 3deg,transparent 3deg 19deg); box-shadow: 0 0 9px #4de0d0; }

/* Visual pickers expose the composition/effect language before saving. */
.cust-layout-picker,.cust-effect-picker { grid-column: 1/-1; padding-top: 4px; }
.cust-layout-picker > label,.cust-effect-picker > label { display: block; color: #d8d1d4; font: 700 10px/1 var(--ui); text-transform: uppercase; letter-spacing: .11em; }
.cust-layout-picker > p,.cust-effect-picker > p { margin: 6px 0 12px; color: #71696d; font-size: 11px; }
.cust-layout-picker > div,.cust-effect-picker > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.cust-layout-picker button,.cust-effect-picker button { display: flex; min-width: 0; min-height: 74px; align-items: center; padding: 10px; gap: 11px; border: 1px solid rgba(255,255,255,.075); border-radius: 7px; color: #9b9297; background: linear-gradient(135deg,#0e090b,#090607); text-align: left; transition: border-color .15s,color .15s,transform .15s,box-shadow .15s; }
.cust-layout-picker button:hover,.cust-layout-picker button.on,.cust-effect-picker button:hover,.cust-effect-picker button.on { transform: translateY(-2px); border-color: var(--accent); color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.32),0 0 18px rgba(234,34,66,.12); }
.cust-layout-picker button > span,.cust-effect-picker button > span { min-width: 0; font: 700 8px/1.15 var(--ui); text-transform: uppercase; letter-spacing: .05em; }
.cust-layout-picker button small,.cust-effect-picker button small { display: block; overflow: hidden; margin-top: 5px; color: #625b5e; font: 6px/1 var(--mono); text-transform: none; text-overflow: ellipsis; white-space: nowrap; }
.cust-layout-picker button.on small,.cust-effect-picker button.on small { color: #a2999d; }
[data-layout-glyph] { position: relative; display: block; width: 49px; height: 41px; flex: none; overflow: hidden; border: 1px solid #3b3337; border-radius: 4px; background: #080506; box-shadow: inset 0 0 12px rgba(0,0,0,.6); }
[data-layout-glyph] b { position: absolute; display: block; border: 1px solid #b52b43; border-radius: 2px; background: rgba(211,34,65,.2); }
[data-layout-glyph] b:nth-child(1) { left: 12px; top: 5px; width: 23px; height: 7px; }[data-layout-glyph] b:nth-child(2) { left: 17px; top: 16px; width: 13px; height: 13px; border-radius: 50%; }[data-layout-glyph] b:nth-child(3) { left: 10px; bottom: 5px; width: 27px; height: 3px; }
[data-layout-glyph="wide"] b:nth-child(1),[data-layout-glyph="cinematic"] b:nth-child(1) { left: 4px; width: 39px; height: 10px; }[data-layout-glyph="wide"] b:nth-child(2) { left: 18px; top: 18px; }[data-layout-glyph="split"] b:nth-child(2),[data-layout-glyph="dossier"] b:nth-child(2) { left: 7px; top: 16px; }[data-layout-glyph="split"] b:nth-child(3),[data-layout-glyph="dossier"] b:nth-child(3) { left: 24px; bottom: 9px; width: 18px; height: 11px; }
[data-layout-glyph="terminal"] { border-radius: 0; }[data-layout-glyph="terminal"] b { border-color: #4abf79; background: rgba(74,191,121,.16); }[data-layout-glyph="shrine"] b:nth-child(1) { clip-path: polygon(0 0,100% 0,80% 100%,20% 100%); height: 12px; }[data-layout-glyph="poster"] { width: 34px; margin-inline: 7px; }[data-layout-glyph="orbit"] { border-radius: 13px; }[data-layout-glyph="orbit"] b:nth-child(1) { border-radius: 50%; }[data-layout-glyph="cinematic"] b:nth-child(1) { height: 14px; }[data-layout-glyph="comic"] { transform: rotate(-2deg); border-width: 2px; }
.cust-effect-picker button > i { position: relative; display: block; width: 45px; height: 45px; flex: none; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: radial-gradient(circle,#e3304b,#23040a 46%,#060405 70%); box-shadow: 0 0 13px rgba(227,38,71,.18); }
.cust-effect-picker button > i::before,.cust-effect-picker button > i::after { content: ''; position: absolute; inset: 6px; border: 1px dashed rgba(255,255,255,.46); border-radius: 50%; }
.cust-effect-picker button > i::after { inset: 13px; animation: scene-spin 7s linear infinite reverse; }
.fx-choice-darkhold > i { background: url('/themes/darkhold-grimoire.jpg') center/cover !important; }.fx-choice-darkhold > i::before { border-color: #ff3a62 !important; box-shadow: 0 0 9px #e32248; }
.fx-choice-chaos > i { background: repeating-conic-gradient(#ff315b 0 5deg,#220007 5deg 22deg) !important; }.fx-choice-reactor > i { background: radial-gradient(circle,#fff 0 8%,#63ecff 9% 20%,#4b180f 21% 37%,#dfb840 38% 42%,#071015 43%) !important; }.fx-choice-reactor > i::before { border-style: solid; border-color: #6bedff; }
.fx-choice-webs > i { background: repeating-conic-gradient(#6eabff 0 1deg,transparent 1deg 18deg),repeating-radial-gradient(circle,#09152b 0 6px,#77b0ff 7px 8px) !important; }.fx-choice-symbiote > i { background: radial-gradient(ellipse at 35% 28%,#dce5ef,#12151b 8%,#000 58%,#d8e2ed 60%,#050506 67%) !important; }
.fx-choice-mystic > i,.fx-choice-timeline > i,.fx-choice-cosmic > i,.fx-choice-infinity > i { background: url('/themes/multiverse-rift.jpg') center/cover !important; }.fx-choice-timeline > i::before { border-color: #80f0ad; }.fx-choice-lightning > i { background: linear-gradient(120deg,#081327 36%,#e5f6ff 37% 43%,#5a9ef2 44% 49%,#071125 50%) !important; }.fx-choice-vibranium > i { border-radius: 9px !important; background: repeating-conic-gradient(#9c6cf5 0 3deg,#190c35 3deg 30deg) !important; }.fx-choice-embers > i { background: radial-gradient(circle at 50% 80%,#fff4ac,#ff9e24 13%,#f1350f 28%,#170306 62%) !important; }.fx-choice-nighttime > i { background: radial-gradient(circle at 68% 26%,#fff 0 7%,#a8b3cb 8% 12%,transparent 13%),#060a18 !important; }.fx-choice-radar > i { background: conic-gradient(#27050a 0 320deg,#ff3655 350deg,#27050a 360deg) !important; }

.cust-preview__card[data-layout="poster"] { width: 224px; border-radius: 4px; transform: rotate(-1deg); }.cust-preview__card[data-layout="poster"] .cust-preview__banner { height: 112px; }
.cust-preview__card[data-layout="orbit"] { width: 300px; border-radius: 31px; }.cust-preview__card[data-layout="orbit"] .cust-preview__banner { clip-path: ellipse(78% 77% at 50% 10%); }
.cust-preview__card[data-layout="dossier"] { width: 340px; border-radius: 5px; }.cust-preview__card[data-layout="cinematic"] { width: 360px; }.cust-preview__card[data-layout="cinematic"] .cust-preview__banner { height: 115px; }
.cust-preview__card[data-layout="comic"] { width: 315px; border-width: 3px; border-radius: 2px; clip-path: polygon(0 0,97% 0,100% 5%,100% 95%,96% 100%,3% 100%,0 96%); transform: rotate(1deg); box-shadow: 7px 7px 0 color-mix(in srgb,var(--preview-accent) 32%,#000),0 20px 55px #000; }

.cust-preview__stage::before { content: ''; position: absolute; z-index: 1; inset: 0; pointer-events: none; opacity: 0; }
.cust-preview__stage[data-effect="nighttime"]::before { opacity: .9; background: radial-gradient(circle at 82% 13%,#fff 0 6px,#9ba7bf 7px 9px,transparent 10px),radial-gradient(circle at 15% 25%,#fff 0 1px,transparent 2px),radial-gradient(circle at 70% 62%,#fff 0 1px,transparent 2px); }
.cust-preview__stage[data-effect="chaos"]::before { inset: 8%; opacity: .35; background: repeating-conic-gradient(#f32650 0 2deg,transparent 2deg 18deg); clip-path: polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); animation: scene-spin 20s linear infinite; }
.cust-preview__stage[data-effect="webs"]::before { opacity: .28; background: repeating-radial-gradient(circle,transparent 0 34px,#83b7ff 35px 36px),repeating-conic-gradient(transparent 0 14deg,#83b7ff 14deg 15deg); }
.cust-preview__stage[data-effect="mystic"]::before { inset: 14%; opacity: .4; border: 1px dashed #57e7d7; border-radius: 50%; background: repeating-conic-gradient(#ff7540 0 2deg,transparent 2deg 17deg); animation: scene-spin 22s linear infinite; }
.cust-preview__stage[data-effect="lightning"]::before { left: 12%; width: 17%; height: 75%; opacity: .8; clip-path: polygon(45% 0,90% 0,61% 42%,92% 42%,10% 100%,38% 55%,0 55%); background: #d9eeff; filter: drop-shadow(0 0 7px #75b8ff); animation: lightning-strike 5.5s steps(1) infinite; }
.cust-preview__stage[data-effect="embers"]::before { opacity: .8; background: radial-gradient(circle at 12% 90%,#ffc55b 0 2px,transparent 3px),radial-gradient(circle at 38% 78%,#ff6325 0 1px,transparent 2px),radial-gradient(circle at 72% 92%,#ffd77d 0 2px,transparent 3px); animation: ember-rise 5s ease-in-out infinite; }
.cust-preview__stage[data-effect="radar"]::before { opacity: .45; background: conic-gradient(transparent 0 320deg,rgba(255,39,69,.5) 359deg,transparent 360deg); animation: scene-spin 7s linear infinite; }
.cust-preview__stage[data-effect="darkhold"]::before { opacity: .82; background: linear-gradient(rgba(9,0,2,.13),rgba(4,0,1,.68)),url('/themes/darkhold-grimoire.jpg') center/cover; }
.cust-preview__stage[data-effect="reactor"]::before { inset: 10%; opacity: .72; border: 1px solid #6beaff; border-radius: 50%; background: repeating-conic-gradient(#ebc657 0 3deg,transparent 3deg 18deg),radial-gradient(circle,#fff 0 4%,#5ae9ff 5% 9%,transparent 10%); box-shadow: 0 0 30px #39cfe7; animation: reactor-core 16s linear infinite; }
.cust-preview__stage[data-effect="timeline"]::before { opacity: .7; background: linear-gradient(175deg,transparent 46%,#eace66 49%,#76efaa 50%,transparent 54%),linear-gradient(rgba(1,9,5,.34),rgba(1,5,3,.65)),url('/themes/multiverse-rift.jpg') center/cover; animation: timeline-flow 8s ease-in-out infinite alternate; }
.cust-preview__stage[data-effect="vibranium"]::before { opacity: .45; background: repeating-conic-gradient(from 0deg,#a575fa 0 1deg,transparent 1deg 30deg); animation: vibranium-pulse 6s ease-in-out infinite; }
.cust-preview__stage[data-effect="cosmic"]::before,.cust-preview__stage[data-effect="infinity"]::before { opacity: .66; background: linear-gradient(rgba(1,1,7,.1),rgba(1,1,7,.58)),url('/themes/multiverse-rift.jpg') center/cover; }.cust-preview__stage[data-effect="infinity"]::before { box-shadow: inset 0 0 50px #8a5cff; }

.vs-upload-card { display: flex; width: 100%; min-height: 82px; align-items: center; padding: 14px; gap: 12px; border: 1px dashed rgba(237,44,73,.34); border-radius: 7px; color: #c8c0c4; background: linear-gradient(135deg,rgba(126,8,26,.14),rgba(255,255,255,.018)); text-align: left; transition: border-color .15s,background .15s,transform .15s; }
.vs-upload-card:hover { transform: translateY(-1px); border-color: var(--accent); background: rgba(126,8,26,.22); }.vs-upload-card > i { display: grid; width: 38px; height: 38px; flex: none; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; color: #f13b56; font-style: normal; font-size: 20px; }.vs-upload-card b,.vs-upload-card small { display: block; }.vs-upload-card small { margin-top: 4px; color: #71696d; font-size: 10px; }

/* ---------- adaptive rendering tiers ---------- */
html.ak-paused *, html.ak-paused *::before, html.ak-paused *::after { animation-play-state: paused !important; }
html[data-ak-quality="balanced"] .land-aurora i { filter: blur(80px); }
html[data-ak-quality="balanced"] .ak-cursor { width: 120px; height: 120px; }
html[data-ak-quality="lite"] .ak-cursor, html[data-ak-quality="lite"] .hero-shard, html[data-ak-quality="lite"] .hero-orbit--two, html[data-ak-quality="lite"] .cust-preview__orb.two, html[data-ak-quality="lite"] .bl-effect-layer { display: none; }
html[data-ak-quality="lite"] .land-aurora i, html[data-ak-quality="lite"] .hero-orbit, html[data-ak-quality="lite"] .hero-float, html[data-ak-quality="lite"] .bl-deco, html[data-ak-quality="lite"] .cust-preview__orb { animation: none !important; }
html[data-ak-quality="lite"] .topbar, html[data-ak-quality="lite"] .rail, html[data-ak-quality="lite"] .modal-layer, html[data-ak-quality="lite"] .cust-tabs, html[data-ak-quality="lite"] .cust-preview__card { backdrop-filter: none !important; }
html[data-ak-quality="lite"] .bl-bg-overlay { backdrop-filter: none !important; }
/* Preserve the selected profile artwork in every quality tier.  Lite mode only
   sheds continuous animation and expensive backdrop sampling, never the scene. */
html[data-ak-quality="lite"] .bl-theme-art { display:block; opacity:.82; }
html[data-ak-quality="balanced"] .bl-card { backdrop-filter:blur(min(10px,var(--card-blur,14px))) saturate(1.08); }
html.ak-paused *,html.ak-paused *::before,html.ak-paused *::after { animation-play-state:paused !important; }

@media (max-width: 1180px) {
  .cust-studio-grid { grid-template-columns: minmax(0,1fr) 330px; }
  .cust-preview__stage { height: 450px; }
}
@media (max-width: 980px) {
  .ltrust { grid-template-columns: 1fr; gap: 35px; }
  .cust-studio-grid { grid-template-columns: 1fr; }
  .cust-preview { position: relative; top: 0; }
  .cust-preview__stage { height: 460px; }
  .cust-tabs { grid-template-columns: repeat(4,1fr); position: relative; }
}
@media (max-width: 620px) {
  .ak-desktop-drag span, .ak-desktop-brand small { display: none; }
  .ak-window-controls button { width: 40px; }
  .cust-intro { align-items: flex-start; flex-direction: column; }
  .cust-health { width: 100%; }
  .cust-tabs { grid-template-columns: repeat(3,1fr); }
  .cust-tabs button { min-height: 42px; }
  .cust-assets { grid-template-columns: 1fr; }
  .cust-relic-picker > div { grid-template-columns: repeat(2,1fr); }
  .cust-layout-picker > div,.cust-effect-picker > div { grid-template-columns: 1fr; }
  .cust-save-state, #cust-ai { display: none; }
  .ltrust { width: calc(100% - 26px); padding: 75px 0; }
  .ltrust__actions, .ltrust__terminal footer { align-items: stretch; flex-direction: column; }
  .lmember-card { align-items: flex-start; flex-direction: column; gap: 10px; }
  .lnav__member > span { display: none; }
}

/* ---------- Social message depth: unread, replies, pins and media ---------- */
.chan__unread { min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; color: #aaa2a6; background: #2b2528; font: 700 7px/17px var(--mono); text-align: center; }
.chan__unread.mention { color: #fff; background: #d91e3a; box-shadow: 0 0 12px rgba(223,29,60,.32); }
#channel-pins { color: #756e71; font: 700 17px/1 var(--ui); }
.reply-bar { display: none; min-height: 29px; align-items: center; justify-content: space-between; margin: 0 0 -2px; padding: 5px 8px 7px 11px; border: 1px solid rgba(255,255,255,.08); border-bottom: 0; border-radius: 6px 6px 0 0; color: #71696d; background: #100b0d; font-size: 8px; }
.reply-bar.on { display: flex; }.reply-bar b { color: #db3a53; }.reply-bar button { display: grid; width: 23px; height: 20px; place-items: center; color: #71696d; }
.reply-bar.on + .composer__box { border-radius: 0 0 7px 7px; }
.msg__reply-source { display: grid; max-width: 100%; grid-template-columns: 18px auto minmax(0,1fr); align-items: center; margin: 0 0 4px; gap: 5px; color: #5e575a; text-align: left; }
.msg__reply-source i { width: 16px; height: 11px; border-top: 1px solid #3f393c; border-left: 1px solid #3f393c; border-radius: 5px 0 0; }
.msg__reply-source b { color: #8f878b; font-size: 8px; }.msg__reply-source span { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.pinned-mark { padding: 2px 4px; border: 1px solid rgba(224,39,67,.18); border-radius: 2px; color: #b42c41; font: 5px/1 var(--mono); font-style: normal; letter-spacing: .08em; }
.msg.is-flashed { animation: msg-flash 1.2s ease; }
@keyframes msg-flash { 20% { background: rgba(224,31,62,.15); box-shadow: inset 2px 0 #df2340; } }
.pinned-list { display: grid; gap: 2px; }.pinned-list article { display: grid; grid-template-columns: 35px 1fr; padding: 11px; gap: 9px; border: 1px solid rgba(255,255,255,.06); border-radius: 5px; background: rgba(255,255,255,.018); }.pinned-list article header { display: flex; align-items: center; gap: 7px; }.pinned-list article header b { font-size: 10px; }.pinned-list article time { color: #534c4f; font-size: 6px; }.pinned-list article p { margin-top: 4px; color: #a39b9f; font-size: 9px; line-height: 1.5; }
.msg-attachment { position: relative; display: block; width: min(480px,100%); margin-top: 7px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 6px; background: #060405; }
.msg-attachment img { display: block; width: 100%; max-height: 340px; object-fit: cover; }.msg-attachment span { position: absolute; right: 7px; bottom: 7px; padding: 4px 6px; border-radius: 3px; color: #ddd6d9; background: rgba(0,0,0,.7); font: 6px/1 var(--mono); }
.msg-media { display: block; width: min(520px,100%); max-height: 360px; margin-top: 7px; border-radius: 6px; background: #000; }.msg-audio { display: block; width: min(420px,100%); height: 34px; margin-top: 7px; accent-color: #d9213e; }

/* ---------- Profile Engine 5.0: expanded identity systems ---------- */
/* One geometry source keeps the picture, clipping mask, border and relic frame aligned at every user-selected size. */
.bl-avatar { width: var(--avatar-size,94px); height: var(--avatar-size,94px); margin-inline: auto; }
.biolink .bl-card .bl-avatar .av { box-sizing: border-box; width: 100%; height: 100%; margin: 0; border: var(--avatar-border,3px) solid rgba(12,7,9,.92); object-fit: cover; }
.bl-avatar .bl-deco { inset:var(--deco-inset,-10px);box-sizing:border-box; }
.biolink .bl-card .bl-card__banner { height: var(--banner-height,112px); }
.biolink .bl-card__banner + .bl-card__body .bl-avatar { margin-top:var(--avatar-lift,-49px); }
.layout-centered .bl-card { max-width:var(--bl-card-width,430px); }.avatar-circle .bl-avatar .av,.avatar-circle .bl-deco { border-radius:50%; }.links-glass .bl-social { border-radius:50%;background:rgba(255,255,255,.06); }
.bl-card { backdrop-filter: blur(var(--card-blur,14px)); }
.bl-social { width: var(--social-size,46px); height: var(--social-size,46px); }
.avatar-octagon .bl-avatar .av,.avatar-octagon .bl-deco { border-radius: 0; clip-path: polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%); }
.avatar-shield .bl-avatar .av,.avatar-shield .bl-deco { border-radius: 0; clip-path: polygon(12% 5%,88% 5%,96% 18%,87% 76%,50% 100%,13% 76%,4% 18%); }
.avatar-squircle .bl-avatar .av,.avatar-squircle .bl-deco { border-radius: 32%; }
.avatar-arch .bl-avatar .av,.avatar-arch .bl-deco { border-radius: 50% 50% 14% 14%; }

.bl-card.align-left .bl-card__body { text-align: left; }.bl-card.align-left .bl-badges,.bl-card.align-left .bl-socials,.bl-card.align-left .bl-meta,.bl-card.align-left .bl-actions { justify-content: flex-start; }
.bl-card.align-right .bl-card__body { text-align: right; }.bl-card.align-right .bl-badges,.bl-card.align-right .bl-socials,.bl-card.align-right .bl-meta,.bl-card.align-right .bl-actions { justify-content: flex-end; }
.bl-card.align-left .bl-avatar { margin-left: 0; }.bl-card.align-right .bl-avatar { margin-right: 0; }
.bl-card.surface-solid { backdrop-filter: none; background: #0c080a !important; }.bl-card.surface-translucent { background: color-mix(in srgb,#0b0709 38%,transparent) !important; }
.bl-card.surface-outline { background: rgba(5,3,4,.2) !important; box-shadow: 0 0 0 1px var(--accent),0 26px 80px rgba(0,0,0,.62); }
.bl-card.surface-chromeless { overflow: visible; border-color: transparent; background: transparent !important; box-shadow: none; backdrop-filter: none; }.bl-card.surface-chromeless .bl-card__banner { border-radius: var(--bl-radius); }
.bl-card.badges-square .bl-badge { border-radius: 3px; }.bl-card.badges-minimal .bl-badge { border: 0; background: transparent; box-shadow: none; }.bl-card.badges-neon .bl-badge { border-color: var(--bc); box-shadow: 0 0 12px var(--bc),inset 0 0 8px color-mix(in srgb,var(--bc) 18%,transparent); }
.bl-card.socials-grid .bl-socials { display: grid; grid-template-columns: repeat(4,var(--social-size,46px)); }.bl-card.socials-stack .bl-socials { align-items: stretch; flex-direction: column; }.bl-card.socials-stack .bl-social { width: 100%; border-radius: 8px; }
.links-outline .bl-social { border-color: var(--accent); background: transparent; }.links-tiles .bl-social { border-radius: 3px; background: color-mix(in srgb,var(--accent) 15%,#080506); box-shadow: 4px 4px 0 color-mix(in srgb,var(--accent) 20%,#000); }.links-minimal .bl-social { border-color: transparent; background: transparent; box-shadow: none; }

/* Six additional compositions. */
.layout-stacked .bl-card { max-width: 440px; }.layout-stacked .bl-card__body { padding-inline: 48px; }.layout-stacked .bl-socials { margin-top: 18px; }
.layout-asymmetry .bl-card { max-width: 560px; transform: translateX(5%) rotate(.35deg); }.layout-asymmetry .bl-card__banner { width: 72%; margin-left: 28%; clip-path: polygon(8% 0,100% 0,100% 100%,0 100%); }.layout-asymmetry .bl-card__body { padding: 0 44px 34px; text-align: left; }.layout-asymmetry .bl-avatar { margin-left: 0; }.layout-asymmetry .bl-badges,.layout-asymmetry .bl-socials,.layout-asymmetry .bl-actions { justify-content: flex-start; }
.layout-magazine .bl-card { max-width: 580px; border-radius: 2px; }.layout-magazine .bl-card__banner { height: max(180px,var(--banner-height)); filter: contrast(1.12) saturate(.72); }.layout-magazine .bl-name { font: 900 clamp(28px,5vw,48px)/.9 var(--display); letter-spacing: -.055em; text-transform: uppercase; }.layout-magazine .bl-name::before { content: 'AKUSHA / '; color: var(--accent); font: 6px/1 var(--mono); letter-spacing: .18em; }
.layout-halo .bl-card { max-width: 500px; border-radius: 90px 90px 26px 26px; }.layout-halo .bl-card__banner { clip-path: ellipse(72% 78% at 50% 2%); }.layout-halo .bl-avatar { filter: drop-shadow(0 0 20px var(--accent)); }.layout-halo .bl-card__body { padding-inline: 52px; }
.layout-brutalist .bl-card { max-width: 560px; border: 3px solid var(--bl-text); border-radius: 0; box-shadow: 12px 12px 0 var(--accent),0 32px 80px #000; }.layout-brutalist .bl-card__banner { filter: grayscale(1) contrast(1.4); }.layout-brutalist .bl-name { font-family: var(--display); font-size: clamp(28px,5vw,44px); text-transform: uppercase; }.layout-brutalist .bl-social { border: 2px solid currentColor; border-radius: 0; }
.layout-polaroid .bl-card { max-width: 410px; padding: 11px; border: 0; border-radius: 3px; color: #171216; background: #ece7e4 !important; box-shadow: 0 28px 85px #000; transform: rotate(-.65deg); }.layout-polaroid .bl-card__banner { height: max(190px,var(--banner-height)); border: 0; }.layout-polaroid .bl-card__body { padding: 0 22px 24px; }.layout-polaroid .bl-bio,.layout-polaroid .bl-loc { color: #2b2328 !important; }.layout-polaroid .bl-meta { color: #655a60; }

/* Expanded name treatments. */
.fx-hologram { color: #aefaff; text-shadow: 2px 0 #f04cff,-2px 0 #42f4ff,0 0 18px #49e9ff; animation: name-holo 3.2s steps(2) infinite; }
.fx-glitch { color: #fff; text-shadow: 3px 0 #ff174f,-3px 0 #29e9ff; animation: name-glitch 2.6s steps(1) infinite; }.fx-neon { color: #fff; -webkit-text-stroke: 1px var(--gcol); text-shadow: 0 0 5px #fff,0 0 14px var(--gcol),0 0 34px var(--gcol); }
.fx-outline { color: transparent; -webkit-text-stroke: 1px var(--bl-text); text-shadow: 0 0 16px var(--gcol); }.fx-flame { background: linear-gradient(0deg,#ff2a00,#ff9e21 55%,#fff5ad); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 8px #ff4c00); animation: name-flame 2.3s ease-in-out infinite; }
.fx-frost { background: linear-gradient(#fff,#a9e9ff 48%,#5189d7); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 8px #79ceff); }.fx-spectral { background: linear-gradient(90deg,#7dffd8,#9dbaff,#df8cff,#7dffd8); background-size: 240% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: name-spectrum 5s linear infinite; }
@keyframes name-holo { 48% { transform: translateX(0); } 49% { transform: translateX(2px); } 50% { transform: translateX(-1px); } }@keyframes name-glitch { 0%,92%,100% { transform:none; } 94% { transform:skewX(12deg) translateX(2px); } 96% { transform:skewX(-8deg) translateX(-2px); } }
@keyframes name-flame { 50% { filter: drop-shadow(0 -4px 13px #ff3b00); transform: translateY(-1px); } }@keyframes name-spectrum { to { background-position: 240% 0; } }

/* Twenty-one new card frames with distinct material language. */
.bl-card.frame-obsidian { border: 2px solid #38333d; box-shadow: inset 0 0 0 2px #050405,inset 0 0 48px #000,0 0 32px rgba(135,103,170,.22),0 34px 90px #000; }
.bl-card.frame-bloodstone { border: 3px double #ff3157; box-shadow: inset 0 0 42px rgba(128,0,24,.32),0 0 44px rgba(255,30,70,.48),0 34px 90px #000; }
.bl-card.frame-holographic { border: 2px solid #7ff5ff; box-shadow: 0 0 0 2px #ff6fe7,0 0 35px #53e6ff66,inset 0 0 35px #df56ff22,0 34px 90px #000; }
.bl-card.frame-prism { border: 3px solid transparent; background-clip: padding-box; box-shadow: 0 0 0 1px #ff4d79,0 0 0 3px #66eaff,0 0 0 5px #ffd85c,0 34px 90px #000; }
.bl-card.frame-void { border: 1px solid #5a4a76; box-shadow: 0 0 0 5px #050308,0 0 60px #5d2da866,inset 0 0 80px #000,0 34px 90px #000; }
.bl-card.frame-frost { border: 2px solid #c9f5ff; box-shadow: 0 0 0 3px #5b93c7,0 0 38px #7edcff88,inset 0 0 30px #b7efff22,0 34px 90px #000; }
.bl-card.frame-plasma { border: 2px solid #ff57f1; box-shadow: 0 0 18px #5ceaff,0 0 48px #ff3ee677,inset 0 0 35px #694dff22,0 34px 90px #000; animation: frame-plasma 4s ease-in-out infinite; }
.bl-card.frame-glitch { border: 2px solid #fff; box-shadow: 6px 0 #ff174f,-6px 0 #35eaff,0 34px 90px #000; }.bl-card.frame-gothic { border: 3px double #8f2038; box-shadow: 0 0 0 5px #16070b,0 0 42px #b7173f55,inset 0 0 45px #33010d55,0 34px 90px #000; }
.bl-card.frame-thorned { border: 2px dashed #c31e44; box-shadow: 0 0 0 4px #250710,0 0 35px #d81c4866,inset 0 0 28px #4b061655,0 34px 90px #000; }.bl-card.frame-chained { border: 5px double #8d939d; box-shadow: 0 0 0 2px #272b31,0 0 30px #bac1cd44,0 34px 90px #000; }
.bl-card.frame-quantum { border: 2px solid #6fffe2; box-shadow: 0 0 0 3px #5139d4,0 0 45px #6c5dff77,inset 0 0 38px #4af3dc22,0 34px 90px #000; }.bl-card.frame-toxic { border: 2px solid #9cff24; box-shadow: 0 0 0 4px #183307,0 0 38px #72ff1b77,inset 0 0 28px #91ff2522,0 34px 90px #000; }
.bl-card.frame-eclipse { border: 2px solid #f1be64; box-shadow: 0 0 0 5px #2a0908,0 0 48px #ff5b2366,inset 0 0 48px #120206,0 34px 90px #000; }.bl-card.frame-runic { border: 2px dashed #e04964; box-shadow: 0 0 0 3px #360b14,0 0 34px #e32f5466,inset 0 0 25px #e2304a22,0 34px 90px #000; }
.bl-card.frame-nebula { border: 2px solid #9c7dff; box-shadow: 0 0 0 3px #263c88,0 0 52px #af52ff77,inset 0 0 42px #456fff22,0 34px 90px #000; }.bl-card.frame-cyber { border: 1px solid #37f7ef; box-shadow: 7px 7px 0 #ff2356,0 0 32px #30e9e866,0 34px 90px #000; }
.bl-card.frame-ivory { border: 4px double #f3eee1; box-shadow: 0 0 0 2px #8d8068,0 0 30px #fff3d744,0 34px 90px #000; }.bl-card.frame-baroque { border: 5px ridge #c69b46; box-shadow: 0 0 0 3px #4a2d0e,0 0 38px #e2ba5c55,inset 0 0 34px #d9ad4a22,0 34px 90px #000; }
.bl-card.frame-shattered { border: 2px solid #d5edff; clip-path: polygon(2% 0,97% 1%,100% 9%,98% 37%,100% 60%,96% 100%,61% 98%,37% 100%,0 96%,2% 69%,0 41%); box-shadow: 0 0 34px #89cfff55,0 34px 90px #000; }.bl-card.frame-lasergrid { border: 1px solid #ff2f71; box-shadow: 0 0 0 3px #1f194c,0 0 35px #6d65ff66,inset 0 0 32px #ff2e7322,0 34px 90px #000; }
@keyframes frame-plasma { 50% { box-shadow: 0 0 26px #5ceaff,0 0 64px #ff3ee699,inset 0 0 45px #694dff33,0 34px 90px #000; } }

/* Twenty-five new avatar relics. All inherit the same calculated avatar box. */
.deco-void-halo,.deco-eclipse-ring,.deco-plasma-halo,.deco-quantum-ring,.deco-toxic-orbit,.deco-glitch-ring,.deco-hologram-halo,.deco-chain-orbit,.deco-skull-orbit,.deco-shattered-halo { border: 2px solid var(--accent); border-radius: 50%; box-shadow: 0 0 18px var(--accent),inset 0 0 14px color-mix(in srgb,var(--accent) 38%,transparent); animation: relic-orbit calc(9s / var(--fx-speed,1)) linear infinite; }
.deco-void-halo { border-color:#7e62b7; box-shadow:0 0 25px #6136a7,inset 0 0 26px #000; }.deco-eclipse-ring { border:5px double #f3c36c; border-left-color:#53121a; }.deco-plasma-halo { border-color:#65edff; box-shadow:0 0 18px #5eeeff,0 0 30px #ff47e6; }.deco-quantum-ring { border-style:dashed; border-color:#80ffe5; }.deco-toxic-orbit { border-color:#9bff31; box-shadow:0 0 20px #6fff1e; }
.deco-glitch-ring { border-color:#fff; box-shadow:5px 0 #ff2053,-5px 0 #38efff; animation-timing-function:steps(8); }.deco-hologram-halo { border-style:dotted; border-color:#8cf7ff; box-shadow:0 0 22px #61efff; }.deco-chain-orbit { border:5px double #9ca5b2; }.deco-skull-orbit { border-style:dashed; border-color:#e3e6ed; }.deco-shattered-halo { border-radius:12%; border-color:#bdeaff; clip-path:polygon(8% 0,42% 5%,68% 0,100% 13%,94% 48%,100% 78%,84% 100%,51% 94%,21% 100%,0 83%,6% 47%,0 17%); }
.deco-scarlet-crown,.deco-loki-crown,.deco-storm-crown,.deco-panther-crown,.deco-iron-halo,.deco-mystic-mandala,.deco-prism-crown,.deco-cathedral-spires,.deco-bloodstone-crown,.deco-cyber-crown,.deco-halo-blades,.deco-raven-crown,.deco-thorn-crown,.deco-frost-horns,.deco-inferno-horns,.deco-oni-horns,.deco-runic-antlers,.deco-neon-wings,.deco-cosmic-wings,.deco-angel-halo,.deco-bat-wings { overflow:visible;clip-path:none !important; }
.deco-prism-crown,.deco-cathedral-spires,.deco-bloodstone-crown,.deco-cyber-crown,.deco-halo-blades,.deco-raven-crown,.deco-thorn-crown,.deco-frost-horns,.deco-inferno-horns,.deco-oni-horns,.deco-runic-antlers,.deco-neon-wings,.deco-cosmic-wings,.deco-angel-halo,.deco-bat-wings { border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);border-radius:50%;background:none;filter:none;animation:relic-float 4.2s ease-in-out infinite; }
.deco-prism-crown::before,.deco-cathedral-spires::before,.deco-bloodstone-crown::before,.deco-cyber-crown::before { content:''; position:absolute; top:-30%; left:7%; width:86%; height:48%; clip-path:polygon(0 100%,10% 30%,29% 69%,50% 0,71% 69%,90% 30%,100% 100%); background:linear-gradient(135deg,#62efff,#ff65db 46%,#ffe36b); filter:drop-shadow(0 0 8px var(--accent)); }.deco-cathedral-spires::before { background:linear-gradient(#eee4e8,#8b1734); clip-path:polygon(0 100%,8% 20%,20% 62%,34% 0,50% 70%,66% 0,80% 62%,92% 20%,100% 100%); }.deco-bloodstone-crown::before { background:linear-gradient(#ffb1c0,#e31e4b 38%,#41000f); }.deco-cyber-crown::before { background:linear-gradient(#59f5ee,#314de0); clip-path:polygon(0 100%,0 37%,21% 37%,21% 3%,45% 56%,62% 0,74% 58%,100% 30%,100% 100%); }
.deco-raven-crown::before,.deco-thorn-crown::before,.deco-frost-horns::before,.deco-inferno-horns::before,.deco-oni-horns::before,.deco-runic-antlers::before { content:'';position:absolute;top:-39%;left:-4%;width:108%;height:65%;background:#09080b;clip-path:polygon(0 100%,8% 27%,27% 71%,42% 0,50% 61%,58% 0,73% 71%,92% 27%,100% 100%);filter:drop-shadow(0 0 9px var(--accent)); }.deco-thorn-crown::before { background:#a51435; clip-path:polygon(0 100%,12% 34%,24% 73%,38% 4%,50% 67%,63% 0,76% 73%,91% 28%,100% 100%); }.deco-frost-horns::before { background:linear-gradient(#fff,#8edfff,#3f68ba); clip-path:polygon(0 100%,8% 8%,30% 56%,44% 0,50% 67%,56% 0,70% 56%,92% 8%,100% 100%); }.deco-inferno-horns::before,.deco-oni-horns::before { background:linear-gradient(#fff0a1,#ff5c13,#5b0712); }.deco-runic-antlers::before { background:linear-gradient(#ffe391,#ad7421); clip-path:polygon(0 100%,5% 10%,22% 50%,28% 0,43% 60%,50% 18%,57% 60%,72% 0,78% 50%,95% 10%,100% 100%); }
.deco-neon-wings::before,.deco-cosmic-wings::before,.deco-bat-wings::before { content:'';position:absolute;top:10%;left:-42%;width:184%;height:77%;background:linear-gradient(90deg,#4eefff,#d45cff 48%,#ff4e83);clip-path:polygon(0 12%,37% 42%,43% 0,50% 50%,57% 0,63% 42%,100% 12%,87% 85%,61% 62%,50% 100%,39% 62%,13% 85%);filter:drop-shadow(0 0 9px var(--accent)); }.deco-cosmic-wings::before { background:linear-gradient(90deg,#6b82ff,#d24cff,#ff7c91); }.deco-bat-wings::before { background:linear-gradient(90deg,#08060a,#892040,#08060a); clip-path:polygon(0 10%,39% 37%,45% 0,50% 47%,55% 0,61% 37%,100% 10%,91% 100%,72% 67%,62% 90%,50% 58%,38% 90%,28% 67%,9% 100%); }.deco-angel-halo::before { content:'';position:absolute;left:12%;top:-31%;width:76%;height:25%;border:4px solid #fff2ae;border-radius:50%;box-shadow:0 0 15px #ffeaa1;transform:rotateX(65deg); }.deco-halo-blades::before { content:'';position:absolute;inset:-8%;background:repeating-conic-gradient(#e5f7ff 0 3deg,transparent 3deg 27deg);filter:drop-shadow(0 0 7px #8cdbff);animation:relic-orbit 8s linear infinite; }
@keyframes relic-orbit { to { transform:rotate(360deg); } }

/* Twenty-six scene effects use the existing single layer + canvas budget. */
.eff-blackhole .bl-bg-overlay { background:radial-gradient(circle,#000 0 13%,transparent 14% 19%,rgba(120,70,255,.32) 22%,rgba(1,0,6,.82) 49%) !important; }.eff-blackhole .bl-effect-layer::before { inset:12%;border-radius:50%;background:repeating-conic-gradient(from 20deg,#7b5cff00 0 8deg,#a987ff99 9deg,#55dfff00 15deg);filter:blur(2px);animation:fx-spin calc(19s / var(--fx-speed,1)) linear infinite; }.eff-blackhole .bl-effect-layer::after { inset:34%;border:11px solid #000;border-radius:50%;box-shadow:0 0 35px #8c63ff,0 0 90px #4ecbff55; }
.eff-eclipse .bl-effect-layer::before { top:10%;right:11%;width:180px;height:180px;border:2px solid #ffd17c;border-radius:50%;background:#080409;box-shadow:0 0 25px #ff9b39,0 0 80px #ff432966;animation:fx-breathe calc(6s / var(--fx-speed,1)) ease-in-out infinite; }.eff-eclipse .bl-effect-layer::after { inset:0;background:radial-gradient(circle at calc(100% - 100px) 100px,transparent 0 80px,#ff5a2d17 90px,transparent 180px); }
.eff-matrix .bl-effect-layer { inset:-35% 0 0;opacity:.48;background:repeating-linear-gradient(90deg,transparent 0 22px,#6bff9633 23px,#b8ffc844 24px,transparent 25px),repeating-linear-gradient(0deg,transparent 0 18px,#8affaa88 19px,transparent 20px);animation:fx-fall calc(8s / var(--fx-speed,1)) linear infinite; }.eff-matrix .bl-bg-overlay { background:rgba(0,12,4,.72) !important; }
.eff-glitch .bl-effect-layer::before,.eff-glitch .bl-effect-layer::after { inset:0;opacity:.22;background:repeating-linear-gradient(0deg,transparent 0 7px,#fff 8px,transparent 9px);animation:fx-glitch calc(3.1s / var(--fx-speed,1)) steps(1) infinite; }.eff-glitch .bl-effect-layer::after { background:linear-gradient(90deg,#ff164b22,transparent 43%,#37edff22);animation-delay:-1.1s; }
.eff-hologram .bl-effect-layer { inset:0;opacity:.36;background:repeating-linear-gradient(0deg,transparent 0 5px,#75f7ff44 6px,transparent 7px),linear-gradient(90deg,transparent,#5ef3ff1f,transparent);animation:fx-scan calc(6s / var(--fx-speed,1)) linear infinite; }.eff-hologram .bl-bg-overlay { background:radial-gradient(circle at 50% 45%,#4defff20,#020a0d 65%) !important; }
.eff-prism .bl-effect-layer::before { inset:8%;background:conic-gradient(from 90deg,#ff436444,#ffcf4d44,#56efff44,#9b5cff44,#ff436444);clip-path:polygon(50% 0,100% 100%,0 100%);filter:blur(4px);animation:fx-spin calc(25s / var(--fx-speed,1)) linear infinite; }.eff-prism .bl-effect-layer::after { inset:17%;border:1px solid #fff8;transform:rotate(45deg);box-shadow:0 0 55px #fff3; }
.eff-lasergrid .bl-effect-layer { inset:45% -30% -50%;background:repeating-linear-gradient(90deg,#8c65ff66 0 1px,transparent 1px 70px),repeating-linear-gradient(0deg,#ff2e7066 0 1px,transparent 1px 54px);transform:perspective(480px) rotateX(62deg);transform-origin:50% 0;animation:fx-grid calc(8s / var(--fx-speed,1)) linear infinite; }.eff-lasergrid .bl-bg-overlay { background:linear-gradient(#060319 0 48%,#18031d 49%,#020105 77%) !important; }
.eff-void .bl-effect-layer::before { inset:8%;border:1px solid #795aac44;border-radius:50%;box-shadow:inset 0 0 120px #000,0 0 90px #582d9c55;animation:fx-breathe calc(8s / var(--fx-speed,1)) ease-in-out infinite; }.eff-void .bl-effect-layer::after { inset:29%;border:1px dashed #a385d055;border-radius:50%;animation:fx-spin calc(30s / var(--fx-speed,1)) linear infinite reverse; }
.eff-bloodrain .bl-effect-layer { inset:-25% 0 0;opacity:.62;background:repeating-linear-gradient(102deg,transparent 0 25px,#e2184633 26px,#ff416055 27px,transparent 29px);animation:fx-fall calc(5s / var(--fx-speed,1)) linear infinite; }.eff-bloodrain .bl-bg-overlay { background:linear-gradient(rgba(28,0,7,.42),rgba(4,0,2,.78)) !important; }
.eff-spectral .bl-effect-layer::before,.eff-spectral .bl-effect-layer::after { width:55%;height:70%;border-radius:50%;background:radial-gradient(ellipse,#9fffe322,transparent 68%);filter:blur(18px);animation:fx-drift calc(11s / var(--fx-speed,1)) ease-in-out infinite alternate; }.eff-spectral .bl-effect-layer::after { right:0;bottom:0;background:radial-gradient(ellipse,#aa8cff22,transparent 68%);animation-direction:alternate-reverse; }
.eff-frost .bl-effect-layer { inset:0;opacity:.5;background:repeating-conic-gradient(from 0deg at 50% 50%,transparent 0 28deg,#c9f5ff55 29deg,#7ccfff33 31deg,transparent 32deg 60deg);animation:fx-breathe calc(7s / var(--fx-speed,1)) ease-in-out infinite; }.eff-frost .bl-bg-overlay { background:linear-gradient(#06203655,#02060bdd) !important; }
.eff-inferno .bl-effect-layer::before { inset:36% -10% -28%;background:linear-gradient(0deg,#ff2f00,#ff8d1e 44%,#ffe78a 64%,transparent 67%);clip-path:polygon(0 100%,0 49%,8% 16%,14% 52%,22% 1%,30% 55%,40% 20%,48% 63%,58% 5%,67% 53%,77% 13%,86% 61%,94% 20%,100% 55%,100% 100%);filter:blur(3px) drop-shadow(0 0 16px #ff3b00);animation:fx-flame calc(3.5s / var(--fx-speed,1)) ease-in-out infinite; }.eff-inferno .bl-bg-overlay { background:linear-gradient(#15020366,#2b0505aa) !important; }
.eff-plasma .bl-effect-layer::before,.eff-plasma .bl-effect-layer::after { width:48%;height:65%;border-radius:44% 56% 63% 37%;background:radial-gradient(circle,#6ff8ff66,#8b46ff33 45%,transparent 70%);filter:blur(12px);animation:fx-drift calc(8s / var(--fx-speed,1)) ease-in-out infinite alternate; }.eff-plasma .bl-effect-layer::after { right:0;bottom:0;background:radial-gradient(circle,#ff5fe766,#6c4cff33 45%,transparent 70%);animation-direction:alternate-reverse; }
.eff-cyberstorm .bl-effect-layer { inset:0;background:linear-gradient(90deg,transparent 49.8%,#52eeff44 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,#ff2d6544 50%,transparent 50.2%);background-size:64px 64px; }.eff-cyberstorm .bl-effect-layer::after { left:18%;top:-5%;width:14%;height:85%;background:#d7faff;clip-path:polygon(49% 0,100% 0,63% 41%,88% 41%,12% 100%,38% 54%,0 54%);filter:drop-shadow(0 0 10px #5cecff);animation:fx-strike calc(4.8s / var(--fx-speed,1)) steps(1) infinite; }
.eff-gothic .bl-effect-layer::before { inset:8%;border:2px solid #8d1d38;border-radius:50%;background:repeating-conic-gradient(#941a3433 0 8deg,transparent 8deg 22deg);box-shadow:0 0 50px #9b123355,inset 0 0 50px #9b123333;animation:fx-spin calc(38s / var(--fx-speed,1)) linear infinite; }.eff-gothic .bl-effect-layer::after { inset:27%;border:1px solid #d4496255;transform:rotate(45deg); }
.eff-ravens .bl-effect-layer::before,.eff-ravens .bl-effect-layer::after { width:44%;height:34%;background:#020203;clip-path:polygon(0 54%,18% 35%,36% 48%,50% 5%,64% 48%,82% 35%,100% 54%,72% 62%,50% 100%,28% 62%);filter:drop-shadow(0 0 8px #8f1f3f);animation:fx-raven calc(12s / var(--fx-speed,1)) ease-in-out infinite; }.eff-ravens .bl-effect-layer::after { right:0;bottom:8%;transform:scale(.65);animation-delay:-5s; }
.eff-chains .bl-effect-layer { inset:0;opacity:.36;background:repeating-linear-gradient(112deg,transparent 0 38px,#b2bac544 39px 43px,transparent 44px 78px);animation:fx-chain calc(10s / var(--fx-speed,1)) ease-in-out infinite alternate; }.eff-chains .bl-bg-overlay { background:radial-gradient(circle,#42101c22,#030204cc 70%) !important; }
.eff-thorns .bl-effect-layer::before { inset:5%;border:4px solid #721329;clip-path:polygon(0 6%,7% 10%,2% 19%,9% 26%,1% 35%,8% 45%,0 54%,8% 63%,1% 73%,8% 83%,0 94%,100% 94%,92% 83%,99% 73%,92% 63%,100% 54%,92% 45%,99% 35%,91% 26%,98% 19%,93% 10%,100% 6%);box-shadow:0 0 30px #b4153855;animation:fx-breathe calc(7s / var(--fx-speed,1)) ease-in-out infinite; }
.eff-runic .bl-effect-layer::before { inset:11%;border:2px dashed #ef496666;border-radius:50%;background:repeating-conic-gradient(#e3375633 0 2deg,transparent 2deg 14deg);box-shadow:0 0 60px #d91c4555,inset 0 0 50px #d91c4522;animation:fx-spin calc(27s / var(--fx-speed,1)) linear infinite; }.eff-runic .bl-effect-layer::after { inset:29%;border:1px solid #ffd0d855;transform:rotate(45deg);animation:fx-spin calc(13s / var(--fx-speed,1)) linear infinite reverse; }
.eff-portal .bl-effect-layer::before { inset:8%;border:3px solid #65e9dc88;border-radius:50%;background:repeating-conic-gradient(#ff784744 0 3deg,transparent 3deg 17deg);box-shadow:0 0 60px #55decf66,inset 0 0 90px #ff6c3533;animation:fx-spin calc(22s / var(--fx-speed,1)) linear infinite; }.eff-portal .bl-effect-layer::after { inset:25%;border:2px dashed #ff865566;border-radius:50%;animation:fx-spin calc(11s / var(--fx-speed,1)) linear infinite reverse; }
.eff-quantum .bl-effect-layer::before,.eff-quantum .bl-effect-layer::after { left:10%;top:20%;width:80%;height:50%;border:2px solid #6fffe277;border-radius:50%;transform:rotate(24deg);box-shadow:0 0 35px #6a63ff55;animation:fx-quantum calc(9s / var(--fx-speed,1)) linear infinite; }.eff-quantum .bl-effect-layer::after { transform:rotate(-36deg);border-color:#a977ff77;animation-direction:reverse; }
.eff-sonic .bl-effect-layer { inset:0;background:repeating-radial-gradient(circle at 50% 50%,transparent 0 44px,#5cecff33 45px 47px,transparent 48px 82px);animation:fx-sonic calc(4s / var(--fx-speed,1)) ease-out infinite; }.eff-sonic .bl-bg-overlay { background:radial-gradient(circle,#26346422,#03040bcc 70%) !important; }
.eff-meteor .bl-effect-layer { inset:-25% -15%;opacity:.65;background:repeating-linear-gradient(128deg,transparent 0 55px,#fff6ceaa 56px,#ff8b3b77 57px,transparent 62px 112px);animation:fx-meteor calc(7s / var(--fx-speed,1)) linear infinite; }.eff-meteor .bl-bg-overlay { background:linear-gradient(#07091a88,#2d0b12aa) !important; }
.eff-nebula .bl-effect-layer::before,.eff-nebula .bl-effect-layer::after { width:67%;height:67%;border-radius:50%;background:radial-gradient(circle,#5b8cff44,#9e4cff22 45%,transparent 72%);filter:blur(25px);animation:fx-drift calc(14s / var(--fx-speed,1)) ease-in-out infinite alternate; }.eff-nebula .bl-effect-layer::after { right:-4%;bottom:-6%;background:radial-gradient(circle,#ff4da744,#4c8cff22 45%,transparent 72%);animation-direction:alternate-reverse; }
.eff-toxic .bl-effect-layer { inset:0;opacity:.45;background:radial-gradient(circle at 10% 83%,#9dff35 0 4px,transparent 6px),radial-gradient(circle at 26% 72%,#70ff22 0 2px,transparent 4px),radial-gradient(circle at 78% 86%,#b1ff4d 0 5px,transparent 7px),radial-gradient(circle at 63% 67%,#68ff1e 0 3px,transparent 5px);animation:fx-toxic calc(5s / var(--fx-speed,1)) ease-in-out infinite; }.eff-toxic .bl-bg-overlay { background:radial-gradient(circle at 50% 100%,#62b41733,#061005cc 62%) !important; }
.eff-dreamwave .bl-effect-layer::before,.eff-dreamwave .bl-effect-layer::after { inset:34% -20% -35%;border-radius:50%;background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 25px,#ff68cc33 27px,#6deaff22 30px,transparent 34px);transform:rotate(-4deg);animation:fx-wave calc(8s / var(--fx-speed,1)) ease-in-out infinite alternate; }.eff-dreamwave .bl-effect-layer::after { inset:45% -15% -30%;transform:rotate(5deg);animation-direction:alternate-reverse; }

@keyframes fx-spin { to { transform:rotate(360deg); } }@keyframes fx-breathe { 50% { opacity:.55;transform:scale(.93); } }@keyframes fx-fall { to { transform:translateY(25%); } }
@keyframes fx-glitch { 0%,88%,100% { transform:none;clip-path:inset(0); } 90% { transform:translateX(3%);clip-path:inset(20% 0 58%); } 94% { transform:translateX(-2%);clip-path:inset(62% 0 14%); } }
@keyframes fx-scan { to { transform:translateY(12%); } }@keyframes fx-grid { to { background-position:70px 54px; } }@keyframes fx-drift { to { transform:translate3d(10%,-6%,0) scale(1.12); } }
@keyframes fx-flame { 50% { transform:translateY(-4%) scaleY(1.08);filter:blur(5px) drop-shadow(0 0 22px #ff3b00); } }@keyframes fx-strike { 0%,91%,94%,100% { opacity:0; } 92%,95% { opacity:.9; } }
@keyframes fx-raven { 50% { transform:translate3d(45%,20%,0) rotate(8deg) scale(.74); } }@keyframes fx-chain { to { transform:translate3d(3%,-2%,0); } }@keyframes fx-quantum { to { rotate:360deg; } }
@keyframes fx-sonic { 0% { opacity:.15;transform:scale(.72); } 80%,100% { opacity:.55;transform:scale(1.12); } }@keyframes fx-meteor { to { transform:translate3d(18%,24%,0); } }@keyframes fx-toxic { 50% { transform:translateY(-8%);filter:blur(2px); } }@keyframes fx-wave { to { transform:translateY(-7%) rotate(4deg) scale(1.05); } }

/* Customizer parity for sizing, new layouts, effects and relics. */
.cust-preview__avatar { width:var(--preview-avatar-size,70px);height:var(--preview-avatar-size,70px);margin-top:var(--preview-avatar-lift,-35px); }.cust-preview__avatar img { box-sizing:border-box;width:100%;height:100%;border-width:var(--preview-avatar-border,3px); }#cust-preview-deco:not([data-deco="none"]) { inset:var(--preview-deco-inset,-7px); }
.cust-preview__avatar img[data-shape="octagon"] { border-radius:0;clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%); }.cust-preview__avatar img[data-shape="shield"] { border-radius:0;clip-path:polygon(12% 5%,88% 5%,96% 18%,87% 76%,50% 100%,13% 76%,4% 18%); }.cust-preview__avatar img[data-shape="squircle"] { border-radius:32%; }.cust-preview__avatar img[data-shape="arch"] { border-radius:50% 50% 14% 14%; }
.cust-preview__card[data-align="left"] .cust-preview__body { text-align:left; }.cust-preview__card[data-align="right"] .cust-preview__body { text-align:right; }.cust-preview__card[data-surface="solid"] { backdrop-filter:none;background:#0b0709 !important; }.cust-preview__card[data-surface="outline"] { background:rgba(5,3,4,.2) !important; }.cust-preview__card[data-surface="chromeless"] { border-color:transparent;box-shadow:none;background:transparent !important;backdrop-filter:none; }
.cust-preview__socials i { width:var(--preview-social-size,21px);height:var(--preview-social-size,21px); }.cust-preview__card[data-socials="grid"] .cust-preview__socials { display:grid;grid-template-columns:repeat(4,var(--preview-social-size,21px)); }.cust-preview__card[data-socials="stack"] .cust-preview__socials { align-items:stretch;flex-direction:column; }.cust-preview__card[data-socials="stack"] .cust-preview__socials i { width:100%;border-radius:3px; }
.cust-preview__card[data-layout="stacked"] { width:270px; }.cust-preview__card[data-layout="asymmetry"] { width:330px;transform:translateX(10px) rotate(1deg); }.cust-preview__card[data-layout="asymmetry"] .cust-preview__banner { width:72%;margin-left:28%; }.cust-preview__card[data-layout="magazine"] { width:340px;border-radius:2px; }.cust-preview__card[data-layout="magazine"] .cust-preview__banner { height:128px; }.cust-preview__card[data-layout="halo"] { width:300px;border-radius:50px 50px 15px 15px; }.cust-preview__card[data-layout="brutalist"] { width:335px;border:3px solid #fff;border-radius:0;box-shadow:8px 8px 0 var(--preview-accent),0 20px 55px #000; }.cust-preview__card[data-layout="polaroid"] { width:245px;padding:7px;border-radius:2px;background:#ece7e4 !important;transform:rotate(-1deg); }
[data-layout-glyph="stacked"] b:nth-child(1) { left:15px;width:17px; }[data-layout-glyph="asymmetry"] b:nth-child(1) { left:22px;width:21px; }[data-layout-glyph="magazine"] b:nth-child(1) { left:4px;width:39px;height:14px; }[data-layout-glyph="halo"] { border-radius:12px 12px 4px 4px; }[data-layout-glyph="brutalist"] { border-width:2px;border-radius:0;box-shadow:3px 3px 0 #b52b43; }[data-layout-glyph="polaroid"] { width:36px;margin-inline:6px;border:4px solid #d8d2d4;background:#282124; }
.cust-effect-picker > div { max-height:540px;overflow:auto;padding:1px 3px 8px 1px;scrollbar-color:#4b1721 transparent; }
.fx-choice-blackhole > i,.fx-choice-void > i { background:radial-gradient(circle,#000 0 24%,#9d77ff 27%,#111 35%,#020104 68%) !important; }.fx-choice-eclipse > i { background:radial-gradient(circle at 55% 45%,#080408 0 28%,#ffc267 31%,#ff542c 35%,#16070b 50%) !important; }.fx-choice-matrix > i { background:repeating-linear-gradient(90deg,#041108 0 6px,#58ff8d 7px,#041108 9px) !important; }.fx-choice-glitch > i { background:linear-gradient(90deg,#ff2359 0 30%,#111 31% 67%,#42efff 68%) !important; }.fx-choice-hologram > i { background:repeating-linear-gradient(0deg,#09252b 0 4px,#78f4ff 5px,#09252b 6px) !important; }.fx-choice-prism > i { background:conic-gradient(#ff486e,#ffd953,#5df2ff,#a15cff,#ff486e) !important; }.fx-choice-lasergrid > i { border-radius:5px !important;background:repeating-linear-gradient(90deg,#13072a 0 8px,#a56fff 9px),repeating-linear-gradient(0deg,transparent 0 8px,#ff3974 9px) !important; }.fx-choice-bloodrain > i,.fx-choice-gothic > i,.fx-choice-ravens > i,.fx-choice-chains > i,.fx-choice-thorns > i,.fx-choice-runic > i { background:url('/themes/darkhold-grimoire.jpg') center/cover !important; }.fx-choice-spectral > i { background:radial-gradient(circle,#dffff6,#74d6bf 24%,#3b335d 55%,#071012) !important; }.fx-choice-frost > i { background:repeating-conic-gradient(#e8fbff 0 5deg,#528bc7 6deg 20deg) !important; }.fx-choice-inferno > i { background:radial-gradient(circle at 50% 80%,#fff3a5,#ff8e1e 18%,#f12d00 45%,#160207 70%) !important; }.fx-choice-plasma > i { background:radial-gradient(circle at 32% 31%,#75f7ff,#6c4cff 28%,#ff4ee4 52%,#080412 70%) !important; }.fx-choice-cyberstorm > i { background:linear-gradient(120deg,#071725 36%,#d9fbff 37% 42%,#f22a64 43% 48%,#071725 49%) !important; }.fx-choice-portal > i,.fx-choice-quantum > i,.fx-choice-nebula > i,.fx-choice-dreamwave > i { background:url('/themes/multiverse-rift.jpg') center/cover !important; }.fx-choice-sonic > i { background:repeating-radial-gradient(circle,#07101c 0 5px,#63eaff 6px 7px) !important; }.fx-choice-meteor > i { background:repeating-linear-gradient(130deg,#080b1b 0 9px,#ff9a45 10px,#080b1b 13px) !important; }.fx-choice-toxic > i { background:radial-gradient(circle,#d8ff61,#72db1b 26%,#0a1d07 58%,#020502 70%) !important; }
.cust-preview__stage[data-effect="blackhole"]::before,.cust-preview__stage[data-effect="void"]::before { opacity:.78;background:radial-gradient(circle,#000 0 13%,#9b73ff 15%,transparent 22%),url('/themes/multiverse-rift.jpg') center/cover; }.cust-preview__stage[data-effect="eclipse"]::before { opacity:.8;background:radial-gradient(circle at 78% 18%,#060307 0 10%,#ffbe63 11%,#ff4c2b 13%,transparent 25%); }.cust-preview__stage[data-effect="matrix"]::before { opacity:.45;background:repeating-linear-gradient(90deg,transparent 0 18px,#68ff9144 19px),repeating-linear-gradient(0deg,transparent 0 13px,#a0ffb366 14px); }.cust-preview__stage[data-effect="glitch"]::before { opacity:.35;background:repeating-linear-gradient(0deg,transparent 0 6px,#fff 7px,transparent 8px),linear-gradient(90deg,#ff225533,transparent,#43ecff33); }.cust-preview__stage[data-effect="hologram"]::before { opacity:.4;background:repeating-linear-gradient(0deg,transparent 0 5px,#72f5ff55 6px,transparent 7px); }.cust-preview__stage[data-effect="prism"]::before { opacity:.42;background:conic-gradient(#ff456866,#ffdb5866,#59f0ff66,#ad62ff66,#ff456866); }.cust-preview__stage[data-effect="lasergrid"]::before { top:48%;opacity:.45;background:repeating-linear-gradient(90deg,#9968ff66 0 1px,transparent 1px 34px),repeating-linear-gradient(0deg,#ff337166 0 1px,transparent 1px 28px);transform:perspective(300px) rotateX(58deg); }.cust-preview__stage[data-effect="bloodrain"]::before { opacity:.5;background:repeating-linear-gradient(103deg,transparent 0 20px,#e52b4d66 21px,transparent 23px); }.cust-preview__stage[data-effect="spectral"]::before { opacity:.5;background:radial-gradient(circle at 30% 40%,#90ffe055,transparent 35%),radial-gradient(circle at 70% 62%,#aa86ff44,transparent 35%); }.cust-preview__stage[data-effect="frost"]::before { opacity:.45;background:repeating-conic-gradient(transparent 0 27deg,#c4f2ff66 28deg,#73bce944 31deg); }.cust-preview__stage[data-effect="inferno"]::before { opacity:.62;background:linear-gradient(0deg,#ff2f00,#ff9a25 30%,transparent 58%);clip-path:polygon(0 100%,0 52%,12% 20%,22% 62%,37% 7%,50% 57%,67% 13%,79% 64%,91% 22%,100% 55%,100% 100%); }.cust-preview__stage[data-effect="plasma"]::before { opacity:.5;background:radial-gradient(circle at 25% 33%,#65efff66,transparent 35%),radial-gradient(circle at 77% 70%,#ff52e466,transparent 37%); }.cust-preview__stage[data-effect="cyberstorm"]::before { opacity:.5;background:linear-gradient(90deg,transparent 49%,#5defff55 50%,transparent 51%),linear-gradient(0deg,transparent 49%,#ff366c44 50%,transparent 51%);background-size:38px 38px; }.cust-preview__stage[data-effect="gothic"]::before,.cust-preview__stage[data-effect="ravens"]::before,.cust-preview__stage[data-effect="chains"]::before,.cust-preview__stage[data-effect="thorns"]::before,.cust-preview__stage[data-effect="runic"]::before { opacity:.65;background:linear-gradient(#12010655,#050203bb),url('/themes/darkhold-grimoire.jpg') center/cover; }.cust-preview__stage[data-effect="portal"]::before,.cust-preview__stage[data-effect="quantum"]::before,.cust-preview__stage[data-effect="nebula"]::before,.cust-preview__stage[data-effect="dreamwave"]::before { opacity:.66;background:linear-gradient(#02031522,#03010abb),url('/themes/multiverse-rift.jpg') center/cover; }.cust-preview__stage[data-effect="sonic"]::before { opacity:.38;background:repeating-radial-gradient(circle,transparent 0 31px,#62e9ff66 32px 34px); }.cust-preview__stage[data-effect="meteor"]::before { opacity:.5;background:repeating-linear-gradient(130deg,transparent 0 38px,#ffb26788 39px,transparent 43px 80px); }.cust-preview__stage[data-effect="toxic"]::before { opacity:.5;background:radial-gradient(circle at 20% 80%,#99ff3e 0 4px,transparent 6px),radial-gradient(circle at 72% 72%,#72ed26 0 5px,transparent 7px),linear-gradient(#07100633,#071006bb); }
.relic-raven-crown i,.relic-thorn-crown i,.relic-frost-horns i,.relic-oni-horns i,.relic-runic-antlers i { clip-path:polygon(0 100%,9% 22%,29% 67%,43% 0,50% 62%,57% 0,71% 67%,91% 22%,100% 100%);background:linear-gradient(#fff,#8c2140,#09060a);filter:drop-shadow(0 0 5px #d52b4b); }.relic-frost-horns i { background:linear-gradient(#fff,#8edfff,#3565af); }.relic-neon-wings i { clip-path:polygon(0 15%,38% 42%,45% 0,50% 50%,55% 0,62% 42%,100% 15%,82% 95%,57% 60%,50% 100%,43% 60%,18% 95%);background:linear-gradient(90deg,#4ff0ff,#d15fff,#ff4c85);filter:drop-shadow(0 0 5px #7feaff); }

@media (max-width:620px) {
  .layout-asymmetry .bl-card { transform:none; }.layout-asymmetry .bl-card__banner { width:100%;margin-left:0;clip-path:none; }
  .layout-magazine .bl-card__banner { height:min(180px,var(--banner-height)); }.layout-brutalist .bl-card { box-shadow:7px 7px 0 var(--accent),0 25px 70px #000; }
  .bl-avatar { max-width:128px;max-height:128px; }
}
@media (prefers-reduced-motion:reduce) {
  .biolink .bl-effect-layer,.biolink .bl-effect-layer::before,.biolink .bl-effect-layer::after,.biolink .bl-deco,.biolink .bl-deco::before,.biolink .bl-deco::after,.biolink .bl-name { animation:none !important; }
}
