:root{--ink:#183e2e;--green:#194e37;--lime:#c9ef83;--paper:#f6f8f0;--muted:#7c8977;--line:#dce4d4}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.7 "Microsoft YaHei",system-ui,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #729e45;outline-offset:4px}header,main,footer{max-width:1320px;margin:auto;padding:0 52px}header{height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;gap:10px;align-items:center}.brand img{width:42px;height:42px;object-fit:contain}.brand span{font-size:21px;font-weight:750;letter-spacing:1px}.brand small{display:block;font-size:9px;font-weight:400;letter-spacing:3px;margin-top:-4px}nav{display:flex;gap:35px;font-size:12px}nav a:hover{color:#6b983e}.nav-cta{font-size:12px;padding:5px 0;border-bottom:1px solid var(--green)}.hero{display:grid;grid-template-columns:1.12fr 1fr;gap:20px;align-items:center;min-height:620px}.hero-copy{padding:40px 0}.eyebrow{font-size:10px;letter-spacing:2px;color:#758b65;font-weight:600}h1{font-size:clamp(35px,4.1vw,58px);line-height:1.35;letter-spacing:-2px;margin:22px 0}h1 span{color:#578d3c;position:relative;white-space:nowrap}h1 span:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:8px;background:#c6eb86;z-index:-1;border-radius:50%;transform:rotate(-2deg)}.intro{font-size:14px;color:#76816f;line-height:2;margin:27px 0}.actions{display:flex;gap:12px;flex-wrap:wrap}.button{padding:13px 21px;font-size:12px;font-weight:600;border-radius:7px;display:inline-block;border:1px solid transparent;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 8px 20px #183e2e18}.primary{background:var(--green);color:white}.secondary{background:#ffffff50;border-color:#d0dbc6}.note{font-size:10px;color:#8b9781;margin-top:18px}.proof{display:flex;align-items:center;gap:14px;margin-top:34px}.avatars{display:flex}.avatars i{font-style:normal;display:grid;place-items:center;border:2px solid var(--paper);border-radius:50%;width:30px;height:30px;margin-left:-5px;background:#bfd3ac;font-size:10px}.avatars i:first-child{margin-left:0;background:#5e8767;color:white}.avatars i:nth-child(3){background:#dcd4b0}.avatars i:nth-child(4){background:#adc8bd}.proof p{margin:0;font-size:10px}.proof strong{font-weight:500}.proof small{display:block;font-size:9px;color:#8a9581}.stage{height:550px;position:relative;display:grid;place-items:center}.court{position:absolute;width:400px;height:340px;border-radius:90px 90px 130px 80px;transform:rotate(-11deg);background:linear-gradient(140deg,#e5efd6,#d0e9ad);overflow:hidden}.court:before{content:"";position:absolute;inset:40px 35px;border:1px solid #fff9;background:linear-gradient(90deg,transparent 49.8%,#fff9 50%,transparent 50.2%),linear-gradient(transparent 49.8%,#fff9 50%,transparent 50.2%)}.court:after{content:"";position:absolute;inset:40px 100px;border:1px solid #fff9}.orbit{position:absolute;width:460px;height:440px;border:1px solid #dae6d0;border-radius:50%;transform:rotate(-25deg)}.phone{position:relative;overflow:hidden;border:6px solid #253f31;border-radius:33px;background:#fff;padding:0 3px 12px;box-shadow:14px 24px 45px #254a3026}.hero-phone{width:225px;height:445px;transform:rotate(6deg);animation:float 6s ease-in-out infinite}.phone img{display:block;width:100%;height:auto}.status{height:23px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;font-size:8px;background:white}.homebar{position:absolute;bottom:5px;left:36%;right:36%;height:4px;border-radius:4px;background:#253f31}.float{position:absolute;z-index:2;display:flex;align-items:center;gap:12px;padding:16px;background:#fffffff2;border:1px solid white;border-radius:13px;box-shadow:0 12px 30px #2e4f2513;animation:drift 7s ease-in-out infinite}.float b{display:grid;place-items:center;width:33px;height:33px;border-radius:10px;background:#eaf3df;color:#6c9746;font-size:20px}.float strong{font-size:11px;display:block}.float small{font-size:9px;color:#859078}.signup{top:95px;left:-10px;animation-delay:-2s}.match{right:-10px;bottom:95px;animation-delay:-4s}.stage-label{position:absolute;left:30px;bottom:45px;font-size:10px;color:#74905d}.stage-note{position:absolute;right:0;bottom:12px;font-size:9px;color:#99a48d}.benefits{display:flex;justify-content:space-between;padding:21px 30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:13px;font-weight:600;letter-spacing:1px}.features{padding:92px 0 82px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:34px}h2{font-size:36px;line-height:1.4;font-weight:650;letter-spacing:-1px;margin:18px 0}h2 span{color:#809573}.section-head h2{margin-bottom:0}.section-head p{font-size:11px;color:#88937d;line-height:2;margin:0}.feature-layout{display:grid;grid-template-columns:.9fr 1.3fr;gap:35px}.tabs{display:flex;flex-direction:column;justify-content:center;gap:8px}.tabs button{display:flex;gap:18px;align-items:center;text-align:left;border:1px solid transparent;border-radius:12px;padding:23px 20px;background:transparent;color:var(--ink);transition:background .25s,border-color .25s,transform .25s}.tabs button[aria-selected=true]{background:white;border-color:#dbe5cf;transform:translateX(3px);box-shadow:0 8px 20px #28491b05}.tabs i{font-size:10px;font-style:normal;color:#9aa68d;align-self:start;padding-top:5px}.tabs strong{font-size:17px;font-weight:600}.tabs small{display:block;font-size:10px;color:#8b957f;margin-top:7px}.tabs b{margin-left:auto;font-weight:400;color:#90a777}.panel{height:500px;border-radius:20px;background-color:#e5edd9;background-image:linear-gradient(#ffffff35 1px,transparent 1px),linear-gradient(90deg,#ffffff35 1px,transparent 1px);background-size:45px 45px;position:relative;overflow:hidden;padding:35px}.panel-copy{max-width:205px;position:relative;z-index:1}.panel-copy>span{font-size:9px;color:#859b6c;letter-spacing:1px}.panel-copy h3{font-size:25px;line-height:1.6;font-weight:600;margin:17px 0}.panel-copy p{font-size:11px;color:#8b997b;max-width:170px}.demo-phone{width:220px;height:435px;position:absolute;right:35px;top:100px;transform:rotate(-5deg)}.panel-index{position:absolute;left:27px;bottom:65px;font-size:110px;line-height:1;color:#6a874515;font-weight:800}.panel-tag{position:absolute;left:33px;bottom:30px;border:1px solid #c6d5b0;border-radius:20px;padding:6px 10px;color:#77935b;font-size:9px}.journey{text-align:center;background:#ecf1e5;padding:48px 40px;border-radius:20px}.journey h2{font-size:30px}.journey>p{font-size:12px;color:#849278}.steps{display:grid;grid-template-columns:repeat(4,1fr);position:relative;gap:10px;margin:35px 0 25px}.steps:before{content:"";position:absolute;left:12%;right:12%;top:23px;height:1px;background:#c8d7b8}.steps button{z-index:1;background:transparent;border:0;color:#8b997f;padding:0}.steps i{width:46px;height:46px;border:1px solid #c8d7b8;background:#ecf1e5;display:grid;place-items:center;margin:0 auto 17px;font-size:11px;border-radius:50%;font-style:normal;transition:all .3s}.steps strong{display:block;font-size:13px;font-weight:600}.steps small{display:block;font-size:10px;margin-top:6px}.steps .active{color:var(--green)}.steps .active i{background:var(--green);color:var(--lime);border-color:var(--green);box-shadow:0 0 0 6px #1b4d3608}.journey-detail{display:flex;align-items:center;gap:14px;text-align:left;background:#ffffff95;padding:13px 17px;border-radius:10px}.journey-detail>span{color:#83a25e;font-size:20px}.journey-detail p{flex:1;font-size:11px;color:#7b8e6a;margin:0}.journey-detail button{font-size:10px;background:transparent;border:0;color:#66884b;white-space:nowrap}.demo-note{display:block;margin-top:12px;font-size:9px;color:#98a38b}.experience{margin:75px 0 40px;padding:45px 55px;border-radius:20px;background:var(--green);display:flex;justify-content:space-between;align-items:center;gap:25px}.experience .eyebrow{color:#b5cd93}.experience h2{color:#f4f8ec;font-size:38px}.experience p{font-size:12px;color:#c3d0b6}.light{background:var(--lime);color:var(--green)}.experience figure{margin:0;text-align:center}.experience img{width:130px;height:130px;object-fit:contain;background:white;border-radius:10px;padding:4px}.experience figcaption{font-size:10px;color:#ccdabd;margin-top:7px}#copy-status{font-size:10px;color:#d2e8ac;margin-left:12px}footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:25px;font-size:10px;color:#8b967e}footer button{font-size:10px;color:#7b8d6c;background:transparent;border:1px solid #d6dfca;border-radius:5px;padding:5px 9px}.hero-copy>*{animation:enter .7s both}.hero-copy>*:nth-child(2){animation-delay:.1s}.hero-copy>*:nth-child(3){animation-delay:.2s}.hero-copy>*:nth-child(4){animation-delay:.3s}.hero-copy>*:nth-child(5){animation-delay:.4s}.hero-copy>*:nth-child(6){animation-delay:.5s}.image-enter{animation:enter .35s both}@keyframes enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes float{50%{transform:translateY(-10px) rotate(4deg)}}@keyframes drift{50%{transform:translateY(-9px)}}.reduced *{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}@media(max-width:1050px){header,main,footer{padding-left:30px;padding-right:30px}.stage{transform:scale(.86)}.feature-layout{gap:20px}.panel{padding:25px}.panel-copy{max-width:165px}.panel-copy h3{font-size:22px}.panel-copy p{max-width:140px}.demo-phone{width:190px;right:15px;top:150px}.benefits{padding:20px 10px}}@media(max-width:760px){header,main,footer{padding-left:22px;padding-right:22px}header{height:75px}nav{display:none}.brand span{font-size:18px}.brand img{width:36px;height:36px}.hero{display:flex;flex-direction:column;gap:0}.hero-copy{width:100%;padding:35px 0 0}h1{font-size:38px;letter-spacing:-1.5px}.intro{font-size:13px}.button{padding:12px 14px;font-size:11px}.note{font-size:9px}.proof{margin-top:25px}.stage{width:100%;height:460px;transform:scale(.87);margin-top:-5px;margin-bottom:-12px}.court{width:350px;height:320px}.orbit{width:370px;height:395px}.hero-phone{width:205px;height:405px}.float{padding:12px;gap:8px}.signup{left:-10px;top:70px}.match{right:-10px;bottom:65px}.float strong{font-size:10px}.float small{font-size:8px}.stage-label{bottom:15px;left:18px}.stage-note{bottom:-10px}.benefits{flex-wrap:wrap;gap:15px;font-size:11px;justify-content:center}.benefits span{flex-basis:40%}.features{padding:55px 0}.section-head{display:block}.section-head h2{font-size:30px}.section-head p{margin-top:18px}.feature-layout{display:flex;flex-direction:column;gap:20px}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px}.tabs button{padding:13px 10px;gap:9px}.tabs strong{font-size:13px}.tabs small{font-size:9px}.tabs b{display:none}.tabs i{font-size:9px}.tabs button[aria-selected=true]{transform:none}.panel{height:470px}.panel-copy{max-width:175px}.panel-copy h3{font-size:23px}.demo-phone{width:195px;height:390px;right:15px;top:120px}.panel-tag{left:23px;bottom:25px}.journey{padding:35px 15px}.journey h2{font-size:23px}.steps{gap:3px}.steps strong{font-size:11px}.steps small{font-size:8px}.steps i{width:40px;height:40px}.steps:before{top:20px}.journey-detail{padding:12px;gap:8px;flex-wrap:wrap}.journey-detail p{font-size:10px;min-width:180px}.journey-detail button{margin-left:auto}.experience{padding:30px 24px;margin:50px 0 30px;gap:15px}.experience h2{font-size:25px}.experience .eyebrow{font-size:9px;letter-spacing:0}.experience p{font-size:10px}.experience img{width:85px;height:85px}.experience figcaption{font-size:8px}.experience .button{font-size:10px;padding:10px 12px}footer{flex-wrap:wrap;font-size:9px}}@media(max-width:370px){h1{font-size:34px}.demo-phone{width:175px;right:8px}.experience{flex-direction:column;align-items:start}.experience figure{align-self:center}}
@media(max-width:760px){.hero{overflow:hidden}.stage .orbit{width:310px;height:360px}.stage{min-width:0}}
html,body{overflow-x:clip}
.hero-carousel{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;white-space:nowrap;z-index:4}.hero-slide-tabs{display:flex;gap:3px;background:#ffffffbd;border:1px solid #dde8d3;padding:4px;border-radius:30px;box-shadow:0 4px 15px #234b2610}.hero-slide-tabs button{border:0;background:transparent;color:#7a8e68;border-radius:20px;padding:6px 12px;font-size:10px;transition:background .25s,color .25s}.hero-slide-tabs button[aria-pressed=true]{background:#194e37;color:#ecf7dd}.hero-carousel>button{border:1px solid #d5e2c9;border-radius:50%;background:#fff9;color:#617b4f;width:29px;height:29px;padding:0;font-size:10px}.hero-phone{display:flex;flex-direction:column}.hero-phone>#hero-slide-image{height:calc(100% - 23px);min-height:0;object-fit:cover;object-position:top}.hero-phone.show-results{background:#eef3e7}.hero-phone.show-results>#hero-slide-image{object-fit:contain;object-position:center;background:#eef3e7}.hero-image-enter{animation:heroFade .45s ease both}@keyframes heroFade{from{opacity:.25}to{opacity:1}}@media(max-width:760px){.hero-carousel{bottom:-6px}.stage-note{bottom:-28px;font-size:8px}.stage{margin-bottom:12px}.hero-slide-tabs button{font-size:10px;padding:6px 10px}.hero-phone{animation:none}.float{animation:none}}
/* Original website framework and brand colors, combined with preview interactions. */
:root{--ink:#153d31;--green:#185940;--lime:#d6f57a;--paper:#f7f8f1;--muted:#5b6c63;--line:#dbe3d7}header{max-width:none;height:auto;padding:0;background:rgba(255,255,255,.97)}header .nav-wrap{width:100%;max-width:1200px;padding:14px 32px;min-height:88px;gap:25px}header .brand{display:flex;flex-shrink:0}header .brand img{width:132px;height:48px;object-fit:contain}header .navigation{display:flex;gap:22px;flex-wrap:wrap;font-size:14px}header .navigation a{font-size:13px;font-weight:650}main{max-width:none;padding:0}main>.container{max-width:1200px;padding:0 32px}h1 span{color:#348054}h1 span:after{background:var(--lime)}.hero{border-bottom:0;padding:0;min-height:610px}.hero .hero-copy{padding:40px 0}.hero .stage{padding:0}.hero .eyebrow{display:block}.features{border-bottom:1px solid var(--line);padding:55px 0 70px}.features .eyebrow,.journey .eyebrow{display:block;margin:0}.features .section-head{margin-bottom:34px}.features .section-head p{max-width:330px}.features .phone img{max-width:100%}.journey{margin:30px 0 45px}.journey .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.journey .steps i{font-size:11px}.journey .steps strong{display:block}.journey .steps small{display:block}.journey .journey-detail p{margin:0}.connected-workflow{margin-top:10px}.experience{display:grid;grid-template-columns:1fr 210px;gap:40px;padding:44px;background:var(--ink)}.experience .eyebrow{color:var(--lime)}.experience .text-link{color:var(--lime)}footer{max-width:none;display:block;padding:40px 0 20px;font-size:13px}footer>.container{max-width:1200px;margin:auto;padding:0 32px}footer nav{display:flex;flex-direction:column;gap:8px}.local-preview-controls{display:flex;justify-content:center;align-items:center;gap:18px;padding:10px 20px;font-size:11px;background:#eaf0e4;color:#58705d}.local-preview-controls button{border:1px solid #a3b5a2;background:transparent;color:#185940;padding:4px 10px;border-radius:5px;font-size:11px}.hero-carousel{bottom:30px}.stage-note{bottom:8px}.hero-slide-tabs button{padding:6px 9px}.hero .phone img{border-radius:0}.hero .float small{line-height:1.7}.hero .stage-note{max-width:none}.hero .proof p{margin:0}.hero .proof strong{font-size:10px}.hero .hero-note{margin:18px 0 0}.hero .float strong{line-height:1.7}@media(max-width:950px){header .nav-wrap{flex-direction:column;align-items:flex-start;gap:8px}header .navigation{gap:12px 20px}.hero{min-height:550px}.stage{transform:scale(.8)}.hero h1{font-size:39px}}@media(max-width:760px){header .nav-wrap{padding:12px 22px;min-height:0}header .brand img{width:112px;height:38px}header .navigation{display:flex;gap:8px 16px}header .navigation a{font-size:11px}main>.container{padding:0 22px}.hero{min-height:0}.hero .hero-copy{padding:35px 0 0}.hero h1{font-size:37px}.hero .stage{transform:scale(.87);height:460px;margin-top:0;margin-bottom:14px}.hero-carousel{bottom:-5px}.stage-note{bottom:-27px}.features{padding:45px 0}.features .section-head p{font-size:11px}.journey{padding:35px 15px}.journey .steps{gap:3px}.experience{display:flex;flex-direction:column;align-items:flex-start;padding:30px 24px}.experience figure{align-self:center}.experience figure img{width:150px;height:150px}.experience figcaption{font-size:12px}footer>.container{padding:0 22px}.local-preview-controls{font-size:9px;gap:10px}.hero-slide-tabs button{padding:6px 7px;font-size:9px}}@media(prefers-reduced-motion:reduce){.hero-image-enter{animation:none}}
.journey-screen{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;padding:30px 40px;margin:25px 0;background:#fff9;border:1px solid #d8e4cc;border-radius:18px;text-align:left}.journey-screen-copy h3{font-size:26px;line-height:1.6;max-width:330px;margin:18px 0}.journey-screen-copy p{font-size:12px;color:#789066;max-width:320px}.journey-screen-copy .button{margin-top:12px;font-size:12px}.journey-screen-image{position:relative;border:0;background:transparent;padding:0;display:block;margin:auto;max-width:245px;width:100%;height:400px}.journey-screen-image img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 14px #27462518)}.journey-screen-image>span{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);font-size:10px;color:white;background:#194e37dd;border-radius:20px;padding:5px 13px;white-space:nowrap}#journey-image-dialog{max-width:90vw;max-height:92vh;border:0;border-radius:12px;padding:45px 14px 14px;background:#f7f8f1}#journey-image-dialog::backdrop{background:#10281bd9;backdrop-filter:blur(4px)}#journey-dialog-image{display:block;max-width:80vw;max-height:78vh;object-fit:contain;width:auto;height:auto}#journey-dialog-close{position:absolute;right:14px;top:10px;border:0;background:#e7efdc;padding:5px 12px;border-radius:5px;color:#194e37;font-size:12px}@media(max-width:760px){.journey-screen{grid-template-columns:1fr;gap:20px;padding:24px 18px}.journey-screen-copy h3{font-size:21px;margin:12px 0}.journey-screen-image{height:350px;max-width:230px}.journey-screen-copy .button{padding:10px 14px}.journey-screen-copy p{font-size:11px}}
/* Palette adapted from the supplied product UI: vivid green, mint and white. */
:root{--ink:#162d24;--green:#237d3d;--lime:#bdf575;--paper:#f5f7f6;--muted:#66736b;--line:#e0e9e3}body{background:var(--paper);color:var(--ink)}header{background:#fff}.hero{position:relative;background:radial-gradient(ellipse at 85% 15%,#b7efc980,transparent 50%),radial-gradient(ellipse at 25% 0%,#c9f3ed80,transparent 55%);border-radius:0 0 28px 28px}.hero h1{color:#152d23}h1 span{color:#35a84c}h1 span:after{background:#bdf575}.hero .court{background:linear-gradient(135deg,#c9f3e8,#c0efab)}.hero .orbit{border-color:#bce5c8}.button.primary{background:linear-gradient(110deg,#4bd965,#b7ef75);color:#143421;border-color:transparent}.button.primary:hover{background:linear-gradient(110deg,#3dce59,#a8e765)}.button.secondary{background:#fff;border-color:#d6e8dc;color:#285e3a}.features .panel{background-color:#e8f7ed}.features h2 span{color:#6a9879}.tabs button[aria-selected=true]{background:#fff;border-color:#82dd96}.tabs button[aria-selected=true] i,.tabs button[aria-selected=true] b{color:#39b553}.journey{background:linear-gradient(135deg,#e5f7ef,#f0f8df)}.steps .active i{background:#49ce62;border-color:#49ce62;color:#123620}.journey-screen{background:#ffffffd9;border-color:#d3ebdc}.hero-slide-tabs button[aria-pressed=true]{background:linear-gradient(110deg,#45ce5d,#a5e976);color:#133b20}.club-metrics>div{background:#e9f7ec;border-color:#d4e9d8}.club-metrics strong{color:#2d9b48}.city-track>span{background:linear-gradient(90deg,#4fd669,#a9e96f)}.experience{background:linear-gradient(120deg,#e0f7ea,#eff8d9);color:#153d31;border:1px solid #d4ebd9}.experience h2{color:#163b26}.experience p{color:#55745e}.experience .eyebrow,.experience .text-link{color:#278943}.experience figcaption{color:#55745e}footer{background:#eaf3ec}.local-preview-controls{background:#e8f5eb}
.journey-formats{font-size:12px;color:#667d6b;line-height:1.9;margin:18px auto 24px;max-width:680px}.features{padding-bottom:48px}.features+.journey{margin-top:40px}

/* Soft edge-to-edge hero atmosphere; no hard container edges. */
.hero{background:transparent!important;border-radius:0;isolation:isolate;overflow:visible}.hero::before{content:"";position:absolute;z-index:-1;pointer-events:none;top:-70px;bottom:-25px;left:50%;width:100vw;transform:translateX(-50%);background:radial-gradient(ellipse 42% 58% at 68% 27%,rgba(164,229,181,.32) 0%,rgba(195,239,211,.18) 48%,rgba(245,247,246,0) 78%),radial-gradient(ellipse 35% 50% at 29% 14%,rgba(184,235,228,.25) 0%,rgba(214,242,237,.12) 48%,rgba(245,247,246,0) 80%);mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 70%,transparent 100%)}.hero .court{background:linear-gradient(135deg,rgba(202,239,222,.72),rgba(192,233,171,.65));box-shadow:0 0 50px 22px rgba(201,239,218,.13)}.hero .orbit{border-color:rgba(156,211,168,.28)}@media(max-width:760px){.hero{overflow:hidden}.hero::before{top:0;bottom:0;width:100%;background:radial-gradient(ellipse 85% 45% at 65% 35%,rgba(177,232,192,.25),transparent 80%),radial-gradient(ellipse 90% 45% at 20% 5%,rgba(191,237,230,.22),transparent 78%);mask-image:linear-gradient(transparent,#000 12%,#000 78%,transparent)}}
