.home-overview-v2 {
  --phnx-bg: #030817;
  --phnx-panel: rgba(6, 15, 34, .92);
  --phnx-border: rgba(94, 136, 210, .24);
  --phnx-muted: #8e9bb7;
  --phnx-cyan: #20dcff;
  --phnx-pink: #ff2f85;
  --phnx-orange: #ff6a21;
  --phnx-green: #28e58b;
  --phnx-violet: #bb46ff;
  width: 100%;
  min-width: 0;
  isolation: isolate;
}

body[data-route="home"] {
  background:
    radial-gradient(circle at 75% 7%, rgba(51, 27, 136, .17), transparent 34rem),
    radial-gradient(circle at 20% 44%, rgba(9, 80, 144, .12), transparent 38rem),
    #020714;
}

body[data-route="home"] > main > .view.home-overview-v2[data-view="home"]:not([hidden]) {
  display: block !important;
  width: 100% !important;
  max-width: 1680px !important;
  min-width: 0 !important;
  grid-template-columns: none !important;
}

.home-overview-v2,
.home-overview-v2 *,
.home-overview-v2 *::before,
.home-overview-v2 *::after {
  box-sizing: border-box;
}

.home-overview-root.phnx-command-home {
  display: grid;
  gap: 16px;
  width: 100%;
  min-width: 0;
  max-width: 1680px;
  margin: 0 auto;
  color: #f7f9ff;
}

.phnx-command-home svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.phnx-home-hero {
  position: relative;
  display: grid;
  align-items: center;
  min-height: clamp(430px, 36vw, 575px);
  padding: clamp(34px, 4.7vw, 76px) clamp(28px, 5vw, 82px);
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(2, 7, 20, .99) 0%, rgba(2, 9, 26, .96) 29%, rgba(2, 8, 25, .64) 48%, rgba(2, 7, 19, .1) 78%),
    linear-gradient(180deg, rgba(2, 7, 20, .1), rgba(2, 7, 20, .22) 70%, #020714 100%),
    var(--hero-art) 50% 50% / cover no-repeat;
  box-shadow: inset 0 -1px rgba(74, 124, 220, .16);
}

.phnx-home-hero::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background-image:
    linear-gradient(rgba(39, 140, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(39, 140, 255, .035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(90deg, #000, rgba(0, 0, 0, .3) 60%, transparent 94%);
}

.phnx-home-hero::after {
  position: absolute;
  right: 5%;
  bottom: -1px;
  width: 51%;
  height: 2px;
  content: "";
  background: linear-gradient(90deg, transparent, #ff335f 35%, #ff941f 60%, transparent);
  box-shadow: 0 0 18px #ff375d;
  opacity: .7;
}

.phnx-home-hero-copy {
  position: relative;
  z-index: 2;
  width: min(620px, 48%);
}

.phnx-home-kicker {
  margin: 0 0 13px;
  color: var(--phnx-cyan);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .09em;
}

.phnx-home-hero h1 {
  display: grid;
  gap: 0;
  width: max-content;
  max-width: 100%;
  margin: 0;
  line-height: .92;
}

.phnx-home-hero h1 span {
  color: #fbfbff;
  font-size: clamp(28px, 3.2vw, 51px);
  font-weight: 950;
  letter-spacing: -.035em;
  text-shadow: 0 5px 22px rgba(0, 0, 0, .55);
}

.phnx-home-hero h1 strong {
  display: block;
  width: max-content;
  max-width: 100%;
  margin-top: 8px;
  color: #ff3f42;
  background: linear-gradient(90deg, #ff285f 0%, #ff3f49 43%, #ff8d28 100%);
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(54px, 6.2vw, 100px);
  font-weight: 1000;
  letter-spacing: -.055em;
  text-shadow: 0 0 36px rgba(255, 50, 85, .2);
  -webkit-text-fill-color: transparent;
}

.phnx-home-hero h1 em {
  margin-top: 10px;
  color: #fff;
  font-size: clamp(15px, 1.55vw, 24px);
  font-style: normal;
  font-weight: 650;
  letter-spacing: .5em;
  line-height: 1.2;
  white-space: nowrap;
}

.phnx-home-lead {
  max-width: 600px;
  margin: 27px 0 0;
  color: #aeb9cf;
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 1.65;
}

.phnx-home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 26px;
}

.phnx-home-btn.btn {
  min-height: 48px;
  height: auto;
  padding: 0 28px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .015em;
  text-decoration: none;
}

.phnx-home-btn svg {
  width: 18px;
  height: 18px;
}

.phnx-home-btn-primary {
  border: 0;
  color: #fff;
  background: linear-gradient(100deg, #ff6f2a, #ff3357 58%, #bb22c8);
  box-shadow: 0 12px 28px rgba(255, 47, 104, .3), inset 0 1px rgba(255, 255, 255, .24);
}

.phnx-home-btn-primary:hover {
  color: #fff;
  filter: brightness(1.1);
  transform: translateY(-2px);
}

.phnx-home-btn-outline {
  border: 1px solid rgba(35, 209, 255, .55);
  color: var(--phnx-cyan);
  background: rgba(3, 14, 35, .78);
  box-shadow: inset 0 0 24px rgba(32, 220, 255, .04);
}

.phnx-home-btn-outline:hover {
  border-color: var(--phnx-cyan);
  color: #fff;
  background: rgba(20, 112, 157, .25);
}

.phnx-home-live-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.phnx-home-status.badge {
  min-height: 34px;
  height: auto;
  padding: 7px 12px;
  border: 1px solid rgba(93, 135, 200, .28);
  border-radius: 7px;
  color: #91cfee;
  background: rgba(3, 12, 30, .76);
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}

.phnx-home-status i,
.phnx-home-online-count i,
.phnx-home-online-user em i,
.phnx-home-panel-live i {
  display: inline-block;
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 11px currentColor;
}

.phnx-home-status.is-live {
  border-color: rgba(255, 45, 123, .58);
  color: #ff4087;
}

.phnx-home-status.sync { color: #39cfff; }
.phnx-home-status.archive { border-color: rgba(43, 231, 143, .32); color: #34e795; }
.phnx-home-status.guard { border-color: rgba(255, 190, 51, .3); color: #ffc244; }

.phnx-home-socials {
  position: absolute;
  z-index: 3;
  right: clamp(14px, 2.7vw, 44px);
  top: 50%;
  display: grid;
  gap: 12px;
  transform: translateY(-50%);
}

.phnx-home-socials a {
  display: grid;
  width: 48px;
  height: 52px;
  place-items: center;
  border: 1px solid rgba(50, 213, 255, .62);
  color: #35d9ff;
  background: rgba(3, 12, 31, .82);
  clip-path: polygon(50% 0, 92% 23%, 92% 77%, 50% 100%, 8% 77%, 8% 23%);
  text-decoration: none;
  transition: transform .2s ease, filter .2s ease;
}

.phnx-home-socials a:nth-child(1) { border-color: rgba(255, 52, 105, .8); color: #ff3a70; }
.phnx-home-socials a:nth-child(2) { border-color: rgba(255, 124, 37, .8); color: #ff8d29; }
.phnx-home-socials a:nth-child(3) { border-color: rgba(73, 122, 255, .85); color: #5592ff; }
.phnx-home-socials a:hover { filter: brightness(1.35); transform: scale(1.08); }
.phnx-home-socials b { font-size: 24px; }

.phnx-home-mobile-app {
  position: relative;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) minmax(245px, 290px);
  align-items: center;
  min-height: 164px;
  padding: 20px 28px;
  overflow: hidden;
  border: 1px solid rgba(255, 93, 48, .48);
  border-radius: 14px;
  background:
    radial-gradient(circle at 9% 50%, rgba(255, 77, 25, .22), transparent 17rem),
    radial-gradient(circle at 68% -20%, rgba(124, 43, 255, .18), transparent 27rem),
    linear-gradient(105deg, rgba(15, 11, 35, .98), rgba(5, 15, 37, .98) 48%, rgba(5, 11, 29, .98));
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 18px 40px rgba(0, 0, 0, .24);
}

.phnx-home-mobile-app::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, transparent 0 72%, rgba(31, 217, 255, .035) 72%),
    repeating-linear-gradient(120deg, transparent 0 34px, rgba(64, 138, 255, .024) 35px, transparent 36px);
}

.phnx-home-mobile-app::after {
  position: absolute;
  right: 24%;
  bottom: 0;
  width: 36%;
  height: 2px;
  content: "";
  background: linear-gradient(90deg, transparent, #ff4c29, #d72cff, transparent);
  box-shadow: 0 0 15px rgba(255, 57, 85, .8);
}

.phnx-home-mobile-app-visual {
  position: relative;
  z-index: 1;
  display: grid;
  width: 118px;
  height: 118px;
  place-items: center;
}

.phnx-home-mobile-app-orbit {
  position: absolute;
  inset: 3px;
  border: 1px solid rgba(255, 120, 30, .5);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255, 69, 22, .16), rgba(117, 31, 178, .08));
  box-shadow: inset 0 0 28px rgba(255, 84, 20, .12), 0 0 28px rgba(255, 54, 30, .14);
  transform: rotate(45deg);
}

.phnx-home-mobile-app-orbit::before,
.phnx-home-mobile-app-orbit::after {
  position: absolute;
  content: "";
  border-radius: 50%;
  background: #ff8528;
  box-shadow: 0 0 12px #ff4c2e;
}

.phnx-home-mobile-app-orbit::before { top: -4px; left: 50%; width: 7px; height: 7px; }
.phnx-home-mobile-app-orbit::after { right: -3px; bottom: 26%; width: 5px; height: 5px; background: #cf3dff; }

.phnx-home-mobile-app-icon {
  position: relative;
  z-index: 2;
  display: grid;
  width: 82px;
  height: 82px;
  place-items: center;
  border: 1px solid rgba(255, 118, 40, .48);
  border-radius: 25px;
  background: linear-gradient(150deg, #18102b, #080d20);
  box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 12px 25px rgba(0, 0, 0, .4);
}

.phnx-home-mobile-app-icon img {
  width: 68px;
  height: 68px;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(255, 76, 21, .42));
}

.phnx-home-mobile-app-copy,
.phnx-home-mobile-app-action { position: relative; z-index: 1; min-width: 0; }

.phnx-home-mobile-app-copy > p {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin: 0;
  color: #8293b3;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .08em;
}

.phnx-home-mobile-app-copy .badge {
  min-height: 25px;
  padding: 4px 9px;
  border: 1px solid rgba(255, 101, 43, .48);
  color: #ff9b45;
  background: rgba(255, 74, 26, .08);
  font-size: 9px;
  font-weight: 950;
}

.phnx-home-mobile-app-copy h2 {
  margin: 7px 0 0;
  color: #fff;
  font-size: clamp(27px, 2.5vw, 40px);
  font-weight: 1000;
  letter-spacing: -.035em;
  line-height: 1;
}

.phnx-home-mobile-app-copy h3 {
  margin: 7px 0 0;
  color: #aeb9d0;
  font-size: 13px;
  font-weight: 650;
}

.phnx-home-mobile-app-features {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-top: 12px;
}

.phnx-home-mobile-app-features span {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: #8da0c1;
  font-size: 10px;
  font-weight: 700;
}

.phnx-home-mobile-app-features i {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #23e692;
  box-shadow: 0 0 9px #23e692;
}

.phnx-home-mobile-app-action {
  display: grid;
  gap: 8px;
  justify-items: stretch;
  padding-left: 30px;
  border-left: 1px solid rgba(88, 128, 190, .22);
}

.phnx-home-mobile-app-platform {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #32dfff;
}

.phnx-home-mobile-app-platform > svg { width: 25px; height: 25px; }
.phnx-home-mobile-app-platform span { display: grid; }
.phnx-home-mobile-app-platform strong { color: #eef7ff; font-size: 12px; }
.phnx-home-mobile-app-platform small { color: #7f90ae; font-size: 9px; }

.phnx-home-mobile-app-download.btn {
  min-height: 43px;
  height: auto;
  border: 0;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(100deg, #ff6d27, #ff3455 62%, #ba27cb);
  box-shadow: 0 10px 24px rgba(255, 49, 86, .24), inset 0 1px rgba(255, 255, 255, .2);
  font-size: 11px;
  font-weight: 950;
  text-decoration: none;
}

.phnx-home-mobile-app-download.btn:hover { color: #fff; filter: brightness(1.1); transform: translateY(-1px); }
.phnx-home-mobile-app-download svg { width: 17px; height: 17px; }

.phnx-home-mobile-app-count {
  color: #8392ae;
  font-size: 9px;
  text-align: center;
}

.phnx-home-mobile-app-count strong { color: #31dcff; font-size: 11px; }

.phnx-home-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-auto-flow: row;
  gap: 14px;
  width: 100%;
  padding: 0 2px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.phnx-home-stat {
  --tone: #20dcff;
  position: relative;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  min-height: 104px;
  padding: 16px 14px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--tone) 52%, transparent);
  border-radius: 12px;
  background: linear-gradient(140deg, color-mix(in srgb, var(--tone) 8%, rgba(5, 14, 33, .95)), rgba(4, 12, 29, .95));
  box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 12px 28px rgba(0, 0, 0, .18);
}

.phnx-home-stat[data-tone="pink"] { --tone: #ff2780; }
.phnx-home-stat[data-tone="orange"] { --tone: #ff7a1a; }
.phnx-home-stat[data-tone="green"] { --tone: #22e986; }
.phnx-home-stat[data-tone="cyan"] { --tone: #20cfff; }
.phnx-home-stat[data-tone="violet"] { --tone: #cf42ff; }

.phnx-home-stat-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--tone) 52%, transparent);
  border-radius: 50%;
  color: var(--tone);
  background: color-mix(in srgb, var(--tone) 10%, rgba(4, 12, 29, .8));
  box-shadow: 0 0 24px color-mix(in srgb, var(--tone) 22%, transparent);
}

.phnx-home-stat .stat {
  min-width: 0;
  padding: 0 0 0 8px;
}

.phnx-home-stat .stat-title {
  overflow: hidden;
  color: color-mix(in srgb, var(--tone) 82%, #fff);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .045em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phnx-home-stat .stat-value {
  margin-top: 2px;
  overflow: hidden;
  color: #f8faff;
  font-size: clamp(22px, 2vw, 29px);
  font-weight: 900;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phnx-home-stat .stat-desc {
  margin-top: 4px;
  overflow: hidden;
  color: #8997b3;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phnx-home-sparkline {
  position: absolute;
  right: 12px;
  bottom: 10px;
  width: 64px;
  height: 25px;
  color: var(--spark);
  opacity: .82;
}

.phnx-home-sparkline path { stroke: currentColor; stroke-width: 1.8; }
.phnx-home-sparkline .fill { fill: color-mix(in srgb, var(--spark) 12%, transparent); stroke: none; }

.phnx-home-dashboard {
  display: grid;
  grid-template-columns: minmax(280px, .95fr) minmax(420px, 1.45fr) minmax(280px, .92fr);
  gap: 16px;
}

.phnx-home-panel.card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 330px;
  overflow: hidden;
  border: 1px solid var(--phnx-border);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(8, 18, 41, .96), rgba(4, 11, 27, .96));
  box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 18px 38px rgba(0, 0, 0, .22);
}

.phnx-home-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 21px 24px 8px;
}

.phnx-home-panel h2 {
  margin: 0;
  color: var(--phnx-cyan);
  font-size: 16px;
  font-weight: 950;
  letter-spacing: .025em;
}

.phnx-home-activity { border-color: rgba(255, 42, 120, .34) !important; }
.phnx-home-activity h2 { color: #ff3b86; }
.phnx-home-panel-live { display: inline-flex; gap: 5px; align-items: center; color: #ff3b86; font-size: 9px; font-weight: 900; }

.phnx-home-activity > div,
.phnx-home-quick > div {
  display: grid;
  gap: 2px;
  padding: 4px 20px 8px;
}

.phnx-home-activity-row,
.phnx-home-quick-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 55px;
  padding: 7px 8px;
  border-bottom: 1px solid rgba(103, 132, 184, .11);
  color: #f2f5fd;
  text-decoration: none;
}

.phnx-home-activity-row > span:nth-child(2),
.phnx-home-quick-row > span:nth-child(2) {
  display: grid;
  min-width: 0;
}

.phnx-home-activity-row strong,
.phnx-home-quick-row strong {
  overflow: hidden;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phnx-home-activity-row small,
.phnx-home-quick-row small {
  margin-top: 2px;
  overflow: hidden;
  color: #8492ac;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phnx-home-activity-row time {
  color: #7e8ba6;
  font-size: 9px;
  white-space: nowrap;
}

.phnx-home-row-icon {
  --row-tone: #29d8ff;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--row-tone) 22%, transparent);
  border-radius: 8px;
  color: var(--row-tone);
  background: color-mix(in srgb, var(--row-tone) 7%, rgba(4, 13, 30, .8));
}

.phnx-home-row-icon svg { width: 18px; height: 18px; }
.phnx-home-row-icon[data-tone="pink"] { --row-tone: #ff3b86; }
.phnx-home-row-icon[data-tone="gold"] { --row-tone: #ffbd31; }
.phnx-home-row-icon[data-tone="green"] { --row-tone: #27e990; }
.phnx-home-row-icon[data-tone="cyan"] { --row-tone: #20dcff; }

.phnx-home-inline-link {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  width: fit-content;
  margin: auto 20px 18px;
  color: #ff3b86;
  font-size: 10px;
  font-weight: 850;
  text-decoration: none;
}

.phnx-home-inline-link svg { width: 14px; height: 14px; }
.phnx-home-inline-link:hover { color: #fff; }

.phnx-home-pass {
  position: relative;
  border-color: rgba(255, 46, 143, .38) !important;
  background:
    linear-gradient(90deg, rgba(15, 5, 38, .98), rgba(22, 5, 45, .78) 49%, rgba(11, 4, 33, .18) 100%),
    var(--pass-art) 69% 50% / cover no-repeat !important;
}

.phnx-home-pass::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background: radial-gradient(circle at 76% 44%, rgba(255, 36, 175, .17), transparent 34%);
}

.phnx-home-pass-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 60%;
  padding: 34px 30px;
}

.phnx-home-pass-copy > small {
  color: #a78caf;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .12em;
}

.phnx-home-pass h2 {
  margin: 5px 0 3px;
  color: #df48ff;
  font-size: clamp(29px, 3vw, 44px);
  line-height: 1;
  text-shadow: 0 0 24px rgba(220, 55, 255, .48);
}

.phnx-home-pass h3 {
  margin: 2px 0 14px;
  color: #f5f7ff;
  font-size: 11px;
  letter-spacing: .085em;
}

.phnx-home-pass ul {
  display: grid;
  gap: 8px;
  margin: 0 0 22px;
  padding: 0;
  color: #b4bfd2;
  font-size: 10px;
  list-style: none;
}

.phnx-home-pass li { display: flex; gap: 8px; align-items: center; }
.phnx-home-pass li i { width: 8px; height: 8px; border-radius: 50%; background: #36deba; box-shadow: 0 0 10px rgba(54, 222, 186, .7); }
.phnx-home-pass .phnx-home-btn { min-height: 43px; padding: 0 21px; font-size: 10px; }

.phnx-home-quick-row {
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  border-radius: 8px;
  transition: background .2s ease, transform .2s ease;
}

.phnx-home-quick-row > svg { width: 16px; height: 16px; color: #49d8ff; }
.phnx-home-quick-row:hover { color: #fff; background: rgba(26, 115, 170, .12); transform: translateX(3px); }
.phnx-home-quick .phnx-home-inline-link { color: var(--phnx-cyan); }

.phnx-home-guard.card {
  display: grid;
  grid-template-columns: minmax(260px, 1.35fr) repeat(4, minmax(150px, 1fr)) auto;
  gap: 16px;
  align-items: center;
  min-height: 82px;
  padding: 13px 18px;
  overflow: hidden;
  border: 1px solid rgba(126, 118, 170, .26);
  border-radius: 13px;
  background: linear-gradient(95deg, rgba(26, 11, 37, .93), rgba(7, 15, 31, .96) 34%, rgba(8, 13, 26, .98));
}

.phnx-home-guard-brand,
.phnx-home-guard-feature {
  display: flex;
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.phnx-home-guard-brand img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  filter: drop-shadow(0 0 13px rgba(255, 44, 119, .32));
}

.phnx-home-guard-brand span,
.phnx-home-guard-feature span { display: grid; min-width: 0; }
.phnx-home-guard-brand strong { color: #ff3f9d; font-size: 16px; }
.phnx-home-guard-brand small,
.phnx-home-guard-feature small { margin-top: 2px; overflow: hidden; color: #7f8aa1; font-size: 8px; line-height: 1.4; text-overflow: ellipsis; }

.phnx-home-guard-feature > i {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(255, 196, 76, .26);
  border-radius: 50%;
  color: #e6ebf5;
  background: rgba(125, 82, 33, .13);
}

.phnx-home-guard-feature svg { width: 18px; height: 18px; }
.phnx-home-guard-feature strong { overflow: hidden; color: #eef2fc; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.phnx-home-guard-more.btn {
  min-height: 38px;
  height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(118, 143, 192, .22);
  border-radius: 7px;
  color: #eaf1ff;
  background: rgba(4, 12, 27, .78);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}

.phnx-home-guard-more svg { width: 14px; height: 14px; }

.phnx-home-online {
  display: grid;
  gap: 13px;
  margin-top: 4px;
  padding: 22px 22px 24px;
  border: 1px solid rgba(38, 220, 147, .22);
  border-radius: 14px;
  background:
    radial-gradient(circle at 86% 16%, rgba(39, 225, 142, .06), transparent 28rem),
    linear-gradient(145deg, rgba(6, 17, 36, .93), rgba(3, 11, 27, .95));
}

.phnx-home-online > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.phnx-home-online > header span:first-child { display: grid; gap: 3px; }
.phnx-home-online > header small { color: #31e493; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.phnx-home-online h2 { margin: 0; color: #f5f8ff; font-size: 20px; letter-spacing: .025em; }

.phnx-home-online-count.badge {
  display: inline-flex;
  gap: 8px;
  min-height: 34px;
  height: auto;
  padding: 7px 12px;
  border: 1px solid rgba(42, 231, 146, .34);
  border-radius: 999px;
  color: #32e694;
  background: rgba(19, 90, 66, .14);
  font-size: 10px;
  font-weight: 850;
}

.phnx-home-online-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.phnx-home-online-user.card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 76px;
  padding: 12px;
  border: 1px solid rgba(68, 126, 170, .2);
  border-radius: 10px;
  color: #f5f8ff;
  background: rgba(5, 15, 33, .78);
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, transform .2s ease, background .2s ease;
}

.phnx-home-online-user:hover {
  border-color: rgba(43, 230, 145, .5);
  background: rgba(9, 34, 48, .9);
  transform: translateY(-2px);
}

.phnx-home-online-avatar {
  display: block;
  width: 46px;
  height: 46px;
  overflow: hidden;
  border: 2px solid rgba(42, 229, 143, .72);
  border-radius: 50%;
  background: #08172b;
  box-shadow: 0 0 16px rgba(42, 229, 143, .14);
}

.phnx-home-online-avatar img { width: 100%; height: 100%; object-fit: cover; }
.phnx-home-online-user > span:nth-child(2) { display: grid; min-width: 0; }
.phnx-home-online-user strong,
.phnx-home-online-user small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.phnx-home-online-user strong { font-size: 11px; }
.phnx-home-online-user small { margin-top: 2px; color: #8594ae; font-size: 9px; }
.phnx-home-online-user em { grid-column: 2; display: inline-flex; gap: 5px; align-items: center; color: #32e694; font-size: 8px; font-style: normal; font-weight: 800; }
.phnx-home-online-user em i { width: 6px; height: 6px; }

.phnx-home-empty {
  display: grid;
  min-height: 110px;
  place-items: center;
  padding: 20px;
  color: #8190aa;
  font-size: 11px;
  text-align: center;
}

.phnx-home-online-empty { grid-column: 1 / -1; min-height: 82px; }

.phnx-home-load-error.card {
  display: grid;
  gap: 10px;
  justify-items: start;
  padding: 32px;
  border: 1px solid rgba(255, 66, 103, .35);
  border-radius: 14px;
  color: #ff809a;
  background: rgba(43, 9, 27, .72);
}

.phnx-home-load-error span { color: #aeb9cf; }

.phnx-home-skeleton,
.phnx-home-skeleton-row {
  min-height: 110px;
  border-radius: 13px;
  background: linear-gradient(100deg, rgba(8, 19, 42, .95) 20%, rgba(17, 38, 70, .96) 38%, rgba(8, 19, 42, .95) 56%);
  background-size: 260% 100%;
  animation: phnx-home-skeleton 1.5s linear infinite;
}

.phnx-home-skeleton.hero { min-height: 500px; }
.phnx-home-skeleton-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; background: none; animation: none; }
.phnx-home-skeleton-row.panels { grid-template-columns: 1fr 1.5fr 1fr; }
.phnx-home-skeleton-row.panels > * { min-height: 330px; }

@keyframes phnx-home-skeleton { to { background-position: -160% 0; } }

@media (max-width: 1320px) {
  .phnx-home-stat.stats { grid-template-columns: 45px minmax(0, 1fr); padding-inline: 11px; }
  .phnx-home-stat-icon { width: 40px; height: 40px; }
  .phnx-home-stat-icon svg { width: 19px; height: 19px; }
  .phnx-home-guard.card { grid-template-columns: minmax(240px, 1.25fr) repeat(2, minmax(170px, 1fr)) auto; }
  .phnx-home-guard-feature:nth-of-type(4),
  .phnx-home-guard-feature:nth-of-type(5) { display: none; }
}

@media (max-width: 1120px) {
  .phnx-home-hero-copy { width: min(620px, 58%); }
  .phnx-home-mobile-app { grid-template-columns: 125px minmax(0, 1fr) minmax(220px, 250px); padding-inline: 20px; }
  .phnx-home-mobile-app-visual { width: 105px; height: 105px; }
  .phnx-home-mobile-app-action { padding-left: 20px; }
  .phnx-home-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .phnx-home-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .phnx-home-pass { grid-column: 1 / -1; min-height: 360px !important; order: -1; }
  .phnx-home-online-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .phnx-home-skeleton-row { grid-template-columns: repeat(3, 1fr); }
  .phnx-home-skeleton-row.panels { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 820px) {
  .home-overview-root.phnx-command-home { gap: 12px; }
  .phnx-home-hero {
    min-height: 545px;
    padding: 34px 24px;
    background:
      linear-gradient(90deg, rgba(2, 7, 20, .98), rgba(2, 8, 25, .82) 62%, rgba(2, 8, 25, .24)),
      linear-gradient(180deg, rgba(2, 7, 20, .12), rgba(2, 7, 20, .92) 92%),
      var(--hero-art) 63% 50% / cover no-repeat;
  }
  .phnx-home-hero-copy { width: 82%; }
  .phnx-home-socials { right: 12px; }
  .phnx-home-mobile-app { grid-template-columns: 105px minmax(0, 1fr); gap: 4px 16px; }
  .phnx-home-mobile-app-visual { grid-row: 1 / 3; width: 96px; height: 96px; }
  .phnx-home-mobile-app-icon { width: 68px; height: 68px; border-radius: 20px; }
  .phnx-home-mobile-app-icon img { width: 57px; height: 57px; }
  .phnx-home-mobile-app-copy h2 { font-size: 28px; }
  .phnx-home-mobile-app-action { grid-column: 2; grid-template-columns: minmax(120px, .8fr) minmax(170px, 1fr); align-items: center; padding: 11px 0 0; border-top: 1px solid rgba(88, 128, 190, .18); border-left: 0; }
  .phnx-home-mobile-app-count { grid-column: 2; }
  .phnx-home-stat.stats { min-height: 94px; }
  .phnx-home-guard.card { grid-template-columns: 1fr auto; }
  .phnx-home-guard-feature { display: none; }
  .phnx-home-online-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  body[data-route="home"] > main > .view.home-overview-v2[data-view="home"]:not([hidden]) { padding-inline: 0 !important; }
  .home-overview-root.phnx-command-home { gap: 10px; }
  .phnx-home-hero {
    min-height: 620px;
    padding: 30px 18px 26px;
    background:
      linear-gradient(180deg, rgba(2, 7, 20, .42), rgba(2, 7, 20, .8) 43%, rgba(2, 7, 20, .99) 77%),
      var(--hero-art) 68% 17% / auto 66% no-repeat,
      #020714;
  }
  .phnx-home-hero-copy { align-self: end; width: 100%; padding-right: 0; }
  .phnx-home-kicker { font-size: 9px; }
  .phnx-home-hero h1 span { font-size: clamp(28px, 9vw, 38px); }
  .phnx-home-hero h1 strong { font-size: clamp(58px, 18vw, 78px); }
  .phnx-home-hero h1 em { font-size: 13px; letter-spacing: .32em; }
  .phnx-home-lead { margin-top: 20px; font-size: 13px; }
  .phnx-home-actions { gap: 9px; margin-top: 18px; }
  .phnx-home-btn.btn { flex: 1; min-height: 44px; padding: 0 12px; font-size: 10px; }
  .phnx-home-live-meta { gap: 6px; margin-top: 18px; }
  .phnx-home-status.badge { min-height: 29px; padding: 5px 8px; font-size: 8px; }
  .phnx-home-socials { top: 22px; right: 13px; display: flex; transform: none; }
  .phnx-home-socials a { width: 37px; height: 41px; }
  .phnx-home-socials svg { width: 17px; height: 17px; }
  .phnx-home-socials b { font-size: 18px; }
  .phnx-home-mobile-app { grid-template-columns: 78px minmax(0, 1fr); gap: 12px; margin-inline: 10px; padding: 17px 15px; border-radius: 11px; }
  .phnx-home-mobile-app-visual { grid-row: auto; width: 72px; height: 72px; }
  .phnx-home-mobile-app-orbit { border-radius: 22px; }
  .phnx-home-mobile-app-icon { width: 55px; height: 55px; border-radius: 17px; }
  .phnx-home-mobile-app-icon img { width: 46px; height: 46px; }
  .phnx-home-mobile-app-copy > p { gap: 6px; font-size: 8px; }
  .phnx-home-mobile-app-copy .badge { min-height: 21px; font-size: 7px; }
  .phnx-home-mobile-app-copy h2 { margin-top: 5px; font-size: 22px; }
  .phnx-home-mobile-app-copy h3 { font-size: 10px; }
  .phnx-home-mobile-app-features { grid-column: 1 / -1; gap: 8px 12px; }
  .phnx-home-mobile-app-features span { font-size: 8px; }
  .phnx-home-mobile-app-action { grid-column: 1 / -1; grid-template-columns: 1fr; gap: 7px; padding-top: 12px; }
  .phnx-home-mobile-app-platform { justify-content: center; }
  .phnx-home-mobile-app-download.btn { min-height: 42px; }
  .phnx-home-mobile-app-count { grid-column: auto; }
  .phnx-home-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 0 10px; }
  .phnx-home-stat.stats { min-height: 87px; grid-template-columns: 37px minmax(0, 1fr); padding: 10px 8px; border-radius: 9px; }
  .phnx-home-stat-icon { width: 34px; height: 34px; }
  .phnx-home-stat .stat { padding-left: 5px; }
  .phnx-home-stat .stat-title { font-size: 8px; }
  .phnx-home-stat .stat-value { font-size: 19px; }
  .phnx-home-stat .stat-desc { font-size: 7px; }
  .phnx-home-sparkline { width: 46px; height: 18px; }
  .phnx-home-dashboard { display: flex; flex-direction: column; padding: 0 10px; }
  .phnx-home-panel.card { min-height: 320px; }
  .phnx-home-pass { min-height: 390px !important; order: 0; background-position: 64% 50% !important; }
  .phnx-home-pass-copy { width: 76%; padding: 28px 20px; }
  .phnx-home-pass h2 { font-size: 31px; }
  .phnx-home-pass h3 { font-size: 9px; }
  .phnx-home-guard.card { margin-inline: 10px; padding: 12px; }
  .phnx-home-guard-brand img { width: 44px; height: 44px; }
  .phnx-home-guard-brand small { max-width: 185px; }
  .phnx-home-guard-more.btn { width: 38px; min-width: 38px; padding: 0; font-size: 0; }
  .phnx-home-online { margin: 0 10px; padding: 18px 14px; }
  .phnx-home-online h2 { font-size: 16px; }
  .phnx-home-online-count.badge { min-height: 30px; font-size: 8px; }
  .phnx-home-online-grid { grid-template-columns: 1fr; }
  .phnx-home-online-user.card { min-height: 70px; }
  .phnx-home-skeleton.hero { min-height: 620px; }
  .phnx-home-skeleton-row,
  .phnx-home-skeleton-row.panels { grid-template-columns: 1fr; padding-inline: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .phnx-home-skeleton,
  .phnx-home-socials a,
  .phnx-home-online-user,
  .phnx-home-quick-row,
  .phnx-home-btn { animation: none !important; transition: none !important; }
}