.gym-playground,.neighbourhood{padding:100px 24px 70px;overflow:clip}
.gym-playground{background:#fff}.neighbourhood{background:linear-gradient(#fff,#fff9eb 220px)}
.play-heading{text-align:center;max-width:830px;margin:0 auto 45px}
.play-eyebrow{font-size:11px;letter-spacing:.18em;color:#61806d;margin:0 0 20px}
.play-heading h2{font:700 clamp(40px,5.2vw,70px)/1.04 Baloo,sans-serif;letter-spacing:-.035em;margin:0}
.play-heading h2 em{font-style:normal;color:#078367}.play-heading>p:last-child{font-size:16px;line-height:1.6;color:#5b7265;margin:20px 0 0}
.bench-layout{max-width:1250px;margin:0 auto 35px;display:grid;grid-template-columns:1.45fr 1fr;align-items:center;gap:35px}
.bench-scene{position:relative;min-width:0}.bench-illustration{display:block;width:100%;height:auto}
.bench-art{position:relative}.bench-object{position:absolute;border:2px solid transparent;border-radius:25px;background:transparent;cursor:pointer}.bench-object:hover{border-color:#ffb100;background:#ffbd1810}.object-weight{left:5%;top:32%;width:29%;height:34%}.object-notebook{left:35%;top:46%;width:31%;height:23%}.object-watch{left:69%;top:30%;width:19%;height:36%}
.bench-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:-45px 3% 0;position:relative}
.bench-tabs button{min-height:62px;padding:10px 6px;border:1px solid #dce7df;border-radius:17px;background:#fff;color:var(--ink);cursor:pointer;font-size:15px;transition:background .2s,transform .2s}
.bench-tabs button span{display:block;font-size:10px;letter-spacing:.1em;color:#6b8272;margin-bottom:5px}
.bench-tabs button[aria-selected=true]{background:#ffcc42;border-color:#ffcc42;transform:translateY(-5px)}
.bench-tabs button:hover{background:#fff1bf}
.tool-stage{min-height:365px;display:grid;align-items:center;max-width:410px;width:100%;margin:auto}
.tool-panel{padding:10px;animation:tool-arrive .3s ease-out}.tool-panel[hidden]{display:none}
@keyframes tool-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.spot-person{display:flex;align-items:center;gap:12px;font-size:13px;color:#61786b;margin-bottom:18px}.spot-person .story-portrait{width:54px;height:54px}
.spot-bubble{font:700 clamp(27px,3.1vw,40px)/1.15 Baloo,sans-serif;margin:0 0 22px;background:#edf7ef;border-radius:25px 25px 25px 4px;padding:25px}
.play-action{min-height:46px;padding:12px 22px;background:#ffbd18;color:#143b2e;border:0;border-radius:22px;cursor:pointer;font-size:14px}
.play-action:hover{background:#ffc93e}.spot-reply{font-size:16px;line-height:1.6;color:#087357;margin:16px 0 0;max-width:32ch}
.tool-caption{font-size:13px;line-height:1.6;color:#5d7567;margin:18px 0 0}
.workout-notebook{background:#fffcf1;border:1px solid #e5dcbf;border-radius:5px 20px 20px 5px;padding:22px 22px 18px;border-left:8px solid #a8d9c2;transform:rotate(-2deg);box-shadow:5px 9px 0 #f1f1e6}
.notebook-label{font-size:9px;letter-spacing:.16em;color:#728573;margin:0 0 10px}.workout-notebook h3{font:700 29px/1.1 Baloo;margin:0 0 14px}
.exercise-order{list-style:none;padding:0;margin:0}.exercise-order li{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #dfdfca;padding:13px 0}
.exercise-order strong{display:block;font-size:16px}.exercise-order small{display:block;font-size:11px;color:#647a67;margin-top:5px}.exercise-order button{width:40px;height:40px;border-radius:50%;border:1px solid #cadccf;background:#fff;color:#087254;cursor:pointer;font-size:20px}
.exercise-order button:disabled{opacity:.3;cursor:default}.exercise-order li:focus-visible{outline:2px solid #087254;outline-offset:3px;border-radius:6px}
.rest-demo{text-align:center}.breather-ring{width:240px;height:240px;position:relative;margin:0 auto 25px}.breather-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.breather-ring circle{fill:none;stroke-width:8}.ring-track{stroke:#e7f0e8}.ring-progress{stroke:#ffb100;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0}
.breather-ring>div{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px}.breather-ring small{font-size:10px;letter-spacing:.08em;color:#5f7769}.breather-ring strong{font:700 65px/.95 Baloo;color:#ad7100;font-variant-numeric:tabular-nums}.breather-ring span{font-size:12px;color:#698171}
.play-demo-note{font-size:11px;line-height:1.8;color:#768171;text-align:center;max-width:750px;margin:25px auto 0}
.reach-controls{display:flex;justify-content:center;gap:10px;margin:0 auto 18px}.reach-controls button{min-width:85px;min-height:46px;padding:10px 20px;border-radius:25px;border:1px solid #d7dfd0;background:#fff;color:var(--ink);cursor:pointer;font-size:15px}
.reach-controls button[aria-pressed=true]{background:#093a33;border-color:#093a33;color:#fff}.reach-controls button:hover{box-shadow:0 0 0 3px #ffd26b80}
.reach-summary{text-align:center;font-size:14px;color:#677765;margin:0 0 25px}.reach-summary strong{color:#087653}
.neighbourhood-map{position:relative;max-width:1000px;aspect-ratio:3/2;margin:auto;isolation:isolate;border-radius:35px;overflow:hidden;background:#fff9eb}
.neighbourhood-map>img{display:block;width:100%;height:100%;object-fit:cover}
.coverage-ring{position:absolute;left:53%;top:52%;width:42%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);border:2px dashed #078367;background:#00a56d18;pointer-events:none;transition:width .65s ease}
.neighbourhood-map[data-range="10"] .coverage-ring{width:57%}.neighbourhood-map[data-range="20"] .coverage-ring{width:90%}
.map-gym{position:absolute;transform:translate(-50%,-50%);z-index:2}.gym-home{left:53%;top:52%;transform:translate(-50%,-100%)}.gym-corner{left:37%;top:68%;transform:translate(-70%,5%)}.gym-park{left:40%;top:25%;transform:translate(-50%,-70%)}.gym-loft{left:83%;top:37%;transform:translate(-50%,-30%)}
.map-gym button{display:flex;flex-direction:column;gap:7px;align-items:stretch;width:170px;min-height:44px;padding:12px;border:2px solid #fff;border-radius:18px 18px 18px 4px;background:#fffef6;box-shadow:0 5px 16px #153b2b20;cursor:pointer;color:var(--ink);text-align:left;transition:background .25s,border-color .25s}
.pin-name{font:700 17px/1.1 Baloo,sans-serif;color:#143f31;white-space:nowrap}
.pin-stats{display:flex;justify-content:space-between;align-items:center;gap:6px}.pin-stats strong{font:700 23px/1 Baloo,sans-serif}.pin-busy{font-size:11px;background:#e6f4e9;border-radius:9px;padding:4px 6px}
.pin-population{display:flex;flex-direction:column;gap:1px}.pin-unit{font-size:10px;line-height:1.1;color:#486550}
[data-busy=busy] .pin-busy,.busy-label[data-busy=busy]{background:#ffcd41}
[data-busy=moderate] .pin-busy,.busy-label[data-busy=moderate]{background:#f5eecf}
.pin-mix{display:grid;gap:5px;font-size:9px;color:#46644e}.mix-bar{display:flex;height:8px;border-radius:8px;overflow:hidden;background:#e4ebe0}.mix-bar>span:first-child{background:#118966}.mix-bar>span:last-child{background:#ffbe24}
.map-gym button[aria-pressed=true]{background:#fffbdf;border-color:#0c745a;box-shadow:0 0 0 3px #ffffffb0,0 6px 18px #143c3220}
.map-gym button:focus-visible{outline:3px solid #093a33;outline-offset:4px}
.map-gym button:disabled{cursor:default;opacity:.6;filter:grayscale(1);width:auto;min-width:90px;background:#fff9ebe0;box-shadow:none}
.map-gym button:disabled .pin-stats,.map-gym button:disabled .pin-mix{display:none}
.map-gym button:not(:disabled) .pin-stats,.map-gym button:not(:disabled) .pin-mix{animation:tool-arrive .3s ease-out}
.map-key{position:absolute;bottom:12px;right:15px;font-size:10px;color:#58725f;background:#fff9ebdd;padding:6px 9px;border-radius:10px}
.map-gathering{position:absolute;display:flex;justify-content:center;flex-wrap:wrap;max-width:168px;transform:translate(-50%,0);pointer-events:none;filter:drop-shadow(0 2px 0 #fff9eb)}
.map-gathering .snapshot-peep{width:24px;height:33px}
.gym-snapshot{text-align:center;max-width:600px;margin:35px auto 0;padding:28px 35px;background:#fffefa;border:1px solid #e1e8d9;border-radius:28px;box-shadow:0 7px 0 #e8eddc66}.snapshot-hint{font-size:10px;letter-spacing:.14em;color:#687e67;margin:0 0 12px}.gym-snapshot h3{font:700 32px/1.15 Baloo;margin:0}
.snapshot-crowd{display:flex;flex-wrap:wrap;justify-content:center;align-items:end;gap:0;min-height:92px;max-width:650px;margin:20px auto 10px}
.snapshot-peep{display:block;width:47px;height:64px;background-image:url('assets/all-peeps.png');background-size:1500% 700%;background-repeat:no-repeat;animation:tool-arrive .35s ease-out both}
.snapshot-count{font-size:15px;margin:12px 0 0}.snapshot-count strong{font:700 35px/1 Baloo;color:#078367;vertical-align:middle;margin-right:6px}.snapshot-detail{font-size:13px;color:#62785f;line-height:1.6;margin:12px 0 0}
.insight-now{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.insight-now .snapshot-count{margin:0}.busy-label{font-size:12px;padding:6px 10px;border-radius:12px;background:#e6f4e9}.insight-mix{max-width:380px;margin:24px auto 0}.insight-mix[hidden],.mix-unavailable[hidden]{display:none}.insight-label{font-size:13px;margin:0 0 10px;color:#60725c}.insight-mix .mix-bar{height:12px}.mix-labels{display:flex;justify-content:space-between;margin-top:10px;font-size:14px;color:#234f3c}.mix-unavailable{font-size:14px;line-height:1.6;color:#62785f;max-width:350px;margin:24px auto 0}.insight-peak{font-size:14px;line-height:1.6;margin:24px 0 0;padding-top:18px;border-top:1px dashed #cbd9c0;color:#34583e}.save-gym-copy{text-align:center;font-size:17px;line-height:1.6;margin:35px auto 0;color:#5b7265}.save-gym-copy strong{color:#0a5c45;font-weight:500}
@media(max-width:960px){.map-gym button{width:100px;padding:8px;gap:4px;border-radius:12px 12px 12px 3px}.pin-name{font-size:13px}.pin-stats{flex-direction:column;align-items:flex-start;gap:3px}.pin-stats strong{font-size:20px}.pin-busy{font-size:10px;padding:2px 5px}.map-gym button .pin-mix{display:none}.map-gym button:disabled{min-width:65px}.gym-snapshot{scroll-margin-top:24px}.map-gathering{display:none}}
@media(max-width:850px){.bench-layout{grid-template-columns:1fr;gap:35px;max-width:650px}.tool-stage{min-height:375px;max-width:390px}.bench-tabs{margin-top:-40px}.play-heading{margin-bottom:25px}}
@media(max-width:600px){
 .gym-playground,.neighbourhood{padding:65px 18px 45px}.play-heading h2{font-size:clamp(37px,10vw,52px)}.play-eyebrow{font-size:9px;letter-spacing:.13em;margin-bottom:16px}.play-heading>p:last-child{font-size:14px;margin-top:15px}
 .bench-layout{gap:27px}.bench-scene{margin-inline:-8px}.bench-tabs{gap:5px;margin:-10px 0 0}.bench-tabs button{font-size:12px;min-height:57px;padding:8px 4px;border-radius:13px}.bench-tabs button span{font-size:9px}.tool-stage{min-height:360px;max-width:340px}.tool-panel{padding:10px 6px}.spot-bubble{font-size:32px;padding:22px}.spot-person{font-size:12px}.spot-person .story-portrait{width:45px;height:45px}.tool-caption{font-size:12px}
 .workout-notebook{padding:20px 17px}.workout-notebook h3{font-size:27px}.exercise-order strong{font-size:15px}.play-demo-note{font-size:10px}
 .reach-controls{gap:8px}.reach-controls button{min-width:76px;padding:10px 16px;font-size:14px}.reach-summary{font-size:12px;line-height:1.6}.neighbourhood-map{aspect-ratio:3/2;border-radius:23px;margin-inline:-6px}.neighbourhood-map>img{object-fit:cover}.map-gym button{width:80px;min-height:44px;padding:6px;gap:3px}.pin-name{font-size:11px}.pin-stats strong{font-size:19px}.pin-busy{font-size:9px}.map-key{font-size:8px;bottom:5px;right:5px;padding:3px 5px}
 .gym-snapshot{margin-top:25px;padding:24px 17px}.gym-snapshot h3{font-size:27px}.snapshot-hint{font-size:8px;letter-spacing:.1em}.snapshot-peep{width:39px;height:53px}.snapshot-crowd{max-width:300px;min-height:66px;margin-top:15px}.snapshot-count{font-size:12px}.snapshot-count strong{font-size:30px}.snapshot-detail{font-size:12px}.insight-peak{font-size:13px}.save-gym-copy{font-size:15px}.mix-labels{font-size:13px}
 .map-gathering{max-width:98px}.map-gathering .snapshot-peep{width:14px;height:19px}
 .gym-park{left:28%;top:28%}.gym-home{left:57%;top:60%}.gym-corner{left:23%;top:61%;transform:translate(-50%,0)}.gym-loft{left:84%;top:20%;transform:translate(-50%,0)}
}
@media(prefers-reduced-motion:reduce){.tool-panel,.snapshot-peep,.map-gym button:not(:disabled) .pin-stats,.map-gym button:not(:disabled) .pin-mix{animation:none}.coverage-ring,.bench-tabs button,.map-gym button{transition:none}}
@media(max-width:359px){.map-gym button{width:73px;padding:5px}.pin-name{font-size:10px}.play-eyebrow{line-height:1.7}}
@media(max-width:600px){.map-gym button{gap:2px}.pin-stats{gap:2px}.pin-stats strong{font-size:17px}.pin-busy{padding:1px 4px}.pin-unit{font-size:9px}.gym-park{top:31%}.gym-corner{top:56%}}
