*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#333b29;color:#fff8e8;font-family:Arial,"PingFang SC",sans-serif}main{position:relative;height:100svh;min-height:520px;overflow:hidden}canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:manipulation}a{color:inherit;text-decoration:none}header{position:absolute;left:5%;right:5%;top:5%;display:flex;align-items:center;justify-content:space-between;font-size:12px}.brand{font-size:22px;letter-spacing:-1px}.title{position:absolute;left:6%;top:25%;pointer-events:none}.title p{font-size:12px;letter-spacing:.1em}.title h1{font-size:clamp(42px,5vw,82px);line-height:1.4;font-weight:400;letter-spacing:-.04em;margin:20px 0}.story{position:absolute;right:6%;bottom:17%;width:230px;font-size:13px;line-height:1.9}.story p{margin-bottom:24px}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}.story button{display:block;width:100%;text-align:left;border-top:1px solid #ffffff50;padding:13px 0}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible{outline:2px solid #ffe6a9;outline-offset:5px}footer{position:absolute;bottom:4%;left:6%;right:6%;display:flex;justify-content:space-between;font-size:11px;color:#fff4d9}footer button{font-size:11px}@media(max-width:650px){header{left:7%;right:7%;top:4%}.title{top:15%;left:7%}.title p{font-size:11px}.title h1{font-size:36px;margin-top:8px}.title h1 br{display:none}.story{left:7%;right:7%;width:auto;bottom:10%}.story p{font-size:12px;margin-bottom:12px}.story button{padding:9px 0;font-size:12px}.shade{background:linear-gradient(0deg,#14210bdd,transparent 58%)}footer{left:7%;right:7%}}
#life{pointer-events:none}header,.title,.story,footer{z-index:2}.title{text-shadow:0 2px 24px #1a261855}.story{right:5%;bottom:15%;text-shadow:0 1px 10px #10200c}.story p{line-height:1.8}.story button{background:#14200d18}#error{position:absolute;inset:40% 10%;z-index:5}#error[hidden]{display:none}@media(max-width:650px){.title{top:14%}.title h1{font-size:34px}.story{left:7%;right:7%;bottom:10%}footer span{max-width:75%}}
/* A discrete, user-triggered action within the existing meadow. */
.sneeze-stage{position:absolute;inset:0;z-index:1;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility .2s}
#sneeze-film{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.sneeze-shade{position:absolute;inset:0;background:linear-gradient(0deg,#0d150d55,transparent 40%)}
.action-controls{display:none;position:absolute;right:5%;bottom:12%;z-index:3;width:230px}
.action-controls button{display:block;width:100%;text-align:left;padding:13px 0;border-top:1px solid #ffffff60;text-shadow:0 1px 10px #10200c;background:#14200d18}
main[data-scene="loading"] .action-controls,main[data-scene="playing"] .action-controls,main[data-scene="seated"] .action-controls{display:block}
main[data-scene="playing"] .sneeze-stage,main[data-scene="seated"] .sneeze-stage{opacity:1;visibility:visible;pointer-events:auto}
main:not([data-scene="garden"]) .title,main:not([data-scene="garden"]) .story{visibility:hidden}
main[data-scene="seated"] #pause{visibility:hidden}
#sneeze{color:#ffe4aa}
@media(max-width:650px){#sneeze-film{object-position:57.5% 50%}.action-controls{left:7%;right:7%;bottom:10%;width:auto}.action-controls button{padding:10px 0;font-size:13px}.story{bottom:11%}.title{top:12%}}
@media(prefers-reduced-motion:reduce){.sneeze-stage{transition:none}}

/* Continuous butterfly input remains live across every sheep behavior. */
.sneeze-stage{pointer-events:none!important;transition:opacity .18s ease,visibility .18s}
main[data-scene="behavior"] .sneeze-stage{opacity:1;visibility:visible}
#life{z-index:2}header,.title,.story,footer{z-index:3}
main[data-scene="behavior"] .story{visibility:visible;pointer-events:none}
main[data-scene="behavior"] .title{visibility:hidden}
main[data-scene="behavior"] #pause{visibility:visible}
#sneeze-film{position:absolute;width:var(--film-width);height:var(--film-height);left:var(--film-left);top:var(--film-top);object-fit:fill}
footer{gap:20px;align-items:center}footer span{flex:1}footer button{white-space:nowrap}
canvas#garden{touch-action:none}canvas#garden:focus-visible{outline:2px solid #ffe6a9;outline-offset:-5px}
@media(max-width:650px){footer{gap:12px;font-size:10px}footer span{max-width:60%}.story{bottom:12%}}

/* The unified live canvas renders both motion sources, including breathing while waiting. */
main[data-scene="behavior"] .sneeze-stage{opacity:0;visibility:hidden}
.story{pointer-events:none}

.journey-guides{position:absolute;right:5%;top:14%;z-index:4;display:flex;gap:16px;font-size:12px}.journey-guides button{border-bottom:1px solid #fff7d960;padding:8px 0;text-shadow:0 1px 8px #14200c}#fetch-film,#roll-film{display:none}@media(max-width:650px){.journey-guides{right:7%;top:9%;font-size:11px;gap:12px}.story{bottom:13%;font-size:11px}}

.pet-actions{position:absolute;left:6%;bottom:12%;z-index:5;display:flex;gap:10px;flex-wrap:wrap}.pet-actions button{padding:11px 16px;border:1px solid #fff4d970;border-radius:24px;background:#28332080;backdrop-filter:blur(12px);font-size:13px}.pet-actions button[aria-pressed="true"]{background:#fff1cc;color:#30281b}@media(max-width:650px){.pet-actions{left:7%;right:7%;bottom:16%;gap:7px}.pet-actions button{padding:10px 12px;font-size:12px}}

.review-actions{position:absolute;left:6%;bottom:7.7%;z-index:5;font-size:12px;text-decoration:underline;text-underline-offset:4px}.action-review-dialog{width:min(1000px,94vw);max-height:88svh;overflow:auto;border:1px solid #bbaa7c;border-radius:18px;background:#29251e;color:#fff4dc;padding:24px}.action-review-dialog::backdrop{background:#000b}.action-review-dialog video{width:100%;max-height:52vh}.action-review-dialog p{font-size:14px;color:#d7cdb7}.close-review{position:sticky;top:0;float:right;font-size:28px;background:#29251e;border-radius:50%;width:40px;height:40px}.review-frames{display:flex;gap:10px;overflow:auto}.review-frames img{width:48%;object-fit:contain}.review-frames img:only-child{width:100%}@media(max-width:650px){.review-actions{left:7%;bottom:11%}.action-review-dialog{padding:16px}.review-frames img{width:80%}}

@media(max-width:650px){.pet-actions{bottom:17%;max-width:86%;}.review-actions{bottom:11%;}.story{display:none}}

.weather-controls{position:absolute;right:5%;top:20%;z-index:5;display:flex;gap:16px;font-size:12px}.weather-controls button{padding:8px 2px;border-bottom:1px solid transparent;text-shadow:0 1px 6px #14200c}.weather-controls button[aria-pressed="true"]{border-bottom-color:#fff3d4}.weather-controls button:hover{color:#ffe1a3}@media(max-width:650px){.weather-controls{right:7%;top:14%;gap:14px;font-size:12px}}

@media(max-width:650px){.title{top:20%}}
