:root{--ink:#14262f;--muted:#4b5c62;--paper:#f6f4ec;--paper-2:#ecede2;--line:#d5dad0;--green:#d4e8bd;--leaf:#2a6550;--space:#111a27;--signal:#f08a3c;--focus:#b55b16;--focus-dark:#ffb066;--radius:22px;--sans:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;--display:"Segoe UI Variable Display","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;--stars:radial-gradient(circle at 8% 18%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 22% 74%,#ffffffb3 0 1px,transparent 1.6px),radial-gradient(circle at 35% 10%,#ffffff8c 0 1px,transparent 1.6px),radial-gradient(circle at 47% 88%,#fff 0 1.2px,transparent 1.8px),radial-gradient(circle at 62% 26%,#ffffffa6 0 1px,transparent 1.6px),radial-gradient(circle at 78% 66%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 89% 13%,#ffffffcc 0 1.3px,transparent 1.9px),radial-gradient(circle at 94% 84%,#ffffff8c 0 1px,transparent 1.6px),radial-gradient(circle at 13% 47%,#ffffff73 0 1px,transparent 1.6px),radial-gradient(circle at 70% 94%,#ffffff80 0 1px,transparent 1.6px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 var(--sans)}
img{max-width:100%}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
a:hover{color:var(--leaf)}
a:focus-visible{outline:3px solid var(--focus);outline-offset:4px;border-radius:4px}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:var(--display);text-wrap:balance}
header,main,footer{max-width:1200px;margin:auto;padding-left:56px;padding-right:56px}
header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 32px;padding-top:26px;padding-bottom:22px}
.brand{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:800;letter-spacing:1.8px;text-decoration:none;line-height:1.25}
.brand-sub{display:block;font-size:9px;letter-spacing:2px;margin-top:5px;color:var(--muted)}
.mark{position:relative;display:grid;place-items:center;border-radius:12px;width:45px;height:45px;background:var(--ink);color:var(--green);font-size:30px;letter-spacing:-4px;padding-right:6px}
.mark span{font-size:14px;align-self:start;margin-top:6px;position:absolute;right:7px;color:var(--signal)}
header nav{display:flex;flex-wrap:wrap;gap:4px;font-size:14px;font-weight:600}
header nav a{text-decoration:none;padding:8px 14px;border-radius:999px}
header nav a:hover{background:var(--paper-2);color:var(--ink)}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;margin:0 0 16px;color:var(--leaf)}
h1{font-size:clamp(40px,6vw,74px);font-weight:600;letter-spacing:-.035em;line-height:1.04;margin-bottom:24px}
h1 span{color:var(--leaf)}
.lede{font-size:21px;line-height:1.55;color:var(--muted);max-width:560px}
.text-link{font-size:14px;font-weight:700}
.text-link span{margin-left:6px}
.intro{padding:72px 0 64px;max-width:950px}
.home-intro{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr);gap:56px;align-items:center;max-width:none;padding:48px 0 64px}
.quick{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:10px;box-shadow:0 24px 48px -32px #14262f59}
.quick-title{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--muted);margin:10px 14px 6px}
.quick a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;text-decoration:none;line-height:1.35}
.quick a:hover{background:var(--paper);color:var(--ink)}
.quick a+a{box-shadow:0 -1px 0 var(--paper-2)}
.quick strong{display:block;font-size:15px}
.quick small{display:block;font-size:13px;color:var(--muted)}
.dot{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;font-size:15px;font-weight:700}
.dot-work{background:repeating-linear-gradient(90deg,#d6e9bf 0 6px,#bcd89c 6px 12px)}
.dot-play{background:radial-gradient(circle at 62% 40%,var(--signal) 0 4px,transparent 5px),var(--space)}
.dot-help,.dot-privacy{background:var(--paper-2);color:var(--leaf)}
.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:28px 0 16px}
.section-heading h2{font-size:26px;font-weight:600;letter-spacing:-.02em;margin:0}
.section-heading p{color:var(--muted);font-size:14px;margin:0}
.app-row{display:grid;grid-template-columns:1.05fr 1fr;margin-bottom:28px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.play .app-art{order:2}
.app-art{position:relative;min-height:380px;overflow:hidden;isolation:isolate}
.art-label{position:absolute;top:22px;left:24px;z-index:2;font-size:10px;font-weight:700;letter-spacing:2px;padding:5px 11px;border-radius:999px;background:#ffffffa6}
.mow-art{background:repeating-linear-gradient(90deg,#d8eac2 0 56px,#cbe1b0 56px 112px);color:#1f4a37}
.mq{position:relative;z-index:1;padding:92px 40px 40px;font-family:var(--display);font-size:clamp(54px,6vw,78px);line-height:.95;font-weight:700;letter-spacing:-.045em}
.mq span{display:inline-block;font-family:var(--sans);font-size:13px;line-height:1.4;letter-spacing:0;margin-top:26px;font-weight:600;padding:7px 13px;border-radius:999px;background:#fffc}
.lawn-lines{position:absolute;bottom:-90px;right:-70px;width:340px;height:340px;border-radius:50%;background:repeating-linear-gradient(0deg,#bcd89c 0 22px,#d3e7bb 22px 44px);box-shadow:0 0 0 18px #ffffff40}
.farlight-art{display:grid;place-items:center;background:radial-gradient(circle at 50% 56%,#f08a3c38,transparent 46%),var(--stars),var(--space);color:#dfe8f1}
.farlight-art::before,.farlight-art::after{content:"";position:absolute;left:50%;top:54%;border-radius:50%;transform:translate(-50%,-50%) rotate(-16deg);pointer-events:none}
.farlight-art::before{width:min(92%,470px);height:150px;border:1px solid #dfe8f138}
.farlight-art::after{width:min(70%,340px);height:100px;border:1px dashed #f08a3c59}
.farlight-art .art-label{background:#ffffff14}
.farlight-art img{position:relative;width:min(100%,400px);height:auto;mix-blend-mode:lighten}
.app-copy{padding:48px;display:flex;flex-direction:column;justify-content:center}
.app-copy h3{font-size:40px;line-height:1.1;letter-spacing:-.03em;font-weight:600;margin-bottom:16px}
.app-copy p{font-size:16px;margin-bottom:18px;max-width:420px}
.app-copy .eyebrow{font-size:10px;margin-bottom:12px}
.play .eyebrow{color:#b55b16}
.app-copy .detail{font-size:14px;color:var(--muted)}
.actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:10px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;background:var(--ink);color:#fff;text-decoration:none;padding:13px 22px;font-size:14px;font-weight:600;border-radius:999px;transition:background-color .2s}
.button:hover{background:var(--leaf);color:#fff}
.button.light{background:#fff;color:var(--space)}
.button.light:hover{background:var(--green);color:var(--space)}
.support{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:center;margin:56px 0 72px;padding:48px;border-radius:var(--radius);background:linear-gradient(120deg,#dcebc9,#e8f0dc)}
.support h2{font-size:32px;line-height:1.15;font-weight:600;letter-spacing:-.02em;margin-bottom:10px}
.support p{font-size:15px;color:var(--muted)}
.support .eyebrow{font-size:10px;margin-bottom:12px}
.email{display:inline-block;margin-top:6px;font-size:clamp(17px,2.1vw,22px);font-weight:600;overflow-wrap:anywhere}
.support-privacy{background:#ffffffc7;border-radius:16px;padding:22px 24px 10px}
.support-privacy h3{font-size:15px;margin-bottom:6px}
.link-list{list-style:none;margin:0;padding:0}
.link-list a{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid #14262f1a;text-decoration:none;font-size:15px;font-weight:600}
.link-list li:first-child a{border-top:0}
footer{background:var(--space);color:#d6dfe7;box-shadow:0 0 0 100vmax var(--space);clip-path:inset(0 -100vmax);padding-top:48px;padding-bottom:32px;font-size:14px}
footer a{text-decoration:none}
footer a:hover{color:#fff;text-decoration:underline}
footer a:focus-visible,.game-intro a:focus-visible{outline-color:var(--focus-dark)}
.footer-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px 56px}
.footer-top>div p{margin:6px 0 0;color:#a9b6c0;font-size:13px}
.footer-brand{font-weight:700;font-size:16px;color:#fff}
footer nav{display:grid;grid-template-columns:repeat(3,auto);gap:24px 56px}
footer nav div{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
footer nav p{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#93a4b1;margin:0 0 2px}
footer small{display:block;margin-top:40px;padding-top:20px;border-top:1px solid #ffffff1f;color:#a9b6c0;font-size:12px}
.back{display:inline-block;font-size:14px;font-weight:600;margin:16px 0 24px;text-decoration:none}
.back:hover{text-decoration:underline}
.game-intro{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center;margin-bottom:56px;padding:64px;border-radius:28px;background:radial-gradient(circle at 78% 46%,#f08a3c2e,transparent 38%),var(--stars),var(--space);color:#c9d5df}
.game-intro::before{content:"";position:absolute;z-index:-1;left:76%;top:50%;width:640px;height:220px;border:1px solid #dfe8f129;border-radius:50%;transform:translate(-50%,-50%) rotate(-16deg)}
.game-intro .eyebrow{color:var(--signal)}
.game-intro h1{font-size:clamp(56px,8vw,96px);color:#fff;margin-bottom:16px}
.game-intro .lede{font-family:var(--display);font-size:clamp(24px,3vw,32px);line-height:1.3;letter-spacing:-.02em;color:#fff}
.game-intro p{max-width:500px}
.release-note{margin:26px 0;padding:16px 18px;border:1px solid #ffffff24;border-radius:16px;background:#ffffff0a;max-width:460px}
.status{display:flex;align-items:center;gap:10px;margin:0;font-weight:700;color:#fff}
.status::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px #f08a3c33}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0;padding:0;font-size:13px;font-weight:600}
.tags li{padding:4px 12px;border-radius:999px;background:#ffffff14;color:#e4ebf1}
.game-intro .text-link{color:#fff}
.game-intro .text-link:hover{color:var(--green)}
.game-intro figure{margin:0 auto;width:100%;max-width:320px}
.game-intro img{display:block;width:100%;height:auto;border-radius:30px;border:8px solid #22324a;box-shadow:0 0 0 1px #ffffff26,0 34px 60px -24px #000}
.game-intro figcaption{font-size:12px;color:#a9b6c0;margin-top:14px;text-align:center}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:0 0 72px}
.features>div{border-top:2px solid var(--ink);padding-top:22px}
.features span{font-size:13px;font-weight:700;letter-spacing:1px;color:#b55b16}
.features h2{font-size:22px;font-weight:600;letter-spacing:-.01em;margin:10px 0}
.features p{font-size:15px;color:var(--muted)}
.policy{max-width:760px;margin:8px auto 80px;font-size:17px;line-height:1.75}
.policy h1{font-size:clamp(34px,5vw,52px);margin-bottom:16px}
.policy-date{display:inline-block;margin-bottom:36px;padding:5px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:14px}
.policy section{border-top:1px solid var(--line);padding-top:26px;margin-bottom:26px}
.policy h2{font-size:22px;line-height:1.3;letter-spacing:-.01em;font-weight:600;margin-bottom:12px}
.policy p{margin-bottom:16px;overflow-wrap:anywhere}
.policy section a,.policy aside a{color:var(--leaf);font-weight:600}
.policy aside{padding:22px 24px;border-radius:16px;background:#e3edd6;font-size:15px}
.notfound{position:relative;padding:88px 0 104px}
.notfound .eyebrow{display:inline-block;padding:6px 14px;border-radius:999px;background:var(--space);color:var(--signal)}
.skip{position:fixed;left:20px;top:-100px;padding:10px 16px;background:#fff;border-radius:8px;z-index:100}
.skip:focus{top:10px}
@media(max-width:900px){.home-intro{grid-template-columns:1fr;gap:36px}.quick{max-width:560px}.game-intro{grid-template-columns:1fr;gap:40px}.game-intro::before{left:50%;top:78%}.support{grid-template-columns:1fr;gap:28px}}
@media(max-width:760px){header,main,footer{padding-left:20px;padding-right:20px}header{padding-top:18px;padding-bottom:14px}.brand{font-size:14px;letter-spacing:1.1px}.brand-sub{font-size:7px;letter-spacing:1.3px}.mark{width:36px;height:36px;font-size:24px;border-radius:10px}.mark span{font-size:11px;right:5px;margin-top:4px}header nav{width:100%;margin-left:-12px;font-size:13px}header nav a{padding:8px 12px}.intro{padding:48px 0}.home-intro{padding:24px 0 44px}.lede{font-size:18px}.section-heading{display:block;padding-top:22px}.section-heading h2{margin-bottom:6px}.section-heading p{font-size:13px}.app-row{grid-template-columns:1fr;border-radius:18px}.play .app-art{order:0}.app-art{min-height:230px}.farlight-art{min-height:290px}.mq{padding:68px 24px 28px;font-size:54px}.lawn-lines{width:240px;height:240px;bottom:-80px;right:-60px}.app-copy{padding:28px 22px 32px}.app-copy h3{font-size:32px}.app-copy p{font-size:15px}.actions{gap:18px}.support{margin:40px 0 56px;padding:28px 22px;border-radius:18px}.support h2{font-size:26px}.support-privacy{padding:18px 18px 6px}footer{padding-top:36px}footer nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;width:100%}.back{margin:8px 0 18px}.game-intro{padding:36px 22px 28px;border-radius:20px;margin-bottom:40px}.game-intro h1{font-size:52px}.game-intro .lede{font-size:25px}.game-intro figure{max-width:260px}.game-intro img{border-width:6px;border-radius:24px}.features{grid-template-columns:1fr;gap:24px;padding-bottom:56px}.features>div{border-top-width:1px}.policy{margin-top:0}.policy-date{margin-bottom:28px}.notfound{padding:56px 0 72px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
