/* A quiet storybook surround for wide screens. The phone playfield keeps its own space. */
.desktop-life{display:none}.desktop-logo{display:block;width:100%;height:auto;max-height:160px;object-fit:contain}.swap-blob{position:absolute;z-index:4;left:50%;transform:translateX(-50%);bottom:max(20px,env(safe-area-inset-bottom));padding:10px 14px;border:1px solid #78856988;border-radius:24px;background:#f4eed9df;color:#375445;font:8px var(--mono);letter-spacing:.7px;box-shadow:0 2px 8px #23453516}.swap-blob[hidden]{display:none}.swap-blob:disabled{opacity:.55}.home-active .swap-blob{visibility:hidden}
@media(min-width:701px){.desktop-life{display:block;position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}.desktop-cloud{position:absolute;width:210px;height:65px;border-radius:60%;background:#faf8e6a1;filter:blur(7px);box-shadow:20px -22px 0 0 #faf8e68c,-38px 5px 0 0 #faf8e68c;animation:desktop-drift 40s ease-in-out infinite alternate}.cloud-a{left:-4%;top:24%}.cloud-b{right:-5%;top:48%;animation-duration:53s;animation-direction:alternate-reverse}.cloud-c{left:9%;top:76%;transform:scale(.7);animation-duration:61s;opacity:.5}.sky-visitor{position:absolute;width:100px;height:60px;top:10%;left:-130px;opacity:0;animation:desktop-visitor 64s linear infinite}.desktop-firefly{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff1a7;box-shadow:0 0 12px 4px #e3d58b77;animation:desktop-flicker 7s ease-in-out infinite alternate}.f1{left:6%;top:38%}.f2{left:21%;top:67%;animation-delay:-2s}.f3{right:7%;top:19%;animation-delay:-5s}.f4{right:23%;top:80%;animation-delay:-4s}.f5{left:15%;top:15%;animation-delay:-6s}.editorial h1{width:100%}}
@keyframes desktop-drift{to{translate:70px -16px}}
@keyframes desktop-flicker{0%,15%{opacity:.12;transform:translateY(6px)}70%,100%{opacity:.9;transform:translate(12px,-12px)}}
@keyframes desktop-visitor{0%,72%{left:-130px;opacity:0}75%{opacity:.75}94%{opacity:.75}98%,100%{left:110%;opacity:0}}
@media(prefers-reduced-motion:reduce){.desktop-cloud,.sky-visitor,.desktop-firefly{animation:none!important}.sky-visitor{display:none}}
@media (min-width:701px){
 body{background:#e5eadb url('assets/paper-grain.svg') repeat}
 body:before{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,#dbe3d6a6,#f0efdfed 29%,#f0efdfeb 69%,#d5dfd2a6),url('assets/forest-menu.webp') center/cover;opacity:.8}
 body:after{content:'';position:fixed;inset:0;pointer-events:none;background:url('assets/desktop-botanical.svg') center/100% 100% no-repeat;opacity:.8}
 .shell{position:relative;z-index:1;max-width:1500px;gap:clamp(28px,4vw,68px);padding:24px clamp(28px,4vw,64px)}
 .editorial,.notes{justify-content:center;max-height:100%;padding:12px 0;gap:18px}
 .editorial h1{font-size:clamp(48px,5.2vw,76px);letter-spacing:-4px;margin:10px 0 0;color:#304c40;text-shadow:0 2px #fffa}
 .editorial .edition{display:block;font:9px var(--mono);letter-spacing:2px;color:#68765a}.edition span{display:none}
 .editorial .tagline{display:block;font:italic 21px/1.45 var(--display);margin:0;color:#627459}
 .editorial .sketch{position:relative;transform:none;margin:auto 0 0;background:radial-gradient(ellipse at 50% 65%,#f6f0dba6,transparent 68%);flex-shrink:1;min-height:100px}
 .sketch canvas{width:100%;height:auto;max-height:220px;object-fit:contain}
 .editorial .sketch>span{display:block;font:8px var(--mono);letter-spacing:2px;color:#68765a;margin-top:-12px}
 .editorial .fieldnote{display:block;padding:18px 20px;border:1px solid #78876840;border-radius:3px 20px 5px 15px;background:#fff9e5a6 url('assets/paper-grain.svg');box-shadow:0 7px 22px #34513b0a;transform:rotate(-2deg)}
 .fieldnote>span{font:8px var(--mono);letter-spacing:2px;color:#798464}.fieldnote p{font:17px/1.6 var(--display);margin:10px 0 0;color:#475c49}
 .editorial .desktop-controls{padding:12px 0 0;border-top:1px solid #6c7d5d40;width:100%;font:8px var(--mono);letter-spacing:1px}.desktop-controls>span{display:block;font:13px/1.6 var(--display);letter-spacing:0;color:#6a765e}
 .notes{gap:22px}.notes .zone-index{display:block;margin:0;padding:22px;border:1px solid #78876840;background:#f8f5e5a3;border-radius:32px 4px 24px 5px}.zone-index h2{font:26px/1.14 var(--display);letter-spacing:-.5px;margin:16px 0}.zone-index p{font:15px/1.6 var(--display);color:#68765e;margin-bottom:0}.zone-index>span{font-size:8px;opacity:1;color:#778364}
 .desktop-trail{position:relative;margin:auto 0 0;padding:22px 0 0;border-top:1px solid #6c7d5d40}.trail-arch{width:100%;height:150px;display:block;color:#849578;margin-bottom:14px;overflow:visible}.trail-arch .trail-cloud{animation:drift-cloud 12s ease-in-out infinite alternate;transform-origin:center}.trail-arch .trail-light{animation:trail-glow 4s ease-in-out infinite alternate}
 .desktop-trail>span{font:8px var(--mono);letter-spacing:1.8px;color:#6b7d60}.desktop-trail h3{font:23px/1.2 var(--display);margin:10px 0;color:#3b5544}.desktop-trail p{font:14px/1.6 var(--display);color:#6b785e;margin:8px 0}.desktop-trail progress{display:block;width:100%;height:5px;accent-color:#7d9563;margin:14px 0;background:#cfd8bd;border:0;border-radius:5px}.desktop-trail progress::-webkit-progress-bar{background:#cfd8bd;border-radius:5px}.desktop-trail progress::-webkit-progress-value{background:#7d9563;border-radius:5px}
 .notes .sound-button{margin-top:0;font-size:8px;flex-shrink:0;padding:14px 0}.notes .best{padding-top:14px;flex-shrink:0}.notes .best strong{font-size:17px;letter-spacing:0}
 #game{box-shadow:0 16px 64px #27473130,0 0 0 5px #f4efda99,0 0 0 6px #8e9c7e55}
}
@media(min-width:701px) and (max-width:1050px){.shell{grid-template-columns:minmax(200px,1fr) minmax(340px,450px)}.notes{display:none}.editorial{max-width:320px;justify-self:center}.editorial h1{font-size:58px}.editorial .tagline{font-size:19px}}
@media(min-width:701px) and (max-height:700px){.editorial,.notes{gap:12px}.editorial h1{font-size:49px}.editorial .tagline{font-size:17px}.sketch canvas{max-height:150px}.fieldnote p{font-size:15px}.fieldnote{padding:12px!important}.trail-arch{height:90px}.notes .zone-index{padding:16px}.zone-index h2{font-size:22px}.desktop-trail{padding-top:14px}.desktop-trail h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){.trail-arch .trail-cloud,.trail-arch .trail-light{animation:none}}
@keyframes drift-cloud{to{transform:translateX(8px)}}
@keyframes trail-glow{to{opacity:.35}}
