.landing-page {
  --night:#0b1622;
  --night-soft:#122432;
  --ivory:#f5f0e6;
  --muted:#bfcbcf;
  --turquoise:#50d8c7;
  --orange:#ff7827;
  --gold:#ecc879;
  background:var(--night);
  color:var(--ivory);
  isolation:isolate;
  overflow-x:clip;
}
.landing-page::before {
  position:absolute; z-index:-1; top:0; left:0; width:100%; height:880px;
  background:url("assets/hubble-westerlund2.webp") center 16%/cover;
  opacity:.12; mask-image:linear-gradient(black 20%,transparent 96%);
  pointer-events:none; content:"";
}
.landing-page .shell { width:min(1380px,calc(100% - 72px)); }
.landing-page :focus-visible { outline-color:var(--turquoise); }
.landing-page h1,
.landing-page .section h2,
.landing-page .section h3 { font-family:var(--display); }
.landing-page .site-header {
  position:relative; z-index:5; min-height:98px; border:0;
}
.landing-page .brand { gap:14px; color:var(--ivory); font-size:22px; }
.landing-page .brand img { width:48px; height:48px; object-fit:contain; }
.landing-page .nav-links a { color:var(--muted); }
.landing-page .nav-links a:hover { color:var(--turquoise); }
.landing-page .hero {
  position:relative; isolation:isolate; display:block; min-height:690px;
  padding:70px 0 85px;
}
.landing-page .hero-copy { position:relative; z-index:2; max-width:625px; }
.landing-page .hero .eyebrow { color:var(--gold); }
.landing-page h1 {
  max-width:680px; margin:0 0 28px; color:var(--ivory);
  font-size:clamp(62px,6.1vw,88px); font-weight:750; letter-spacing:-.055em; line-height:.98;
}
.landing-page .hero-lede {
  max-width:565px; margin:0 0 26px; color:#d0d9d8;
  font-size:22px; line-height:1.52;
}
.landing-page .hero-facts { max-width:590px; gap:5px 17px; color:var(--muted); font-size:15px; }
.landing-page .hero-facts span:first-child { color:var(--gold); }
.landing-page .hero-actions { gap:17px 23px; }
.landing-page .button-primary { background:var(--orange); color:#101c24; }
.landing-page .button-primary:hover { background:#ff9a55; }
.landing-page .hero .text-link { color:var(--turquoise); }
.landing-page .hero .text-link:hover { color:var(--gold); }
.landing-page .hero-art {
  position:absolute; z-index:0; top:0; right:-58px; width:min(78vw,1080px);
  height:670px; overflow:hidden; margin:0; pointer-events:none;
  mask-image:linear-gradient(90deg,transparent,black 33%),linear-gradient(270deg,transparent,black 9%),linear-gradient(0deg,transparent,black 12%,black 84%,transparent);
  mask-composite:intersect;
}
.landing-page .hero-team { width:100%; height:100%; object-fit:cover; object-position:center; }
.landing-page .paper-world { background:transparent; color:var(--ivory); }
.landing-page .paper-world .eyebrow,
.landing-page .section-heading .eyebrow { color:var(--turquoise); }
.landing-page .section { padding-block:84px; }
.landing-page .section-heading h2,
.landing-page .current-copy h2,
.landing-page .action-intro h2,
.landing-page .access-layout h2 {
  color:var(--ivory); font-size:clamp(48px,5.1vw,68px); font-weight:720;
  letter-spacing:-.045em; line-height:1.02;
}
.landing-page .current-section { padding-block:55px 90px; }
.landing-page .current-layout { display:block; }
.landing-page .current-top {
  display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(45px,7vw,100px); align-items:center;
}
.landing-page .current-copy { grid-column:2; grid-row:1; max-width:620px; }
.landing-page .current-copy .eyebrow { color:var(--turquoise); }
.landing-page .current-copy h2 { margin:0 0 20px; }
.landing-page .current-copy>p:not(.eyebrow) {
  max-width:570px; margin:0; color:var(--muted); font-size:19px; line-height:1.62;
}
.landing-page .product-shot {
  grid-column:1; grid-row:1; width:100%; margin:0; overflow:hidden; border:0; border-radius:11px;
  background:transparent;
}
.landing-page .product-shot img { width:100%; height:auto; border-radius:11px; }
.landing-page .current-bottom {
  display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);
  gap:clamp(38px,6vw,82px); align-items:start; margin-top:48px;
}
.landing-page .available-list { gap:26px 36px; }
.landing-page .available-list li::before { background:var(--orange); }
.landing-page .available-list strong { color:var(--ivory); font-size:22px; }
.landing-page .available-list span { color:var(--muted); font-size:17px; line-height:1.58; }
.landing-page .limit-panel {
  margin:0; padding:0; border:0; border-radius:0; background:transparent; color:var(--ivory);
}
.landing-page .limit-panel .eyebrow { color:var(--gold); }
.landing-page .limit-panel h3 { margin:0 0 17px; color:var(--ivory); font-size:29px; }
.landing-page .limit-panel li { color:var(--muted); font-size:16px; line-height:1.55; }
.landing-page .limit-panel li::before { background:var(--turquoise); }
.landing-page .tier-rule {
  display:flex; align-items:center; gap:22px; margin-top:45px; padding-top:24px;
  border-top:1px solid #bfcbcf25;
}
.landing-page .tier-emblems { display:flex; gap:12px; flex:none; }
.landing-page .tier-emblems img { width:76px; height:76px; object-fit:contain; }
.landing-page .tier-rule p { margin:0; color:var(--muted); font-size:17px; }
.landing-page .tier-rule strong { color:var(--ivory); font-weight:700; }
.landing-page .tier-rule>a { margin-left:auto; color:var(--turquoise); font-size:16px; white-space:nowrap; }
.landing-page .action-section { padding-block:85px 90px; background:transparent; color:var(--ivory); }
.landing-page .action-section .eyebrow { color:var(--turquoise); }
.landing-page .action-panel {
  display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);
  gap:38px clamp(48px,7vw,92px); align-items:start;
}
.landing-page .action-intro { max-width:470px; grid-column:1; grid-row:1 / span 2; }
.landing-page .action-intro h2 { margin-bottom:23px; font-size:clamp(58px,6vw,76px); }
.landing-page .action-intro h2 em { color:var(--orange); font-style:normal; }
.landing-page .action-intro>p:last-child { color:var(--muted); font-size:19px; line-height:1.62; }
.landing-page .raid-proof { grid-column:2; margin:0; }
.landing-page .raid-proof img { width:100%; height:auto; border-radius:9px; }
.landing-page .gold-rule {
  grid-column:2; display:flex; align-items:center; gap:20px;
  max-width:730px; margin-top:2px;
}
.landing-page .gold-rule>img { width:104px; height:104px; flex:none; object-fit:contain; }
.landing-page .gold-rule h3 { margin:0 0 7px; color:var(--gold); font-size:27px; }
.landing-page .gold-rule p { margin:0 0 8px; color:var(--muted); font-size:17px; line-height:1.5; }
.landing-page .gold-rule a { color:var(--turquoise); font-size:15px; text-decoration:underline; text-underline-offset:4px; }
.landing-page .workflow-list {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px;
  margin:56px 0 0; padding:0; list-style:none;
}
.landing-page .workflow-list li { grid-template-columns:32px 1fr; gap:14px; }
.landing-page .workflow-number { color:var(--orange); font-size:29px; }
.landing-page .workflow-list h3 { color:var(--ivory); font-size:23px; }
.landing-page .workflow-list p { color:var(--muted); font-size:17px; line-height:1.55; }
.landing-page .next-section { position:relative; isolation:isolate; padding-block:78px; }
.landing-page .next-section::before {
  position:absolute; z-index:-1; inset:-50px -7vw;
  background:url("assets/hubble-westerlund2.webp") 70% 48%/cover;
  opacity:.1; mask-image:radial-gradient(ellipse at 76% 50%,black,transparent 70%);
  pointer-events:none; content:"";
}
.landing-page .next-copy p,
.landing-page .data-summary p,
.landing-page .access-copy p,
.landing-page .faq-list details p { color:var(--muted); }
.landing-page .next-copy p { font-size:19px; line-height:1.65; }
.landing-page .next-copy p:last-child { color:var(--gold); font-size:17px; }
.landing-page .data-section { padding-block:46px 70px; }
.landing-page .data-heading h2 { color:var(--ivory); font-size:clamp(42px,4.4vw,58px); }
.landing-page .data-summary p { font-size:18px; line-height:1.65; }
.landing-page .data-summary strong { color:var(--ivory); }
.landing-page .data-summary .text-link,
.landing-page .access-copy .text-link { color:var(--turquoise); }
.landing-page .access-section {
  position:relative; isolation:isolate; padding-block:75px 85px; overflow:visible;
}
.landing-page .access-section::before {
  position:absolute; z-index:-1; inset:-20px -7vw;
  background:url("assets/hubble-westerlund2.webp") center 45%/cover;
  opacity:.18; mask-image:radial-gradient(ellipse at 68% 50%,black,transparent 71%);
  pointer-events:none; content:"";
}
.landing-page .access-layout { grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:50px; }
.landing-page .access-layout .eyebrow { color:var(--gold); }
.landing-page .access-layout h2 { font-size:clamp(43px,4.6vw,59px); }
.landing-page .access-copy {
  position:relative; display:block; max-width:none; min-height:255px; padding:0 240px 0 0;
}
.landing-page .access-copy p { margin:0 0 20px; font-size:18px; line-height:1.62; }
.landing-page .access-copy .button { margin-right:14px; }
.landing-page .access-copy .text-link { display:inline-block; }
.landing-page .access-mark {
  position:absolute; top:50%; right:0; width:210px; height:auto;
  transform:translateY(-50%); object-fit:contain;
}
.landing-page .faq-section { padding-block:60px 90px; }
.landing-page .faq-layout .section-heading h2 { color:var(--ivory); font-size:clamp(43px,4.5vw,58px); }
.landing-page .faq-list { gap:0; }
.landing-page .faq-list details {
  padding:18px 2px; border-bottom:1px solid #bfcbcf2b; border-radius:0; background:transparent;
}
.landing-page .faq-list summary {
  color:var(--ivory); font-size:21px;
}
.landing-page .faq-list summary::after { color:var(--turquoise); }
.landing-page .faq-list details p { font-size:17px; line-height:1.65; }
.landing-page .faq-list details p a { color:var(--turquoise); text-decoration:underline; }
.landing-page .site-footer { position:relative; background:#08131d; }
.landing-page .footer-inner { min-height:112px; padding-block:22px; }
.landing-page .site-footer p { max-width:780px; color:#bfcbcf; font-size:14px; line-height:1.55; }
.landing-page .site-footer p a { color:var(--turquoise); text-decoration:underline; text-underline-offset:3px; }
.landing-page .site-footer > .footer-inner > span { color:var(--muted); }

@media (max-width:1100px) {
  .landing-page .shell { width:calc(100% - 64px); }
  .landing-page .hero-art { right:-90px; width:82vw; }
  .landing-page .hero-copy { max-width:550px; }
  .landing-page h1 { font-size:clamp(60px,7vw,78px); }
  .landing-page .current-top { gap:42px; }
  .landing-page .current-bottom { gap:36px; }
  .landing-page .action-panel { gap:34px; }
  .landing-page .gold-rule { gap:14px; }
  .landing-page .gold-rule>img { width:88px; height:88px; }
  .landing-page .access-layout { gap:30px; }
  .landing-page .access-copy { padding-right:190px; }
  .landing-page .access-mark { width:170px; }
}
@media (max-width:960px) {
  .landing-page .hero { min-height:0; padding-block:52px 54px; }
  .landing-page .hero-art { right:-45px; width:86vw; height:590px; }
  .landing-page .hero-copy { max-width:540px; }
  .landing-page .current-top { grid-template-columns:1fr 1.1fr; }
  .landing-page .current-bottom { grid-template-columns:1fr; }
  .landing-page .limit-panel { margin:0; }
  .landing-page .action-panel { grid-template-columns:1fr 1.25fr; gap:32px; }
  .landing-page .action-intro { grid-row:1 / span 2; }
  .landing-page .workflow-list { gap:24px; }
  .landing-page .workflow-list li { grid-template-columns:25px 1fr; gap:10px; }
  .landing-page .access-copy { padding-right:150px; }
  .landing-page .access-mark { width:135px; }
  .landing-page .footer-inner { align-items:flex-start; }
}
@media (max-width:680px) {
  .landing-page .shell { width:calc(100% - 38px); }
  .landing-page .site-header { min-height:72px; }
  .landing-page .brand { font-size:18px; }
  .landing-page .brand img { width:42px; height:42px; }
  .landing-page .hero { padding-block:37px 28px; }
  .landing-page .hero-copy { max-width:none; }
  .landing-page h1 { font-size:clamp(46px,11.7vw,68px); line-height:1; }
  .landing-page .hero-lede { font-size:19px; }
  .landing-page .hero-facts { font-size:14px; }
  .landing-page .hero-actions { gap:13px 18px; }
  .landing-page .hero-actions .button { width:100%; }
  .landing-page .hero-art {
    position:relative; top:auto; right:auto; width:calc(100% + 38px);
    height:auto; aspect-ratio:16/9; margin:20px -19px 0;
    mask-image:linear-gradient(0deg,transparent,black 12%,black 88%,transparent),linear-gradient(270deg,transparent,black 9%);
  mask-composite:intersect;
  }
  .landing-page .hero-team { object-fit:cover; }
  .landing-page .section { padding-block:59px; }
  .landing-page .section-heading h2,
  .landing-page .current-copy h2,
  .landing-page .action-intro h2 { font-size:clamp(43px,10.4vw,58px); }
  .landing-page .current-section { padding-block:42px 58px; }
  .landing-page .current-top { grid-template-columns:1fr; gap:24px; }
  .landing-page .current-copy,
  .landing-page .product-shot { grid-column:auto; grid-row:auto; }
  .landing-page .current-copy>p:not(.eyebrow) { font-size:18px; }
  .landing-page .current-bottom { margin-top:35px; }
  .landing-page .available-list { grid-template-columns:1fr 1fr; gap:22px 20px; }
  .landing-page .available-list strong { font-size:20px; }
  .landing-page .available-list span { font-size:16px; }
  .landing-page .limit-panel h3 { font-size:26px; }
  .landing-page .limit-panel li { font-size:16px; }
  .landing-page .tier-rule { align-items:flex-start; flex-wrap:wrap; gap:12px 16px; margin-top:32px; }
  .landing-page .tier-emblems img { width:62px; height:62px; }
  .landing-page .tier-rule p { flex:1 1 210px; font-size:16px; }
  .landing-page .tier-rule>a { margin-left:0; }
  .landing-page .action-panel { grid-template-columns:1fr; gap:25px; }
  .landing-page .action-intro { grid-column:1; grid-row:auto; }
  .landing-page .action-intro h2 { font-size:58px; }
  .landing-page .action-intro>p:last-child { font-size:18px; }
  .landing-page .raid-proof { grid-column:1; }
  .landing-page .gold-rule { grid-column:1; align-items:flex-start; gap:12px; }
  .landing-page .gold-rule>img { width:77px; height:77px; }
  .landing-page .gold-rule h3 { font-size:24px; }
  .landing-page .gold-rule p { font-size:16px; }
  .landing-page .workflow-list { grid-template-columns:1fr; gap:22px; margin-top:39px; }
  .landing-page .workflow-list h3 { font-size:22px; }
  .landing-page .workflow-list p { font-size:16px; }
  .landing-page .next-layout,
  .landing-page .data-layout,
  .landing-page .access-layout,
  .landing-page .faq-layout { grid-template-columns:1fr; gap:17px; }
  .landing-page .next-section,
  .landing-page .data-section,
  .landing-page .access-section,
  .landing-page .faq-section { padding-block:48px; }
  .landing-page .next-copy p,
  .landing-page .data-summary p,
  .landing-page .access-copy p { font-size:17px; }
  .landing-page .access-layout h2,
  .landing-page .data-heading h2,
  .landing-page .faq-layout .section-heading h2 { font-size:43px; }
  .landing-page .access-copy { min-height:0; padding:0; }
  .landing-page .access-mark { position:static; display:block; width:170px; margin:30px auto 0; transform:none; }
  .landing-page .faq-list summary { font-size:19px; }
  .landing-page .faq-list details p { font-size:16px; }
  .landing-page .footer-inner { display:grid; grid-template-columns:1fr auto; gap:15px; }
  .landing-page .site-footer p { grid-column:1 / -1; grid-row:2; max-width:none; }
}
@media (max-width:390px) {
  .landing-page .shell { width:calc(100% - 32px); }
  .landing-page .available-list { grid-template-columns:1fr; }
  .landing-page .tier-emblems img { width:54px; height:54px; }
  .landing-page .gold-rule>img { width:66px; height:66px; }
}
@media (prefers-reduced-motion:reduce) {
  .landing-page { scroll-behavior:auto; }
}

/* A quieter, product-led layout: game art once, real app UI where it matters. */
.landing-page::before {
  height:760px;
  background-position:center 12%;
  opacity:.1;
}
.landing-page .next-section::before,
.landing-page .access-section::before { content:none; }
.landing-page .section { padding-block:74px; }
.landing-page .section-heading h2,
.landing-page .current-copy h2,
.landing-page .action-intro h2,
.landing-page .access-layout h2 {
  font-size:clamp(38px,4.25vw,56px);
  letter-spacing:-.035em;
  line-height:1.04;
}
.landing-page .site-header { min-height:82px; }
.landing-page .hero {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(32px,5vw,72px);
  align-items:center;
  min-height:0;
  padding-block:54px 72px;
}
.landing-page .hero-copy { max-width:680px; }
.landing-page h1 {
  max-width:700px;
  margin-bottom:22px;
  font-size:clamp(56px,6vw,80px);
  letter-spacing:-.045em;
  line-height:1;
}
.landing-page .hero-lede { max-width:620px; font-size:20px; line-height:1.55; }
.landing-page .hero-facts { margin-bottom:22px; }
.landing-page .hero-art {
  position:relative;
  top:auto;
  right:auto;
  z-index:1;
  width:min(100%, 620px);
  max-width:620px;
  height:auto;
  overflow:hidden;
  margin:0;
  justify-self:center;
  padding:8px;
  border:1px solid #657782;
  border-radius:6px;
  background:#0a1823;
  box-shadow:0 22px 54px #02091070;
  mask-image:none;
  pointer-events:auto;
}
.landing-page .hero-team {
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/10;
  border:0;
  border-radius:2px;
  object-fit:cover;
  object-position:center;
}
.landing-page .current-section { padding-block:70px 82px; border-top:1px solid #b4c0c51c; }
.landing-page .current-top {
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(36px,5.4vw,76px);
}
.landing-page .product-shot {
  border:1px solid #52636d;
  border-radius:6px;
  background:#09131d;
  box-shadow:0 18px 42px #02091055;
}
.landing-page .product-shot img { display:block; border-radius:5px; }
.landing-page .current-bottom { margin-top:40px; }
.landing-page .available-list { gap:23px 35px; }
.landing-page .available-list li::before { border-radius:0; transform:rotate(45deg); }
.landing-page .available-list strong { font-size:20px; }
.landing-page .limit-panel {
  padding:18px 0 0;
  border-top:1px solid #b4c0c530;
}
.landing-page .limit-panel h3 { font-size:25px; }
.landing-page .limit-panel li::before { border-radius:0; transform:rotate(45deg); }
.landing-page .tier-rule { margin-top:36px; }
.landing-page .action-section { border-top:1px solid #b4c0c51c; }
.landing-page .action-intro h2 { font-size:clamp(48px,5.5vw,66px); }
.landing-page .next-section,
.landing-page .data-section,
.landing-page .access-section,
.landing-page .faq-section {
  padding-block:53px;
  border-top:1px solid #b4c0c51c;
}
.landing-page .next-layout,
.landing-page .data-layout,
.landing-page .access-layout,
.landing-page .faq-layout { gap:clamp(30px,6vw,78px); }
.landing-page .next-copy,
.landing-page .data-summary,
.landing-page .access-copy { max-width:700px; }
.landing-page .next-copy p,
.landing-page .data-summary p,
.landing-page .access-copy p { font-size:17px; line-height:1.62; }
.landing-page .section-heading .eyebrow,
.landing-page .current-copy .eyebrow,
.landing-page .action-section .eyebrow { letter-spacing:.1em; }
.landing-page .access-layout h2 { max-width:480px; }
.landing-page .access-copy { padding-right:155px; }
.landing-page .access-mark { width:138px; opacity:.82; }
.landing-page .faq-list { gap:0; }
.landing-page .faq-list details { border-bottom:1px solid #aebdc42b; border-radius:0; background:transparent; }
.landing-page .faq-list details:first-child { border-top:1px solid #aebdc42b; }
.landing-page .faq-list summary { padding:15px 32px 15px 0; }
.landing-page .site-footer { border-top:1px solid #b4c0c522; }
.landing-page .nav-account-link { display:inline-flex; align-items:center; gap:7px; }
.landing-page .nav-account-link svg { flex:0 0 auto; }

@media (max-width:960px) {
  .landing-page .hero { grid-template-columns:1fr; gap:34px; padding-block:42px 58px; }
  .landing-page .hero-copy { max-width:720px; }
  .landing-page .hero-art { width:min(100%,760px); justify-self:center; }
  .landing-page .current-top { grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); }
  .landing-page .access-copy { padding-right:125px; }
  .landing-page .access-mark { width:112px; }
}
@media (max-width:680px) {
  .landing-page .site-header { min-height:72px; }
  .landing-page .hero { gap:20px; padding-block:34px 45px; }
  .landing-page h1 { font-size:clamp(46px,11vw,66px); }
  .landing-page .hero-lede { font-size:18px; }
  .landing-page .hero-art { width:min(100%, 760px); aspect-ratio:auto; margin:0 auto; padding:5px; }
  .landing-page .hero-team { aspect-ratio:16/10; border-radius:2px; }
  .landing-page .current-section { padding-block:48px 56px; }
  .landing-page .current-top { grid-template-columns:1fr; gap:24px; }
  .landing-page .current-copy,
  .landing-page .product-shot { grid-column:auto; grid-row:auto; }
  .landing-page .current-bottom { margin-top:30px; }
  .landing-page .available-list { grid-template-columns:1fr 1fr; }
  .landing-page .next-section,
  .landing-page .data-section,
  .landing-page .access-section,
  .landing-page .faq-section { padding-block:39px; }
  .landing-page .access-copy { padding:0; }
  .landing-page .access-mark { position:static; width:90px; margin:6px 0 0 auto; transform:none; }
  .landing-page .faq-list summary { font-size:18px; }
  .landing-page .nav-account-link { min-height:40px; }
}
@media (max-width:390px) {
  .landing-page .available-list { grid-template-columns:1fr; }
  .landing-page .hero-actions .button { width:100%; }
}

/* Account pages use the landing page brand system without reusing its hero bands. */
.account-page .site-header { border-bottom:1px solid #b4c0c51c; }
.account-page .account-main {
  width:min(1180px,calc(100% - 56px));
  max-width:none;
  padding-block:clamp(40px,6vw,82px) 92px;
}
.account-page .account-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
  gap:clamp(30px,6vw,86px);
  align-items:center;
  min-height:390px;
  padding:0 0 clamp(42px,7vw,82px);
}
.account-page .account-hero-copy { max-width:700px; }
.account-page .account-hero .eyebrow,
.account-page .account-gate .eyebrow,
.account-page .account-workspace .eyebrow { color:var(--gold); }
.account-page .account-hero h1 {
  max-width:720px;
  margin:12px 0 21px;
  font-size:clamp(54px,7vw,92px);
  line-height:.92;
  letter-spacing:-.055em;
}
.account-page .account-hero h1 em { color:var(--orange); font-style:normal; }
.account-page .account-hero-lede { max-width:610px; color:#e0e5df; font-size:20px; line-height:1.55; }
.account-page .account-hero-note { max-width:560px; color:#aebfc4; font-size:15px; line-height:1.55; }
.account-page .account-hero-mark { position:relative; width:min(100%,410px); justify-self:end; margin:0; }
.account-page .account-hero-mark::before {
  position:absolute;
  z-index:-1;
  inset:12%;
  border-radius:50%;
  background:#32c8bc1a;
  content:"";
  filter:blur(42px);
}
.account-page .account-hero-mark img { display:block; width:100%; height:auto; }
.account-page .account-hero-mark figcaption { margin-top:8px; color:#9fb1b7; font-size:14px; text-align:center; }
.account-page .account-membership {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px 40px;
  align-items:center;
  margin-bottom:28px;
  padding:clamp(26px,4vw,42px);
  border:1px solid #ffe0a3;
  border-radius:16px;
  background:var(--ivory);
  color:#13212a;
  box-shadow:0 22px 52px #02091040;
}
.account-page .account-membership .eyebrow { color:#95601e; }
.account-page .account-membership h2 { margin:0 0 10px; font-size:clamp(32px,4vw,48px); line-height:1; letter-spacing:-.035em; }
.account-page .account-membership-copy > p:not(.eyebrow):not(.account-membership-status) { max-width:650px; margin:0; color:#43535a; font-size:17px; line-height:1.55; }
.account-page .account-membership-status { min-height:1.5em; margin:14px 0 0; color:#33434a; font-size:15px; font-weight:700; }
.account-page .account-membership-status[data-state="success"] { color:#176b56; }
.account-page .account-membership-status[data-state="error"] { color:#9b3821; }
.account-page .account-membership-actions { display:grid; gap:12px; justify-items:start; min-width:235px; }
.account-page .account-enroll-button,
.account-page .account-download-button { min-height:54px; padding-inline:23px; font-size:17px; font-weight:800; }
.account-page .account-membership .button-primary { border-color:#ef6c22; background:#ef6c22; color:#101923; }
.account-page .account-membership .button-primary:hover { border-color:#d85716; background:#d85716; }
.account-page .account-membership .text-link { color:#145c59; font-size:15px; }
.account-page .account-gate,
.account-page .account-workspace {
  margin-top:28px;
  padding:clamp(26px,4.5vw,48px);
  border:1px solid #294353;
  border-radius:15px;
  background:linear-gradient(135deg,#0d2130f5,#102638f0);
  box-shadow:0 18px 48px #02091035;
}
.account-page .account-gate {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.75fr);
  gap:32px 62px;
  align-items:center;
}
.account-page .account-gate h2,
.account-page .account-workspace h2 { max-width:620px; margin:5px 0 12px; font-size:clamp(32px,4.3vw,48px); line-height:1.02; letter-spacing:-.035em; }
.account-page .account-gate-copy > p:last-child { max-width:650px; color:#c5d2d0; font-size:17px; line-height:1.62; }
.account-page .account-gate-actions { display:grid; gap:12px; }
.account-page .account-gate-actions .button { min-height:51px; font-size:16px; }
.account-page .account-gate-status,
.account-page .account-gate-note { margin:0; color:#b9c7ca; font-size:14px; line-height:1.5; }
.account-page .account-gate-status[data-state="error"],
.account-page .account-workspace-status[data-state="error"] { color:#ffab85; }
.account-page .account-workspace-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.account-page .account-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:30px 0 15px; }
.account-page .account-summary > div { min-width:0; padding:16px; border:1px solid #ffffff1c; border-radius:10px; background:#07172380; }
.account-page .account-summary dt { margin-bottom:6px; color:#a8bdc3; font-size:13px; }
.account-page .account-summary dd { overflow-wrap:anywhere; margin:0; color:var(--ivory); font-size:16px; font-weight:700; }
.account-page #account-beta-state[data-state="success"] { color:#65dfc7; }
.account-page #account-beta-state[data-state="error"] { color:#ffab85; }
.account-page .account-workspace-status { min-height:1.5em; color:#c5d2d0; font-size:15px; }
.account-page .account-workspace-status[data-state="success"] { color:#65dfc7; }
.account-page .account-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:25px; }
.account-page .account-tools article { padding:22px; border:1px solid #ffffff1c; border-radius:11px; background:#07172380; }
.account-page .account-tools h3,
.account-page .account-danger-zone h3 { margin:0 0 8px; font-size:22px; }
.account-page .account-tools article > p:not(.eyebrow),
.account-page .account-danger-zone p { color:#c5d2d0; font-size:15px; line-height:1.55; }
.account-page .account-tools .text-link { color:var(--turquoise); }
.account-page .account-danger-zone { border-color:#a8533c; background:#421e1a66; color:var(--ivory); }
.account-page .account-danger-zone p { margin:0; }
.account-page .account-danger-zone .account-danger { flex:0 0 auto; }
.account-page .account-footer { border-top:1px solid #b4c0c522; }
.account-page :focus-visible { outline:3px solid var(--gold); outline-offset:4px; }

@media (max-width:820px) {
  .account-page .account-hero { grid-template-columns:minmax(0,1fr) minmax(230px,.65fr); min-height:0; gap:26px; }
  .account-page .account-hero-mark { width:min(100%,300px); }
  .account-page .account-membership { grid-template-columns:1fr; }
  .account-page .account-membership-actions { grid-template-columns:repeat(2,max-content); align-items:center; }
  .account-page .account-membership-actions .text-link { grid-column:1/-1; }
  .account-page .account-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  .account-page .account-main { width:calc(100% - 36px); padding-block:30px 62px; }
  .account-page .account-nav { gap:15px; }
  .account-page .account-hero { grid-template-columns:1fr; gap:13px; padding-bottom:31px; }
  .account-page .account-hero h1 { max-width:520px; font-size:clamp(48px,13vw,72px); }
  .account-page .account-hero-mark { width:min(62vw,260px); justify-self:center; }
  .account-page .account-hero-mark figcaption { font-size:13px; }
  .account-page .account-gate { grid-template-columns:1fr; gap:12px; }
  .account-page .account-membership-actions { grid-template-columns:1fr; }
  .account-page .account-membership-actions .text-link { grid-column:auto; }
  .account-page .account-workspace-heading { align-items:flex-start; }
  .account-page .account-summary { gap:9px; }
  .account-page .account-summary > div { padding:13px; }
  .account-page .account-tools { grid-template-columns:1fr; }
  .account-page .account-danger-zone { align-items:flex-start; flex-direction:column; }
}

/* Keep account access compact and make the account icon render at icon size. */
.account-page .site-header { min-height:70px; }
.account-page .site-header .brand img { width:40px; height:40px; }
.account-page .account-nav {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(14px,2vw,26px);
  margin-left:auto;
}
.account-page .account-nav a {
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#d0dcdf;
  font-size:15px;
  text-decoration:none;
}
.account-page .account-nav a:hover { color:var(--turquoise); }
.account-page .account-nav .account-nav-current {
  padding:8px 11px;
  border:1px solid #50d8c744;
  border-radius:999px;
  background:#102736;
  color:var(--ivory);
}
.account-page .account-nav-current svg {
  display:block;
  flex:0 0 18px;
  width:18px;
  height:18px;
  fill:currentColor;
}
.account-page .account-main { padding-block:16px 68px; }
.account-page .account-hero {
  grid-template-columns:minmax(0,1fr) 180px;
  gap:clamp(20px,3vw,42px);
  min-height:0;
  padding-bottom:18px;
}
.account-page .account-hero-copy { max-width:760px; }
.account-page .account-hero h1 {
  margin:5px 0 10px;
  font-size:clamp(42px,5vw,64px);
  line-height:.98;
}
.account-page .account-hero-lede { font-size:17px; line-height:1.45; }
.account-page .account-hero-note { margin-top:10px; font-size:13px; line-height:1.45; }
.account-page .account-hero-mark { width:170px; }
.account-page .account-hero-mark figcaption { margin-top:3px; font-size:12px; }
.account-page .account-membership {
  gap:12px 24px;
  margin-bottom:14px;
  padding:20px 24px;
}
.account-page .account-membership h2 { margin-bottom:6px; font-size:clamp(28px,3vw,36px); }
.account-page .account-membership-copy > p:not(.eyebrow):not(.account-membership-status) { font-size:16px; line-height:1.4; }
.account-page .account-membership-status { min-height:0; margin-top:8px; font-size:14px; }
.account-page .account-membership-actions { gap:8px; min-width:215px; }
.account-page .account-enroll-button,
.account-page .account-download-button { min-height:46px; padding-inline:18px; font-size:15px; }
.account-page .account-gate,
.account-page .account-workspace { margin-top:14px; padding:22px 24px; }
.account-page .account-gate h2,
.account-page .account-workspace h2 { margin:4px 0 8px; font-size:clamp(28px,3vw,38px); }
.account-page .account-gate-copy > p:last-child { font-size:16px; line-height:1.48; }
.account-page .account-gate-actions { gap:9px; }
.account-page .account-gate-actions .button { min-height:45px; }
.account-page .account-summary { gap:9px; margin:16px 0 8px; }
.account-page .account-summary > div { padding:12px; }
.account-page .account-summary dt { margin-bottom:4px; font-size:12px; }
.account-page .account-summary dd { font-size:15px; }
.account-page .account-workspace-status { min-height:0; margin:8px 0; font-size:14px; }
.account-page .account-tools { gap:12px; margin-top:16px; }

@media (max-width:820px) {
  .account-page .account-hero { grid-template-columns:minmax(0,1fr) 145px; gap:20px; }
  .account-page .account-hero-mark { width:140px; }
  .account-page .account-membership { padding:18px 20px; }
  .account-page .account-gate,
  .account-page .account-workspace { padding:20px; }
}
@media (max-width:620px) {
  .account-page .site-header { min-height:64px; }
  .account-page .account-nav { gap:9px; }
  .account-page .account-nav a { gap:5px; font-size:12px; }
  .account-page .account-nav .account-nav-current { padding:7px 8px; }
  .account-page .account-nav-current svg { flex-basis:16px; width:16px; height:16px; }
  .account-page .account-main { padding-block:18px 52px; }
  .account-page .account-hero { grid-template-columns:1fr; gap:0; padding-bottom:16px; }
  .account-page .account-hero h1 { max-width:500px; font-size:clamp(38px,10vw,52px); }
  .account-page .account-hero-lede { font-size:16px; }
  .account-page .account-hero-note { font-size:12px; }
  .account-page .account-hero-mark { display:none; }
  .account-page .account-membership { gap:10px; padding:18px; }
  .account-page .account-membership-actions { min-width:0; }
  .account-page .account-gate,
  .account-page .account-workspace { padding:18px; }
  .account-page .account-gate { gap:8px; }
  .account-page .account-summary { gap:8px; margin-top:12px; }
  .account-page .account-summary > div { padding:10px; }
}
