:root {
  --bg-0: #020716;
  --bg-1: #06111f;
  --panel: #09162c;
  --panel-2: #071126;
  --line: rgba(111,189,244,.16);
  --border: rgba(101,179,240,.28);
  --cyan: #48e8f0;
  --cyan-bright: #8cf9ff;
  --text: #eef6ff;
  --text-dim: #a7bfd8;
  --text-soft: #d9e7f6;
  --muted: #9bb6c7;
  --success: #7dffc0;
  --warn: #ffe9b0;
  --danger: #ffd5dc;
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 20px;
  --space-5: 28px;
  --space-6: 40px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --shadow-panel: 0 18px 40px -28px rgba(0,0,0,.9), 0 0 0 1px rgba(121,245,255,.04);
  --font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { background: var(--bg-0); }

body {
  min-height: 100vh;
  color: var(--text);
  font-family: var(--font-sans);
  background:
    radial-gradient(circle at 50% 0%, rgba(74,214,255,.10), transparent 22%),
    radial-gradient(circle at 50% 28%, rgba(30,140,220,.08), transparent 30%),
    radial-gradient(circle at 50% 100%, rgba(8,20,45,0), rgba(2,7,22,.45) 55%, rgba(2,7,22,.92) 100%),
    linear-gradient(180deg, var(--bg-1) 0%, var(--bg-0) 100%);
  padding: 24px 24px 48px;
  line-height: 1.55;
  overflow-x: hidden;
  position: relative;
  -webkit-font-smoothing: antialiased;
}

/* Background effects — quieter for a premium audit product */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -2;
  background:
    radial-gradient(ellipse at 72% 28%, rgba(120,70,200,.08) 0%, transparent 48%),
    radial-gradient(ellipse at 28% 72%, rgba(50,130,210,.07) 0%, transparent 48%),
    radial-gradient(ellipse at 88% 58%, rgba(180,70,150,.04) 0%, transparent 42%);
  animation: nebulaDrift 40s ease-in-out infinite alternate;
  opacity: .85;
}

body::after {
  content: '';
  position: fixed;
  inset: -80px;
  pointer-events: none;
  z-index: -1;
  background: transparent;
  opacity: .28;
  box-shadow:
    12px 15px 0 0 #fff, 32px 48px 0 0 #fffa, 55px 8px 0 0 #fff8,
    78px 90px 0 0 #fffc, 95px 22px 0 0 #fff6, 115px 60px 0 0 #fff,
    140px 12px 0 0 #fffa, 165px 75px 0 0 #fff8, 190px 105px 0 0 #fffc,
    210px 30px 0 0 #fff6, 235px 55px 0 0 #fff, 260px 85px 0 0 #fffa,
    285px 15px 0 0 #fff8, 310px 95px 0 0 #fffc, 335px 40px 0 0 #fff6,
    360px 110px 0 0 #fff, 385px 20px 0 0 #fffa, 410px 70px 0 0 #fff8,
    435px 130px 0 0 #fffc, 460px 10px 0 0 #fff6, 485px 50px 0 0 #fff,
    510px 80px 0 0 #fffa, 535px 35px 0 0 #fff8, 560px 100px 0 0 #fffc,
    585px 65px 0 0 #fff6, 610px 5px 0 0 #fff, 635px 45px 0 0 #fffa,
    660px 120px 0 0 #fff8, 685px 18px 0 0 #fffc, 710px 72px 0 0 #fff6,
    735px 38px 0 0 #fff, 760px 92px 0 0 #fffa, 785px 58px 0 0 #fff8,
    810px 14px 0 0 #fffc, 835px 82px 0 0 #fff6, 860px 42px 0 0 #fff,
    885px 108px 0 0 #fffa, 910px 28px 0 0 #fff8, 935px 62px 0 0 #fffc,
    960px 5px 0 0 #fff6, 985px 88px 0 0 #fff, 1010px 32px 0 0 #fffa,
    1035px 115px 0 0 #fff8, 1060px 48px 0 0 #fffc, 1085px 76px 0 0 #fff6,
    1110px 22px 0 0 #fff, 1135px 95px 0 0 #fffa, 1160px 12px 0 0 #fff8,
    1185px 68px 0 0 #fffc, 1210px 40px 0 0 #fff6, 1235px 102px 0 0 #fff,
    1260px 55px 0 0 #fffa, 1285px 25px 0 0 #fff8, 1310px 85px 0 0 #fffc,
    1335px 35px 0 0 #fff6, 1360px 98px 0 0 #fff, 1385px 18px 0 0 #fffa,
    1410px 72px 0 0 #fff8, 55px 155px 0 0 #fffc, 120px 220px 0 0 #fff6,
    200px 280px 0 0 #fff, 310px 350px 0 0 #fffa, 420px 420px 0 0 #fff8,
    530px 180px 0 0 #fffc, 640px 260px 0 0 #fff6, 750px 320px 0 0 #fff,
    860px 400px 0 0 #fffa, 970px 150px 0 0 #fff8, 1080px 230px 0 0 #fffc,
    1190px 340px 0 0 #fff6, 1300px 480px 0 0 #fff, 100px 520px 0 0 #fffa,
    250px 600px 0 0 #fff8, 400px 680px 0 0 #fffc, 550px 750px 0 0 #fff6,
    700px 820px 0 0 #fff, 850px 550px 0 0 #fffa, 1000px 700px 0 0 #fff8,
    1150px 850px 0 0 #fffc, 1300px 950px 0 0 #fff6;
  animation: starsDrift 240s linear infinite;
}

@keyframes starsDrift {
  0% { transform: translateY(0); }
  100% { transform: translateY(-80px); }
}

@keyframes nebulaDrift {
  0% { transform: translate(0,0) scale(1); opacity: .7; }
  50% { transform: translate(30px,-20px) scale(1.1); opacity: 1; }
  100% { transform: translate(-20px,30px) scale(1.05); opacity: .8; }
}

/* Layout */
.wrap { max-width: 1180px; margin: 0 auto; }

/* Header */
.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 22px;
  flex-wrap: wrap;
}

.header__left {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: inherit;
}

.header__left:hover .brand { color: #fff; }
.header__left:hover .tagline { color: var(--cyan-bright); }

.logo-icon {
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  display: block;
  filter: drop-shadow(0 0 8px rgba(63,227,214,.28));
}

/* Entropy layers: incommensurate periods feel less mechanical */
.logo-icon__universe {
  transform-origin: 32px 32px;
}

.logo-icon__universe--a {
  animation: logo-spin 17.3s linear infinite;
}

.logo-icon__universe--b {
  animation: logo-spin-rev 23.7s linear infinite;
}

.logo-icon__universe--c {
  animation: logo-spin 11.1s linear infinite reverse;
  opacity: 0.85;
}

.logo-icon__core {
  transform-origin: 32px 32px;
  animation: logo-pulse 2.7s ease-in-out infinite;
}

.logo-icon__glow {
  transform-origin: 32px 32px;
  animation: logo-glow 3.9s ease-in-out infinite;
}

.logo-icon__shell {
  animation: logo-shell 6.4s ease-in-out infinite;
  transform-origin: 32px 32px;
}

.logo-icon__star {
  fill: #9efcff;
  transform-origin: center;
  transform-box: fill-box;
}

/* Twinkle “entropy” — staggered, irregular-ish timings */
.logo-icon__star--1  { animation: logo-twinkle 2.1s ease-in-out infinite; }
.logo-icon__star--2  { animation: logo-twinkle 3.4s ease-in-out 0.4s infinite; }
.logo-icon__star--3  { animation: logo-twinkle 1.7s ease-in-out 0.9s infinite; }
.logo-icon__star--4  { animation: logo-twinkle 2.9s ease-in-out 0.2s infinite; }
.logo-icon__star--5  { animation: logo-twinkle 2.4s ease-in-out 1.1s infinite; }
.logo-icon__star--6  { animation: logo-twinkle 3.8s ease-in-out 0.6s infinite; }
.logo-icon__star--7  { animation: logo-twinkle 1.9s ease-in-out 1.5s infinite; }
.logo-icon__star--8  { animation: logo-twinkle 2.6s ease-in-out 0.3s infinite; }
.logo-icon__star--9  { animation: logo-twinkle 3.1s ease-in-out 0.8s infinite; }
.logo-icon__star--10 { animation: logo-twinkle 2.2s ease-in-out 1.3s infinite; }
.logo-icon__star--11 { animation: logo-twinkle 4.0s ease-in-out 0.1s infinite; }
.logo-icon__star--12 { animation: logo-twinkle 1.6s ease-in-out 0.7s infinite; }

.logo-icon__orbit {
  fill: none;
  stroke: #5ff2e0;
  stroke-width: 0.35;
  stroke-dasharray: 2 3;
  opacity: 0.35;
  animation: logo-dash 9s linear infinite;
}

.logo-icon__orbit--soft {
  opacity: 0.22;
  stroke-dasharray: 1.5 4;
  animation-duration: 13s;
  animation-direction: reverse;
}

@keyframes logo-spin {
  to { transform: rotate(360deg); }
}

@keyframes logo-spin-rev {
  to { transform: rotate(-360deg); }
}

@keyframes logo-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  40% { transform: scale(1.14); opacity: 0.95; }
  55% { transform: scale(1.2); opacity: 1; }
  70% { transform: scale(1.08); opacity: 0.92; }
}

@keyframes logo-glow {
  0%, 100% { opacity: 0.85; transform: scale(1); }
  35% { opacity: 1; transform: scale(1.08); }
  65% { opacity: 0.75; transform: scale(0.96); }
}

@keyframes logo-shell {
  0%, 100% { filter: brightness(1); }
  45% { filter: brightness(1.12); }
  70% { filter: brightness(0.96); }
}

@keyframes logo-twinkle {
  0%, 100% { opacity: 0.35; transform: scale(0.85); }
  30% { opacity: 1; transform: scale(1.35); }
  55% { opacity: 0.55; transform: scale(1); }
  80% { opacity: 0.9; transform: scale(1.15); }
}

@keyframes logo-dash {
  to { stroke-dashoffset: -28; }
}

@media (prefers-reduced-motion: reduce) {
  .logo-icon__universe,
  .logo-icon__core,
  .logo-icon__glow,
  .logo-icon__shell,
  .logo-icon__star,
  .logo-icon__orbit {
    animation: none !important;
  }
}

@media (max-width: 640px) {
  .logo-icon {
    width: 48px;
    height: 48px;
  }
}

.brand {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: -.01em;
  color: #fff;
  line-height: 1.15;
}

.tagline {
  font-size: 13px;
  font-weight: 550;
  color: var(--muted);
  margin-top: 3px;
  letter-spacing: .01em;
}

/* Language switch */
.lang-switch {
  display: flex;
  gap: 8px;
  align-items: center;
  position: relative;
  z-index: 20;
}

.lang-menu {
  position: relative;
}

.lang-menu__summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 52px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(111,189,244,.24);
  background: rgba(9,19,43,.58);
  color: var(--text-dim);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .6px;
  cursor: pointer;
  user-select: none;
}

.lang-menu__summary::-webkit-details-marker { display: none; }

.lang-menu__summary:hover {
  color: var(--text);
  border-color: rgba(111,189,244,.45);
}

.lang-menu[open] .lang-menu__summary {
  color: #041f1b;
  background: linear-gradient(180deg, #79f5ff, #2adfd9);
  border-color: transparent;
}

.lang-menu__chevron {
  font-size: 10px;
  opacity: .85;
}

.lang-menu__list {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  min-width: 168px;
  max-height: min(70vh, 360px);
  overflow-y: auto;
  padding: 6px;
  border-radius: 14px;
  border: 1px solid rgba(111,189,244,.22);
  background: rgba(6, 14, 32, .96);
  box-shadow: 0 12px 40px rgba(0,0,0,.45);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.lang-menu__item {
  display: block;
  padding: 9px 12px;
  border-radius: 10px;
  color: var(--text-dim);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
}

.lang-menu__item:hover {
  color: var(--text);
  background: rgba(63,227,214,.1);
}

.lang-menu__item.active {
  color: #041f1b;
  background: linear-gradient(180deg, #79f5ff, #2adfd9);
}

/* Article / guides */
.article-page__crumb {
  font-size: 13px;
  color: var(--text-dim);
  margin: 0 0 10px;
}

.article-page__crumb a {
  color: var(--cyan);
  text-decoration: none;
}

.article-page__body {
  color: var(--text-dim);
  line-height: 1.8;
  font-size: 15px;
}

.article-page__body h2 {
  color: var(--text);
  font-size: 18px;
  margin: 22px 0 10px;
}

.article-page__body p,
.article-page__body ul {
  margin: 0 0 12px;
}

.article-page__body ul {
  padding-left: 1.25em;
}

.article-page__body code {
  font-size: .92em;
  color: var(--cyan-bright);
}

.article-page__cta {
  margin: 24px 0 0;
}

.draw-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 20px;
  margin-top: 22px;
  padding: 18px 18px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(72,232,240,.22);
  background:
    radial-gradient(ellipse at 0% 0%, rgba(72,232,240,.10), transparent 55%),
    rgba(7, 16, 36, .72);
}

.draw-cta__title {
  margin: 0 0 6px;
  font-size: 17px;
  font-weight: 750;
  color: #fff;
  letter-spacing: -.015em;
}

.draw-cta__lead {
  margin: 0;
  max-width: 36rem;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-dim);
}

.draw-cta__btn {
  margin-top: 0;
  flex-shrink: 0;
}

.raffles-panel {
  margin-bottom: 8px;
}

.raffles-body h2 {
  color: var(--text);
  font-size: 17px;
  margin: 20px 0 10px;
}

.raffles-body p {
  margin: 0 0 12px;
}

@media (max-width: 720px) {
  .draw-cta {
    flex-direction: column;
    align-items: stretch;
  }

  .draw-cta__btn {
    width: 100%;
  }
}

.article-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.article-list a {
  color: var(--cyan);
  text-decoration: none;
  font-weight: 600;
}

.article-list--cards a {
  display: block;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(111,189,244,.18);
  background: rgba(9,19,43,.4);
  color: inherit;
}

.article-list--cards a strong {
  display: block;
  color: var(--cyan-bright);
  margin-bottom: 6px;
  font-size: 15px;
}

.article-list--cards a span {
  display: block;
  color: var(--text-dim);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}

.article-list--cards a:hover {
  border-color: rgba(72,232,240,.35);
  background: rgba(63,227,214,.08);
}

.guides-teaser {
  padding: 28px 0 8px;
}

.guides-teaser__list {
  margin-top: 8px;
}

@media (min-width: 800px) {
  .guides-teaser__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
}

.app-primary {
  position: relative;
  z-index: 1;
}

/* Hero */
.hero.hero--compact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 22px;
  padding: 4px 0 0;
  min-height: 0;
}

.hero.hero--compact .seo-heading {
  margin: 0;
  min-width: 0;
  width: 100%;
  line-height: 1.2;
  letter-spacing: -.02em;
}

.hero__lead {
  margin: 0;
  max-width: 46rem;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.55;
}

.hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.hero__badge {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  padding: 7px 12px;
  border-radius: var(--radius-pill);
  background: rgba(72,232,240,.08);
  border: 1px solid rgba(72,232,240,.22);
  color: var(--cyan-bright);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .02em;
  white-space: nowrap;
  line-height: 1.2;
}

/* Grid */
.grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: 18px;
  align-items: stretch;
}

/* Panel */
.panel {
  position: relative;
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(10,20,42,.92), rgba(5,12,28,.96));
  border: 1px solid var(--border);
  overflow: hidden;
  box-shadow: var(--shadow-panel);
  padding: 20px 20px 22px;
  backdrop-filter: blur(8px);
}

.grid .panel:first-child {
  padding: 22px 22px 20px;
  border-color: rgba(72,232,240,.18);
  background: linear-gradient(180deg, rgba(11,22,46,.88), rgba(5,12,28,.94));
}

.grid .panel:first-child .title {
  font-size: 15px;
  padding-bottom: 12px;
  margin-bottom: 16px;
  text-transform: none;
  letter-spacing: -.01em;
  color: var(--text);
}

.grid .panel:first-child::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 5%, rgba(121,245,255,.55), transparent 95%);
  opacity: .7;
}

/* Typography */
.eyebrow {
  color: var(--cyan-bright);
  letter-spacing: 1.2px;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 12px;
}

.title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
  letter-spacing: -.01em;
}

/* Form */
.form--stacked { display: flex; flex-direction: column; gap: 8px; }

.mode-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 2px 0 8px;
  padding: 4px;
  border-radius: var(--radius-md);
  background: rgba(4, 10, 24, .9);
  border: 1px solid rgba(102, 171, 230, .14);
}

.mode-switch__btn {
  border: 0;
  border-radius: var(--radius-sm);
  padding: 12px 12px;
  min-height: 44px;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .01em;
  color: var(--text-soft);
  background: transparent;
  cursor: pointer;
  transition: background .2s, color .2s, box-shadow .2s;
}

.mode-switch__btn:hover {
  color: var(--text);
  background: rgba(72, 232, 240, .06);
}

.mode-switch__btn.is-active {
  color: #04241f;
  background: linear-gradient(180deg, #79f5ff, #2adfd9 58%, #16b8b4);
  box-shadow: 0 0 0 1px rgba(129, 248, 255, .2), 0 0 14px rgba(63, 227, 214, .18);
}

.form-mode-fields { margin-top: 2px; }

.field-hint {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text-dim);
}

.field-hint--soft {
  color: rgba(167, 191, 216, .55);
  font-size: 11px;
}

.form__input--list {
  min-height: 140px;
  resize: vertical;
  line-height: 1.45;
  font-family: inherit;
}

.field-label {
  display: block;
  margin-bottom: 6px;
  margin-top: 12px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .02em;
  text-transform: none;
  font-weight: 600;
}

.form__input {
  width: 100%;
  background: rgba(5, 11, 26, .92);
  border: 1px solid rgba(102,171,230,.16);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  color: var(--text);
  outline: none;
  font-size: 15px;
  transition: border-color .2s, box-shadow .2s;
}

.form__input:focus {
  border-color: var(--cyan);
  box-shadow: inset 0 0 0 1px rgba(72,232,240,.25), 0 0 0 3px rgba(72,232,240,.1);
}

.form__input::placeholder {
  color: rgba(167,191,216,.35);
  font-size: 13px;
}

.grid .panel:first-child .form__input {
  padding: 13px 15px;
  font-size: 16px;
}

.grid .panel:first-child .form__input::placeholder {
  font-size: 14px;
}

.grid .panel:first-child .field-label {
  font-size: 12px;
  margin-top: 14px;
  margin-bottom: 4px;
}

.grid .panel:first-child .btn-main {
  padding: 15px 16px;
  font-size: 16px;
  max-width: none;
  margin-top: 18px;
}

.row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.grid .panel:first-child .row-2 { gap: 14px; }

.row-2 .field-label { margin-top: 10px; }

/* Button */
.btn-main {
  margin-top: 18px;
  width: 100%;
  max-width: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #79f5ff, #2adfd9 58%, #16b8b4);
  box-shadow: 0 0 0 1px rgba(129,248,255,.18), 0 10px 28px -12px rgba(42,223,217,.55);
  color: #04241f;
  font-size: 16px;
  font-weight: 750;
  padding: 14px 16px;
  min-height: 48px;
  cursor: pointer;
  transition: box-shadow .2s, filter .2s, transform .15s;
  text-decoration: none;
}

.btn-main:hover {
  filter: brightness(1.05);
  box-shadow: 0 0 0 1px rgba(129,248,255,.28), 0 14px 32px -10px rgba(42,223,217,.65);
}

.btn-main:active {
  filter: brightness(.96);
  transform: translateY(1px);
}

.btn-main--ghost {
  background: transparent;
  color: var(--cyan-bright);
  border: 1px solid rgba(72,232,240,.28);
  box-shadow: none;
}

.btn-main--ghost:hover {
  background: rgba(72,232,240,.08);
  filter: none;
}

/* Status line */
.status-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
  justify-content: center;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  background: rgba(5,12,28,.55);
  border: 1px solid rgba(111,189,244,.12);
}

.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 10px 2px rgba(63,227,214,.6);
}

.beacon-status {
  flex-wrap: wrap;
  text-align: center;
  max-width: 100%;
}

.beacon-status__text {
  line-height: 1.35;
}

.beacon-status.is-offline .dot {
  background: #f0b45a;
  box-shadow: 0 0 10px 2px rgba(240, 180, 90, .45);
}

.beacon-status.is-offline {
  color: #ffe9b0;
}

.panel .beacon-status {
  margin-top: 14px;
}

/* Number panel */
.number-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  justify-content: center;
  padding: 28px 22px 26px;
  background:
    radial-gradient(ellipse at 50% 18%, rgba(72,232,240,.10), transparent 55%),
    linear-gradient(180deg, rgba(9,22,48,.94), rgba(4,11,26,.98));
  border-color: rgba(72,232,240,.22);
  box-shadow: var(--shadow-panel), inset 0 0 48px rgba(72,232,240,.03);
  transition: border-color .25s, box-shadow .25s;
  min-height: 320px;
}

.number-panel.is-reset,
.number-panel.is-empty {
  border-color: rgba(72, 232, 240, .14);
  box-shadow: var(--shadow-panel);
}

.number-panel.is-reset .big-number,
.number-panel.is-empty .big-number {
  opacity: .42;
}

.number-panel .title {
  font-size: 12px;
  font-weight: 650;
  color: var(--muted);
  text-transform: none;
  letter-spacing: .04em;
  border: 0;
  padding: 0;
  margin: 0 0 8px;
}

.number-panel__empty {
  margin-top: 10px;
  max-width: 260px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.big-number {
  /* Same box for number and name so the result panel does not jump */
  --result-size: clamp(64px, 10vw, 140px);
  font-size: var(--result-size);
  font-weight: 800;
  line-height: 1;
  margin: 8px 0 6px;
  min-height: var(--result-size);
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  padding: 0 8px;
  word-break: break-word;
  overflow-wrap: anywhere;
  background: linear-gradient(180deg, #f1ffff 0%, #b6fdff 30%, #5ef3ec 66%, #1fc9be 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 8px rgba(129,249,255,.18));
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}

.big-number.is-animating {
  filter: drop-shadow(0 0 10px rgba(129,249,255,.4)) drop-shadow(0 0 28px rgba(63,227,214,.25));
}

/* Name uses the same font-size/min-height; only line-height eases multi-word wrapping */
.big-number--name {
  line-height: 1.05;
}

.list-audit {
  margin-top: 14px;
  border: 1px solid rgba(102, 171, 230, .12);
  border-radius: 8px;
  background: rgba(5, 12, 28, .55);
  overflow: hidden;
}

.list-audit > summary {
  cursor: pointer;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--text-soft);
  list-style: none;
}

.list-audit > summary::-webkit-details-marker { display: none; }

.list-audit[open] > summary {
  border-bottom: 1px solid rgba(102, 171, 230, .1);
  color: var(--cyan);
}

.list-audit__items {
  margin: 0;
  padding: 10px 12px 12px 28px;
  max-height: 220px;
  overflow: auto;
  font-size: 13px;
  color: var(--text);
}

.list-audit__items li {
  margin: 0 0 6px;
  padding-left: 2px;
}

.list-audit__items li.is-winner {
  color: #9ffff7;
  font-weight: 700;
}

.list-audit__idx {
  color: var(--text-dim);
  margin-right: 4px;
  font-variant-numeric: tabular-nums;
}

.minmax {
  display: flex;
  gap: 48px;
  font-size: 13px;
  color: var(--text-dim);
  letter-spacing: .5px;
  padding: 12px 0 8px;
  margin: 0 0 8px;
  width: 100%;
  justify-content: center;
  border-top: 1px solid var(--line);
}

.minmax b {
  color: #fff;
  font-size: 15px;
  margin-left: 4px;
  font-weight: 700;
}

.timestamp {
  font-size: 12px;
  letter-spacing: .6px;
  color: var(--text-dim);
  font-weight: 500;
  margin-top: 4px;
}

.mystery-note {
  font-size: 13px;
  color: var(--text-dim);
  margin-top: 6px;
  text-align: center;
  letter-spacing: 2px;
}

/* Integrity section */
.integrity {
  margin-top: 18px;
  padding: 22px 22px 24px;
}

.integrity h3 {
  text-align: left;
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
  letter-spacing: -.01em;
}

.integrity-subtitle {
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
  letter-spacing: 0;
  display: inline;
  margin-left: 8px;
}

.integrity-body {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr) 200px;
  gap: 24px;
  align-items: start;
}

.integrity-center{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.qr-block {
  text-align:center;
}

.entropy-block {
  text-align:center;
  grid-column:3;
  grid-row:1 / -1;
}

.qr-box {
  width:220px;
  height:220px;
  background:#fff;
  border-radius:8px;
  margin:0 auto 10px;
}

.qr-box img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.qr-caption,
.entropy-caption {
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  letter-spacing: .3px;
}

.entropy-caption a:hover { text-decoration: underline; }

.hash-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.hash-row-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .8px;
  color: #fff;
  margin-bottom: 8px;
}

.hash-row-label .icon {
  color: var(--cyan);
  margin-right: 6px;
}

.hash-value {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 11px 13px;
  border-radius: 6px;
  background: linear-gradient(180deg, rgba(8,17,36,.96), rgba(6,13,28,.96));
  border: 1px solid var(--border);
}

.hash-value code {
  flex: 1;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text);
  word-break: break-all;
}

.url-block {
  margin-top: 4px;
}

.url-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .8px;
  color: #fff;
  margin-bottom: 8px;
}

.url-label .icon {
  color: var(--cyan);
  margin-right: 6px;
}

.url-value {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-radius: 6px;
  background: linear-gradient(180deg, rgba(8,17,36,.96), rgba(6,13,28,.96));
  border: 1px solid var(--border);
}

.url-value code {
  flex: 1;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-dim);
  word-break: break-all;
  line-height: 1.5;
}

.copy-btn {
  flex-shrink: 0;
  border: 1px solid rgba(111,189,244,.22);
  background: rgba(16, 32, 56, .9);
  color: #eff7ff;
  font-size: 12px;
  font-weight: 650;
  padding: 8px 12px;
  min-height: 36px;
  border-radius: var(--radius-sm);
  cursor: pointer;
}

.copy-btn:hover { filter: brightness(1.05); }

.entropy-img {
  width: 220px;
  height: 220px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
  margin: 0 auto 8px;
}

.entropy-img img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Draw overlay */
.draw-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(2,7,22,.78);
  backdrop-filter: blur(10px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 999;
}

.draw-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.draw-overlay__card {
  width: min(640px, calc(100vw - 24px));
  min-height: 460px;
  padding: 28px 24px 24px;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(101,179,240,.28);
  background: linear-gradient(180deg, rgba(10,20,42,.98), rgba(4,11,26,.99));
  box-shadow: 0 24px 64px rgba(0,0,0,.45);
  text-align: center;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.draw-overlay__steps {
  text-align: left;
  margin-bottom: 16px;
  flex-shrink: 0;
  min-height: 108px; /* 4 steps — keeps card height stable */
}

.draw-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 0;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,.2);
  transition: color .35s;
}

.draw-step.active { color: var(--cyan-bright); }
.draw-step.done { color: rgba(72,232,240,.4); }

.draw-step__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
  transition: box-shadow .35s;
}

.draw-step.active .draw-step__dot {
  box-shadow: 0 0 6px currentColor;
}

/* Fixed slot: number and name never resize the modal */
.draw-overlay__result {
  flex: 1 1 auto;
  width: 100%;
  height: 340px;
  min-height: 340px;
  max-height: 340px;
  margin: 0 0 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-sizing: border-box;
}

.draw-overlay__number {
  --overlay-size: 280px;
  font-size: var(--overlay-size);
  line-height: 1.08;
  font-weight: 900;
  margin: 0;
  color: var(--cyan-bright);
  text-shadow: 0 0 8px rgba(63,227,214,.25);
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  display: block;
  text-align: center;
  box-sizing: border-box;
  padding: 0 4px;
  word-break: break-word;
  overflow-wrap: anywhere;
  overflow: hidden;
  hyphens: auto;
}

.draw-overlay__number--name {
  line-height: 1.12;
}

.draw-overlay__number.draw-pulse {
  animation: glow-pulse .3s ease-in-out infinite alternate;
}

.draw-overlay__number.draw-flash {
  animation: glow-flash .35s ease-out forwards;
}

@keyframes glow-pulse {
  from { text-shadow: 0 0 8px rgba(63,227,214,.25); }
  to { text-shadow: 0 0 16px rgba(63,227,214,.45); }
}

/* Glow only — no scale, so box size stays stable */
@keyframes glow-flash {
  0% { text-shadow: 0 0 8px rgba(63,227,214,.25); filter: brightness(1); }
  40% { text-shadow: 0 0 22px rgba(63,227,214,.55); filter: brightness(1.15); }
  100% { text-shadow: 0 0 10px rgba(63,227,214,.3); filter: brightness(1); }
}

.draw-overlay__bar {
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
  flex-shrink: 0;
  margin-top: auto;
}

.draw-overlay__bar-fill {
  width: 12%;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #4bece0, #22c9bd, #4bece0);
  box-shadow: 0 0 8px rgba(63,227,214,.35);
  transition: width .15s ease;
}

/* Explanation section */
.explanation {
  margin-top: 40px;
  padding: 36px 0 12px;
  border-top: 1px solid var(--line);
}

.explanation__title {
  text-align: center;
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 750;
  color: #fff;
  margin-bottom: 10px;
  letter-spacing: -.02em;
}

.explanation__lead {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 8px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--text-soft);
  font-weight: 600;
}

.explanation__intro {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 28px;
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-dim);
}

.explanation__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.exp-step {
  display: flex;
  gap: 14px;
  padding: 18px;
  border-radius: var(--radius-md);
  border: 1px solid var(--line);
  background: rgba(9,22,44,.55);
  box-shadow: var(--shadow-panel);
}

.exp-step__num {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 750;
  color: var(--bg-0);
  background: linear-gradient(180deg, #79f5ff, #2adfd9);
}

.exp-step__content h3 {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 6px;
  letter-spacing: -.01em;
}

.exp-step__content p {
  font-size: 13px;
  color: var(--text-dim);
  line-height: 1.55;
}

.explanation__tech {
  margin-top: 20px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: rgba(9,22,44,.3);
  padding: 4px 16px;
}

.explanation__tech summary {
  cursor: pointer;
  padding: 12px 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--cyan);
  letter-spacing: .3px;
}

.explanation__tech[open] summary {
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}

.tech-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding-bottom: 16px;
}

.tech-item--full { grid-column: 1 / -1; }

.tech-item h3,
.tech-item h4 {
  font-size: 13px;
  font-weight: 700;
  color: var(--cyan-bright);
  margin-bottom: 6px;
}

.tech-item p {
  font-size: 12px;
  color: var(--text-dim);
  line-height: 1.6;
}

/* SEO heading */
.seo-heading {
  font-size: clamp(26px, 3.4vw, 40px);
  font-weight: 780;
  color: #fff;
  margin: 0;
  line-height: 1.15;
  letter-spacing: -.025em;
}

.section-intro {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 24px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-dim);
}

/* Sections */
.section {
  margin-top: 36px;
  padding: 32px 0 8px;
  border-top: 1px solid var(--line);
}

.section h2 {
  text-align: center;
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 750;
  color: #fff;
  margin-bottom: 14px;
  letter-spacing: -.02em;
}

.verification-section .wrap {
  max-width: 1420px;
}

.verification-body {
  width: 100%;
  padding: 36px 56px 40px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(9, 22, 44, 0.4);
}

.verification-body h2 {
  margin-bottom: 24px;
}

.verification-desc {
  text-align: center;
  font-size: 17px;
  color: var(--text-dim);
  line-height: 1.9;
  max-width: none;
  margin: 0 auto 32px;
  padding: 0;
}

.verification-list {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 40px;
}

.verification-list li {
  position: relative;
  padding: 12px 12px 12px 32px;
  font-size: 15px;
  color: var(--text-soft);
  line-height: 1.7;
}

.verification-list li::before {
  content: '\2713';
  position: absolute;
  left: 4px;
  color: var(--cyan);
  font-weight: 700;
}

/* Trust grid */
.trust-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.trust-item {
  padding: 20px;
  border-radius: var(--radius-md);
  border: 1px solid var(--line);
  background: rgba(9,22,44,.55);
  box-shadow: var(--shadow-panel);
}

.trust-item h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--cyan-bright);
  margin-bottom: 8px;
  letter-spacing: -.01em;
}

.trust-item p {
  font-size: 14px;
  color: var(--text-dim);
  line-height: 1.55;
  margin: 0;
}

/* FAQ */
.faq-list {
  max-width: 840px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.faq-item {
  border-radius: 10px;
  border: 1px solid var(--line);
  background: rgba(9,22,44,.3);
  padding: 4px 18px;
}

.faq-item summary {
  cursor: pointer;
  padding: 12px 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--cyan);
  letter-spacing: .3px;
  outline: none;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::marker {
  display: none;
  content: '';
}

.faq-item summary::before {
  content: '\25B6';
  display: inline-block;
  margin-right: 10px;
  color: var(--cyan);
  transition: transform .2s;
  font-size: 11px;
}

.faq-item[open] summary::before {
  transform: rotate(90deg);
}

.faq-item[open] summary {
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}

.faq-item p {
  font-size: 13px;
  color: var(--text-dim);
  line-height: 1.6;
  padding-bottom: 16px;
}

.faq-section .faq-list {
  margin-top: 8px;
}

.faq-more {
  text-align: center;
  margin-top: 18px;
}

.faq-more a {
  color: var(--cyan);
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
}

.faq-more a:hover {
  text-decoration: underline;
}

.faq-page__intro {
  color: var(--text-dim);
  line-height: 1.8;
  font-size: 14px;
  margin-bottom: 20px;
}

.faq-intro {
  margin: 0 0 8px;
}

/* Open source section */
.opensource-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

.opensource-item {
  padding: 18px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(9,22,44,.5);
}

.opensource-item h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--cyan-bright);
  margin-bottom: 8px;
}

.opensource-item p {
  font-size: 13px;
  color: var(--text-dim);
  line-height: 1.5;
  margin: 0;
}

.opensource-cta {
  text-align: center;
}

.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 10px;
  border: 1px solid rgba(72,232,240,.35);
  color: var(--cyan-bright);
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
  background: rgba(72,232,240,.08);
  transition: border-color .2s, background .2s;
}

.btn-outline:hover {
  border-color: var(--cyan);
  background: rgba(72,232,240,.14);
}

/* Responsive */
@media (max-width: 720px) {
  .trust-grid {
    grid-template-columns: 1fr;
  }

  .section h2 {
    font-size: 20px;
  }

  .verification-body {
    padding: 24px 20px 28px;
  }

  .verification-desc {
    font-size: 15px;
    margin-bottom: 24px;
  }

  .verification-list {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

/* Footer */
/* Keep unfilled / auto-placed ads from punching holes in the layout */
ins.adsbygoogle[data-ad-status="unfilled"],
.adsbygoogle[data-ad-status="unfilled"] {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Never let Auto ads split the draw UI (form + result) */
.app-primary .google-auto-placed,
.app-primary ins.adsbygoogle,
.grid > .google-auto-placed,
.header ~ .google-auto-placed:has(+ .app-primary),
.draw-page .google-auto-placed,
.draw-page ins.adsbygoogle {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.google-auto-placed {
  margin: 24px auto !important;
  max-width: 1180px;
  clear: both;
}

.site-rodape {
  margin-top: 48px;
  padding: 32px 0 20px;
  border-top: 1px solid var(--line);
}

.site-rodape__divider--top {
  margin: 0 0 20px;
}

.site-rodape__title {
  font-size: 20px;
  font-weight: 800;
  color: var(--cyan-bright);
  margin: 0 0 24px;
  text-align: center;
  letter-spacing: .3px;
}

.site-rodape__steps {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.site-rodape__step {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.site-rodape__step-icon {
  font-size: 28px;
  line-height: 1.3;
  flex-shrink: 0;
  width: 40px;
  text-align: center;
}

.site-rodape__step-body h3 {
  font-size: 15px;
  font-weight: 700;
  color: var(--cyan);
  margin: 0 0 5px;
  letter-spacing: .3px;
}

.site-rodape__step-body p {
  font-size: 14px;
  color: var(--text-dim);
  line-height: 1.6;
  margin: 0;
}

.site-rodape__note {
  margin-top: 28px;
  padding: 14px 18px;
  border-radius: 8px;
  background: rgba(72,232,240,.06);
  border: 1px solid rgba(72,232,240,.12);
  font-size: 14px;
  color: var(--text-soft);
  line-height: 1.5;
  text-align: center;
}

.site-rodape__divider {
  height: 1px;
  background: var(--line);
  margin: 32px 0 24px;
}

.site-rodape__bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  width: 100%;
}

.site-rodape__brand {
  font-size: 16px;
  font-weight: 700;
  color: var(--cyan-bright);
  white-space: nowrap;
}

.site-rodape__version {
  font-size: 12px;
  color: var(--text-dim);
  font-weight: 500;
  margin-left: 4px;
}

.site-rodape__tagline {
  font-size: 13px;
  color: var(--text-dim);
  white-space: nowrap;
}

.site-rodape__nav {
  display: flex;
  gap: 18px;
  white-space: nowrap;
}

.site-rodape__nav a {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dim);
  text-decoration: none;
  transition: color .2s;
}

.site-rodape__nav a:hover { color: var(--cyan-bright); }

/* Responsive */
@media (max-width: 1200px) {
  .grid,
  .integrity-body {
    grid-template-columns: 1fr;
  }

  .integrity-body { justify-items: center; }

  .entropy-block {
    text-align: center;
    grid-column: auto;
    grid-row: auto;
  }

  .entropy-img { margin: 0 auto 8px; }
}

@media (max-width: 720px) {
  body { padding: 14px 14px 32px; }

  .header {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    padding-bottom: 14px;
    margin-bottom: 16px;
  }

  .header__left {
    min-width: 0;
    flex: 1;
  }

  .header__brand {
    min-width: 0;
  }

  .lang-switch {
    flex-shrink: 0;
    margin-top: 2px;
  }

  .opensource-grid {
    grid-template-columns: 1fr;
  }

  .hero.hero--compact {
    gap: 10px;
    margin: 0 0 16px;
  }

  .seo-heading {
    font-size: clamp(22px, 7vw, 30px);
  }

  .hero__lead {
    font-size: 14px;
  }

  .hero__badge {
    white-space: normal;
  }

  .number-panel {
    min-height: 240px;
    padding: 22px 16px;
  }

  .number-panel.is-empty {
    min-height: 0;
    padding-top: 16px;
    padding-bottom: 14px;
  }

  .explanation__steps { grid-template-columns: 1fr; }

  .tech-grid { grid-template-columns: 1fr; }

  .site-rodape__bar {
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 16px;
  }

  .site-rodape__nav {
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 14px;
    white-space: normal;
  }

  .site-rodape__brand { font-size: 14px; }
  .site-rodape__tagline { font-size: 12px; white-space: normal; text-align: center; }

  .panel { padding: 18px 16px; }

  .row-2 { grid-template-columns: 1fr; }

  .minmax {
    gap: 16px;
    flex-wrap: wrap;
  }

  .brand { font-size: 18px; }
  .tagline { font-size: 12px; }

  .site-rodape__step { gap: 10px; }
  .site-rodape__step-icon { font-size: 22px; width: 32px; }
  .site-rodape__step-body h3 { font-size: 14px; }
  .site-rodape__step-body p { font-size: 13px; }
  .site-rodape__note { font-size: 13px; padding: 12px 14px; }

  .big-number {
    --result-size: clamp(48px, 14vw, 88px);
    font-size: var(--result-size);
    min-height: var(--result-size);
  }

  .title { font-size: 15px; }
  .integrity h3 { font-size: 16px; }

  .hash-value,
  .url-value {
    flex-wrap: wrap;
  }

  .verify-checklist__steps li {
    grid-template-columns: 28px minmax(0, 1fr);
  }

  .panel .beacon-status,
  .status-line {
    width: 100%;
    justify-content: center;
  }
}

.protocol-seal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--cyan-bright);
  font-size: 13px;
  font-weight: 700;
}

.campaign-logo {
  display: block;
  width: 72px;
  height: 72px;
  object-fit: contain;
  margin: 0 0 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .04);
}

.campaign-logo--inline {
  width: 36px;
  height: 36px;
  margin: 0;
}

.order-form,
.order-done {
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.order-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--text-dim);
  font-size: 14px;
}

.order-check {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  color: var(--text);
  font-size: 14px;
  line-height: 1.45;
}

.order-honey {
  position: absolute;
  left: -9999px;
  height: 0;
  overflow: hidden;
}

.order-pix code {
  color: var(--cyan-bright);
  word-break: break-all;
}

.campaign-organizer {
  margin: 0 0 14px;
  color: var(--text-dim);
  font-size: 15px;
}

.affiliates {
  margin-top: 22px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.affiliates__label {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.affiliates ul {
  margin: 0;
  padding-left: 18px;
}

.offer-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 20px;
  margin: 16px 0 4px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(72, 232, 240, .35);
  background:
    radial-gradient(ellipse at 100% 0%, rgba(72, 232, 240, .12), transparent 50%),
    rgba(5, 12, 28, .72);
}

.offer-strip[hidden] {
  display: none;
}

.offer-strip__title {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 750;
  color: #fff;
}

.offer-strip__lead {
  margin: 0;
  max-width: 40rem;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-dim);
}

.offer-strip__lead strong {
  color: var(--cyan-bright);
  font-weight: 750;
}

.offer-strip__btn {
  margin-top: 0;
  flex-shrink: 0;
}

.offer-result {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-dim);
}

.offer-result a {
  color: var(--cyan-bright);
  font-weight: 700;
}

.article-page__cta .offer-strip {
  margin-top: 12px;
}

.offer {
  margin: 28px 0 8px;
}

.offer h2 {
  text-align: center;
  font-size: clamp(22px, 2.6vw, 28px);
  margin: 0 0 10px;
}

.offer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  max-width: 860px;
  margin: 0 auto;
}

.offer-card {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: rgba(5, 12, 28, .55);
  padding: 22px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.offer-card--paid {
  border-color: rgba(72, 232, 240, .45);
  box-shadow: inset 0 0 0 1px rgba(72, 232, 240, .08);
}

.offer-card h3 {
  margin: 0;
  font-size: 16px;
  color: var(--text);
}

.offer-card__price {
  margin: 0;
  font-size: 28px;
  font-weight: 750;
  letter-spacing: -.03em;
  color: var(--cyan-bright);
}

.offer-card ul {
  margin: 0 0 8px;
  padding-left: 18px;
  color: var(--text-dim);
  font-size: 14px;
  line-height: 1.55;
  flex: 1;
}

.offer-card .btn-main,
.offer-card .btn-outline {
  align-self: flex-start;
}

.offer__note {
  max-width: 760px;
  margin: 14px auto 0;
  text-align: center;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

@media (max-width: 720px) {
  .offer-grid { grid-template-columns: 1fr; }

  .offer-strip {
    flex-direction: column;
    align-items: stretch;
  }

  .offer-strip__btn {
    width: 100%;
  }
}

.protocol-toggle,
.protocol-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 12px 0 4px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(102, 171, 230, .16);
  background: rgba(7, 14, 30, .55);
}

.protocol-note {
  flex-direction: column;
  gap: 4px;
}

.protocol-toggle {
  cursor: pointer;
}

.protocol-toggle input {
  margin-top: 3px;
  accent-color: var(--cyan);
}

.protocol-toggle__title {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
}

.protocol-toggle__help {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--text-dim);
}

.verify-checklist {
  margin-top: 18px;
  padding: 22px 22px 24px;
}

.verify-checklist__title {
  margin: 0 0 8px;
  font-size: 18px;
  border: 0;
  padding: 0;
  color: var(--text);
  letter-spacing: -.01em;
}

.verify-checklist__intro {
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.verify-checklist__steps {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  counter-reset: verify-step;
}

.verify-checklist__steps li {
  counter-increment: verify-step;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  padding: 12px 14px;
  border-radius: var(--radius-md);
  background: rgba(5, 12, 28, .45);
  border: 1px solid rgba(111,189,244,.10);
}

.verify-checklist__steps li::before {
  content: counter(verify-step);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: #04241f;
  background: linear-gradient(180deg, #79f5ff, #2adfd9);
  flex-shrink: 0;
}

.verify-checklist__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.verify-checklist__step-text {
  display: block;
}

.verify-checklist__link {
  display: inline-flex;
  align-items: center;
  margin-top: 0;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(72,232,240,.28);
  background: rgba(72,232,240,.08);
  color: var(--cyan-bright);
  text-decoration: none;
  font-weight: 650;
  font-size: 13px;
  line-height: 1.3;
}

.verify-checklist__link:hover {
  background: rgba(72,232,240,.14);
  border-color: rgba(72,232,240,.45);
  text-decoration: none;
}

.verify-checklist__badge {
  display: inline-flex;
  align-items: center;
  margin-top: 0;
  padding: 5px 10px;
  border-radius: var(--radius-pill);
  font-size: 12px;
  font-family: var(--font-mono);
  font-weight: 650;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--cyan-bright);
  font-weight: 650;
  text-decoration: none;
  border-bottom: 1px solid rgba(140,249,255,.35);
  padding-bottom: 1px;
  line-height: 1.4;
}

.text-link:hover {
  color: #b6fdff;
  border-bottom-color: rgba(182,253,255,.7);
}

.field-hint a:not(.text-link):not(.verify-checklist__link) {
  color: var(--cyan-bright);
  font-weight: 650;
  text-decoration: none;
  border-bottom: 1px solid rgba(140,249,255,.35);
}

.field-hint a:not(.text-link):not(.verify-checklist__link):hover {
  color: #b6fdff;
  border-bottom-color: rgba(182,253,255,.7);
}

.verify-checklist__badge.is-ok {
  background: rgba(40, 160, 100, .14);
  border: 1px solid rgba(80, 220, 150, .35);
  color: var(--success);
}

.verify-checklist__badge.is-fail {
  background: rgba(180, 40, 60, .15);
  border: 1px solid rgba(255, 100, 120, .35);
  color: var(--danger);
}

.verify-checklist__limit {
  margin: 16px 0 0;
  padding-top: 12px;
  border-top: 1px solid rgba(121, 245, 255, .12);
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.draw-page__hero {
  text-align: center;
  align-items: center;
  min-height: 280px;
}

.draw-page__title {
  margin: 0 0 6px;
  font-size: clamp(18px, 2.4vw, 24px);
  font-weight: 750;
  color: var(--text);
  letter-spacing: -.015em;
  border: 0;
  padding: 0;
}

.draw-page--waiting .draw-page__hero {
  border-color: rgba(72,232,240,.28);
}

.draw-page--failed .draw-page__hero {
  border-color: rgba(255,100,120,.28);
}

.draw-page--resolved .draw-page__hero {
  border-color: rgba(80,220,150,.28);
}

.btn-main--inline {
  width: auto;
  min-width: 180px;
  margin-top: 18px;
  text-decoration: none;
}

.anchor-alias {
  position: relative;
  top: -80px;
  height: 0;
  width: 0;
  overflow: hidden;
  pointer-events: none;
}

.draw-v2__lead {
  margin: 10px 0 14px;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.6;
  max-width: 36rem;
}

.draw-v2__countdown {
  font-size: 15px;
  font-weight: 650;
  color: var(--cyan-bright);
  letter-spacing: .01em;
  margin-top: 4px;
}

.draw-v2__pending {
  opacity: .55;
}

.alert {
  padding: 12px 14px;
  border-radius: 8px;
  font-size: 14px;
  margin-bottom: 16px;
}

.alert--error {
  background: rgba(180, 40, 60, .15);
  border: 1px solid rgba(255, 100, 120, .35);
  color: #ffd5dc;
}

.alert--success {
  background: rgba(40, 160, 100, .12);
  border: 1px solid rgba(80, 220, 150, .35);
  color: #d7ffe8;
}

.alert--warn {
  background: rgba(180, 140, 40, .12);
  border: 1px solid rgba(240, 200, 80, .35);
  color: #ffe9b0;
}

.list-commit {
  margin-top: 12px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid rgba(121, 245, 255, .18);
  background: rgba(2, 20, 36, .45);
}

.list-commit__head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 8px;
}

.list-commit__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text, #e8f7ff);
}

.list-commit__count {
  font-size: 12px;
  color: var(--muted, #9bb6c7);
}

.list-commit__hash code {
  font-size: 11px;
  word-break: break-all;
}

.form--stacked textarea.form__input {
  min-height: 110px;
  resize: vertical;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }

  .draw-overlay { backdrop-filter: none; }
}