:root {
  --arc-black: #08080a;
  --arc-panel: #111116;
  --arc-panel-2: #191920;
  --arc-ink: #f7f7f3;
  --arc-muted: #b8b7be;
  --arc-acid: #d9ff43;
  --arc-purple: #7557ff;
  --arc-line: rgba(255,255,255,.14);
}
.arc-popup-open { overflow: hidden; }
.arc-overlay[hidden], [data-arc-success][hidden], [data-arc-capture][hidden] { display: none !important; }
.arc-overlay { position: fixed; z-index: 999999; inset: 0; display: grid; place-items: center; padding: 18px; background: rgba(0,0,0,.72); backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); }
.arc-popup, .arc-hero { color: var(--arc-ink); font-family: inherit; box-sizing: border-box; }
.arc-popup { position: relative; width: min(840px, 100%); max-height: min(760px, calc(100dvh - 36px)); overflow: auto; overscroll-behavior: contain; border: 1px solid rgba(255,255,255,.16); border-radius: 28px; background: var(--arc-panel); box-shadow: 0 42px 120px rgba(0,0,0,.7), 0 0 0 1px rgba(117,87,255,.12); scrollbar-width: thin; }
.arc-popup-layout { display: grid; grid-template-columns: .88fr 1.12fr; min-height: 610px; }
.arc-popup-visual { position: relative; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 34px; background: linear-gradient(155deg, rgba(117,87,255,.82), rgba(20,12,46,.78) 48%, rgba(8,8,10,.98)), repeating-linear-gradient(118deg, transparent 0 28px, rgba(255,255,255,.07) 29px 30px); }
.arc-popup-visual::after { content: ""; position: absolute; width: 260px; height: 260px; right: -90px; bottom: -105px; border: 58px solid rgba(217,255,67,.16); border-radius: 50%; }
.arc-brand-mark { position: relative; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid rgba(255,255,255,.55); font-size: 28px; font-weight: 950; letter-spacing: -.08em; }
.arc-popup-visual > div:last-child { position: relative; z-index: 1; }
.arc-popup-badge { display: inline-flex; padding: 8px 13px; border-radius: 999px; color: #0b0b0d; background: var(--arc-acid); box-shadow: 0 8px 26px rgba(217,255,67,.18); font-size: 12px; font-weight: 950; letter-spacing: .12em; }
.arc-invite { margin: 18px 0 8px !important; color: rgba(255,255,255,.7) !important; font-size: 11px; font-weight: 900; letter-spacing: .18em; }
.arc-popup h2, .arc-hero h1 { color: var(--arc-ink); font-weight: 950; letter-spacing: -.045em; line-height: .94; text-transform: uppercase; }
.arc-popup h2 { margin: 0 0 16px; font-size: clamp(38px, 5vw, 64px); }
.arc-popup-visual p:not(.arc-invite) { max-width: 310px; color: rgba(255,255,255,.82); font-size: 15px; line-height: 1.5; }
.arc-popup-visual ul { display: grid; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; color: rgba(255,255,255,.78); font-size: 13px; font-weight: 700; }
.arc-popup-visual li::before { content: "✦"; margin-right: 9px; color: var(--arc-acid); }
.arc-popup-content { display: flex; min-width: 0; padding: 38px 38px 30px; background: linear-gradient(155deg, var(--arc-panel-2), var(--arc-black)); }
.arc-popup-content > * { width: 100%; }
.arc-mobile-kicker { display: none; }
.arc-close { position: sticky; z-index: 20; top: 12px; float: right; display: grid; place-items: center; width: 48px; height: 48px; margin: 12px 12px -60px 0; padding: 0; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; color: #fff; background: rgba(8,8,10,.88); box-shadow: 0 8px 24px rgba(0,0,0,.34); font-size: 32px; line-height: 1; cursor: pointer; }
.arc-close:hover, .arc-close:focus-visible { color: var(--arc-black); background: var(--arc-acid); outline: 3px solid rgba(217,255,67,.28); }
.arc-consent-form { display: grid; gap: 8px; margin-top: 0; }
.arc-consent-form > label { margin-top: 4px; color: #fff; font-size: 12px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.arc-consent-form > label span { color: var(--arc-muted); font-weight: 600; text-transform: none; }
.arc-consent-form input[type="email"], .arc-consent-form input[type="tel"] { width: 100%; min-height: 50px; padding: 11px 14px; border: 1px solid var(--arc-line); border-radius: 11px; color: #fff; background: rgba(255,255,255,.07); box-sizing: border-box; }
.arc-consent-form input::placeholder { color: #85848d; }
.arc-consent-form input:focus { border-color: var(--arc-acid); outline: 3px solid rgba(217,255,67,.12); }
.arc-choices { display: grid; gap: 10px; margin: 10px 0 5px; }
.arc-choices label { display: grid; grid-template-columns: 21px 1fr; gap: 9px; align-items: start; color: #d8d7dd; font-size: 13px; line-height: 1.4; }
.arc-choices input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--arc-acid); }
.arc-privacy { margin: 0; color: #8e8d96; font-size: 11px; line-height: 1.45; }
.arc-consent-form button[type="submit"], .arc-shop-cta { display: grid; place-items: center; min-height: 50px; margin-top: 7px; padding: 12px 18px; border: 0; border-radius: 11px; color: #0b0b0d; background: var(--arc-acid); box-shadow: 0 14px 30px rgba(217,255,67,.12); font-weight: 950; letter-spacing: .035em; text-decoration: none; text-transform: uppercase; cursor: pointer; }
.arc-consent-form button[type="submit"]:hover, .arc-shop-cta:hover { color: #fff; background: var(--arc-purple); }
.arc-consent-form button[disabled] { opacity: .65; cursor: wait; }
.arc-message { min-height: 18px; color: #fff; font-size: 12px; font-weight: 750; }
.arc-success { color: var(--arc-acid); }
.arc-error { color: #ff758b; }
.arc-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.arc-community { margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--arc-line); }
.arc-community > span { color: #fff; font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.arc-community p { margin: 6px 0 10px; color: var(--arc-muted); font-size: 12px; line-height: 1.4; }
.arc-community a { display: inline-flex; align-items: center; min-height: 42px; padding: 0 15px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: #fff; font-size: 11px; font-weight: 900; letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.arc-community a::before { content: "↗"; margin-right: 8px; color: var(--arc-acid); font-size: 17px; }
.arc-community a:hover { border-color: var(--arc-acid); color: var(--arc-acid); }
.arc-success-state { align-self: center; text-align: center; }
.arc-success-icon { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 14px; border-radius: 50%; color: var(--arc-black); background: var(--arc-acid); font-size: 25px; font-weight: 950; }
.arc-success-kicker { margin: 0 0 4px; color: var(--arc-acid); font-size: 12px; font-weight: 900; letter-spacing: .13em; }
.arc-success-state h3 { margin: 0 0 18px; color: #fff; font-size: clamp(28px, 4vw, 42px); font-weight: 950; letter-spacing: -.04em; line-height: 1; text-transform: uppercase; }
.arc-coupon { display: grid; grid-template-columns: 1fr auto; overflow: hidden; margin: 0 0 8px; border: 1px dashed rgba(217,255,67,.62); border-radius: 12px; }
.arc-coupon span { display: grid; place-items: center; padding: 13px; color: var(--arc-acid); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 17px; font-weight: 850; letter-spacing: .08em; }
.arc-coupon button { min-width: 76px; border: 0; color: #0b0b0d; background: var(--arc-acid); font-size: 11px; font-weight: 900; cursor: pointer; }
.arc-success-question { margin: 22px 0 0; color: var(--arc-muted); font-size: 13px; line-height: 1.45; }
.arc-community-compact { margin-top: 12px; }
.arc-page-shell { min-height: 74vh; padding: clamp(38px, 7vw, 92px) 18px; background: radial-gradient(circle at 14% 0, rgba(117,87,255,.42), transparent 34%), #08080a; }
.arc-hero { width: min(820px, 100%); margin: 0 auto; padding: clamp(28px, 5vw, 58px); border: 1px solid var(--arc-line); border-radius: 28px; background: linear-gradient(150deg, #191920, #0b0b0e); box-shadow: 0 32px 90px rgba(0,0,0,.48); }
.arc-landing-head { max-width: 680px; margin-bottom: 28px; }
.arc-hero h1 { margin: 16px 0 12px; font-size: clamp(42px, 8vw, 78px); }
.arc-landing-head > p:not(.arc-invite), .arc-hero > p { color: var(--arc-muted); }
.arc-hero .arc-consent-form, .arc-hero > [data-arc-capture] { max-width: 610px; }
.arc-hero > .arc-success-state { max-width: 560px; margin: 0 auto; }
.arc-preferences .arc-consent-form { margin-top: 22px; }
.arc-checkout { margin: 24px 0; padding: 20px; border: 1px solid #dedbe8; border-radius: 14px; color: #222; background: #f7f6fb; }
.arc-checkout h3 { margin-top: 0; color: #222; }
.arc-checkout > p { margin-bottom: 0; color: #6d697d; font-size: 13px; }
@media (max-width: 720px) {
  .arc-overlay { align-items: end; padding: 8px; }
  .arc-popup { width: 100%; max-height: calc(100dvh - 16px); border-radius: 22px 22px 18px 18px; }
  .arc-popup-layout { display: block; min-height: 0; }
  .arc-popup-visual { min-height: auto; padding: 24px 22px 20px; }
  .arc-brand-mark, .arc-popup-visual ul { display: none; }
  .arc-popup-visual h2 { max-width: 86%; margin: 10px 0 8px; font-size: clamp(34px, 11vw, 48px); }
  .arc-popup-visual p:not(.arc-invite) { margin: 0; font-size: 13px; }
  .arc-invite { margin-top: 12px !important; }
  .arc-popup-content { padding: 22px 20px 24px; }
  .arc-mobile-kicker { display: block; margin: 0 55px 15px 0; color: var(--arc-acid); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
  .arc-close { position: sticky; top: 8px; width: 48px; height: 48px; margin: 8px 8px -56px 0; }
  .arc-community { margin-top: 14px; }
  .arc-page-shell { padding: 24px 8px; }
  .arc-hero { padding: 28px 19px; border-radius: 20px; }
  .arc-hero h1 { font-size: clamp(39px, 13vw, 58px); }
}
@media (max-width: 360px) {
  .arc-overlay { padding: 0; }
  .arc-popup { max-height: 100dvh; border-radius: 0; }
  .arc-popup-visual { padding: 20px 17px 16px; }
  .arc-popup-content { padding: 18px 16px 20px; }
  .arc-popup-visual h2 { font-size: 34px; }
  .arc-consent-form input[type="email"], .arc-consent-form input[type="tel"] { min-height: 46px; }
  .arc-choices { gap: 7px; }
  .arc-community p { margin-bottom: 8px; }
}
@media (prefers-reduced-motion: no-preference) {
  .arc-popup { animation: arc-in .32s cubic-bezier(.2,.8,.2,1) both; }
  .arc-close, .arc-community a, .arc-consent-form button { transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease; }
  .arc-consent-form button:hover, .arc-community a:hover { transform: translateY(-1px); }
  @keyframes arc-in { from { opacity: 0; transform: translateY(20px) scale(.975); } }
}
