body[data-scene=rest] .map-grass{background:#b9d7c6}body[data-scene=rest] .map-path{border-color:#599eae}body[data-scene=rest] .map-path span{color:#599eae}
:root{--cream:#f5f0de;--blue:#183e74;--orange:#f07c36;--lime:#d8e969;--ink:#153053}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif}button,a{font:inherit}a{color:inherit}.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;z-index:100;background:#fff;padding:12px}.demo-banner{background:var(--blue);color:#fff;text-align:center;padding:7px 15px;font-size:10px;letter-spacing:.07em;line-height:1.5}.header{height:84px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;background:var(--cream);border-bottom:2px solid var(--blue)}.brand{text-decoration:none;display:flex;align-items:center;gap:13px;font-size:22px;font-weight:900;letter-spacing:.06em}.brand small{display:block;font:10px 'Arial Narrow',sans-serif;letter-spacing:.16em;margin-top:2px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--orange);color:#fff;font-size:28px}.header nav{display:flex;gap:30px}.header nav a{text-decoration:none;font-size:12px;font-weight:800;border-bottom:2px solid transparent;padding:7px 0}.header nav a:hover,.header nav a:focus-visible{border-color:var(--orange)}.hero{background:#d9e8e5;overflow:hidden}.hero-top,.hero-bottom{display:flex;justify-content:space-between;padding:18px 5vw;font:11px 'Arial Narrow',sans-serif;letter-spacing:.16em;font-weight:900}.hero-top{border-bottom:2px solid var(--blue)}.hero-bottom{border-top:2px solid var(--blue)}.hero-grid{display:grid;grid-template-columns:45% 55%;min-height:720px}.hero-copy{padding:9vw 3vw 8vw 7vw;position:relative;z-index:1}.hero-kicker{display:inline-block;background:var(--lime);padding:9px 15px;font-weight:900;font-size:13px;transform:rotate(-2deg)}.hero h1{font-size:clamp(76px,10vw,170px);font-weight:950;line-height:1.04;letter-spacing:-.12em;margin:35px 0;text-shadow:5px 5px 0 #fff}.hero h1 em{font-style:normal;color:var(--orange);-webkit-text-stroke:2px var(--blue)}.hero-copy>p:not(.hero-kicker){max-width:440px;font-size:15px;line-height:2;font-weight:600}.hero-copy>a{display:inline-flex;justify-content:space-between;gap:65px;background:var(--blue);color:#fff;text-decoration:none;padding:18px 23px;border-radius:40px;font-weight:900;margin-top:25px}.park-map{position:relative;display:grid;place-items:center;min-width:0}.map-ring{width:min(54vw,680px);aspect-ratio:1;border-radius:50%;background:#f9f6e8;border:12px solid var(--blue);outline:2px dashed var(--blue);outline-offset:15px;position:relative;box-shadow:25px 28px 0 #9bc3b9;overflow:hidden}.map-ring:before{content:'';position:absolute;width:65%;height:64%;left:17%;top:18%;border:2px dashed #8eab8a;border-radius:50%;transform:rotate(-15deg)}.map-grass{position:absolute;inset:19% 25% 28% 11%;border-radius:50% 43% 48% 39%;background:#d8e969;transform:rotate(-12deg)}.map-grass:after{content:'';position:absolute;width:45%;aspect-ratio:1;border-radius:50%;background:#aacd9b;right:-28%;bottom:-40%}.map-path{position:absolute;left:16%;top:58%;width:62%;height:30%;border-top:7px dotted var(--orange);border-radius:50%;transform:rotate(-17deg);display:flex;justify-content:space-between}.map-path span{font-size:13px;color:var(--orange);animation:step 3s ease-in-out infinite alternate}.map-path span:nth-child(even){animation-delay:.7s}@keyframes step{from{transform:translateY(0) scale(.7)}to{transform:translateY(-18px) scale(1.4)}}.map-label{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;font:10px 'Arial Narrow',sans-serif;font-weight:900;letter-spacing:.15em}.map-label.top{top:5%}.map-label.bottom{bottom:5%}.map-center{position:absolute;left:30%;top:38%;text-align:center;font-size:clamp(15px,2.5vw,35px);font-weight:900;line-height:1.5;transform:rotate(-8deg)}.map-zone{position:absolute;border:3px solid var(--blue);border-radius:50%;width:23%;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;font-size:clamp(12px,1.7vw,23px);line-height:1.2;font-weight:900;box-shadow:5px 6px 0 var(--blue);transition:transform .25s,background .25s}.map-zone:hover,.map-zone:focus-visible{transform:scale(1.08);outline:3px solid #fff;outline-offset:3px}.map-zone b,.map-zone small{font:10px 'Arial Narrow',sans-serif;letter-spacing:.1em}.map-zone.play{left:10%;top:20%;background:var(--orange);color:#fff}.map-zone.rest{right:7%;bottom:22%;background:#9ac5d3}.map-zone[aria-pressed=true]{background:var(--blue);color:white;transform:scale(1.08)}.map-key{position:absolute;bottom:3%;right:4%;display:flex;gap:15px;font-size:10px;font-weight:bold}.scene{padding:110px 5vw;background:#faf6e8}.scene-head{display:grid;grid-template-columns:20% 1fr 30%;gap:20px;align-items:end;margin-bottom:50px}.scene-head>span,.prepare-head>span,.closing>span{font:11px 'Arial Narrow',sans-serif;font-weight:900;letter-spacing:.16em}.scene-head h2,.prepare-head h2{font-size:clamp(48px,6vw,90px);line-height:1.2;letter-spacing:-.09em;margin:0;font-weight:950}.scene-head>p,.prepare-head>p{font-size:14px;line-height:1.8}.scene-panel{display:grid;grid-template-columns:58% 42%;border:3px solid var(--blue);box-shadow:14px 14px 0 var(--lime)}.scene-image{position:relative;min-width:0;background:#b1cac2}.scene-image img{width:100%;height:100%;min-height:510px;object-fit:cover;display:block}.scene-image span{position:absolute;left:18px;bottom:15px;background:var(--cream);padding:8px;font:10px 'Arial Narrow',sans-serif;letter-spacing:.1em}.scene-copy{padding:5vw 4vw;background:#d4e6e0;display:flex;flex-direction:column;justify-content:center}.scene-copy>span{font:14px 'Arial Narrow',sans-serif;font-weight:900;letter-spacing:.2em;color:#b34d21}.scene-copy h3{font-size:clamp(34px,4vw,62px);line-height:1.25;letter-spacing:-.07em;margin:25px 0}.scene-copy p{font-size:15px;line-height:2}.scene-copy small{font-size:11px;line-height:1.8}.scene-copy a{margin-top:30px;font-weight:900;text-decoration:none;border-bottom:2px solid var(--blue);align-self:start;padding-bottom:8px}.ribbon{padding:25px 5vw;background:var(--orange);color:var(--blue);display:flex;justify-content:space-between;align-items:center;gap:20px;font-weight:900}.ribbon b{font-size:34px}.prepare{padding:110px 5vw;background:#e8e1c8}.prepare-head{display:grid;grid-template-columns:20% 1fr 30%;gap:20px;align-items:end;margin-bottom:55px}.planner{display:grid;grid-template-columns:1fr 41%;gap:5vw}.choice-block{border-top:3px solid var(--blue);padding:28px 0}.choice-block:last-child{border-bottom:3px solid var(--blue)}.choice-block h3{font-size:22px;margin:0 0 20px}.choice-block h3 span{display:inline-grid;place-items:center;background:var(--blue);color:white;border-radius:50%;width:36px;height:36px;margin-right:15px;font-size:13px}.choice-row{display:flex;flex-wrap:wrap;gap:10px}.choice{border:2px solid var(--blue);border-radius:25px;background:transparent;padding:11px 19px;cursor:pointer;font-weight:800;font-size:13px}.choice.active{background:var(--blue);color:#fff}.choice:hover,.choice:focus-visible,#reset:focus-visible{outline:3px solid var(--orange);outline-offset:2px}.memo{background:#fff8e7;border:3px solid var(--blue);border-radius:30px;padding:45px 40px;position:relative;align-self:start;box-shadow:13px 13px 0 var(--orange)}.memo-pin{position:absolute;right:30px;top:-27px;background:var(--orange);color:#fff;border-radius:50%;width:55px;height:55px;display:grid;place-items:center;font-size:34px;transform:rotate(15deg)}.memo>span{font:11px 'Arial Narrow',sans-serif;font-weight:900;letter-spacing:.14em}.memo h3{font-size:39px;letter-spacing:-.08em;margin:28px 0}.memo p{line-height:1.9;font-size:14px}.memo dl{margin:30px 0}.memo dt{font-size:12px;font-weight:900;color:#a64e22;border-top:2px dashed #c5bdaa;padding-top:15px}.memo dd{margin:10px 0 20px;font-size:15px;font-weight:900}.memo button{border:0;background:var(--lime);padding:11px 16px;border-radius:20px;cursor:pointer;font-weight:900}.memo small{display:block;font-size:11px;line-height:1.7;margin-top:25px}.closing{background:var(--blue);color:#fff;text-align:center;padding:110px 6vw}.closing h2{font-size:clamp(50px,8vw,110px);line-height:1.1;letter-spacing:-.1em;margin:25px 0}.closing p{max-width:590px;margin:0 auto 35px;line-height:2;font-size:13px}.closing a{display:inline-block;text-decoration:none;background:var(--orange);border-radius:30px;padding:15px 25px;font-weight:900}footer{padding:25px 5vw;display:flex;justify-content:space-between;gap:20px;font-size:11px}footer a{text-decoration:none}@media(max-width:950px){.hero-grid{grid-template-columns:45% 55%;min-height:600px}.hero-copy{padding:6vw 3vw 5vw}.hero h1{font-size:clamp(65px,9vw,100px)}.map-ring{width:min(53vw,560px)}.scene-head,.prepare-head{grid-template-columns:1fr 1fr}.scene-head>span,.prepare-head>span{grid-column:1/-1}.scene-panel{grid-template-columns:1fr 1fr}.scene-copy{padding:30px}}@media(max-width:700px){.header{height:68px}.brand{font-size:18px}.brand small{font-size:8px}.header nav a:not(:last-child){display:none}.hero-grid{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:50px 7vw 35px}.hero h1{font-size:clamp(68px,17vw,110px)}.hero-copy>p:not(.hero-kicker){font-size:13px}.park-map{padding:25px 0 65px}.map-ring{width:min(82vw,510px);border-width:7px;outline-offset:7px}.map-key{bottom:18px;right:auto;font-size:9px}.map-zone{font-size:clamp(12px,3.4vw,20px)}.map-center{font-size:clamp(13px,4vw,23px)}.scene,.prepare{padding:70px 6vw}.scene-head,.prepare-head{display:block}.scene-head h2,.prepare-head h2{margin:20px 0}.scene-panel{display:block}.scene-image img{min-height:0;aspect-ratio:1.3}.scene-copy{padding:35px}.ribbon span:first-child{display:none}.ribbon{font-size:12px}.planner{display:block}.memo{margin:45px 13px 0}.closing{padding:75px 6vw}footer{flex-direction:column}}@media(max-width:390px){.header{padding:0 4vw}.brand{gap:7px;font-size:16px}.brand-mark{width:30px;height:30px;font-size:22px}.hero-top,.hero-bottom{font-size:9px}.hero h1{-webkit-text-stroke:0}.map-key{font-size:8px}.memo{padding:33px 25px}.memo h3{font-size:31px}.ribbon b{font-size:23px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:701px){.map-ring{width:min(48vw,620px)}}

/* 2026-10-31: a photograph-first field poster for the dog-run sample. */
.hero{background:#f07c36}
.hero-top,.hero-bottom{background:#f5f0de}
.hero-grid{grid-template-columns:minmax(0,64%) minmax(0,36%);min-height:620px}
.hero-photo{margin:0;position:relative;min-width:0;min-height:620px;overflow:hidden;background:#9cbb68}
.hero-photo img{width:100%;height:100%;position:absolute;inset:0;display:block;object-fit:cover;object-position:51% center}
.hero-photo figcaption{position:absolute;left:24px;bottom:24px;background:#f5f0de;color:#183e74;padding:9px 12px;font:900 10px 'Arial Narrow',sans-serif;letter-spacing:.1em}
.hero-copy{background:#f07c36;padding:clamp(45px,5vw,90px) clamp(28px,3.4vw,68px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.hero-kicker{background:#183e74;color:white;transform:rotate(2deg);font-size:12px}
.hero h1{font-size:clamp(61px,6.6vw,100px);line-height:1.06;letter-spacing:-.1em;margin:26px 0 12px;text-shadow:none;color:#183e74;white-space:nowrap}
.hero-tagline{font-size:clamp(21px,2.2vw,33px)!important;line-height:1.4!important;font-weight:900!important;margin:0 0 20px}
.hero-copy>p:not(.hero-kicker):not(.hero-tagline){font-size:13px;line-height:1.85;margin:0;max-width:390px}
.hero-copy>a{background:#183e74;border-radius:0;gap:25px;margin-top:25px;font-size:12px;padding:15px 17px}
.park-guide{display:grid;grid-template-columns:minmax(0,38%) minmax(0,62%);background:#d9e8e5;min-height:700px;overflow:hidden;padding:70px 4vw 80px;gap:2vw}
.park-guide-heading{padding:25px 2vw 0 0;align-self:center}
.park-guide-heading>span{font:900 11px 'Arial Narrow',sans-serif;letter-spacing:.16em}
.park-guide-heading h2{font-size:clamp(49px,5.5vw,83px);line-height:1.13;letter-spacing:-.08em;margin:24px 0}
.park-guide-heading p{font-size:14px;line-height:1.85;max-width:410px}
.park-guide .park-map{min-height:580px}
.park-guide .map-ring{width:min(49vw,580px)}
@media(max-width:950px){.hero-grid{grid-template-columns:59% 41%;min-height:560px}.hero-photo{min-height:560px}.hero h1{font-size:clamp(54px,6.3vw,75px)}.hero-copy{padding:32px}.park-guide{grid-template-columns:36% 64%;padding:50px 3vw}.park-guide .map-ring{width:min(55vw,520px)}}
@media(max-width:700px){.hero-grid{display:flex;flex-direction:column;min-height:0}.hero-photo{min-height:0;height:clamp(255px,58vw,350px)}.hero-photo figcaption{left:12px;bottom:12px;font-size:8px}.hero-copy{padding:31px 6vw 36px}.hero h1{font-size:clamp(66px,16vw,104px);margin:22px 0 8px}.hero-tagline{font-size:25px!important;margin-bottom:12px}.hero-copy>a{margin-top:18px}.park-guide{display:block;padding:65px 6vw 70px}.park-guide-heading{padding:0}.park-guide-heading h2{font-size:clamp(46px,11vw,70px)}.park-guide .park-map{min-height:0;padding:20px 0 55px}.park-guide .map-ring{width:min(82vw,510px)}}
@media(max-width:390px){.hero-photo{height:285px}.hero h1{font-size:68px}.hero-copy{padding:26px 6vw 30px}.hero-copy>p:not(.hero-kicker):not(.hero-tagline){font-size:12px}.hero-top,.hero-bottom{font-size:8px}.park-guide .map-ring{width:80vw}}