:root {
  color-scheme: dark;
  --bg: #08090d;
  --surface: rgba(21, 22, 29, 0.76);
  --surface-strong: rgba(28, 29, 38, 0.94);
  --line: rgba(255, 255, 255, 0.09);
  --line-red: rgba(255, 76, 91, 0.3);
  --text: #f7f7fa;
  --muted: #9b9ca8;
  --muted-strong: #c7c7cf;
  --red: #ff3048;
  --red-bright: #ff5c68;
  --red-deep: #bd0d27;
  --green: #42d79b;
  --radius-lg: 26px;
  --radius-md: 18px;
  --shadow: 0 30px 80px rgba(0, 0, 0, 0.34);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { background-color: #08090d; scroll-behavior: smooth; }
body { position: relative; margin: 0; min-width: 320px; min-height: 100vh; color: var(--text); background-color: #08090d; background-image: radial-gradient(circle at 50% 22%, #281019 0, #0a0b11 36%, #08090d 70%); overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; opacity: .22; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 32px 32px; mask-image: linear-gradient(to bottom, #000, transparent 70%); }
button, input { font: inherit; }
button { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
.dialog-open { overflow: hidden; }
.page-ambient { position: absolute; top: max(72px, env(safe-area-inset-top)); right: 0; left: 0; height: calc(100vh - max(72px, env(safe-area-inset-top)) - 220px); overflow: hidden; pointer-events: none; clip-path: inset(0); }
.page-glow { position: absolute; width: 380px; height: 380px; border-radius: 50%; filter: blur(110px); pointer-events: none; opacity: .12; }
.page-glow--top { top: 8px; left: calc(50% - 280px); background: #ff1f3d; }
.page-glow--bottom { bottom: 8px; right: calc(50% - 300px); background: #3b4fff; }
.app-shell { position: relative; width: min(100%, 460px); margin: 0 auto; padding: max(18px, env(safe-area-inset-top)) 16px calc(38px + env(safe-area-inset-bottom)); }
.campaign-bar { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 14px; background: rgba(14,15,20,.74); color: #d9d9df; font-size: 10px; font-weight: 800; letter-spacing: .13em; backdrop-filter: blur(18px); }
.campaign-bar__pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--red-bright); box-shadow: 0 0 0 5px rgba(255,48,72,.1), 0 0 18px var(--red); }
.campaign-bar__live { margin-inline-start: auto; padding: 5px 7px; border-radius: 7px; background: rgba(66,215,155,.1); color: var(--green); font-size: 8px; }
.hero { position: relative; min-height: 520px; margin-top: 12px; padding: 34px 24px 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 30px; background: linear-gradient(145deg, rgba(25,25,32,.95), rgba(12,13,18,.96)); box-shadow: var(--shadow); }
.hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 75% 18%, rgba(255,47,70,.22), transparent 34%), linear-gradient(120deg, transparent 50%, rgba(255,255,255,.018)); pointer-events: none; }
.hero-art { position: relative; height: 206px; margin: -6px -8px 14px; }
.trx-coin { position: absolute; top: 35px; left: 50%; display: grid; place-items: center; width: 124px; height: 124px; translate: -50% 0; border-radius: 50%; border: 1px solid rgba(255,255,255,.32); background: radial-gradient(circle at 38% 30%, #ff7c85 0, #ef3047 22%, #9e071f 68%, #53000d 100%); box-shadow: inset -16px -20px 30px rgba(72,0,10,.45), inset 8px 10px 18px rgba(255,255,255,.22), 0 0 24px rgba(255,38,66,.55), 0 0 90px rgba(255,38,66,.28); transform: rotate(-8deg); animation: coin-float 5s ease-in-out infinite; }
.trx-coin::after { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(255,255,255,.16); border-radius: inherit; }
.trx-coin svg { width: 72px; fill: none; stroke: #fff; stroke-width: 2.3; filter: drop-shadow(0 3px 5px rgba(60,0,0,.45)); }
.orbit { position: absolute; top: 97px; left: 50%; width: 280px; height: 78px; translate: -50% -50%; border: 1px solid rgba(255,79,96,.18); border-radius: 50%; transform: rotate(-10deg); }
.orbit--two { width: 340px; height: 122px; border-color: rgba(255,255,255,.06); transform: rotate(13deg); }
.node { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #ff7985; box-shadow: 0 0 12px #ff3048; }
.node--one { top: 54px; left: 14%; }.node--two { top: 140px; right: 13%; }.node--three { top: 26px; right: 24%; width: 3px; height: 3px; }
.eyebrow, .claim-card__tag { display: inline-flex; padding: 6px 9px; border: 1px solid rgba(255,70,90,.2); border-radius: 8px; background: rgba(255,48,72,.07); color: #ff7b87; font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1 { position: relative; max-width: 340px; margin: 13px 0 10px; font-size: clamp(36px, 11vw, 49px); line-height: .98; letter-spacing: -.05em; }
.hero__subtitle { position: relative; max-width: 360px; margin: 0; color: var(--muted-strong); font-size: 14px; line-height: 1.65; }
.benefit-list { position: relative; display: grid; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; }
.benefit-list li { display: flex; align-items: center; gap: 9px; color: #dadbe1; font-size: 12px; }
.check { display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: rgba(255,49,72,.12); color: #ff6d79; font-size: 11px; }
.hero__fineprint { position: relative; margin: 16px 0 0; color: #72737e; font-size: 10px; line-height: 1.5; }
.safety-card { display: flex; gap: 14px; margin: 14px 0; padding: 17px; border: 1px solid rgba(69,214,156,.16); border-radius: var(--radius-md); background: linear-gradient(135deg, rgba(24,55,47,.45), rgba(14,22,23,.68)); }
.safety-card__icon { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border-radius: 12px; background: rgba(66,215,155,.11); color: var(--green); }
.safety-card svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.safety-card h2 { margin: 1px 0 5px; font-size: 13px; }.safety-card p { margin: 0; color: #a9b9b3; font-size: 10px; line-height: 1.6; }
.glass-card { border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(27,28,36,.85), rgba(15,16,21,.8)); box-shadow: 0 18px 55px rgba(0,0,0,.18); backdrop-filter: blur(18px); }
.details-card { padding: 24px; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 20px; }
.section-kicker { margin: 0 0 5px; color: #ff6d79; font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.section-heading h2, .claim-card h2 { margin: 0; font-size: 24px; letter-spacing: -.035em; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid rgba(66,215,155,.12); border-radius: 99px; color: var(--green); background: rgba(66,215,155,.07); font-size: 9px; font-weight: 700; }
.status-pill i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.055); border-radius: 16px; background: rgba(255,255,255,.055); }
.detail-grid > div { min-height: 88px; padding: 15px; background: rgba(11,12,17,.72); }
.detail-grid dt { color: #777883; font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.detail-grid dd { margin: 8px 0 0; color: #dddde3; font-size: 11px; line-height: 1.45; }.detail-grid dd.accent { color: #ff6976; font-size: 15px; font-weight: 800; }
.flow-section { margin: 30px 0; }.section-heading--plain { padding-inline: 4px; }.step-flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 0; padding: 0; list-style: none; }
.step-flow li { position: relative; display: flex; align-items: center; flex-direction: column; min-width: 0; text-align: center; }
.step-flow li:not(:last-child)::after { content: ""; position: absolute; top: 32px; inset-inline-start: calc(50% + 26px); width: calc(100% - 46px); border-top: 1px dashed rgba(255,76,91,.35); }
.step-flow__number { color: #64656f; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.step-flow__icon { display: grid; place-items: center; width: 46px; height: 46px; margin: 5px 0 9px; border: 1px solid rgba(255,73,91,.2); border-radius: 15px; background: linear-gradient(145deg, rgba(255,55,76,.14), rgba(29,22,28,.9)); color: #ff6a77; box-shadow: inset 0 1px rgba(255,255,255,.04); font-size: 17px; font-weight: 700; }
.step-flow strong { max-width: 76px; color: #bfc0c8; font-size: 9px; line-height: 1.35; }
.claim-card { position: relative; padding: 27px 22px 22px; overflow: hidden; border-color: rgba(255,67,88,.18); background: radial-gradient(circle at 100% 0, rgba(255,35,61,.12), transparent 40%), linear-gradient(145deg, rgba(32,27,35,.94), rgba(15,16,21,.92)); }
.claim-card::after { content: ""; position: absolute; inset: auto -90px -120px auto; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,35,61,.08); filter: blur(45px); pointer-events: none; }
.claim-card h2 { margin-top: 12px; font-size: 28px; }.claim-card > p { color: var(--muted); font-size: 11px; line-height: 1.5; }
label { display: block; margin: 22px 0 8px; color: #d4d5dc; font-size: 11px; font-weight: 700; }
.input-wrap { position: relative; }.input-wrap svg { position: absolute; top: 50%; inset-inline-start: 15px; width: 18px; translate: 0 -50%; fill: none; stroke: #6e6f7a; stroke-width: 1.6; }
input { width: 100%; height: 52px; padding: 0 15px 0 44px; border: 1px solid rgba(255,255,255,.09); border-radius: 15px; outline: none; color: #fff; background: rgba(7,8,12,.66); font-size: 16px; transition: border-color .2s, box-shadow .2s; }
[dir="rtl"] input { padding: 0 44px 0 15px; } input::placeholder { color: #5f606b; } input:focus { border-color: rgba(255,74,93,.65); box-shadow: 0 0 0 4px rgba(255,48,72,.09); }.is-invalid { border-color: #ff5265; }
.field-error { min-height: 16px; margin: 6px 2px 2px; color: #ff7180; font-size: 10px; }
.primary-button, .secondary-button { position: relative; display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 53px; padding: 12px 18px; border: 0; border-radius: 15px; cursor: pointer; font-size: 13px; font-weight: 800; transition: transform .16s ease, filter .16s ease, box-shadow .16s ease; }
.primary-button { color: #fff; background: linear-gradient(135deg, var(--red-bright), var(--red-deep)); box-shadow: 0 12px 28px rgba(221,17,45,.3), inset 0 1px rgba(255,255,255,.22); }.primary-button:hover { filter: brightness(1.08); box-shadow: 0 16px 34px rgba(221,17,45,.38), inset 0 1px rgba(255,255,255,.22); }.primary-button:active { transform: translateY(2px) scale(.99); }.primary-button:disabled { cursor: wait; opacity: .72; }
.claim-card .primary-button { margin-top: 8px; }.button-loader { display: none; width: 17px; height: 17px; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }.is-loading .button-loader { display: block; }
.privacy-note { display: flex; justify-content: center; gap: 6px; margin: 13px 0 0 !important; color: #6f707b !important; font-size: 9px !important; text-align: center; }
.site-footer { padding: 28px 12px 4px; text-align: center; }.brand-lockup { display: flex; align-items: center; justify-content: center; gap: 8px; color: #cfcfd5; font-size: 11px; font-weight: 700; }.brand-mark { display: inline-grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; color: #fff; background: linear-gradient(145deg, #ff4d60, #a70820); }.site-footer p { max-width: 330px; margin: 10px auto 0; color: #565762; font-size: 8px; line-height: 1.5; }
.modal { position: fixed; z-index: 50; inset: 0; display: grid; place-items: end center; padding: 16px; opacity: 0; transition: opacity .22s ease; }.modal.is-visible { opacity: 1; }.modal__backdrop { position: absolute; inset: 0; background: rgba(1,2,5,.76); backdrop-filter: blur(12px); }.modal__panel { position: relative; width: min(100%, 420px); padding: 27px 22px calc(22px + env(safe-area-inset-bottom)); border: 1px solid rgba(255,255,255,.1); border-radius: 28px; outline: none; background: linear-gradient(155deg, #202029, #111218 62%); box-shadow: 0 28px 90px rgba(0,0,0,.7); text-align: center; transform: translateY(22px) scale(.98); transition: transform .25s ease; }.is-visible .modal__panel { transform: translateY(0) scale(1); }
.icon-button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; color: #aaaab4; background: rgba(255,255,255,.05); cursor: pointer; font-size: 20px; }.modal__close { position: absolute; top: 15px; right: 15px; }.modal__status-icon { display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto 15px; border: 1px solid rgba(66,215,155,.23); border-radius: 17px; color: var(--green); background: rgba(66,215,155,.09); box-shadow: 0 0 30px rgba(66,215,155,.08); font-size: 20px; }.modal__panel h2 { max-width: 320px; margin: 8px auto 10px; font-size: 25px; line-height: 1.12; letter-spacing: -.035em; }.modal__panel > p:not(.section-kicker):not(.modal__note) { margin: 0 auto; color: var(--muted); font-size: 11px; line-height: 1.55; }
.handoff-visual { display: flex; align-items: center; gap: 8px; margin: 22px 0; }.handoff-card { display: flex; align-items: center; flex: 1; flex-direction: column; min-width: 0; min-height: 108px; padding: 14px 8px; border: 1px solid rgba(255,255,255,.07); border-radius: 16px; background: rgba(5,6,9,.52); }.handoff-card__icon { display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 7px; border-radius: 9px; color: #ff6573; background: rgba(255,48,72,.1); }.handoff-card small { color: #696a75; font-size: 7px; font-weight: 800; letter-spacing: .1em; }.handoff-card strong { width: 100%; margin-top: 5px; overflow: hidden; color: #c9cad1; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.handoff-card--community { border-color: rgba(255,64,84,.15); }.brand-mark--large { width: 30px; height: 30px; margin-bottom: 7px; }.handoff-arrow { flex: 0 0 14px; color: #ff6674; font-size: 15px; }[dir="rtl"] .handoff-arrow { transform: scaleX(-1); }.modal__note { margin: 12px auto 0; color: #676873; font-size: 9px; line-height: 1.5; }
.reveal { opacity: 0; transform: translateY(10px); transition: opacity .55s ease, transform .55s ease; }.reveal.is-revealed { opacity: 1; transform: none; }
.noscript { position: fixed; z-index: 100; right: 12px; bottom: 12px; left: 12px; padding: 12px; border-radius: 12px; color: #fff; background: #b50d25; text-align: center; }
:focus-visible { outline: 2px solid #ff7180; outline-offset: 3px; }
@keyframes spin { to { transform: rotate(360deg); } } @keyframes coin-float { 0%,100% { transform: rotate(-8deg) translateY(0); } 50% { transform: rotate(-4deg) translateY(-8px); } }
@media (min-width: 600px) { .app-shell { padding-top: 28px; padding-bottom: 60px; }.modal { place-items: center; }.modal__panel { border-radius: 28px; } }
@media (max-width: 370px) { .hero { padding-inline: 19px; }.details-card { padding: 20px 17px; }.detail-grid > div { padding: 13px 11px; }.step-flow__icon { width: 42px; height: 42px; }.claim-card { padding-inline: 18px; }.handoff-card strong { font-size: 8px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* Visual Phase 2 — holographic network system */
:root { --bg: #06070b; --line: rgba(255,255,255,.085); --line-red: rgba(255,70,91,.28); --blue: #638dff; --shadow: 0 30px 90px rgba(0,0,0,.42); }
html, body { background-color: #08090d; }
body { background-image: radial-gradient(ellipse 68% 22% at 50% 20%, rgba(125,12,36,.3), transparent 72%), radial-gradient(circle at 10% 42%, rgba(40,51,116,.12), transparent 28%), radial-gradient(circle at 90% 58%, rgba(119,6,31,.1), transparent 26%), linear-gradient(180deg,#08090d 0,#05060a 54%,#08090d 100%); }
.page-ambient { height: calc(100dvh - max(72px, env(safe-area-inset-top)) - 168px); }
body::before { z-index: -2; opacity: 1; background-image: linear-gradient(rgba(120,134,170,.027) 1px,transparent 1px),linear-gradient(90deg,rgba(120,134,170,.027) 1px,transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(to bottom,#000,rgba(0,0,0,.8) 46%,transparent 94%); }
body::after { content: ""; position: fixed; z-index: -1; top: 14%; left: 50%; width: 720px; height: 1140px; translate: -50% 0; border: 1px solid rgba(255,45,72,.05); border-radius: 50%; box-shadow: inset 0 0 80px rgba(255,36,65,.018),0 0 70px rgba(78,102,255,.018); transform: rotate(-17deg); pointer-events: none; }
.page-glow { width: 430px; height: 430px; filter: blur(120px); opacity: .13; }.page-glow--top { top: 12px; left: calc(50% - 330px); }.page-glow--bottom { right: calc(50% - 350px); bottom: 12px; }
.app-shell::before { content: ""; position: absolute; z-index: -1; top: 410px; bottom: 130px; left: 8px; width: 1px; background: linear-gradient(transparent,rgba(255,48,72,.12) 15%,rgba(91,114,211,.08) 62%,transparent); box-shadow: 443px 170px 0 rgba(255,48,72,.035); pointer-events: none; }
.campaign-bar { position: relative; overflow: hidden; border-color: rgba(255,255,255,.075); background: linear-gradient(90deg,rgba(24,15,21,.88),rgba(11,13,19,.82)); box-shadow: inset 0 1px rgba(255,255,255,.025),0 8px 32px rgba(0,0,0,.2); }
.campaign-bar::after { content: ""; position: absolute; right: 62px; bottom: 0; left: 62px; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,63,85,.28),transparent); }.campaign-bar__pulse { animation: status-pulse 4s ease-in-out infinite; }

.hero { min-height: 520px; padding: 28px 24px 27px; border-color: rgba(255,255,255,.095); background: radial-gradient(circle at 50% 19%,rgba(143,8,35,.2),transparent 35%),linear-gradient(150deg,rgba(24,25,34,.98),rgba(8,10,15,.97) 76%); box-shadow: var(--shadow),inset 0 0 0 1px rgba(255,255,255,.018); }
.hero::before { inset: 7px; border: 1px solid rgba(255,255,255,.026); border-radius: 24px; background: linear-gradient(120deg,rgba(255,255,255,.025),transparent 22%,transparent 75%,rgba(255,42,70,.025)); }
.hero::after { content: ""; position: absolute; top: -1px; right: 18%; left: 18%; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,100,115,.65),transparent); box-shadow: 0 0 22px rgba(255,39,68,.48); pointer-events: none; }
.hud-corner { position: absolute; z-index: 3; width: 28px; height: 28px; pointer-events: none; }.hud-corner--top { top: 15px; left: 15px; border-top: 1px solid rgba(255,91,107,.5); border-left: 1px solid rgba(255,91,107,.5); border-radius: 5px 0 0; }.hud-corner--bottom { right: 15px; bottom: 15px; border-right: 1px solid rgba(255,91,107,.28); border-bottom: 1px solid rgba(255,91,107,.28); border-radius: 0 0 5px; }
.hero-art { height: 225px; margin: -13px -22px -4px; overflow: hidden; perspective: 480px; }.hero-art::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle,rgba(255,255,255,.46) 0 1px,transparent 1.3px),radial-gradient(circle,rgba(255,59,83,.54) 0 1px,transparent 1.4px); background-position: 18% 24%,82% 31%; background-size: 73px 81px,97px 71px; opacity: .21; mask-image: radial-gradient(ellipse at center,#000,transparent 74%); }
.reactor-grid { position: absolute; right: -38px; bottom: -74px; left: -38px; height: 150px; background-image: repeating-linear-gradient(90deg,rgba(248,75,96,.16) 0 1px,transparent 1px 32px),repeating-linear-gradient(0deg,rgba(248,75,96,.13) 0 1px,transparent 1px 24px); mask-image: linear-gradient(to bottom,transparent 4%,#000 62%,transparent); transform: rotateX(66deg); transform-origin: 50% 100%; opacity: .48; }
.energy-beam { position: absolute; top: 78px; left: 50%; width: 150px; height: 170px; translate: -50% 0; background: linear-gradient(90deg,transparent,rgba(255,28,59,.12) 35%,rgba(255,100,114,.2) 50%,rgba(255,28,59,.12) 65%,transparent); filter: blur(8px); clip-path: polygon(34% 0,66% 0,100% 100%,0 100%); opacity: .6; }
.energy-core { position: absolute; z-index: 4; top: 20px; left: 50%; width: 180px; height: 180px; translate: -50% 0; filter: drop-shadow(0 0 25px rgba(255,29,61,.3)) drop-shadow(0 20px 34px rgba(73,0,13,.38)); animation: core-float 6s ease-in-out infinite; }.energy-core::after { content: ""; position: absolute; right: 25%; bottom: 4px; left: 25%; height: 8px; border-radius: 50%; background: rgba(255,35,65,.65); filter: blur(12px); animation: core-shadow 6s ease-in-out infinite; }.energy-core img { display: block; width: 100%; height: 100%; }
.orbit { z-index: 2; top: 106px; border-color: rgba(255,84,104,.2); pointer-events: none; }.orbit--primary { width: 315px; height: 82px; transform: translate(-50%,-50%) rotate(-8deg); box-shadow: 0 0 18px rgba(255,28,59,.035); animation: orbit-drift-one 15s ease-in-out infinite alternate; }.orbit--secondary { width: 370px; height: 126px; border-color: rgba(190,205,255,.075); transform: translate(-50%,-50%) rotate(12deg); animation: orbit-drift-two 18s ease-in-out infinite alternate; }.orbit--vertical { width: 102px; height: 210px; border-color: rgba(255,67,91,.12); transform: translate(-50%,-50%) rotate(24deg); }.orbit--dashed { width: 255px; height: 170px; border-style: dashed; border-color: rgba(255,255,255,.065); transform: translate(-50%,-50%) rotate(-28deg); }
.scanner-ring { position: absolute; z-index: 3; top: 106px; left: 50%; width: 202px; height: 202px; translate: -50% -50%; border-radius: 50%; background: conic-gradient(from 5deg,transparent 0 19%,rgba(255,114,126,.65) 24%,transparent 29% 69%,rgba(255,44,70,.25) 73%,transparent 77%); -webkit-mask: radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px)); mask: radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px)); filter: drop-shadow(0 0 8px rgba(255,48,72,.26)); animation: scanner-spin 16s linear infinite; }
.node { z-index: 5; width: 4px; height: 4px; border: 1px solid rgba(255,204,210,.65); background: var(--red-bright); box-shadow: 0 0 5px 1px rgba(255,49,72,.62); animation: node-pulse 4.8s ease-in-out infinite; }.node::after { content: ""; position: absolute; inset: -5px; border: 1px solid rgba(255,69,91,.12); border-radius: inherit; }.node--one { top: 55px; left: 10%; }.node--two { top: 146px; right: 10%; width: 5px; height: 5px; animation-delay: -1.4s; }.node--three { top: 21px; right: 23%; width: 2px; height: 2px; animation-delay: -2.2s; }.node--four { top: 174px; left: 20%; width: 3px; height: 3px; animation-delay: -3s; }.node--five { top: 103px; left: 4%; width: 2px; height: 2px; animation-delay: -.8s; }.node--six { top: 67px; right: 5%; width: 3px; height: 3px; animation-delay: -3.7s; }.node--seven { top: 196px; right: 30%; width: 2px; height: 2px; animation-delay: -2.7s; }
.particle { position: absolute; z-index: 1; width: 2px; height: 2px; border-radius: 50%; background: #fff; opacity: .28; box-shadow: 24px 16px 0 rgba(255,255,255,.2),-36px 43px 0 rgba(255,71,92,.32),57px 61px 0 rgba(255,255,255,.16); }.particle--one { top: 33px; left: 25%; }.particle--two { top: 117px; right: 24%; transform: rotate(65deg); }.particle--three { top: 181px; left: 42%; transform: rotate(-35deg); }
.eyebrow,.claim-card__tag { box-shadow: inset 0 1px rgba(255,255,255,.025); }.hero h1,.hero__subtitle,.benefit-list,.hero__fineprint { z-index: 2; }.hero h1 { text-wrap: balance; text-shadow: 0 6px 30px rgba(0,0,0,.55); }

.safety-card { position: relative; overflow: hidden; border-color: rgba(69,214,156,.17); background: linear-gradient(135deg,rgba(18,48,42,.54),rgba(9,17,20,.8)); box-shadow: inset 0 1px rgba(255,255,255,.02),0 14px 40px rgba(0,0,0,.16); }.safety-card::before { content: ""; position: absolute; right: -18px; bottom: -28px; width: 130px; height: 80px; background: repeating-linear-gradient(90deg,rgba(66,215,155,.1) 0 1px,transparent 1px 13px),repeating-linear-gradient(0deg,rgba(66,215,155,.06) 0 1px,transparent 1px 13px); transform: rotate(-18deg); mask-image: linear-gradient(90deg,transparent,#000); opacity: .45; }.safety-card::after { content: ""; position: absolute; top: 11px; right: 12px; width: 5px; height: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); opacity: .78; }.safety-card__icon { position: relative; border: 1px solid rgba(66,215,155,.1); box-shadow: inset 0 0 16px rgba(66,215,155,.06),0 0 22px rgba(66,215,155,.05); }.safety-card svg { filter: drop-shadow(0 0 5px rgba(66,215,155,.25)); }
.glass-card { position: relative; background: linear-gradient(145deg,rgba(26,28,37,.87),rgba(10,12,17,.9)); box-shadow: 0 20px 60px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.026); }.glass-card::before { content: ""; position: absolute; inset: 7px; border: 1px solid rgba(255,255,255,.025); border-radius: 20px; pointer-events: none; }.details-card { position: relative; overflow: hidden; }.details-card::after { content: ""; position: absolute; top: -90px; right: -80px; width: 190px; height: 190px; border: 1px solid rgba(255,51,76,.06); border-radius: 50%; box-shadow: inset 0 0 45px rgba(255,48,72,.025); }.section-heading,.detail-grid { position: relative; z-index: 1; }
.detail-grid > div { position: relative; overflow: hidden; background: linear-gradient(145deg,rgba(11,13,19,.9),rgba(8,10,15,.75)); transition: background .25s ease,box-shadow .25s ease; }.detail-grid > div::before { content: ""; position: absolute; top: 0; right: 18%; left: 18%; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent); }.detail-grid > div::after { content: ""; position: absolute; top: 9px; right: 9px; width: 3px; height: 3px; border-radius: 50%; background: rgba(255,71,93,.65); box-shadow: 0 0 7px rgba(255,48,72,.5); }.detail-grid > div:hover { background: linear-gradient(145deg,rgba(29,18,25,.95),rgba(9,11,17,.8)); box-shadow: inset 0 0 22px rgba(255,48,72,.035); }[dir="rtl"] .detail-grid > div::after { right: auto; left: 9px; }.detail-grid dd.accent { text-shadow: 0 0 14px rgba(255,48,72,.28); }

.flow-section { position: relative; padding: 3px 0 2px; }.flow-section::before { content: ""; position: absolute; top: 44px; right: 4%; left: 4%; height: 90px; background: radial-gradient(ellipse,rgba(255,31,62,.055),transparent 70%); filter: blur(12px); }.step-flow { position: relative; }.step-flow li:not(:last-child)::after { top: 32px; inset-inline-start: calc(50% + 25px); width: calc(100% - 44px); height: 1px; border: 0; background: linear-gradient(90deg,rgba(84,13,26,.32),rgba(255,80,99,.78),rgba(84,13,26,.32)); background-size: 180% 100%; box-shadow: 0 0 6px rgba(255,48,72,.16); animation: data-flow 6s linear infinite; }.step-flow__icon { width: 48px; height: 48px; border-color: rgba(255,73,91,.22); background: radial-gradient(circle at 50% 20%,rgba(255,74,94,.13),transparent 55%),linear-gradient(145deg,rgba(37,21,29,.96),rgba(13,15,21,.94)); box-shadow: inset 0 1px rgba(255,255,255,.045),inset 0 0 18px rgba(255,48,72,.03),0 8px 20px rgba(0,0,0,.2); }.step-flow__icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 4px rgba(255,48,72,.28)); }

.claim-card { position: relative; background: radial-gradient(circle at 92% 3%,rgba(255,36,64,.13),transparent 36%),linear-gradient(145deg,rgba(34,25,34,.96),rgba(10,12,17,.96)); box-shadow: 0 22px 70px rgba(0,0,0,.3),inset 0 0 42px rgba(255,36,64,.018); }.claim-card::after { content: ""; position: absolute; inset: 0; width: auto; height: auto; border-radius: 0; background: repeating-linear-gradient(135deg,rgba(255,255,255,.017) 0 1px,transparent 1px 14px); filter: none; mask-image: linear-gradient(135deg,#000,transparent 60%); pointer-events: none; }.claim-card > * { position: relative; z-index: 1; }.claim-card__tag::after { content: ""; position: absolute; top: -29px; left: 10%; width: 130%; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,67,88,.85),transparent); box-shadow: 0 0 18px rgba(255,48,72,.62); }
.input-wrap::before,.input-wrap::after { content: ""; position: absolute; z-index: 2; top: 13px; bottom: 13px; width: 1px; opacity: 0; background: linear-gradient(transparent,#ff6071,transparent); box-shadow: 0 0 8px rgba(255,48,72,.6); transition: opacity .22s; pointer-events: none; }.input-wrap::before { left: -1px; }.input-wrap::after { right: -1px; }.input-wrap:focus-within::before,.input-wrap:focus-within::after { opacity: 1; }.input-wrap svg { z-index: 2; }input { background: linear-gradient(180deg,rgba(5,7,11,.78),rgba(10,11,16,.8)); box-shadow: inset 0 1px 7px rgba(0,0,0,.32); }input:focus { box-shadow: 0 0 0 4px rgba(255,48,72,.07),inset 0 1px 7px rgba(0,0,0,.32),0 0 22px rgba(255,35,64,.07); }
.primary-button { overflow: hidden; background: linear-gradient(110deg,#b60825 0%,#ff5367 48%,#ca0b2b 100%); box-shadow: 0 13px 30px rgba(221,17,45,.31),inset 0 1px rgba(255,255,255,.24),0 0 24px rgba(255,38,66,.06); }.primary-button::before { content: ""; position: absolute; top: -80%; left: -42%; width: 27%; height: 260%; background: linear-gradient(90deg,transparent,rgba(255,255,255,.27),transparent); transform: rotate(18deg); animation: cta-shine 7s ease-in-out infinite; }.primary-button > * { position: relative; z-index: 1; }.primary-button:hover { box-shadow: 0 16px 36px rgba(221,17,45,.39),inset 0 1px rgba(255,255,255,.24),0 0 34px rgba(255,38,66,.1); }

.site-footer { padding-top: 36px; }.footer-energy-line { display: flex; align-items: center; width: 74%; height: 1px; margin: 0 auto 22px; background: linear-gradient(90deg,transparent,rgba(255,63,84,.22),transparent); }.footer-energy-line i { width: 4px; height: 4px; margin: auto; border-radius: 50%; background: #ff6677; box-shadow: 0 0 10px rgba(255,48,72,.8); }.brand-lockup { gap: 9px; letter-spacing: .035em; }.footer-core { width: 30px; height: 30px; filter: drop-shadow(0 0 8px rgba(255,48,72,.26)); }
.modal__panel { overflow: hidden; border-color: rgba(255,80,100,.12); background: radial-gradient(circle at 50% 0,rgba(255,37,64,.09),transparent 28%),linear-gradient(155deg,#20212b,#0e1016 62%); box-shadow: 0 28px 90px rgba(0,0,0,.72),inset 0 0 0 7px rgba(255,255,255,.012); }.modal__panel::after { content: ""; position: absolute; top: 0; right: 24%; left: 24%; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,74,93,.75),transparent); box-shadow: 0 0 18px rgba(255,48,72,.5); }.modal__close { z-index: 2; }.handoff-card { min-height: 112px; background: linear-gradient(155deg,rgba(12,14,20,.8),rgba(5,7,10,.65)); box-shadow: inset 0 1px rgba(255,255,255,.022); }.handoff-card--community { background: radial-gradient(circle at 50% 10%,rgba(255,42,69,.08),transparent 48%),rgba(6,8,12,.65); }.energy-core-mini { display: block; width: 44px; height: 44px; margin: -6px 0 1px; filter: drop-shadow(0 0 7px rgba(255,48,72,.28)); }.energy-core-mini img { width: 100%; height: 100%; }.handoff-arrow { filter: drop-shadow(0 0 5px rgba(255,48,72,.3)); }

@keyframes core-float { 0%,100% { transform: translateY(0); filter: drop-shadow(0 0 24px rgba(255,29,61,.28)) drop-shadow(0 20px 34px rgba(73,0,13,.38)); } 50% { transform: translateY(-6px); filter: drop-shadow(0 0 31px rgba(255,29,61,.38)) drop-shadow(0 23px 38px rgba(73,0,13,.34)); } }
@keyframes core-shadow { 0%,100% { opacity:.64; transform:scaleX(1); } 50% { opacity:.42; transform:scaleX(.84); } }
@keyframes scanner-spin { to { transform:rotate(360deg); } }
@keyframes orbit-drift-one { to { transform:translate(-50%,-50%) rotate(-3deg) scaleX(1.02); } }
@keyframes orbit-drift-two { to { transform:translate(-50%,-50%) rotate(17deg) scaleX(.98); } }
@keyframes node-pulse { 0%,100% { opacity:.42; transform:scale(.8); } 50% { opacity:1; transform:scale(1.16); } }
@keyframes status-pulse { 0%,100% { box-shadow:0 0 0 5px rgba(255,48,72,.08),0 0 14px var(--red); } 50% { box-shadow:0 0 0 7px rgba(255,48,72,.03),0 0 20px var(--red); } }
@keyframes data-flow { to { background-position:-180% 0; } }
@keyframes cta-shine { 0%,66% { left:-42%; } 86%,100% { left:122%; } }
@media (max-width: 390px) { .hero { padding-inline:20px; }.hero-art { margin-inline:-18px; }.details-card { padding:21px 18px; }.detail-grid > div { padding:14px 12px; }.step-flow { gap:3px; }.step-flow__icon { width:44px; height:44px; }.step-flow li:not(:last-child)::after { top:30px; inset-inline-start:calc(50% + 23px); width:calc(100% - 41px); }.claim-card { padding-inline:19px; } }
@media (max-width: 350px) { .app-shell { padding-inline:12px; }.hero { padding-inline:17px; }.hero-art { margin-inline:-15px; }.energy-core { width:170px; height:170px; }.orbit--primary { width:280px; }.details-card { padding-inline:15px; }.detail-grid > div { padding-inline:10px; }.step-flow__icon { width:40px; height:40px; }.step-flow__icon svg { width:20px; }.step-flow li:not(:last-child)::after { top:28px; }.claim-card { padding-inline:16px; } }
.hero-art .orbit { translate: 0 0; }
@media (prefers-reduced-motion: reduce) {
  .energy-core, .energy-core::after, .scanner-ring, .orbit, .node, .campaign-bar__pulse, .step-flow li::after, .primary-button::before { animation: none !important; }
}

/* Visual Phase 3 — integrated hero composition */
.hero { min-height: 0; padding: 22px 24px 24px; isolation: isolate; }
.hero-art { position: absolute; z-index: 1; inset: 0; width: auto; height: auto; margin: 0; overflow: hidden; pointer-events: none; }
.hero-art::before { opacity: .18; background-position: 12% 20%,82% 34%; mask-image: radial-gradient(ellipse at 70% 45%,#000,transparent 76%); }
.hero .reactor-grid { right: -60px; bottom: 74px; left: 32%; height: 220px; opacity: .34; transform: rotateX(65deg) rotateZ(-4deg); }
.hero .energy-beam { top: 216px; right: -12px; left: auto; width: 190px; height: 270px; translate: 0 0; opacity: .46; }
.hero .energy-core { top: 220px; right: -7px; left: auto; width: 165px; height: 165px; translate: 0 0; }
.hero .orbit { top: 294px; left: 77%; }
.hero .orbit--primary { width: 300px; height: 78px; }.hero .orbit--secondary { width: 355px; height: 122px; }.hero .orbit--vertical { width: 95px; height: 195px; }.hero .orbit--dashed { width: 245px; height: 158px; }
.hero .scanner-ring { top: 294px; left: 77%; width: 190px; height: 190px; }
.hero .node--one { top: 190px; left: 56%; }.hero .node--two { top: 378px; right: 5%; }.hero .node--three { top: 167px; right: 16%; }.hero .node--four { top: 407px; left: 49%; }.hero .node--five { top: 282px; left: 45%; }.hero .node--six { top: 230px; right: 3%; }.hero .node--seven { top: 440px; right: 28%; }
.hero .particle--one { top: 174px; left: 54%; }.hero .particle--two { top: 312px; right: 18%; }.hero .particle--three { top: 425px; left: 64%; }

.hero-brand-row { position: relative; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; }
.hero-brand { display: flex; align-items: center; min-width: 0; gap: 8px; color: #e2e3e9; font-size: 10px; letter-spacing: .035em; }.hero-brand img { flex: 0 0 28px; width: 28px; height: 28px; filter: drop-shadow(0 0 8px rgba(255,48,72,.3)); }.hero-brand strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-tagline { position: relative; display: grid; flex: 0 1 148px; gap: 2px; padding-inline-start: 20px; color: #a7abb7; font-size: 9px; line-height: 1.3; text-align: end; letter-spacing: .03em; }.hero-tagline span:last-child { color: #676c78; }.hero-tagline i { position: absolute; top: 3px; bottom: 3px; inset-inline-start: 8px; width: 1px; background: linear-gradient(transparent,rgba(255,79,98,.75),transparent); box-shadow: 0 0 8px rgba(255,48,72,.34); }
.hero-content { position: relative; z-index: 3; margin-top: 27px; }.hero-content .eyebrow { position: relative; z-index: 3; }
.hero h1 { max-width: 278px; margin-top: 14px; font-size: clamp(38px,11vw,48px); line-height: .98; }.hero__subtitle { max-width: 282px; font-size: 12px; line-height: 1.58; }
.hero-how-to { position: relative; display: flex; align-items: center; gap: 9px; width: min(238px,78%); min-height: 50px; margin-top: 16px; padding: 9px 11px; border: 1px solid rgba(255,81,101,.15); border-radius: 13px; background: linear-gradient(100deg,rgba(24,16,23,.91),rgba(12,14,20,.78)); box-shadow: inset 0 1px rgba(255,255,255,.026),0 8px 22px rgba(0,0,0,.17); backdrop-filter: blur(10px); }
.hero-how-to::after { content: ""; position: absolute; top: -1px; right: 18%; left: 18%; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,72,94,.55),transparent); }.hero-how-to__icon { display: grid; place-items: center; flex: 0 0 28px; height: 28px; border: 1px solid rgba(255,72,94,.14); border-radius: 9px; color: #ff7180; background: rgba(255,48,72,.08); }.hero-how-to svg { width: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }.hero-how-to p { margin: 0; color: #c4c6ce; font-size: 9px; line-height: 1.45; }
.hero .benefit-list { max-width: 202px; margin-top: 15px; gap: 7px; }.hero .benefit-list li { font-size: 10px; line-height: 1.35; }.hero .check { flex: 0 0 18px; width: 18px; height: 18px; }
.hero .hero__fineprint { max-width: 255px; margin-top: 13px; color: #626672; font-size: 8px; }
.hero-claim-button { position: relative; z-index: 4; display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 46px; margin-top: 18px; padding: 10px 16px; overflow: hidden; border: 1px solid rgba(255,73,94,.28); border-radius: 14px; color: #f0dce0; background: linear-gradient(100deg,rgba(40,19,27,.84),rgba(16,18,25,.88)); box-shadow: inset 0 1px rgba(255,255,255,.045),0 10px 28px rgba(0,0,0,.2),0 0 24px rgba(255,38,66,.045); cursor: pointer; font-size: 11px; font-weight: 800; letter-spacing: .025em; transition: border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .16s ease; }
.hero-claim-button::before { content: ""; position: absolute; top: 0; bottom: 0; left: -35%; width: 30%; background: linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent); transform: skewX(-18deg); transition: left .5s ease; }.hero-claim-button:hover { border-color: rgba(255,83,104,.52); background: linear-gradient(100deg,rgba(62,21,32,.88),rgba(18,20,28,.92)); box-shadow: inset 0 1px rgba(255,255,255,.05),0 12px 32px rgba(0,0,0,.22),0 0 28px rgba(255,38,66,.08); }.hero-claim-button:hover::before { left: 110%; }.hero-claim-button:active { transform: translateY(1px) scale(.995); }.hero-claim-button svg { width: 16px; height: 16px; fill: none; stroke: #ff7180; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.claim-card { scroll-margin-block: 20vh; }.claim-card.is-highlighted { animation: claim-highlight 1.2s ease-out; }

[dir="rtl"] .hero .energy-core { right: auto; left: -7px; }[dir="rtl"] .hero .orbit,[dir="rtl"] .hero .scanner-ring { right: auto; left: 23%; }[dir="rtl"] .hero .reactor-grid { right: 32%; left: -60px; transform: rotateX(65deg) rotateZ(4deg); }[dir="rtl"] .hero .energy-beam { right: auto; left: -12px; }[dir="rtl"] .hero .node--one { right: 56%; left: auto; }[dir="rtl"] .hero .node--four { right: 49%; left: auto; }[dir="rtl"] .hero .node--five { right: 45%; left: auto; }[dir="rtl"] .hero .particle--one { right: 54%; left: auto; }[dir="rtl"] .hero .particle--three { right: 64%; left: auto; }

html[lang="de"] .hero h1,html[lang="fr"] .hero h1,html[lang="es"] .hero h1,html[lang="pt"] .hero h1,html[lang="it"] .hero h1,html[lang="tr"] .hero h1 { font-size: clamp(34px,9.8vw,44px); }
@keyframes claim-highlight { 0% { border-color: rgba(255,67,88,.2); box-shadow: 0 22px 70px rgba(0,0,0,.3),inset 0 0 42px rgba(255,36,64,.018); } 35% { border-color: rgba(255,86,105,.68); box-shadow: 0 22px 70px rgba(0,0,0,.3),inset 0 0 46px rgba(255,36,64,.06),0 0 32px rgba(255,38,66,.14); } 100% { border-color: rgba(255,67,88,.2); box-shadow: 0 22px 70px rgba(0,0,0,.3),inset 0 0 42px rgba(255,36,64,.018); } }

@media (max-width: 390px) { .hero { padding-inline: 20px; }.hero-content { margin-top: 24px; }.hero .energy-core { right: -14px; width: 158px; height: 158px; }.hero .orbit,.hero .scanner-ring { left: 79%; }.hero h1 { max-width: 265px; }.hero__subtitle { max-width: 266px; }.hero-how-to { width: min(228px,76%); }.hero .benefit-list { max-width: 194px; }[dir="rtl"] .hero .energy-core { right: auto; left: -14px; }[dir="rtl"] .hero .orbit,[dir="rtl"] .hero .scanner-ring { left: 21%; } }
@media (max-width: 350px) { .hero { padding-inline: 17px; }.hero-brand { font-size: 9px; }.hero-brand img { flex-basis: 25px; width: 25px; height: 25px; }.hero-tagline { flex-basis: 132px; font-size: 8px; }.hero h1 { max-width: 245px; font-size: 36px; }.hero__subtitle { max-width: 248px; }.hero-how-to { width: 215px; }.hero .energy-core { top: 230px; right: -22px; width: 148px; height: 148px; }.hero .benefit-list { max-width: 185px; }[dir="rtl"] .hero .energy-core { right: auto; left: -22px; } }
@media (prefers-reduced-motion: reduce) { .claim-card.is-highlighted { animation: none !important; border-color: rgba(255,86,105,.48); }.hero-claim-button,.hero-claim-button::before { transition: none !important; } }

/* In-page claim state machine */
.claim-state { position: relative; z-index: 1; }.claim-state--ready > p:not(.section-kicker):not(.modal__note),.claim-state--processing > p,.claim-state--temporary-error > p { max-width: 320px; margin: 0 auto; color: var(--muted); font-size: 11px; line-height: 1.55; }
.modal__panel[data-claim-state="processing"],.modal__panel[data-claim-state="temporary-error"] { background: radial-gradient(circle at 50% 18%,rgba(83,39,71,.14),transparent 32%),linear-gradient(155deg,#1d202a,#0d1016 64%); }
.claim-state--processing,.claim-state--temporary-error { display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 390px; padding: 28px 4px 12px; }
.claim-processing-visual { position: relative; width: 142px; height: 142px; margin-bottom: 18px; }.claim-processing-visual img { position: absolute; z-index: 2; inset: 31px; width: 80px; height: 80px; filter: drop-shadow(0 0 16px rgba(255,48,72,.34)); animation: claim-core-breathe 2.8s ease-in-out infinite; }.claim-processing-ring { position: absolute; z-index: 1; inset: 7px; border-radius: 50%; background: conic-gradient(from 0deg,transparent 0 18%,rgba(255,91,110,.82) 24%,transparent 31% 68%,rgba(92,129,255,.36) 74%,transparent 81%); -webkit-mask: radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px)); mask: radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px)); filter: drop-shadow(0 0 9px rgba(255,48,72,.24)); animation: claim-scan 5s linear infinite; }.claim-processing-visual::before,.claim-processing-visual::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.055); border-radius: 50%; }.claim-processing-visual::before { inset: 18px; }.claim-processing-visual::after { inset: 0; border-style: dashed; border-color: rgba(255,74,94,.1); animation: claim-scan 12s linear infinite reverse; }.claim-processing-visual i { position: absolute; z-index: 3; width: 5px; height: 5px; border-radius: 50%; background: #ff6677; box-shadow: 0 0 9px rgba(255,48,72,.72); animation: claim-node-fade 1.8s ease-in-out infinite; }.claim-processing-visual i:nth-of-type(1) { top: 25px; left: 19px; }.claim-processing-visual i:nth-of-type(2) { top: 45px; right: 13px; animation-delay: -.6s; }.claim-processing-visual i:nth-of-type(3) { right: 37px; bottom: 11px; width: 3px; height: 3px; animation-delay: -1.2s; }
.claim-state--processing h2,.claim-state--temporary-error h2 { max-width: 330px; margin: 0 auto 10px; font-size: 24px; line-height: 1.14; letter-spacing: -.03em; }.claim-state--processing h2 { color: #f3f4f8; }.claim-state--processing > p { color: #8f94a1; }
.claim-error-visual { display: grid; place-items: center; width: 80px; height: 80px; margin-bottom: 20px; border: 1px solid rgba(185,104,129,.2); border-radius: 24px; color: #c8788e; background: radial-gradient(circle,rgba(173,67,96,.11),rgba(34,29,41,.18)); box-shadow: inset 0 0 24px rgba(145,59,87,.045),0 0 32px rgba(92,76,164,.05); }.claim-error-visual svg { width: 54px; height: 54px; fill: rgba(200,102,130,.16); stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }.claim-state--temporary-error h2 { color: #ececf2; }.claim-state--temporary-error > p { color: #8e929f; }
.claim-error-email { display: grid; width: min(100%,300px); margin: 22px auto 13px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.065); border-radius: 13px; background: rgba(5,7,11,.42); }.claim-error-email span { margin-bottom: 4px; color: #626773; font-size: 7px; font-weight: 800; letter-spacing: .12em; }.claim-error-email strong { overflow: hidden; color: #c6c9d2; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.claim-close-button { width: min(100%,300px); margin-top: 7px; border-color: rgba(197,117,140,.16); background: rgba(255,255,255,.045); }
@keyframes claim-scan { to { transform: rotate(360deg); } }@keyframes claim-core-breathe { 0%,100% { transform: translateY(0) scale(.98); filter: drop-shadow(0 0 13px rgba(255,48,72,.28)); } 50% { transform: translateY(-3px) scale(1.02); filter: drop-shadow(0 0 21px rgba(255,48,72,.4)); } }@keyframes claim-node-fade { 0%,100% { opacity:.3; transform:scale(.8); } 50% { opacity:1; transform:scale(1.2); } }
@media (prefers-reduced-motion: reduce) { .claim-processing-ring,.claim-processing-visual::after,.claim-processing-visual img,.claim-processing-visual i { animation: none !important; } }