/* Take Demi for a walk: page + game styles (loaded only on /walk/) */
.walk-sec{padding:clamp(8px,2vw,20px) 0 clamp(36px,6vw,64px)}
.walk-box{position:relative;border-radius:28px;overflow:hidden;background:#bfe9ff;box-shadow:0 30px 70px -34px rgba(120,30,70,.55),0 0 0 4px #fff,0 0 0 7px var(--pink2)}
.walk-stage{position:relative;height:clamp(340px,64vh,640px);touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:grab}
.walk-stage:active{cursor:grabbing}
.walk-svg{display:block;width:100%;height:100%;font-family:var(--f-h)}
.walk-hud{position:absolute;left:0;right:0;top:0;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;justify-content:space-between;padding:12px 14px;pointer-events:none}
.walk-hearts{display:flex;gap:3px;background:rgba(255,255,255,.88);border-radius:999px;padding:6px 10px;box-shadow:0 4px 14px -6px rgba(0,0,0,.35)}
.walk-hearts i{--f:0;position:relative;width:22px;height:20px;display:block;background:conic-gradient(#ff4fa3 calc(var(--f)*360deg),#f6c9de 0);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54z'/%3E%3C/svg%3E") center/contain no-repeat;transition:background .3s}
.walk-stats{list-style:none;margin:0;padding:6px 12px;display:flex;flex-wrap:wrap;gap:4px 14px;background:rgba(255,255,255,.88);border-radius:16px;font:700 .82rem/1.2 var(--f-h);color:#3b2420;box-shadow:0 4px 14px -6px rgba(0,0,0,.35)}
.walk-stats b{font-weight:900;color:#c81f74;font-variant-numeric:tabular-nums}
.walk-hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);background:rgba(42,24,19,.82);color:#fff;font:800 .9rem/1.2 var(--f-h);padding:.6em 1.1em;border-radius:999px;white-space:nowrap;pointer-events:none;transition:opacity .4s,transform .4s;animation:wh 1.6s ease-in-out infinite}
.walk-hint.gone{opacity:0;transform:translate(-50%,10px);animation:none}
@keyframes wh{50%{transform:translate(-50%,-4px)}}
.walk-controls{display:grid;grid-template-columns:1.6fr repeat(3,1fr) auto;gap:10px;padding:12px;background:var(--card);border-top:3px solid var(--pink2)}
.wbtn{display:flex;align-items:center;justify-content:center;gap:.45em;min-height:56px;border:0;border-radius:18px;font:800 1rem/1.1 var(--f-h);color:#fff;background:var(--pink);box-shadow:0 5px 0 -1px #b3146a,0 10px 20px -12px rgba(200,31,116,.8);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;transition:transform .12s,box-shadow .12s,filter .2s;padding:.5em .8em}
.wbtn .wi{font-size:1.35em;line-height:1}
.wbtn:hover{filter:brightness(1.06)}
.wbtn:active,.wbtn.on{transform:translateY(4px);box-shadow:0 1px 0 -1px #b3146a,0 4px 10px -8px rgba(200,31,116,.8)}
.wbtn:focus-visible{outline:3px solid #ffd36b;outline-offset:3px}
.w-walk{background:linear-gradient(135deg,#ff4fa3,#ff7a59);font-size:1.1rem;touch-action:none}
.w-fetch{background:#25a86b;box-shadow:0 5px 0 -1px #187a4c,0 10px 20px -12px rgba(24,122,76,.8)}
.w-sniff{background:#9b5de5;box-shadow:0 5px 0 -1px #6d36b8,0 10px 20px -12px rgba(109,54,184,.8)}
.w-treat{background:#e8933a;box-shadow:0 5px 0 -1px #b1621b,0 10px 20px -12px rgba(177,98,27,.8)}
.w-snd{background:#fff;color:#3b2420;box-shadow:inset 0 0 0 2.5px var(--pink2),0 4px 10px -8px rgba(0,0,0,.5);min-width:56px}
.w-snd[aria-pressed="true"]{background:var(--bubble);color:var(--pinkink)}
.walk-keys{margin:10px 4px 0;font-size:.85rem;color:var(--ink2);text-align:center}
.walk-keys kbd{font:700 .78rem/1 var(--f-h);background:var(--card);border:1.5px solid var(--pink2);border-radius:6px;padding:.2em .45em}
.walk-more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:8px}
.walk-more a{display:flex;flex-direction:column;gap:6px;background:var(--card);border-radius:22px;padding:18px 20px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow-s);transition:transform .2s}
.walk-more a:hover{transform:translateY(-4px) rotate(-.6deg)}
.walk-more a span{font-size:1.8rem}
.walk-more a b{font:800 1.08rem/1.2 var(--f-h)}
.walk-more a small{color:var(--ink2);font-size:.92rem;line-height:1.45}
@media (max-width:760px){
 .walk-controls{grid-template-columns:repeat(3,1fr) auto;gap:8px;padding:10px}
 .w-walk{grid-column:1/-1;min-height:62px}
 .walk-more{grid-template-columns:1fr}
}
@media (max-width:420px){
 .walk-stage{height:clamp(320px,58vh,560px)}
 .wbtn{font-size:.9rem;min-height:52px;padding:.4em .5em;flex-direction:column;gap:2px}
 .w-walk{flex-direction:row}
 .walk-stats{font-size:.74rem;gap:2px 10px;padding:5px 10px}
 .walk-hearts i{width:18px;height:17px}
 .walk-hud{padding:8px}
}
@media (max-width:300px){.walk-controls{grid-template-columns:repeat(2,1fr)}.w-snd{grid-column:1/-1}.walk-hint{font-size:.78rem}}
@media (orientation:landscape) and (max-height:500px){.walk-stage{height:max(260px,calc(100vh - 150px))}.walk-controls{grid-template-columns:1.6fr repeat(3,1fr) auto}.w-walk{grid-column:auto;min-height:48px}.wbtn{min-height:48px}}

/* ---- park palette (day) ---- */
.walk-svg{--s1:#5fc8ff;--s2:#b9ecff;--s3:#fff1d2;--sun:#fff3a8;--bite:transparent;--starO:0;--cloud:#fff;--cloudO:.92;--shore:#cfe9c4;--water:#3fb3e2;--wline:#fff;--bldg:#fbe9d8;--bldg2:#f6d6c4;--roof:#e8836b;--win:#9fd3ef;--farpalm:#6aa98a;--hedge:#3f9a5a;--midtrunk:#a77a52;--midleaf:#3e9e5b;--lawn:#8fd06a;--stripe:#82c75d;--path:#f7dcb8;--paver:#e9c398;--pathedge:#e2b98a;--trunk:#8a5a3c;--leaf:#4caf63;--leaf2:#3e9a55;--berry:#ff7aa5;--hib:#ff3f7f;--hib2:#ff7aa5;--hibc:#ffd23f;--bench:#c98a56;--hyd:#e8443a;--hyd2:#c22f27;--puddle:#86d4f3;--lamp:#3b4a5a;--bulb:#fff6c9;--glowO:0;--signb:#fff4e0;--signt:#c81f74;--pond:#4fc0e8;--pondr:#b6dfa8;--reed:#3f8f4c;--cattail:#7a4b2f;--duck:#fff;--duckb:#c9a36a;--duckh:#2f8f5b;--sq:#a87b5b;--sqt:#c79a73;--bfw:#ff8cc4;--bfw2:#ffd36b;--tuft:#5fb146;--bub:#fff;--bubt:#3b2420;--note:#c81f74}
.k-s1{stop-color:var(--s1)}.k-s2{stop-color:var(--s2)}.k-s3{stop-color:var(--s3)}
.k-stars{opacity:var(--starO)}.k-sun{fill:var(--sun)}.k-bite{fill:var(--bite)}
.k-cloud{fill:var(--cloud);opacity:var(--cloudO)}
.k-shore{fill:var(--shore)}.k-water{fill:var(--water)}.k-bldg{fill:var(--bldg)}.k-bldg2{fill:var(--bldg2)}.k-roof{fill:var(--roof)}.k-win{fill:var(--win)}
.k-farpalm .k-ptrunk,.k-farpalm .k-pleaf,.k-farpalm .k-coco{fill:var(--farpalm)}
.k-hedge{fill:var(--hedge)}
.k-midpalm .k-ptrunk{fill:var(--midtrunk);stroke:#2a1813;stroke-width:3}.k-midpalm .k-pleaf{fill:var(--midleaf);stroke:#2a1813;stroke-width:2.5}.k-midpalm .k-coco{fill:#7a4b2f}
.k-lawn{fill:var(--lawn)}.k-stripe{fill:var(--stripe);opacity:.55}.k-path{fill:var(--path)}.k-pathedge{fill:var(--pathedge)}.k-paverl{stroke:var(--paver)}
.k-trunk{fill:var(--trunk)}.k-leaf{fill:var(--leaf)}.k-leaf2{fill:var(--leaf2)}.k-berry{fill:var(--berry)}
.k-hib{fill:var(--hib)}.k-hib2{fill:var(--hib2)}.k-hibc{fill:var(--hibc)}
.k-bench{fill:var(--bench)}.k-hyd{fill:var(--hyd)}.k-hyd2{fill:var(--hyd2)}.k-puddle{fill:var(--puddle)}
.k-lamp{fill:var(--lamp)}.k-bulb{fill:var(--bulb)}.k-glow{opacity:var(--glowO)}
.k-signb{fill:var(--signb)}.k-signt{fill:var(--signt);font-family:var(--f-h)}.k-signp{fill:var(--signt)}
.k-pond{fill:var(--pond)}.k-pondr{fill:var(--pondr)}.k-reed{stroke:var(--reed)}.k-cattail{fill:var(--cattail)}
.k-duck{fill:var(--duck)}.k-duckb{fill:var(--duckb)}.k-duckh{fill:var(--duckh)}
.k-sq{fill:var(--sq)}.k-sqt{fill:var(--sqt)}.k-bfw{fill:var(--bfw)}.k-bfw2{fill:var(--bfw2)}
.k-tuft{fill:var(--tuft)}
.k-bub{fill:var(--bub)}.k-bubt{fill:var(--bubt);font-family:var(--f-h)}
.k-sniff{fill:#7a4b2f;font-family:var(--f-h);font-style:italic}.k-note{fill:var(--note);font-family:var(--f-h)}

/* ---- nap mode: golden-hour → evening park ---- */
:root[data-theme="dark"] .walk-svg{--s1:#1e2463;--s2:#6a3f8f;--s3:#ff9a76;--sun:#fff6d8;--bite:#3a2f78;--starO:.9;--cloud:#c9a6d9;--cloudO:.45;--shore:#4d5f86;--water:#3a4f9a;--bldg:#e8c6a8;--bldg2:#d9a98e;--roof:#a55a52;--win:#ffd36b;--farpalm:#2f3f6a;--hedge:#2d6b46;--midtrunk:#6e5040;--midleaf:#2b6b48;--lawn:#4f8a4a;--stripe:#478045;--path:#c9a98a;--paver:#b38f6e;--pathedge:#a8845f;--trunk:#5e3d2a;--leaf:#2f7a4a;--leaf2:#276b40;--puddle:#5f7fc4;--lamp:#20283a;--bulb:#ffe9a0;--glowO:1;--signb:#f3e2c9;--pond:#3d5aa8;--pondr:#4f7f55;--tuft:#3f7f3b}
:root[data-theme="dark"] .walk-box{background:#2a2f6e}
@media (prefers-color-scheme:dark){
 :root:not([data-theme="light"]) .walk-svg{--s1:#1e2463;--s2:#6a3f8f;--s3:#ff9a76;--sun:#fff6d8;--bite:#3a2f78;--starO:.9;--cloud:#c9a6d9;--cloudO:.45;--shore:#4d5f86;--water:#3a4f9a;--bldg:#e8c6a8;--bldg2:#d9a98e;--roof:#a55a52;--win:#ffd36b;--farpalm:#2f3f6a;--hedge:#2d6b46;--midtrunk:#6e5040;--midleaf:#2b6b48;--lawn:#4f8a4a;--stripe:#478045;--path:#c9a98a;--paver:#b38f6e;--pathedge:#a8845f;--trunk:#5e3d2a;--leaf:#2f7a4a;--leaf2:#276b40;--puddle:#5f7fc4;--lamp:#20283a;--bulb:#ffe9a0;--glowO:1;--signb:#f3e2c9;--pond:#3d5aa8;--pondr:#4f7f55;--tuft:#3f7f3b}
 :root:not([data-theme="light"]) .walk-box{background:#2a2f6e}
}
@media (prefers-reduced-motion:reduce){.walk-hint{animation:none}}