:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:#503728;background:#fff1de;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #368bb9;outline-offset:2px}[hidden]{display:none!important}
body[data-activity-state]:not([data-activity-state=active])>.intro,body[data-activity-state]:not([data-activity-state=active])>.app{display:none!important}
.activity-status{position:fixed;z-index:10000;inset:0;display:flex;align-items:center;justify-content:center;overflow:auto;padding:calc(24px + env(safe-area-inset-top,0px)) 20px calc(24px + env(safe-area-inset-bottom,0px));background:radial-gradient(ellipse at 12% 8%,#ffe0b2,transparent 58%),linear-gradient(155deg,#fff5e2,#f8e4ce);text-align:center}
.activity-status:focus{outline:none}.activity-status-card{width:min(100%,440px);max-height:100%;overflow:auto;padding:32px 24px;border:1px solid #fffdf6;border-radius:24px;background:#fffaf1;box-shadow:0 14px 50px #986f3d18}
.activity-status-card img{display:block;margin:0 auto 16px;border-radius:50%;object-fit:cover}.activity-status-brand{margin:0 0 20px;color:#96704e;font-size:14px;letter-spacing:1px}.activity-status h1{margin:0 0 14px;color:#bd582f;font-size:26px;line-height:1.4}.activity-status #activity-status-message{margin:0;color:#654732;font-size:20px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-height:480px){.activity-status-card{padding:20px}.activity-status-card img{width:64px;height:64px;margin-bottom:8px}.activity-status-brand{margin-bottom:12px}}

/* Cover layout is owned here. Coordinates are relative to the 776 x 1102 artwork. */
.intro{position:fixed;z-index:3000;inset:0;display:grid;place-items:center;overflow:hidden;background:#fff3d9;isolation:isolate;transition:opacity .45s ease}
.intro.is-leaving{opacity:0;pointer-events:none}
.intro:before{content:"";position:absolute;inset:-40px;z-index:-1;background:url("/cover.webp?v=ff8f2b15e094") center/cover;filter:blur(26px);opacity:.22}
.intro-art{--cover-unit:min(1vw,.70417423dvh);position:relative;width:min(100vw,70.417423dvh);aspect-ratio:776/1102;box-shadow:0 0 55px #76543a20}
.intro-art>img:not(.intro-mascot){display:block;width:100%;height:auto}
.intro-art .intro-mascot{position:absolute;z-index:2;top:58%;left:4%;right:auto;bottom:auto;width:31%;height:29%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 12px #63412c5c);transform:scaleX(-1);transform-origin:50% 100%;animation:intro-mascot-greeting 3.2s ease-in-out infinite alternate;pointer-events:none}
.intro-actions{position:absolute;z-index:5;bottom:6%;left:50%;transform:translateX(-50%);display:grid;gap:7px;justify-items:center;width:92%;text-align:center}
.intro-actions p{margin:0;padding:.3em .8em;border-radius:999px;background:#fff9e6dd;color:#8b4934;font-size:clamp(10px,calc(var(--cover-unit) * 4.2),21px);line-height:1.25;font-weight:900;box-shadow:0 2px 8px #80543a27}
.intro-actions button{max-width:100%;border:2px solid #fff8de;border-radius:999px;background:#de6540;color:#fff;padding:.6em 1.1em;font-size:clamp(11px,calc(var(--cover-unit) * 4.6),23px);line-height:1.2;font-weight:900;white-space:nowrap;box-shadow:0 8px 25px #9447277d;letter-spacing:.02em}
.intro-actions button:hover{background:#c95330}
.intro-actions button:disabled{cursor:progress;opacity:.85}
.intro-actions button[data-error=true]{background:#a64032}
.intro-steam{position:absolute;left:60%;top:49%;width:22%;height:17%;pointer-events:none}
.intro-steam i{position:absolute;bottom:0;width:30%;height:80%;border-left:4px solid #fff9dfb9;border-radius:50%;filter:drop-shadow(1px 1px 1px #9b5f3f66);opacity:0;animation:steam-rise 3.3s ease-out infinite}
@keyframes steam-rise{0%{transform:translateY(13px) scale(.8);opacity:0}20%{opacity:.8}80%{opacity:.35}100%{transform:translateY(-35px) translateX(8px) scale(1.1);opacity:0}}
@keyframes intro-mascot-greeting{from{transform:scaleX(-1) rotate(-2deg)}to{transform:scaleX(-1) rotate(2deg)}}
@media(max-width:750px){.intro{background:#fff8e6 url('/cover-extension.webp?v=e8dca6ed4c25') center center/cover no-repeat}.intro:before{display:none}}
@media(prefers-reduced-motion:reduce){.intro-mascot,.intro-steam i{animation:none!important}.intro{transition:none}}

.intro-boat-cover{position:absolute;left:54.7%;top:31.2%;width:26%;height:7.9%;background:#8acbd4;clip-path:polygon(2% 29%,16% 15%,82% 9%,100% 25%,97% 75%,80% 89%,17% 88%,0 69%);opacity:.98}.intro-boat{position:absolute;left:55.5%;top:31.4%;width:24%;height:8%;overflow:hidden;mask-image:radial-gradient(ellipse 74% 65% at 50% 52%,#000 65%,transparent 100%);animation:boat-drift 8s ease-in-out infinite alternate}.intro-boat img{position:absolute;display:block;width:416.667%;max-width:none;height:auto;left:-228%;top:-393%}.intro-water{position:absolute;left:42%;top:27%;width:45%;height:29%;overflow:hidden;pointer-events:none}.intro-water i{position:absolute;height:2px;background:#e5f9e8af;border-radius:50%;box-shadow:0 0 4px #dff8e6;opacity:0;animation:water-glide 5s linear infinite}.intro-water i:nth-child(1){top:25%;left:9%;width:17%;animation-delay:0s}.intro-water i:nth-child(2){top:37%;left:61%;width:14%;animation-delay:1.1s}.intro-water i:nth-child(3){top:56%;left:24%;width:20%;animation-delay:2.2s}.intro-water i:nth-child(4){top:69%;left:68%;width:15%;animation-delay:3.3s}.intro-water i:nth-child(5){top:79%;left:39%;width:12%;animation-delay:4.2s}.intro-steam{left:60%;top:47%;width:25%;height:19%}.intro-steam i{width:18%;height:85%;border-left-width:3px;animation-duration:3.6s}.intro-steam i:nth-child(1){left:5%;animation-delay:0s}.intro-steam i:nth-child(2){left:21%;animation-delay:.6s}.intro-steam i:nth-child(3){left:37%;animation-delay:1.2s}.intro-steam i:nth-child(4){left:53%;animation-delay:1.8s}.intro-steam i:nth-child(5){left:69%;animation-delay:2.4s}.intro-steam i:nth-child(6){left:85%;animation-delay:3s}@keyframes boat-drift{from{transform:translateX(-9px) translateY(2px) rotate(-1deg)}to{transform:translateX(10px) translateY(-3px) rotate(1deg)}}@keyframes water-glide{0%{transform:translateX(-18px) scaleX(.75);opacity:0}30%{opacity:.75}70%{opacity:.42}100%{transform:translateX(38px) scaleX(1.2);opacity:0}}@media(prefers-reduced-motion:reduce){.intro-boat,.intro-water i{animation:none}}
.intro-water:before{content:"";position:absolute;inset:-25% -10%;background:repeating-linear-gradient(172deg,transparent 0 24px,#e5ffff8a 26px 29px,transparent 31px 53px);mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse 43% 64% at 45% 52%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 43% 64% at 45% 52%,#000 30%,transparent 100%);animation:river-flow 6s linear infinite}.intro-water i{height:7px;border-top:3px solid #f2ffffdf;background:none;box-shadow:0 0 6px #e8ffff;opacity:0}.intro-water i:nth-child(1){top:22%}.intro-water i:nth-child(2){top:36%}.intro-water i:nth-child(3){top:53%}.intro-water i:nth-child(4){top:66%}.intro-water i:nth-child(5){top:80%}@keyframes river-flow{from{transform:translateX(-22px) translateY(-8px);opacity:.55}50%{opacity:.85}to{transform:translateX(24px) translateY(12px);opacity:.55}}@media(prefers-reduced-motion:reduce){.intro-water:before{animation:none}}