:root{--ink:#173f3a;--muted:#66817b;--cream:#fffaf0;--orange:#ff6b35;--orange-dark:#ed5224;--mint:#dff6e9;--green:#0b6b5d;--line:#e8eadf}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:#fffdf8;margin:0;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}button,a{font:inherit}button{color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #155fff}.site-header{z-index:10;justify-content:space-between;align-items:center;max-width:1180px;height:76px;margin:auto;padding:0 28px;display:flex;position:relative}.brand{letter-spacing:-.04em;align-items:center;gap:10px;font-size:19px;font-weight:850;display:inline-flex}.brand-mark{background:var(--orange);border-radius:11px;place-items:center;width:33px;height:33px;display:grid;transform:rotate(-5deg);box-shadow:0 6px 13px #ff6b3530}.sparkle{fill:#fff;width:21px;height:21px}.site-header nav{align-items:center;gap:30px;font-size:14px;font-weight:650;display:flex}.site-header nav>a:not(.nav-play),.nav-button{color:#627b76;transition:color .2s}.site-header nav>a:not(.nav-play):hover,.nav-button:hover{color:var(--ink)}.nav-button{cursor:pointer;background:0 0;border:0;padding:0}.nav-play{background:var(--ink);color:#fff;border-radius:99px;padding:12px 19px;box-shadow:0 7px 16px #173f3a1d}.nav-play span{margin-left:7px}.hero{grid-template-columns:1.02fr .98fr;align-items:center;gap:40px;max-width:1180px;min-height:648px;margin:0 auto;padding:74px 44px 96px;display:grid}.hero-copy{z-index:2;position:relative}.eyebrow{color:#70847f;letter-spacing:.02em;align-items:center;gap:10px;font-size:12px;font-weight:650;display:flex}.eyebrow span{color:var(--green);background:#e5f6ea;border-radius:99px;padding:7px 12px}.eyebrow i{background:#99aaa6;border-radius:50%;width:3px;height:3px}.hero h1{letter-spacing:-.075em;margin:26px 0 25px;font-size:clamp(56px,6vw,82px);font-weight:900;line-height:.99}.hero h1 em{color:var(--orange);font-style:normal;position:relative}.hero h1 em:after{content:"";background:#ffd9a8;border-radius:50%;height:7px;position:absolute;bottom:-8px;left:7px;right:-5px;transform:rotate(-2deg)}.hero-copy>p{color:var(--muted);max-width:470px;font-size:16px;line-height:1.85}.hero-actions{align-items:center;gap:28px;margin-top:35px;display:flex}.primary-cta{color:#fff;background:var(--orange);border-radius:14px;padding:16px 23px;font-weight:800;transition:transform .2s,box-shadow .2s;box-shadow:0 12px 25px #ff6b3540}.primary-cta:hover{transform:translateY(-2px);box-shadow:0 15px 30px #ff6b354d}.primary-cta span{padding-left:15px}.text-link{border-bottom:1px solid #9aaea9;padding-bottom:3px;font-size:14px;font-weight:700}.mini-proof{align-items:center;gap:14px;margin-top:50px;display:flex}.mini-avatars{display:flex}.mini-avatars span{color:#fff;border:2px solid #fff;border-radius:50%;place-items:center;width:31px;height:31px;margin-right:-7px;font-size:12px;display:grid}.mini-avatars span:first-child{background:#ff6571}.mini-avatars span:nth-child(2){background:#7279ed}.mini-avatars span:nth-child(3){background:#78bf55}.mini-proof p{color:#82938f;margin:0;font-size:11px;line-height:1.45}.mini-proof strong{color:var(--ink);font-size:12px}.hero-art{place-items:center;height:460px;display:grid;position:relative}.hero-art:before{content:"";background:#e7f6e7;border-radius:45% 55% 60% 40%;width:405px;height:405px;position:absolute;transform:rotate(-8deg)}.art-orbit{border:1px dashed #c3dfce;border-radius:50%;position:absolute}.orbit-one{width:470px;height:370px;transform:rotate(18deg)}.orbit-two{width:360px;height:470px;transform:rotate(-28deg)}.art-card{z-index:2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffe6;border:7px solid #fff;border-radius:30px;width:316px;padding:19px;position:relative;transform:rotate(4deg);box-shadow:0 30px 70px #395f4940}.art-top{justify-content:space-between;align-items:center;padding:2px 4px 15px;font-size:11px;font-weight:800;display:flex}.art-top b{color:var(--orange);background:#fff0e9;border-radius:10px;padding:6px 9px}.art-grid{background:#fff7dc;border-radius:20px;grid-template-columns:repeat(4,1fr);gap:8px;padding:11px;display:grid}.mini-tile,.demo-tile{aspect-ratio:1;color:#fff;text-shadow:0 2px #0001;border-radius:15px;place-items:center;font-size:25px;display:grid;box-shadow:inset 0 -5px #00000010,0 4px 5px #00000014}.floating{z-index:3;color:#fff;border:5px solid #ffffffb0;border-radius:19px;place-items:center;width:55px;height:55px;font-size:22px;display:grid;position:absolute;box-shadow:inset 0 -6px #0001,0 12px 22px #254b3b25}.fruit-one{background:#ff6571;top:100px;left:20px;transform:rotate(-14deg)}.fruit-two{background:#81bf55;top:70px;right:0;transform:rotate(11deg)}.fruit-three{background:#6d77dc;bottom:45px;right:26px;transform:rotate(-8deg)}.game-section{background:#f3f7ef;padding:84px 24px 100px;position:relative;overflow:hidden}.game-section:before,.game-section:after{content:"";filter:blur(2px);border-radius:50%;position:absolute}.game-section:before{background:#e3f2d5;width:330px;height:330px;top:-120px;left:-140px}.game-section:after{background:#ffeedb;width:260px;height:260px;bottom:-100px;right:-90px}.section-intro{text-align:center;z-index:1;max-width:620px;margin:0 auto 38px;position:relative}.section-kicker{color:var(--orange);letter-spacing:.18em;font-size:11px;font-weight:900}.section-intro h2{letter-spacing:-.05em;margin:11px 0;font-size:38px}.section-intro p{color:var(--muted);font-size:14px}.game-shell{z-index:1;background:#fff;border:1px solid #edf0e8;border-radius:28px;grid-template-columns:220px 1fr;gap:20px;max-width:930px;margin:auto;padding:18px;display:grid;position:relative;box-shadow:0 25px 70px #4364511c}.game-panel{background:#fbf8ef;border-radius:20px;flex-direction:column;gap:22px;padding:28px 24px;display:flex}.label{color:#81918b;margin:0 0 5px;font-size:11px;font-weight:700}.target{letter-spacing:-.04em;font-size:30px}.progress-label{color:#71837e;justify-content:space-between;margin-bottom:7px;font-size:10px;display:flex}.progress-label strong{color:var(--orange)}.progress-track{background:#e8e7db;border-radius:10px;height:8px;overflow:hidden}.progress-track span{background:linear-gradient(90deg,#ff9c47,var(--orange));border-radius:10px;height:100%;transition:width .4s;display:block}.stat-grid{grid-template-columns:1fr 1fr;gap:7px;display:grid}.stat-grid div{background:#fff;border:1px solid #ece9de;border-radius:12px;padding:11px 8px}.stat-grid span{color:#8a9994;margin-bottom:5px;font-size:9px;display:block}.stat-grid strong{font-size:18px}.best{color:#82908c;border-top:1px solid #e7e5db;align-items:center;gap:10px;padding-top:18px;font-size:10px;line-height:1.5;display:flex}.best strong{color:var(--ink);font-size:12px}.trophy{color:#da9a2c;background:#fff0bd;border-radius:50%;place-items:center;width:35px;height:35px;font-size:17px;display:grid}.restart-side{cursor:pointer;background:0 0;border:1px solid #d8ded6;border-radius:12px;margin-top:auto;padding:10px;font-size:12px;font-weight:700}.restart-side:hover{background:#fff}.restart-side span{margin-right:4px;font-size:17px}.board-area{min-width:0;padding:10px 13px 4px}.board-head{color:#71837d;justify-content:space-between;align-items:start;height:45px;font-size:11px;display:flex}.board-head>div{color:var(--ink);font-weight:800}.board-head p{text-align:right;max-width:280px;margin:0}.live-dot{background:#76be57;border-radius:50%;width:7px;height:7px;margin-right:7px;display:inline-block;box-shadow:0 0 0 4px #e6f4df}.board-wrap{max-width:510px;margin:auto;position:relative}.board{background:#e5efd8;border-radius:20px;grid-template-columns:repeat(7,1fr);gap:7px;padding:12px;display:grid;box-shadow:inset 0 2px 10px #5e7d4b19}.tile{aspect-ratio:1;color:#fff;cursor:pointer;border:2px solid #ffffff70;border-radius:15px;place-items:center;font-size:clamp(17px,2.2vw,27px);font-weight:900;transition:transform .18s,filter .18s,opacity .18s;display:grid;position:relative;box-shadow:inset 0 -6px #0001,inset 0 3px 1px #ffffff50,0 3px 4px #42643f22}.tile:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-2px)scale(1.04)}.tile:disabled{cursor:default}.tile span{filter:drop-shadow(0 2px 1px #0002);transition:transform .2s}.tile.selected{z-index:2;outline:4px solid #fff;transform:scale(.88);box-shadow:0 0 0 7px #163f3a,inset 0 -6px #0001}.tile.popping{animation:.38s forwards pop}.tile.invalid{animation:.28s shake}.tile-null{opacity:.15}.tile-0{background:linear-gradient(145deg,#ff7d82,#f34960)}.tile-1{background:linear-gradient(145deg,#ffd85f,#f5a928)}.tile-2{background:linear-gradient(145deg,#6dc7ed,#4583dc)}.tile-3{background:linear-gradient(145deg,#a985e8,#7553c1)}.tile-4{background:linear-gradient(145deg,#93d76d,#54aa54)}.tile-5{background:linear-gradient(145deg,#ffac83,#f07968)}@keyframes pop{50%{filter:brightness(1.25);transform:scale(1.18)rotate(7deg)}to{opacity:0;transform:scale(.05)}}@keyframes shake{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.combo-badge{z-index:5;color:#fff;background:var(--orange);border-radius:16px;padding:9px 18px;font-size:30px;font-weight:950;animation:.4s combo;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)rotate(-7deg);box-shadow:0 10px 30px #d84a2688}.combo-badge small{text-align:center;letter-spacing:.25em;font-size:8px;display:block}@keyframes combo{0%{transform:translate(-50%,-50%)scale(.3)rotate(10deg)}70%{transform:translate(-50%,-50%)scale(1.15)rotate(-7deg)}}.board-tip{text-align:center;color:#899791;margin:13px 0 2px;font-size:11px}.board-tip span{margin-right:5px}.board-loading{aspect-ratio:1;color:#6c8379;background:#e5efd8;border-radius:20px;place-items:center;font-size:13px;display:grid}.result-card{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);text-align:center;background:#fffdf8ee;border-radius:25px;flex-direction:column;justify-content:center;align-items:center;padding:20px;animation:.35s rise;display:flex;position:absolute;inset:5%;box-shadow:0 15px 50px #25473e4a}@keyframes rise{0%{opacity:0;transform:translateY(15px)scale(.97)}}.result-icon{color:#fff;border-radius:20px;place-items:center;width:58px;height:58px;margin-bottom:14px;font-size:29px;display:grid;transform:rotate(-6deg)}.result-icon.won{background:#75b956}.result-icon.lost{background:#ff725d}.result-card>span{letter-spacing:.18em;color:var(--orange);font-size:10px;font-weight:900}.result-card h3{margin:8px 0 4px;font-size:30px}.result-card p{color:var(--muted);margin:3px 0 20px;font-size:13px}.result-card button,.guide-start{background:var(--orange);color:#fff;cursor:pointer;border:0;border-radius:13px;padding:13px 20px;font-weight:800}.result-card button span{margin-left:7px}.how{grid-template-columns:.75fr 1.6fr;align-items:center;gap:90px;max-width:1080px;margin:0 auto;padding:120px 30px;display:grid}.how-copy h2{letter-spacing:-.055em;margin:14px 0 20px;font-size:43px;line-height:1.12}.how-copy p{color:var(--muted);font-size:14px;line-height:1.8}.how-copy button{cursor:pointer;background:0 0;border:0;border-bottom:1px solid #afbbb5;margin-top:12px;padding:8px 0;font-weight:800}.how-copy button span{margin-left:15px}.steps{grid-template-columns:repeat(3,1fr);gap:17px;display:grid}.steps article{background:#fff;border:1px solid #e5e8df;border-radius:20px;min-height:255px;padding:22px 18px 24px;position:relative;box-shadow:0 10px 30px #28473a0a}.step-num{color:#9aaba5;letter-spacing:.1em;font-size:9px}.step-icon{height:85px;color:var(--orange);justify-content:center;align-items:center;font-size:40px;font-weight:900;display:flex}.match-icon{gap:3px}.match-icon i{color:#fff;background:#fb5b69;border-radius:9px;place-items:center;width:30px;height:30px;font-size:15px;font-style:normal;display:grid;box-shadow:inset 0 -4px #0001}.cascade-icon{color:#647bdd;position:relative}.cascade-icon small{color:var(--orange);margin:0 0 40px 45px;font-size:11px;position:absolute}.steps h3{margin:5px 0 10px;font-size:15px}.steps p{color:#7f8f8a;margin:0;font-size:11px;line-height:1.7}.feedback{background:var(--ink);color:#fff;border-radius:28px;justify-content:space-between;align-items:center;max-width:1080px;margin:0 auto 80px;padding:52px 60px;display:flex;position:relative;overflow:hidden}.feedback:after{content:"";border:45px solid #2b5a53;border-radius:50%;width:230px;height:230px;position:absolute;top:-100px;right:190px}.feedback>div{z-index:1;position:relative}.feedback .sparkle{fill:#ff8b58;vertical-align:middle;width:15px;margin-right:7px}.feedback>div>span{color:#a8c0ba;letter-spacing:.12em;font-size:10px}.feedback h2{margin:12px 0 8px;font-size:32px}.feedback p{color:#a9c0bb;margin:0;font-size:13px}.feedback>a{z-index:2;background:#ff7544;border-radius:14px;padding:15px 21px;font-size:13px;font-weight:800;position:relative;box-shadow:0 10px 30px #09272150}.feedback>a span{margin-left:25px}footer{color:#8a9995;justify-content:space-between;align-items:center;max-width:1080px;margin:auto;padding:0 10px 42px;font-size:11px;display:flex}footer .brand{color:var(--ink);font-size:14px}footer .brand-mark{border-radius:9px;width:27px;height:27px}footer .sparkle{width:16px}.modal-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:50;background:#123f398c;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.guide-modal{text-align:center;background:#fffdf7;border-radius:28px;width:min(420px,100%);padding:35px;animation:.35s rise;position:relative;box-shadow:0 30px 80px #102f2a70}.close{cursor:pointer;background:#f0f1e9;border:0;border-radius:50%;width:30px;height:30px;font-size:19px;position:absolute;top:15px;right:18px}.guide-kicker{color:var(--orange);letter-spacing:.17em;font-size:10px;font-weight:900}.guide-modal h2{letter-spacing:-.04em;margin:10px 0 20px;font-size:32px}.guide-demo{background:#edf4e5;border-radius:19px;justify-content:center;align-items:center;gap:20px;height:92px;display:flex}.demo-tile{color:#fff;width:55px;font-size:22px}.demo-arrow{color:var(--green);font-size:25px;font-weight:900}.guide-modal>p{color:var(--muted);margin:20px 5px 15px;font-size:13px;line-height:1.8}.guide-rule{color:#7d745f;background:#fff2df;border-radius:10px;padding:10px;font-size:11px}.guide-rule span{color:var(--orange);margin-right:8px;font-weight:900}.guide-start{width:100%;margin-top:18px;padding:14px}.guide-start span{float:right}@media (max-width:850px){.hero{grid-template-columns:1fr;padding-top:55px}.hero-copy{text-align:center}.hero-copy>p{margin-left:auto;margin-right:auto}.eyebrow,.hero-actions,.mini-proof{justify-content:center}.hero-art{height:410px}.game-shell{grid-template-columns:1fr;max-width:600px}.game-panel{grid-template-columns:1fr 1fr 1fr;align-items:center;padding:18px;display:grid}.progress-wrap{order:4;grid-column:1/-1}.best{border-top:0;padding-top:0}.restart-side{margin-top:0}.how{grid-template-columns:1fr;gap:50px}.how-copy{text-align:center}}@media (max-width:600px){.site-header{height:66px;padding:0 18px}.site-header nav>a:not(.nav-play),.nav-button{display:none}.nav-play{padding:10px 14px}.hero{min-height:auto;padding:52px 20px 70px}.hero h1{font-size:54px}.hero-copy>p{font-size:14px}.hero-actions{flex-direction:column;gap:19px}.mini-proof{margin-top:38px}.hero-art{height:330px}.hero-art:before{width:290px;height:290px}.art-card{border-width:5px;border-radius:22px;width:235px;padding:12px}.mini-tile{border-radius:11px;font-size:18px}.art-grid{gap:6px;padding:8px}.art-orbit{display:none}.floating{border-width:4px;width:45px;height:45px}.fruit-one{left:3px}.fruit-two{right:3px}.fruit-three{right:8px}.game-section{padding:68px 10px 75px}.section-intro{padding:0 15px}.section-intro h2{font-size:32px}.game-shell{border-radius:22px;gap:4px;padding:9px}.game-panel{grid-template-columns:1fr 1fr;gap:13px;padding:15px}.game-panel>div:first-child{grid-column:1/2}.stat-grid{grid-area:1/2/2/3}.best{grid-column:1/2}.restart-side{grid-column:2/3}.progress-wrap{grid-row:auto}.board-area{padding:8px 3px}.board-head{height:51px;padding:0 4px}.board-head p{max-width:180px}.board{border-radius:16px;gap:4px;padding:7px}.tile{border-radius:10px;box-shadow:inset 0 -4px #0001,0 2px 3px #0001}.tile.selected{box-shadow:0 0 0 4px #163f3a}.how{padding:80px 18px}.how-copy h2{font-size:36px}.steps{grid-template-columns:1fr}.steps article{min-height:0}.feedback{text-align:center;margin:0 15px 50px;padding:42px 25px;display:block}.feedback>a{margin-top:25px;display:inline-block}footer{padding:0 20px 30px}footer p{display:none}.guide-modal{padding:32px 23px}.result-card{inset:3%}.result-card h3{font-size:25px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
