/* TestFlight guide: shared Lyrion type and surfaces over real TestFlight screenshots. */
html.tester-document{scroll-padding-top:24px}
.tester-page .wrap{max-width:1120px}
.tester-hero{padding-block:100px 34px;text-align:center}
.tester-hero .eyebrow{font-size:11px;margin-bottom:24px;padding-inline-start:.17em}
/* Compensate for trailing letter spacing so the visible text shares the center axis. */
.tester-hero h1{font-size:clamp(44px,6.1vw,78px);line-height:1.12;letter-spacing:-.055em;padding-inline-end:.055em}
.tester-start{padding-block:26px 46px;text-align:center}
.tester-start h2{font-size:clamp(25px,2.6vw,33px);line-height:1.3;letter-spacing:-.04em}
.tester-start>p{max-width:520px;margin:14px auto 0;font-size:16px;line-height:1.8;color:var(--glass-muted,#c6bfd3);text-wrap:balance}
.tester-invite-note{font-size:14px;color:var(--glass-muted,#bbb3ca);line-height:1.8}
.tester-invite-note a{color:var(--core);text-decoration:underline;text-underline-offset:4px;display:inline-flex;align-items:center;min-height:44px}
.tester-steps{list-style:none;padding:0;margin-block:0}
.tester-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);align-items:center;gap:64px;padding:60px;border:1px solid var(--glass-border,rgba(222,209,255,.2));border-top-color:var(--glass-border-bright,rgba(240,232,255,.34));border-radius:30px;background:var(--surface-glass,rgba(48,38,67,.68));box-shadow:var(--glass-shadow,inset 0 1px 0 #ffffff14,0 24px 64px #06030d33);-webkit-backdrop-filter:var(--glass-blur,blur(20px) saturate(140%));backdrop-filter:var(--glass-blur,blur(20px) saturate(140%));margin-bottom:24px;scroll-margin-top:0}
.tester-step:nth-child(even){grid-template-columns:minmax(0,.92fr) minmax(0,1fr)}
.tester-step:nth-child(even)>.tester-step-copy{order:2}
.tester-step-number{display:block;font-size:11px;font-weight:600;color:var(--core);letter-spacing:.12em;margin-bottom:22px;font-variant-numeric:tabular-nums}
.tester-step h2{font-size:clamp(29px,3vw,39px);line-height:1.25;letter-spacing:-.045em}
.tester-step-copy>p{font-size:15px;line-height:1.85;color:var(--glass-muted,#c8c0d6);margin-top:22px}
.tester-step strong{font-weight:500;color:var(--text-bright)}
.tester-step-copy>.button{margin-top:26px;font-size:13px;white-space:normal;text-align:center;padding-inline:20px;max-width:100%}
/* The menu path a tester follows inside TestFlight, set apart from the prose. */
.tester-step-copy>p.tester-path{margin-top:14px;font-size:15px;font-weight:500;line-height:1.7;color:var(--text-bright)}
.tester-step-copy>p.tester-tip{font-size:13px;color:var(--glass-muted,#b8aec9);line-height:1.85}
/* No caption bar or surrounding black tab: the image itself is the whole figure. */
.tester-figure{margin:0;min-width:0;width:100%;overflow:hidden;border-radius:24px;box-shadow:0 0 0 1px var(--glass-border,rgba(222,209,255,.2)),0 16px 36px #09051030}
.tester-shot{position:relative;overflow:hidden;border-radius:inherit;background:#0c0812;isolation:isolate}
.tester-shot img{display:block;width:100%;height:auto}
/* The App Store capture is cut off partway through its bottom stats row, so the
   frame shows only the part of the screenshot that is whole. */
.tester-shot-store{aspect-ratio:1284 / 590}
.tester-shot-store img{position:absolute;top:0;left:0}
/* Rings drawn over the real screenshot to point at the button the step asks for. */
.tester-mark{position:absolute;border:3px solid #e8271c;border-radius:999px;pointer-events:none}
.tester-mark-get{left:34%;top:66.8%;width:21.5%;height:22%}
.tester-mark-install{left:4.6%;top:76.1%;width:45.2%;height:18.7%}
.tester-mark-feedback{left:49.2%;top:76.1%;width:45.2%;height:18.7%}
/* The step supplies the blur; the screenshot frame and buttons stay flat. */
.tester-figure,.tester-step .button{-webkit-backdrop-filter:none;backdrop-filter:none}
/* Sits with the invitation button it belongs to, not as a section of its own. */
/* Step 1 sends the visitor off to the App Store; this line brings them back for the invite. */
.tester-step-copy>.tester-return-note{margin-top:14px;font-size:13px;line-height:1.85}
.tester-support-note{margin-top:14px;font-size:13px;line-height:1.85;color:var(--glass-muted,#b8aec9)}
.tester-support-note a{display:inline-flex;align-items:center;min-height:44px;color:var(--core);text-decoration:underline;text-underline-offset:4px}
.tester-support-note a:hover{color:var(--text-bright)}
.tester-closing{padding-block:80px 75px;text-align:center}
.tester-closing h2{font-size:clamp(29px,3.5vw,45px);line-height:1.3}
.tester-closing>.tester-invite-note{margin-top:24px}
.tester-closing>.button{margin-top:27px;white-space:normal;text-align:center}
.tester-footer{display:flex;align-items:center;flex-direction:column;gap:16px;border-top:1px solid var(--glass-border,rgba(222,209,255,.2));padding-block:30px;text-align:center}
.tester-footer>p{font-size:12px;color:var(--glass-muted,#bfb5cd);line-height:1.8}
.tester-footer .tester-support{margin-top:2px}
.tester-support a{display:inline-flex;align-items:center;min-height:44px;color:#ded4ec;text-underline-offset:4px}
.tester-support a:hover{text-decoration:underline}
.tester-step.tester-will-reveal{opacity:0;transform:translateY(20px);transition:opacity 600ms var(--ease-out),transform 600ms var(--ease-out)}
.tester-step.tester-will-reveal.is-visible{opacity:1;transform:none}
.tester-step.tester-reveal-instant{opacity:1;transform:none;transition:none}
@media(min-width:768px) and (max-width:1023px){
  .tester-step,.tester-step:nth-child(even){gap:32px;padding:36px}
  .tester-step h2{font-size:30px}
}
@media(max-width:767px){
  .tester-page .wrap{width:calc(100% - 40px)}
  .tester-hero{padding-block:64px 26px}
  .tester-hero h1{font-size:clamp(35px,9.8vw,58px)}
  .tester-hero .eyebrow{font-size:10px;margin-bottom:22px}
  .tester-start{padding-block:20px 32px}
  .tester-start h2{font-size:25px}
  .tester-start>p{font-size:15px;margin-top:12px}
  .tester-step,.tester-step:nth-child(even){grid-template-columns:minmax(0,1fr);gap:30px;padding:30px 23px;margin-bottom:20px;border-radius:25px}
  .tester-step{-webkit-backdrop-filter:var(--glass-blur-mobile,blur(12px) saturate(140%));backdrop-filter:var(--glass-blur-mobile,blur(12px) saturate(140%))}
  .tester-step:nth-child(even)>.tester-step-copy{order:0}
  .tester-step-number{margin-bottom:18px}
  .tester-step h2{font-size:30px}
  .tester-step-copy>p{font-size:14px;margin-top:18px}
  .tester-step-copy>p.tester-path{font-size:14px}
  .tester-step-copy>.button{font-size:12px;min-height:48px;padding-inline:18px;margin-top:22px}
  .tester-figure{border-radius:20px}
  .tester-mark{border-width:2px}
  .tester-step-copy>.tester-return-note,.tester-support-note{font-size:12px}
  .tester-closing{padding-block:56px 48px}
  .tester-closing h2{font-size:30px}
  .tester-closing>.tester-invite-note{font-size:13px;max-width:310px;margin-inline:auto}
  .tester-closing>.button{font-size:13px}
  .tester-footer{gap:14px;padding-block:28px}
}
@media(max-width:359px){
  .tester-page .wrap{width:calc(100% - 32px)}
  .tester-step,.tester-step:nth-child(even){padding:27px 20px}
  .tester-step h2,.tester-closing h2{font-size:27px}
  .tester-step-copy>.button{font-size:12px;padding-inline:14px}
}
@media(prefers-reduced-motion:reduce){
  .tester-step.tester-will-reveal{opacity:1;transform:none;transition:none}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .tester-step{background:#2a223a}
}
@media(prefers-reduced-transparency:reduce){
  .tester-step{background:#2a223a;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(prefers-contrast:more){
  .tester-step{background:#21192f;border-color:#d7c6f7;-webkit-backdrop-filter:none;backdrop-filter:none}
  .tester-start>p,.tester-invite-note,.tester-step-copy>p,.tester-step-copy>p.tester-tip,.tester-step-copy>.tester-return-note,.tester-support-note,.tester-footer>p{color:#f4effb}
  .tester-mark{border-color:#c4140a;border-width:4px}
}