/*
 * Acki Nacki Radar — cinematic HUD overrides
 * Scope: login + authenticated dashboard only.
 * This file intentionally changes no markup, IDs, auth flow or API contracts.
 */

#login-section,
#dashboard-section {
  --hud-black: #010304;
  --hud-black-2: #030708;
  --hud-panel: rgba(5, 11, 13, 0.965);
  --hud-panel-hi: rgba(8, 21, 24, 0.94);
  --hud-lime: #2ff8ff;
  --hud-lime-hot: #6afcff;
  --hud-lime-dim: #31a6ad;
  --hud-line: rgba(54, 212, 222, 0.34);
  --hud-line-hot: rgba(47, 248, 255, 0.7);
  --hud-grid: rgba(62, 222, 232, 0.042);
  --hud-copy: #dff1f3;
  --hud-muted: #758b8f;
  --hud-warn: #ff9f1c;
  --hud-cut: 14px;
  color: var(--hud-copy);
}

:is(#login-section, #dashboard-section) :focus-visible {
  outline: 1px solid var(--hud-lime);
  outline-offset: 3px;
}

/* ========================= LOGIN / AUTH ========================= */

#login-section.auth {
  position: relative;
  isolation: isolate;
  width: min(100%, 510px);
  max-width: 510px;
  margin: 36px auto 12px;
  padding: 30px 30px 28px;
  border: 1px solid var(--hud-line);
  border-radius: 0;
  clip-path: polygon(
    18px 0,
    calc(100% - 18px) 0,
    100% 18px,
    100% calc(100% - 18px),
    calc(100% - 18px) 100%,
    18px 100%,
    0 calc(100% - 18px),
    0 18px
  );
  background:
    linear-gradient(90deg, var(--hud-grid) 1px, transparent 1px),
    linear-gradient(var(--hud-grid) 1px, transparent 1px),
    radial-gradient(circle at 50% 24%, rgba(47, 248, 255, 0.1), transparent 38%),
    linear-gradient(155deg, rgba(7, 17, 20, 0.99), rgba(1, 4, 5, 0.99));
  background-size: 28px 28px, 28px 28px, auto, auto;
  box-shadow:
    inset 0 0 0 1px rgba(47, 248, 255, 0.035),
    inset 0 0 80px rgba(42, 178, 190, 0.035),
    0 28px 90px rgba(0, 0, 0, 0.58);
}

#login-section.auth::before,
#login-section.auth::after {
  content: "";
  position: absolute;
  z-index: 4;
  width: 72px;
  height: 9px;
  pointer-events: none;
}

#login-section.auth::before {
  top: 10px;
  left: 26px;
  border-top: 1px solid var(--hud-lime);
  border-left: 1px solid var(--hud-lime);
}

#login-section.auth::after {
  right: 26px;
  bottom: 10px;
  border-right: 1px solid var(--hud-lime);
  border-bottom: 1px solid var(--hud-lime);
}

#login-section .radar-wrap {
  width: 238px;
  margin: 10px 0 22px;
  filter: drop-shadow(0 0 18px rgba(47, 248, 255, 0.16));
}

#login-section .radar-wrap::before {
  content: "";
  position: absolute;
  inset: -10px;
  border: 1px dashed rgba(47, 248, 255, 0.22);
  border-radius: 50%;
  animation: hud-auth-orbit 18s linear infinite reverse;
}

#login-section .radar-ring {
  border-color: rgba(47, 248, 255, 0.48);
  box-shadow: inset 0 0 18px rgba(47, 248, 255, 0.025);
}

#login-section .radar-cross::before,
#login-section .radar-cross::after {
  background: linear-gradient(transparent, rgba(47, 248, 255, 0.42), transparent);
}

#login-section .radar-sweep {
  background: conic-gradient(
    from 0deg,
    rgba(47, 248, 255, 0.34) 0deg,
    rgba(47, 248, 255, 0.06) 34deg,
    transparent 70deg,
    transparent 360deg
  );
  animation-duration: 5.6s;
}

#login-section .radar-core {
  border-radius: 2px;
  background: #020506;
  box-shadow:
    0 0 0 1px rgba(47, 248, 255, 0.68),
    0 0 0 8px rgba(47, 248, 255, 0.035),
    0 0 32px rgba(47, 248, 255, 0.22);
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px);
}

#login-section .radar-core img {
  border-radius: 0;
}

#login-section .ping {
  background: var(--hud-lime-hot);
  box-shadow: 0 0 4px 1px var(--hud-lime), 0 0 16px 4px rgba(47, 248, 255, 0.32);
}

#login-section .auth-head h1 {
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(27px, 7vw, 37px);
  font-weight: 700;
  letter-spacing: -0.035em;
  text-transform: uppercase;
}

#login-section .auth-head h1::before,
#login-section .auth-head h1::after {
  content: "";
  display: inline-block;
  width: 32px;
  height: 1px;
  margin: 0 11px 9px;
  background: linear-gradient(90deg, transparent, var(--hud-lime));
  box-shadow: 0 0 8px rgba(47, 248, 255, 0.45);
}

#login-section .auth-head h1::after {
  background: linear-gradient(90deg, var(--hud-lime), transparent);
}

#login-section .auth h1 .accent,
#login-section h1 .accent {
  color: var(--hud-lime);
  background: none;
  filter: drop-shadow(0 0 12px rgba(47, 248, 255, 0.32));
  -webkit-text-fill-color: currentColor;
}

#login-section .sub {
  max-width: 360px;
  margin: 11px 0 22px;
  color: var(--hud-muted);
  font: 500 11px/1.7 "JetBrains Mono", monospace;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

#login-section .authcard {
  position: relative;
  padding: 6px;
  overflow: hidden;
  border: 1px solid var(--hud-line-hot);
  border-radius: 0;
  clip-path: polygon(13px 0, 100% 0, 100% calc(100% - 13px), calc(100% - 13px) 100%, 0 100%, 0 13px);
  background:
    linear-gradient(180deg, rgba(47, 248, 255, 0.04), transparent 30%),
    var(--hud-panel);
  box-shadow: inset 0 0 26px rgba(47, 248, 255, 0.025);
}

#login-section .authcard::before {
  content: "";
  position: absolute;
  top: 0;
  left: 22px;
  width: 54px;
  height: 2px;
  background: var(--hud-lime);
  box-shadow: 0 0 10px rgba(47, 248, 255, 0.48);
}

#login-section .tabs {
  border: 1px solid rgba(47, 248, 255, 0.16);
  border-radius: 0;
  background: #020607;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}

#login-section .tab {
  min-height: 40px;
  border-radius: 0;
  font: 600 11px "JetBrains Mono", monospace;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

#login-section #tab-tg[aria-selected="true"] {
  color: #eaf8ff;
  background: linear-gradient(135deg, #188fc9, #0870ad);
  box-shadow: inset 0 0 0 1px rgba(121, 218, 255, 0.2), 0 0 20px rgba(34, 158, 217, 0.18);
}

#login-section .tabbody {
  min-height: 176px;
  padding: 23px 18px 16px;
}

#login-section .tabpane .lead {
  color: #869da0;
  font: 400 12px/1.7 "Inter", sans-serif;
}

#login-section .tabpane .lead b {
  color: var(--hud-copy);
}

#login-section .btn,
#dashboard-section .btn {
  border-radius: 0;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

#login-section #tg-login-btn {
  min-height: 44px;
  border: 1px solid rgba(113, 212, 255, 0.55);
  color: #f1fbff;
  background: linear-gradient(135deg, #219ed8, #0b78b7);
  box-shadow: 0 0 26px rgba(34, 158, 217, 0.23);
}

#login-section #tg-login-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #31b2ea, #1085c6);
  box-shadow: 0 0 34px rgba(34, 158, 217, 0.34);
}

#login-section .authfoot {
  color: #5f6d70;
  font: 500 9px/1.8 "JetBrains Mono", monospace;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

#login-section .authfoot a {
  color: var(--hud-lime-dim);
}

/* ========================= DASHBOARD ========================= */

#dashboard-section.panel {
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: 1440px;
  padding-top: 14px;
}

#dashboard-section.panel::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -18px -24px -42px;
  pointer-events: none;
  background:
    linear-gradient(90deg, var(--hud-grid) 1px, transparent 1px),
    linear-gradient(var(--hud-grid) 1px, transparent 1px),
    radial-gradient(circle at 56% 6%, rgba(47, 248, 255, 0.08), transparent 32%);
  background-size: 36px 36px, 36px 36px, auto;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.68) 75%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.68) 75%, transparent 100%);
}

#dashboard-section .dashboard-shell {
  grid-template-columns: 242px minmax(0, 1fr);
  gap: 14px;
}

#dashboard-section .side-nav {
  top: 82px;
  min-height: calc(100vh - 104px);
  padding: 17px 12px 14px;
  overflow: hidden;
  border: 1px solid var(--hud-line);
  border-radius: 0;
  clip-path: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px);
  background:
    linear-gradient(180deg, rgba(47, 248, 255, 0.035), transparent 18%),
    linear-gradient(160deg, rgba(6, 14, 16, 0.985), rgba(1, 5, 6, 0.985));
  box-shadow: inset 0 0 0 1px rgba(47, 248, 255, 0.025), 0 26px 70px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(18px);
}

#dashboard-section .side-nav::before {
  content: "";
  position: absolute;
  top: 0;
  left: 28px;
  width: 66px;
  height: 2px;
  background: var(--hud-lime);
  box-shadow: 0 0 12px rgba(47, 248, 255, 0.55);
}

#dashboard-section .side-nav::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 28px;
  height: 7px;
  border-right: 1px solid var(--hud-lime-dim);
  border-bottom: 1px solid var(--hud-lime-dim);
}

#dashboard-section .side-nav-head {
  margin-bottom: 10px;
  padding: 8px 9px 17px;
  border-bottom-color: rgba(47, 248, 255, 0.15);
}

#dashboard-section .side-nav-head b {
  color: var(--hud-copy);
  font: 700 13px "Space Grotesk", sans-serif;
  letter-spacing: 0.015em;
}

#dashboard-section .side-nav-head span {
  color: #68969b;
  font-family: "JetBrains Mono", monospace;
  letter-spacing: 0.16em;
}

#dashboard-section .side-nav-links {
  gap: 4px;
}

#dashboard-section .side-link {
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 0;
  clip-path: polygon(7px 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%, 0 7px);
  color: #7d8d90;
  font: 500 11px "JetBrains Mono", monospace;
  letter-spacing: -0.01em;
}

#dashboard-section .side-link svg {
  width: 16px;
  height: 16px;
  color: #607072;
}

#dashboard-section .side-link:hover,
#dashboard-section .side-link.active {
  color: var(--hud-copy);
  border-color: rgba(47, 248, 255, 0.24);
  background:
    linear-gradient(90deg, rgba(47, 248, 255, 0.13), rgba(47, 248, 255, 0.025) 70%, transparent);
}

#dashboard-section .side-link.active::before {
  left: 0;
  width: 2px;
  height: 24px;
  border-radius: 0;
  background: var(--hud-lime);
  box-shadow: 0 0 12px rgba(47, 248, 255, 0.7);
}

#dashboard-section .side-link.active svg {
  color: var(--hud-lime);
  filter: drop-shadow(0 0 6px rgba(47, 248, 255, 0.28));
}

#dashboard-section .side-link .nav-tag,
#dashboard-section .product-status {
  border-radius: 0;
  clip-path: polygon(4px 0, 100% 0, 100% calc(100% - 4px), calc(100% - 4px) 100%, 0 100%, 0 4px);
  font-family: "JetBrains Mono", monospace;
}

#dashboard-section .side-nav-foot {
  color: #536265;
  font: 500 9px/1.6 "JetBrains Mono", monospace;
  letter-spacing: 0.04em;
}

#dashboard-section .side-nav-foot b {
  color: var(--hud-lime);
  letter-spacing: 0.13em;
}

#dashboard-section .dashboard-hero {
  min-height: 146px;
  margin-bottom: 11px;
  padding: 26px 28px;
  overflow: hidden;
  border: 1px solid var(--hud-line-hot);
  border-radius: 0;
  clip-path: polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px);
  background:
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(47, 248, 255, 0.013) 3px 4px),
    radial-gradient(circle at 88% 24%, rgba(47, 248, 255, 0.14), transparent 27%),
    linear-gradient(118deg, rgba(8, 24, 28, 0.98), rgba(2, 6, 8, 0.98));
  box-shadow: inset 0 0 70px rgba(47, 248, 255, 0.025), 0 22px 60px rgba(0, 0, 0, 0.38);
}

#dashboard-section .dashboard-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 26px;
  width: 96px;
  height: 2px;
  background: var(--hud-lime);
  box-shadow: 0 0 14px rgba(47, 248, 255, 0.62);
}

#dashboard-section .dashboard-hero::after {
  right: -62px;
  top: -112px;
  width: 290px;
  height: 290px;
  border-color: rgba(47, 248, 255, 0.18);
  border-radius: 50%;
  box-shadow:
    0 0 0 30px rgba(47, 248, 255, 0.02),
    0 0 0 62px rgba(47, 248, 255, 0.012),
    0 0 58px rgba(47, 248, 255, 0.05);
}

#dashboard-section .hero-kicker,
#dashboard-section .section-index {
  color: var(--hud-lime);
  font: 700 9px "JetBrains Mono", monospace;
  letter-spacing: 0.19em;
  text-shadow: 0 0 12px rgba(47, 248, 255, 0.38);
}

#dashboard-section .dashboard-hero h1 {
  margin: 12px 0 8px;
  color: #e9f7f8;
  font-size: clamp(25px, 3vw, 38px);
  font-weight: 700;
  text-shadow: 0 0 28px rgba(47, 248, 255, 0.12);
}

#dashboard-section .dashboard-hero p {
  max-width: 720px;
  color: #7d9396;
  font-size: 12px;
  line-height: 1.65;
}

#dashboard-section .hero-live {
  top: 21px;
  right: 24px;
  padding: 6px 9px;
  border: 1px solid rgba(47, 248, 255, 0.22);
  color: #69d2da;
  background: rgba(1, 5, 6, 0.62);
  clip-path: polygon(5px 0, 100% 0, 100% calc(100% - 5px), calc(100% - 5px) 100%, 0 100%, 0 5px);
}

#dashboard-section .hero-live i {
  background: var(--hud-lime);
  box-shadow: 0 0 14px 3px rgba(47, 248, 255, 0.62);
}

#dashboard-section .readout {
  gap: 9px;
  margin: 10px 0 12px;
}

#dashboard-section .stat {
  position: relative;
  min-height: 91px;
  padding: 16px 17px 14px;
  overflow: hidden;
  border: 1px solid var(--hud-line);
  border-radius: 0;
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  background:
    linear-gradient(135deg, rgba(47, 248, 255, 0.07), transparent 62%),
    var(--hud-panel);
  box-shadow: inset 0 0 24px rgba(47, 248, 255, 0.02), 0 10px 28px rgba(0, 0, 0, 0.22);
}

#dashboard-section .stat::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 10px;
  width: 34px;
  height: 3px;
  opacity: 0.45;
  background: repeating-linear-gradient(90deg, var(--hud-lime) 0 2px, transparent 2px 4px);
}

#dashboard-section .stat b {
  margin-bottom: 9px;
  color: var(--hud-lime);
  font-size: clamp(21px, 2vw, 28px);
  text-shadow: 0 0 18px rgba(47, 248, 255, 0.32);
}

#dashboard-section .stat span {
  color: #758d90;
  font-size: 8.5px;
  letter-spacing: 0.15em;
}

#dashboard-section .card,
#dashboard-section .product-card,
#dashboard-section .support-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--hud-line);
  border-radius: 0;
  clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
  background:
    linear-gradient(180deg, rgba(47, 248, 255, 0.027), transparent 35%),
    linear-gradient(145deg, rgba(6, 14, 16, 0.975), rgba(2, 6, 7, 0.975));
  box-shadow: inset 0 0 0 1px rgba(47, 248, 255, 0.018), 0 18px 48px rgba(0, 0, 0, 0.26);
}

#dashboard-section .card {
  margin-bottom: 11px;
  padding: 20px;
}

#dashboard-section .card::before,
#dashboard-section .product-card::before,
#dashboard-section .support-card::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 22px;
  width: 48px;
  height: 1px;
  background: var(--hud-lime-dim);
  box-shadow: 0 0 8px rgba(47, 248, 255, 0.36);
  pointer-events: none;
}

#dashboard-section .card h2 {
  margin-bottom: 15px;
  color: #e4f3f4;
  font: 700 12px "JetBrains Mono", monospace;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

#dashboard-section .card h2 svg {
  color: var(--hud-lime);
  filter: drop-shadow(0 0 5px rgba(47, 248, 255, 0.25));
}

#dashboard-section .card-hint,
#dashboard-section .monitor-note,
#dashboard-section .muted,
#dashboard-section .note,
#dashboard-section .empty {
  color: var(--hud-muted);
}

#dashboard-section .mining-row {
  gap: 11px;
}

#dashboard-section .row {
  border-bottom-color: rgba(47, 248, 255, 0.1);
}

#dashboard-section .row .label,
#dashboard-section .row-main .meta,
#dashboard-section .rw span,
#dashboard-section .monitor-total,
#dashboard-section .epoch-meta {
  color: var(--hud-muted);
}

#dashboard-section .row-main .name,
#dashboard-section .rw b,
#dashboard-section .monitor-total b,
#dashboard-section .epoch-meta b {
  color: var(--hud-lime);
  font-family: "JetBrains Mono", monospace;
}

#dashboard-section #reward-feed {
  scrollbar-color: rgba(47, 248, 255, 0.38) transparent;
}

#dashboard-section #reward-feed::-webkit-scrollbar-thumb {
  border-radius: 0;
  background: rgba(47, 248, 255, 0.38);
}

#dashboard-section .status-pill,
#dashboard-section .miner-toggle,
#dashboard-section .cycle-bar {
  border-radius: 0;
}

#dashboard-section .status-pill.active {
  border-color: rgba(47, 248, 255, 0.45);
  color: var(--hud-lime);
  background: rgba(47, 248, 255, 0.1);
}

#dashboard-section .miner-toggle {
  clip-path: polygon(5px 0, 100% 0, 100% calc(100% - 5px), calc(100% - 5px) 100%, 0 100%, 0 5px);
  font-family: "JetBrains Mono", monospace;
}

#dashboard-section .miner-toggle.start,
#dashboard-section .cycle-bar i {
  color: var(--hud-lime);
  border-color: var(--hud-lime-dim);
  background-color: var(--hud-lime);
}

#dashboard-section input[type="text"],
#dashboard-section select,
#dashboard-section textarea,
#dashboard-section .support-form input,
#dashboard-section .support-form select,
#dashboard-section .support-form textarea {
  border: 1px solid rgba(47, 248, 255, 0.25);
  border-radius: 0;
  color: var(--hud-copy);
  background: rgba(1, 5, 6, 0.92);
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  font-family: "JetBrains Mono", monospace;
}

#dashboard-section input[type="text"]:focus,
#dashboard-section select:focus,
#dashboard-section textarea:focus {
  border-color: var(--hud-lime-dim);
  box-shadow: 0 0 0 2px rgba(47, 248, 255, 0.06), 0 0 20px rgba(47, 248, 255, 0.035);
}

#dashboard-section .btn.primary {
  color: #000e10;
  background: linear-gradient(135deg, var(--hud-lime-hot), var(--hud-lime) 52%, #1ec2cc);
  box-shadow: 0 0 20px rgba(47, 248, 255, 0.18);
}

#dashboard-section .btn.ghost {
  border-color: rgba(47, 248, 255, 0.28);
  color: #c0d4d6;
  background: rgba(47, 248, 255, 0.018);
}

#dashboard-section .btn.ghost:hover:not(:disabled) {
  border-color: rgba(47, 248, 255, 0.58);
  color: var(--hud-lime-hot);
  background: rgba(47, 248, 255, 0.075);
}

#dashboard-section .section-heading {
  margin: 25px 2px 11px;
}

#dashboard-section .section-heading h2 {
  margin-top: 5px;
  color: #e2f2f3;
  font-size: 19px;
}

#dashboard-section .section-heading p {
  color: var(--hud-muted);
  font-family: "JetBrains Mono", monospace;
}

#dashboard-section .product-grid {
  gap: 11px;
}

#dashboard-section .product-card {
  min-height: 190px;
  padding: 21px;
}

#dashboard-section .product-card::after {
  right: -72px;
  bottom: -82px;
  border: 1px solid rgba(47, 248, 255, 0.08);
  background: transparent;
  box-shadow: 0 0 0 24px rgba(47, 248, 255, 0.012);
}

#dashboard-section .product-icon {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(47, 248, 255, 0.3);
  border-radius: 0;
  color: var(--hud-lime);
  background: rgba(47, 248, 255, 0.06);
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}

#dashboard-section .product-card h3,
#dashboard-section .support-contact h3 {
  color: #e4f3f4;
}

#dashboard-section .product-card p,
#dashboard-section .support-contact p {
  color: var(--hud-muted);
}

#dashboard-section .plan-grid {
  gap: 10px;
}

#dashboard-section .plan {
  overflow: hidden;
  border: 1px solid rgba(47, 248, 255, 0.24);
  border-radius: 0;
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  background: rgba(1, 5, 7, 0.78);
}

#dashboard-section .plan:hover,
#dashboard-section .plan.featured {
  border-color: rgba(47, 248, 255, 0.62);
  background: linear-gradient(150deg, rgba(47, 248, 255, 0.075), rgba(1, 5, 7, 0.9));
}

#dashboard-section .plan .tag {
  top: 0;
  border-radius: 0;
  color: #000e10;
  background: var(--hud-lime);
  clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 0 100%, 0 5px);
}

#dashboard-section .plan .pay-option,
#dashboard-section .invoice,
#dashboard-section .copyline,
#dashboard-section .empty,
#dashboard-section .soon,
#dashboard-section .contact-link {
  border-radius: 0;
  clip-path: polygon(7px 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%, 0 7px);
}

#dashboard-section .plan .pay-option {
  border-color: rgba(47, 248, 255, 0.2);
  background: rgba(1, 5, 6, 0.7);
}

#dashboard-section .plan .price,
#dashboard-section .copyline .cl-value {
  color: var(--hud-lime);
}

#dashboard-section .invoice {
  border-color: rgba(47, 248, 255, 0.48);
  background: rgba(47, 248, 255, 0.045);
}

#dashboard-section .invoice .countdown {
  border-radius: 0;
}

#dashboard-section .qr-box {
  border: 5px solid #dff0f2;
  border-radius: 0;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}

#dashboard-section .support-card {
  padding: 22px;
}

#dashboard-section .support-contact {
  border-left-color: rgba(47, 248, 255, 0.14);
}

#dashboard-section .contact-link {
  border-color: rgba(47, 248, 255, 0.22);
  color: #c5d7d9;
  background: rgba(1, 5, 6, 0.72);
}

#dashboard-section .contact-link:hover {
  border-color: rgba(47, 248, 255, 0.55);
  color: var(--hud-lime-hot);
  background: rgba(47, 248, 255, 0.06);
}

#dashboard-section .mobile-nav-toggle {
  min-height: 40px;
  margin-bottom: 10px;
}

#dashboard-section .nav-overlay {
  background:
    linear-gradient(rgba(47, 248, 255, 0.025) 1px, transparent 1px),
    rgba(0, 2, 3, 0.82);
  background-size: 30px 30px, auto;
  backdrop-filter: blur(5px);
}

@keyframes hud-auth-orbit {
  to { transform: rotate(360deg); }
}

@media (min-width: 900px) {
  #dashboard-section .mining-row {
    grid-template-columns: minmax(0, 1.65fr) minmax(285px, 0.9fr);
  }
}

@media (max-width: 1180px) {
  #dashboard-section .dashboard-shell {
    grid-template-columns: 218px minmax(0, 1fr);
  }

  #dashboard-section .side-link {
    font-size: 10px;
  }
}

@media (max-width: 900px) {
  #dashboard-section.panel {
    max-width: 900px;
    padding-top: 10px;
  }

  #dashboard-section .dashboard-shell {
    display: block;
  }

  #dashboard-section .side-nav {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(84vw, 292px);
    min-height: 100vh;
    border-radius: 0;
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%);
    transform: translateX(-105%);
  }

  #dashboard-section .side-nav.open {
    transform: translateX(0);
  }

  #dashboard-section .support-card {
    grid-template-columns: 1fr;
  }

  #dashboard-section .support-contact {
    padding: 20px 0 0;
    border-top: 1px solid rgba(47, 248, 255, 0.14);
    border-left: 0;
  }
}

@media (max-width: 680px) {
  #login-section.auth {
    margin-top: 26px;
    padding: 26px 18px 24px;
  }

  #login-section .radar-wrap {
    width: min(60vw, 220px);
  }

  #login-section .auth-head h1::before,
  #login-section .auth-head h1::after {
    width: 17px;
    margin-right: 7px;
    margin-left: 7px;
  }

  #dashboard-section .dashboard-hero {
    min-height: 0;
    padding: 22px 18px;
  }

  #dashboard-section .hero-live {
    position: relative;
    top: auto;
    right: auto;
    width: max-content;
    margin-bottom: 14px;
  }

  #dashboard-section .readout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #dashboard-section .stat {
    min-height: 84px;
    padding: 14px;
  }

  #dashboard-section .product-grid,
  #dashboard-section .plan-grid {
    grid-template-columns: 1fr;
  }

  #dashboard-section .support-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  #login-section.auth {
    width: calc(100% + 8px);
    margin-left: -4px;
    margin-right: -4px;
    padding-right: 14px;
    padding-left: 14px;
  }

  #login-section .tabbody {
    padding-right: 12px;
    padding-left: 12px;
  }

  #dashboard-section .readout {
    grid-template-columns: 1fr;
  }

  #dashboard-section .field,
  #dashboard-section .row,
  #dashboard-section .row-side {
    align-items: stretch;
  }

  #dashboard-section .field,
  #dashboard-section .row {
    flex-direction: column;
  }

  #dashboard-section .row-side {
    flex-wrap: wrap;
  }

  #dashboard-section .card,
  #dashboard-section .product-card,
  #dashboard-section .support-card {
    padding: 17px 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #login-section .radar-wrap::before {
    animation: none;
  }
}