/* Stream Hearts lettering: system fonts, ribbon strokes and heartbeat accents. */
:root{--type-accent:var(--pink);--type-stroke:#e85881;--type-offset:#eccbbb;--type-ribbon:#ffdbe6}
:root[data-theme="dark"]{--type-stroke:#ff81ad;--type-offset:#79455f;--type-ribbon:#4d2940}
.display-title{font-weight:800;letter-spacing:-.055em;word-break:keep-all;text-wrap:balance;position:relative;isolation:isolate}
.display-title .title-line{display:block}
.display-title .title-lead{font-size:.68em;font-weight:700;letter-spacing:-.04em;margin-bottom:.17em;color:var(--muted)}
.type-ribbon{position:relative;display:inline-block;font-style:normal;color:var(--type-accent);z-index:0;white-space:nowrap}
.type-ribbon::before{content:"";position:absolute;left:-.06em;right:-.06em;bottom:.03em;height:.23em;background:var(--type-ribbon);z-index:-1;transform:skew(-13deg) rotate(-2deg);clip-path:polygon(0 7%,98% 0,96% 40%,100% 78%,2% 100%,4% 65%)}
.type-ribbon::after{content:"";position:absolute;width:.22em;height:.065em;right:-.12em;top:.08em;background:var(--type-accent);box-shadow:.13em -.12em 0 -.012em var(--type-stroke),-.09em .1em 0 -.014em var(--type-offset);transform:rotate(-8deg)}
.hero .hero-title{font-size:clamp(43px,4.5vw,66px);line-height:1.25;margin:24px 0 29px;letter-spacing:-.065em}
.hero-title .hero-opening{display:block;font-size:.79em;letter-spacing:-.045em;font-weight:700;margin-bottom:.13em}
.hero-title .hero-ending{font-size:.86em;margin-left:.025em;color:var(--ink)}
.hero-title .type-ribbon{text-shadow:1px 2px 0 var(--type-offset)}
.title-pulse{display:block;height:15px;width:142px;margin-top:20px;background:currentColor;color:var(--pink);clip-path:polygon(0 46%,30% 46%,36% 4%,43% 91%,49% 32%,53% 46%,100% 46%,100% 58%,52% 58%,49% 51%,43% 100%,36% 30%,32% 58%,0 58%);opacity:.8}
.section-head h2.display-title{font-size:clamp(40px,4.35vw,60px);line-height:1.24;letter-spacing:-.06em}
#play .section-head{align-items:flex-end;gap:34px;margin-bottom:31px}
#play .section-intro{padding-bottom:5px;max-width:385px}
.section-head .eyebrow,.faq-layout>.eyebrow{margin-bottom:19px}
.eyebrow{font-weight:800;font-size:12px;letter-spacing:.17em;line-height:1.5}
.eyebrow:not(.hero-kicker)::before{content:"";display:inline-block;width:21px;height:3px;background:currentColor;vertical-align:middle;margin-right:10px;box-shadow:7px -4px 0 -1px currentColor;opacity:.85}
.hero-kicker{font-size:12px;letter-spacing:.13em}
.hero-kicker img{margin-right:3px}
.three-things h2{font-weight:800;letter-spacing:-.035em;line-height:1.5}
.feature-word{color:var(--pink);text-decoration-line:underline;text-decoration-color:var(--type-ribbon);text-decoration-thickness:5px;text-underline-offset:2px;text-decoration-skip-ink:none}
.game-copy .game-number{display:flex;align-items:center;gap:11px;font-family:"Consolas","SFMono-Regular",monospace;font-size:11px;letter-spacing:.085em;font-weight:700;color:var(--muted);line-height:1.65}
.game-number::before{content:"";height:1px;width:28px;background:var(--pink);flex-shrink:0}
.game-copy h3.game-lettering{font-size:clamp(25px,2.55vw,36px);letter-spacing:-.055em;line-height:1.38;white-space:normal;font-weight:800;margin:22px 0 19px}
.game-title-lead{display:block;font-size:.66em;line-height:1.55;letter-spacing:-.03em;color:var(--muted);font-weight:700;margin-bottom:7px}
.game-title-main{display:block}
.game-copy h3 .type-ribbon::after{width:.18em;right:-.08em}
.game-copy p:not(.game-number){line-height:1.85;word-break:keep-all}
.game-tag{font-size:13px;font-weight:700;letter-spacing:-.015em}
.game-tabs button{font-weight:700;letter-spacing:-.025em}
.connection .display-title .title-lead{color:var(--connect-ink)}
.connection-lead{font-weight:500;letter-spacing:-.045em}
.connection-lead strong{font-weight:800;text-decoration:underline;text-decoration-color:var(--type-ribbon);text-decoration-thickness:7px;text-underline-offset:3px;text-decoration-skip-ink:none}
.steps h3{font-weight:800;letter-spacing:-.03em;line-height:1.55}
.faq-layout h2.display-title{font-size:clamp(33px,3.35vw,44px);line-height:1.4;letter-spacing:-.05em}
.faq-layout h2 .title-lead{font-size:.74em}
.faq-list summary{font-weight:700;letter-spacing:-.025em;line-height:1.65}
.launch h2.display-title{font-size:clamp(38px,3.8vw,52px);line-height:1.24;letter-spacing:-.055em}
.launch .type-ribbon{color:#fff0f7;text-shadow:1px 2px 0 #82374f}
.launch .type-ribbon::before{background:#722743}
.launch .type-ribbon::after{background:#ff9ec1;box-shadow:.13em -.12em 0 -.012em #ffd5e5}
.launch .title-lead{color:#ffccdf;font-size:.67em}
.document-hero h1{display:inline-block;font-weight:800;letter-spacing:-.045em;position:relative;padding-bottom:10px;border-bottom:5px solid var(--type-ribbon)}
.document-body h2{font-weight:800;letter-spacing:-.035em}
.document-body h3,.support-card h2{letter-spacing:-.025em;font-weight:700}
.lead,.section-intro,.three-things p{letter-spacing:-.02em;line-height:1.85}
@media(min-width:1600px){.hero .hero-title{font-size:66px}}
@media(max-width:1120px) and (min-width:901px){.hero .hero-title{font-size:49px}.game-copy h3.game-lettering{font-size:29px}}
@media(max-width:900px){.hero .hero-title{font-size:60px}.section-head h2.display-title{font-size:51px}.game-copy h3.game-lettering{font-size:30px}}
@media(max-width:740px){.hero .hero-title{font-size:clamp(37px,10.3vw,55px);margin-block:22px 25px;line-height:1.3}.hero-title .hero-opening{font-size:.85em}.hero-title .hero-ending{font-size:.82em}.title-pulse{width:108px;height:12px;margin-top:17px}.section-head h2.display-title{font-size:clamp(36px,9.65vw,48px)}.display-title .title-lead{font-size:.67em}.section-head .eyebrow{margin-bottom:15px}.section-head{gap:22px!important}#play .section-head{align-items:flex-start}.game-copy h3.game-lettering{font-size:clamp(29px,8.3vw,36px)}.game-title-lead{font-size:.68em}.game-copy{padding:26px 23px}.faq-layout h2.display-title{font-size:35px}.launch h2.display-title{font-size:39px}.eyebrow,.hero-kicker{font-size:11px;letter-spacing:.12em}.game-copy .game-number{font-size:10px;letter-spacing:.06em}}
