.navbar{
display:flex;
align-items:center;
justify-content:flex-start;
gap:44px;
}

.brand{
flex:0 0 auto;
}

.navlinks{
display:flex;
align-items:center;
gap:18px;
flex:1;
min-width:0;
}

.navlinks a{
white-space:nowrap;
}

.navlinks .shop-login-link{
margin-left:auto;
}

.play-hero{
padding:44px 0 46px;
background:
radial-gradient(circle at 10% 82%,rgba(184,143,70,.09),transparent 27%),
radial-gradient(circle at 82% 12%,rgba(230,241,233,.62),transparent 34%),
linear-gradient(180deg,#fffdf8 0%,#fbf7ed 100%);
}

.play-hero-grid{
display:grid;
align-items:center;
gap:34px;
}

.play-kicker{
color:#147445;
font-weight:900;
letter-spacing:.1em;
}

.play-title{
max-width:650px;
margin-top:10px;
font-size:clamp(43px,4.4vw,58px);
line-height:1.02;
letter-spacing:-.035em;
}

.play-lead{
max-width:610px;
margin-bottom:18px;
}

.play-hero-art{
margin:0;
overflow:hidden;
border-radius:22px;
background:#f3f0e7;
box-shadow:0 22px 48px rgba(34,43,36,.14),0 2px 8px rgba(34,43,36,.07);
}

.play-video-image{
position:relative;
}

.play-hero-art img,
.play-hero-art video{
display:block;
width:100%;
aspect-ratio:16 / 9;
object-fit:cover;
object-position:center;
}

.play-hero-art video{
background:#08150e;
}

.play-video-image::after{
display:none;
}

.play-video-label{
position:absolute;
z-index:1;
left:18px;
bottom:16px;
padding:8px 12px;
border:1px solid rgba(255,255,255,.48);
border-radius:999px;
background:rgba(255,255,255,.92);
color:#0f6038;
font-size:11px;
font-weight:950;
letter-spacing:.08em;
text-transform:uppercase;
box-shadow:0 8px 20px rgba(0,0,0,.14);
}

.play-hero-art figcaption{
display:grid;
gap:2px;
padding:14px 18px 16px;
color:var(--muted);
font-size:13px;
line-height:1.45;
background:#fff;
}

.play-hero-art figcaption strong{
color:#101914;
font-size:18px;
font-weight:950;
letter-spacing:-.015em;
}

.play-hero-art figcaption span{
font-weight:700;
}

.play-install-card{
display:grid;
grid-template-columns:minmax(0,230px) minmax(0,250px);
justify-content:center;
gap:10px;
width:100%;
max-width:490px;
margin:0 auto;
}

.play-install-store,
.play-qr-link{
min-height:100px;
padding:8px 10px;
border:1px solid rgba(19,112,65,.14);
border-radius:14px;
background:rgba(255,255,255,.92);
box-shadow:0 8px 20px rgba(48,43,32,.055);
}

.play-install-store{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:3px;
}

.play-badge-link{
display:inline-block;
width:max-content;
max-width:100%;
border-radius:10px;
}

.play-badge-link:focus{
outline:3px solid rgba(37,99,235,.25);
outline-offset:4px;
}

.play-badge{
width:170px;
max-width:100%;
}

.play-install-store .play-badge{
width:145px;
}

.play-availability{
color:var(--muted);
font-size:12px;
line-height:1.4;
text-align:center;
}

.play-availability strong{
display:block;
color:#147445;
}

.play-qr-link{
display:grid;
grid-template-columns:76px minmax(0,1fr);
align-items:center;
gap:10px;
}

.play-qr-link img{
width:76px;
height:76px;
}

.play-qr-link span{
color:var(--muted);
font-size:12px;
line-height:1.35;
}

.play-qr-link strong{
display:block;
margin-bottom:3px;
color:#0f6038;
font-size:13px;
}

.play-guide-link{
display:inline-block;
margin-top:15px;
color:#147445;
font-size:14px;
font-weight:850;
}

.section-heading{
max-width:720px;
margin-bottom:24px;
}

.section-heading .h2{
margin-top:7px;
}

.section-heading .lead{
margin-bottom:0;
}

.play-steps-section{
padding-top:34px;
padding-bottom:36px;
background:#fff9e8;
background-image:radial-gradient(rgba(117,84,27,.08) .7px,transparent .7px);
background-size:5px 5px;
}

.play-steps{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:16px;
margin:0;
padding:0;
list-style:none;
}

.play-step-card{
position:relative;
display:flex;
min-width:0;
flex-direction:column;
border:0;
border-radius:0;
background:transparent;
box-shadow:none;
filter:drop-shadow(3px 4px 0 rgba(17,21,15,.34));
overflow:visible;
}

.play-step-art{
width:100%;
aspect-ratio:1.1/1;
border:0;
border-radius:0;
background-repeat:no-repeat;
background-position:center bottom;
background-size:100% 100%;
}

.play-step-card--scan .play-step-art{
background-image:url("play-step-1.png?v=20260809-6");
}

.play-step-card--discover .play-step-art{
background-image:url("play-step-2.png?v=20260809-6");
}

.play-step-card--explore .play-step-art{
background-image:url("play-step-3.png?v=20260809-6");
}

.play-step-number{
display:none;
}

.play-step-copy{
flex:1;
margin:-3px 1.78% 0 3.56%;
padding:20px 20px 24px;
border:3px solid #11150f;
border-top:3px solid #11150f;
border-radius:0 0 6px 6px;
background:#fff8e4;
text-align:center;
box-shadow:none;
}

.play-step-card--discover .play-step-copy{
margin-right:1.24%;
margin-left:2.64%;
}

.play-step-card--explore .play-step-copy{
margin-right:1.7%;
margin-left:4.22%;
}

.play-step-card h3{
margin:0 0 17px;
font-family:"Roboto Slab",Rockwell,Georgia,serif;
font-size:clamp(21px,1.7vw,24px);
font-weight:900;
line-height:1.12;
letter-spacing:-.025em;
}

.play-step-card h3::after{
content:"";
display:block;
width:46px;
height:4px;
margin:12px auto 0;
border-radius:999px;
background:#4f8d42;
}

.play-step-card--discover h3::after{
background:#e6aa0a;
}

.play-step-card--explore h3::after{
background:#0a5f8a;
}

.play-step-card p{
margin:0;
color:#11150f;
font-family:"Roboto Condensed","Arial Narrow",Arial,sans-serif;
font-size:17px;
font-weight:600;
line-height:1.38;
text-align:left;
}

.play-score-section{
padding-top:52px;
padding-bottom:52px;
background:#f8faf8;
}

.play-score-layout{
display:grid;
align-items:center;
gap:28px;
}

.play-score-copy .lead{
margin-bottom:16px;
}

.play-score-friendly-note{
max-width:58ch;
margin:0;
padding:15px 17px;
border-left:4px solid #147445;
border-radius:0 12px 12px 0;
background:#fff;
color:#3d5147;
font-weight:700;
}

.play-score-card{
overflow:hidden;
border:1px solid var(--line);
border-radius:18px;
background:#fff;
box-shadow:var(--shadow);
}

.play-score-row{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
gap:16px;
min-height:58px;
padding:12px 18px;
border-bottom:1px solid var(--line);
color:#3f4b45;
}

.play-score-row:last-child{
border-bottom:0;
}

.play-score-row strong{
color:#147445;
font-size:18px;
white-space:nowrap;
}

.play-score-header{
min-height:44px;
background:#eef5f0;
color:#536158;
font-size:12px;
font-weight:900;
letter-spacing:.07em;
text-transform:uppercase;
}

.play-score-highlight{
background:#f0f8f2;
font-weight:800;
}

.play-score-zero strong{
color:var(--muted);
font-size:13px;
}

.play-app-section{
padding-top:28px;
padding-bottom:26px;
}

.play-app-section .section-heading{
margin-bottom:10px;
}

.play-app-grid{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:12px;
}

.play-app-card{
display:flex;
min-height:96px;
flex-direction:column;
gap:6px;
padding:10px 14px;
border:1px solid var(--line);
border-radius:15px;
background:var(--surface);
color:inherit;
font:inherit;
text-align:left;
cursor:pointer;
transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease;
appearance:none;
}

.play-app-card:hover{
transform:translateY(-2px);
border-color:rgba(20,116,69,.34);
box-shadow:0 10px 25px rgba(16,44,29,.08);
}

.play-app-card:focus-visible{
outline:3px solid rgba(20,116,69,.22);
outline-offset:3px;
}

.play-app-card.is-active{
border-color:#147445;
background:#f2f8f4;
box-shadow:inset 0 0 0 1px #147445;
}

.play-app-card-heading{
display:flex;
align-items:center;
gap:7px;
}

.play-tab-icon{
width:28px;
height:28px;
flex:0 0 auto;
fill:none;
stroke:#147445;
stroke-width:32;
stroke-linecap:round;
stroke-linejoin:round;
}

.play-tab-icon-fill{
fill:#147445;
stroke:none;
}

.play-app-card strong{
color:#147445;
font-size:18px;
}

.play-app-card span{
color:var(--muted);
font-size:14px;
line-height:1.4;
}

.play-feature-panel{
display:grid;
grid-template-columns:minmax(280px,390px) minmax(0,1fr);
gap:clamp(32px,5vw,72px);
align-items:center;
margin-top:10px;
padding:14px clamp(24px,4vw,48px);
border:1px solid #d9e7df;
border-radius:22px;
background:
radial-gradient(circle at 19% 23%,rgba(57,169,104,.13),transparent 31%),
radial-gradient(rgba(91,68,30,.075) .7px,transparent .7px),
linear-gradient(135deg,#fffdf6,#f6fbf8);
background-size:auto,5px 5px,auto;
box-shadow:var(--shadow);
overflow:hidden;
}

.play-feature-phone-wrap{
display:grid;
place-items:center;
}

.play-feature-phone{
position:relative;
width:min(242px,72vw);
padding:10px 8px 12px;
border:2px solid #25282c;
border-radius:32px;
background:#17191c;
box-shadow:0 18px 32px rgba(17,24,39,.24);
}

.play-feature-phone::before{
content:"";
display:block;
width:62px;
height:5px;
margin:0 auto 8px;
border-radius:99px;
background:#44484c;
}

.play-feature-screen{
display:block;
width:100%;
aspect-ratio:841/1870;
object-fit:cover;
border-radius:19px;
background:#fff;
}

.play-feature-marker{
position:absolute;
display:grid;
width:31px;
height:31px;
place-items:center;
transform:translate(-50%,-50%);
border:3px solid #fff;
border-radius:50%;
color:#fff;
background:#147445;
box-shadow:0 4px 14px rgba(0,0,0,.28);
font-size:14px;
font-weight:900;
}

.play-feature-marker-one{left:var(--marker-1-x,28%);top:var(--marker-1-y,30%)}
.play-feature-marker-two{left:var(--marker-2-x,67%);top:var(--marker-2-y,43%)}
.play-feature-marker-three{left:var(--marker-3-x,72%);top:var(--marker-3-y,63%)}

.play-feature-copy h3{
margin:5px 0 16px;
font-size:clamp(28px,3.5vw,42px);
line-height:1.07;
letter-spacing:-.035em;
}

.play-feature-notes{
display:grid;
gap:9px;
margin:0;
padding:0;
list-style:none;
}

.play-feature-notes li{
display:grid;
grid-template-columns:34px 1fr;
gap:12px;
align-items:start;
padding:11px 14px;
border:1px solid rgba(8,122,67,.16);
border-radius:14px;
background:rgba(255,255,255,.82);
}

.play-feature-notes li>span{
display:grid;
width:30px;
height:30px;
place-items:center;
border-radius:50%;
color:#fff;
background:#147445;
font-size:13px;
font-weight:900;
}

.play-feature-notes strong{
display:block;
margin:1px 0 3px;
font-size:16px;
}

.play-feature-notes p{
margin:0;
color:var(--muted);
font-size:14px;
line-height:1.4;
}

.play-final-section{
padding-top:0;
padding-bottom:48px;
}

.play-final-card{
display:grid;
align-items:center;
gap:24px;
padding:28px;
border:1px solid rgba(19,112,65,.14);
border-radius:20px;
background:linear-gradient(135deg,#f3f8f4,#fffdf8);
box-shadow:var(--shadow);
}

.play-final-card .h2{
margin-top:7px;
}

.play-final-card p{
margin:0;
color:var(--muted);
}

.play-final-action{
display:flex;
align-items:center;
gap:14px;
}

.play-final-action span{
max-width:190px;
color:var(--muted);
font-size:13px;
line-height:1.4;
}

@media (min-width:920px){
.play-hero-grid{
grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr);
}

.play-steps-section .section-heading,
.play-steps{
max-width:1040px;
margin-right:auto;
margin-left:auto;
}

.play-steps-section .section-heading{
margin-bottom:18px;
}

.play-steps-section .section-heading .h2{
margin-top:0;
}

.play-steps{
gap:14px;
}

.play-step-copy{
padding:16px 16px 19px;
}

.play-step-card h3{
margin-bottom:14px;
font-size:clamp(20px,1.55vw,22px);
}

.play-step-card h3::after{
width:42px;
height:3px;
margin-top:10px;
}

.play-step-card p{
font-size:16px;
line-height:1.34;
}

.play-score-layout{
grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
}

.play-final-card{
grid-template-columns:minmax(0,1fr) auto;
}
}

@media (max-width:1050px) and (min-width:920px){
.play-title{
font-size:clamp(42px,4.6vw,50px);
}

.play-install-card{
grid-template-columns:1fr;
max-width:270px;
}

.play-qr-link{
display:none;
}

.play-app-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
}

@media (max-width:919px){
.navbar{
justify-content:space-between;
gap:14px;
}

.navlinks{
display:none;
}

.play-hero{
padding:42px 0 48px;
}

.play-hero-grid{
grid-template-columns:1fr;
}

.play-hero-copy{
max-width:720px;
}

.play-hero-art{
max-width:720px;
}

.play-steps{
grid-template-columns:1fr;
}

.play-step-card{
min-height:0;
}

.play-app-grid{
display:flex;
overflow-x:auto;
padding:2px 2px 10px;
scroll-snap-type:x proximity;
}

.play-app-card{
min-width:165px;
scroll-snap-align:start;
}

.play-feature-panel{
grid-template-columns:1fr;
gap:20px;
padding:22px 18px;
}
}

@media (max-width:640px){
.play-hero{
padding:32px 0 42px;
}

.play-title{
font-size:clamp(37px,11.5vw,49px);
}

.play-lead{
font-size:16px;
line-height:1.5;
}

.play-install-card{
grid-template-columns:1fr;
max-width:280px;
}

.play-install-store{
min-height:100px;
}

.play-qr-link{
display:none;
}

.play-step-card{
min-height:0;
padding:19px;
}

.play-score-row{
padding:12px 14px;
}

.play-score-row strong{
font-size:16px;
}

.play-score-zero strong{
max-width:84px;
font-size:12px;
text-align:right;
white-space:normal;
}

.play-app-card{
min-height:104px;
padding:14px;
}

.play-feature-panel{
padding:18px 12px;
border-radius:19px;
}

.play-feature-phone{
width:224px;
}

.play-final-card{
padding:22px;
}

.play-final-action{
align-items:flex-start;
flex-direction:column;
}
}

@media (prefers-reduced-motion:reduce){
.play-app-card{transition:none}
}
