:root{font-family:system-ui,'PingFang TC','Noto Sans TC','Microsoft JhengHei',sans-serif;color:#293659;background:#c6e5df}*{box-sizing:border-box}body{margin:0;overflow:hidden;overscroll-behavior:none;user-select:none}canvas{display:block;width:100vw;height:100dvh;touch-action:none}button{font:inherit;cursor:pointer;touch-action:manipulation;color:inherit}button:focus-visible{outline:3px solid #e78d3b;outline-offset:4px}#hud{position:fixed;top:max(18px,env(safe-area-inset-top));left:24px;right:24px;display:flex;align-items:flex-start;gap:24px;pointer-events:none}.health{padding:10px 16px;background:#fff8e9;border:2px solid #34456a;border-radius:30px;box-shadow:0 4px #34456a26;display:flex;gap:12px;align-items:center;display:none}.health span{background:#8898c8;border-radius:50%;padding:3px 8px;font-size:24px}.health b{color:#e47f88;letter-spacing:3px;white-space:nowrap;font-size:18px}.boss{width:min(360px,40vw);margin:auto;text-align:center}.boss-label{display:flex;justify-content:space-between;font-size:11px;font-weight:800;margin-bottom:6px}.boss-label span+span{font-weight:400}.track{height:17px;border:2px solid #34456a;background:#fcf5e8;border-radius:20px;padding:3px}.track i{display:block;background:#ed9195;height:100%;border-radius:10px;transition:width .15s;width:100%}.boss small{display:none!important}#pause{pointer-events:auto;border:2px solid #34456a;background:#fff8e9;border-radius:15px;width:46px;height:46px;font-size:22px}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#dcece49c;backdrop-filter:blur(7px);padding:20px;overflow:auto}.card{background:#fffaf0;border:1px solid #fff;border-radius:30px;padding:32px 40px;text-align:center;width:440px;max-width:100%;box-shadow:0 25px 80px #2e546333}.eyebrow{font-size:10px;letter-spacing:3px;font-weight:800;color:#7b8995}.catmark{font-size:48px;color:#7d8cbe;line-height:1.3;margin:14px auto 0}h1{font-size:48px;line-height:1.15;letter-spacing:-2px;margin:8px 0 18px;font-weight:900}p{font-size:14px;line-height:1.9;color:#7b8493}.mission{background:#eaf1e9;padding:16px;border-radius:15px;margin:22px 0;text-align:left;display:grid;gap:5px}.mission span{font-size:10px;color:#87948e;letter-spacing:2px}.mission strong{font-size:16px}.mission small{font-size:11px;color:#74837e}.primary{width:100%;border:0;border-bottom:4px solid #d17c38;background:#f7b365;padding:15px 20px;border-radius:14px;font-weight:800;font-size:16px}.primary:hover{background:#ffc681}.primary span{float:right}.fine{font-size:10px;color:#89928f;margin:14px -5px}.sound{background:none;border:0;font-size:12px;color:#75849a;padding:8px}.prototype{display:block;color:#a0a5a0;font-size:9px;margin-top:10px}.hidden{display:none!important}h2{font-size:28px;margin:20px 0}.secondary{border:1px solid #d2dbd5;background:transparent;border-radius:12px;padding:12px;width:100%;margin-top:10px}.compact{padding:32px}.stats{display:none!important}.stats b{display:block;font-size:25px}.stats span{font-size:10px;color:#929c98}.stick{position:fixed;bottom:max(35px,env(safe-area-inset-bottom));width:112px;height:112px;border:2px solid #ffffffad;background:#f4fffa3a;border-radius:50%;touch-action:none;display:flex;justify-content:center;align-items:center;box-shadow:inset 0 0 25px #fff4;pointer-events:auto}.stick label{position:absolute;bottom:-25px;font-size:10px;letter-spacing:2px;color:#557475;pointer-events:none}.knob{width:54px;height:54px;background:#f7fffb99;border:2px solid #fff9;border-radius:50%;display:grid;place-items:center;font-size:30px;color:#6e9f9f;pointer-events:none;box-shadow:0 4px 8px #547f8022}#move{left:max(34px,env(safe-area-inset-left))}#aim{right:max(34px,env(safe-area-inset-right))}#desktopHint{position:fixed;bottom:20px;left:0;right:0;text-align:center;font-size:11px;color:#648181;pointer-events:none}#desktopHint span{margin:0 12px}#toast{position:fixed;top:110px;left:50%;transform:translateX(-50%);background:#fff8e9e8;border-radius:20px;padding:8px 20px;font-size:12px;white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none}#combo{position:fixed;right:30px;top:100px;font-size:20px;font-weight:900;color:#c9791f;text-shadow:0 1px 0 #fff8e9,0 0 6px #fff8e9;pointer-events:none}body.idle #hud,body.idle #controls,body.idle #desktopHint{display:none}@media(pointer:fine){#controls{opacity:.3}.stick{width:88px;height:88px}}@media(pointer:coarse){#desktopHint{display:none}}@media(max-width:600px){#hud{left:12px;right:12px;gap:10px;top:max(12px,env(safe-area-inset-top))}.health{display:none}.boss{width:auto;flex:1;min-width:0}.boss-label{font-size:10px}.boss-label span+span{display:none}.boss-label #phase{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:90px;display:inline-block}#pause{width:36px;height:36px;font-size:17px}.card{padding:25px}.stick{width:105px;height:105px}#toast{font-size:11px;top:88px}#combo{top:125px;font-size:14px;font-weight:900;color:#c9791f}}@media(max-height:550px){.card{padding:18px 28px;width:560px}.catmark{display:none}h1{font-size:32px;margin:8px 0}h1 br{display:none}p{margin:8px 0}.mission{margin:10px 0;padding:10px}.fine{margin:8px}.prototype{margin:0}.eyebrow{font-size:9px}.stick{width:90px;height:90px;bottom:24px}.stick label{bottom:-18px}.compact{width:400px}h2{margin:10px 0}.stats{margin:15px 0}}

#aim.fire{background:#f7b365;border:3px solid #fff3d9;box-shadow:0 5px 0 #d28c4d,0 8px 24px #a5784429;color:#624b42;font-size:22px;font-weight:900}#aim.fire:active{background:#ffce89;box-shadow:0 2px 0 #d28c4d;transform:translateY(3px)}#aim label{white-space:nowrap;font-size:9px;font-weight:400;letter-spacing:1px}@media(pointer:fine){#controls{opacity:1}#move{opacity:.4}}

.hero-art{display:block;width:150px;height:140px;object-fit:contain;margin:10px auto -3px;filter:drop-shadow(0 8px 8px #64769b18)}.health .avatar{width:38px;height:38px;object-fit:contain;margin:-5px 0}.card{background:#fffaf0f5}.primary:disabled{opacity:.65;cursor:wait}.overlay{background:#dcece455;backdrop-filter:blur(3px)}@media(max-width:600px){.health .avatar{width:25px;height:25px}.hero-art{width:140px;height:125px}}@media(max-height:700px){.hero-art{width:95px;height:90px}.card{padding-top:20px;padding-bottom:20px}h1{font-size:36px;margin:6px 0 10px}.mission{margin:14px 0}}@media(max-height:550px){.hero-art{float:left;width:150px;height:170px;margin:15px 15px 5px 0}.card:after{content:'';display:block;clear:both}.mission{margin:10px 0}.compact .hero-art{float:none}}

#moveZone{position:fixed;inset:0 50% 0 0;z-index:1;touch-action:none}#controls{position:fixed;inset:0;z-index:2;pointer-events:none}#move{pointer-events:none}#move.tracking{transform:translate(-50%,-50%);opacity:1;border-color:#fff;background:#f4fffa55}#move label{white-space:nowrap;letter-spacing:1px;font-size:10px}#move.tracking label{display:none}#hud{z-index:3}.overlay{z-index:10}#toast,#combo{z-index:4;pointer-events:none}body.idle #moveZone{display:none}

/* Input screens can scroll independently in both orientations. */
.overlay{align-items:safe center;padding-top:max(20px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom))}.card{flex-shrink:0}#openWorry{margin-bottom:12px}.worry-card{width:570px;text-align:left}.worry-card h2{margin:12px 0}.worry-card p{line-height:1.7}.field-label{display:block;font-size:13px;font-weight:800;margin:14px 0 8px}textarea{font:inherit;font-size:16px;color:#293659;width:100%;resize:vertical;min-height:70px;border:1px solid #b9cfc6;background:#fffdf8;border-radius:12px;padding:12px;user-select:text;touch-action:auto}textarea:focus-visible{outline:2px solid #dc9145}.input-meta{display:flex;justify-content:space-between;color:#7a8884;font-size:11px;margin-top:5px}.upload{display:block;border:1px dashed #8daaa2;border-radius:12px;padding:14px;margin-top:14px;cursor:pointer;font-size:13px}.upload small{display:block;color:#7a8884;font-size:10px;margin:5px 0}.upload input{max-width:100%;font:inherit;font-size:12px}#attachment{display:flex;align-items:center;gap:10px;margin-top:10px}#attachmentPreview{width:90px;height:75px;object-fit:contain;border-radius:8px;background:#eaf1e9}.privacy{font-size:11px;color:#7a8884}.worry-card .mission p{margin:3px 0}#generationStatus{color:#966027;font-size:13px}#generationStatus:empty{display:none}#planDetails{font-size:13px;line-height:1.8}#planDetails dt{font-weight:800;margin-top:12px}#planDetails dd{margin:2px 0;color:#64736e;overflow-wrap:anywhere}#closeWorry{display:block;margin:12px auto 0}.worry-card .eyebrow{letter-spacing:2px}#toast{max-width:calc(100vw - 24px);white-space:normal;text-align:center}@media(max-height:550px){.worry-card{width:600px}.worry-card h2{font-size:24px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.roster-preview{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:6px 0 16px}.roster-preview figure{margin:0;text-align:center;flex:1;min-width:90px;max-width:130px}.monster-thumb{width:100%;aspect-ratio:1;background-repeat:no-repeat;background-position:center}.roster-preview figcaption{font-size:10px;color:#687b79}.battle-tip{background:#edf2e6;padding:12px;border-radius:12px;font-size:12px!important}.error{font-size:12px;color:#a05e43}.error:empty{display:none}#openWorry{margin-bottom:0}#endText{white-space:pre-line}#game:focus{outline:none}.boss-label{gap:10px}.boss-label #bossName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}.boss-label #phase{white-space:nowrap}#worryPanel .card{margin-block:auto}button:disabled{cursor:wait;opacity:.6}@media(max-height:550px){#menu .card{width:600px}#menu .hero-art{height:210px}#menu .fine{font-size:9px}#hud{top:10px}#toast{top:75px}.roster-preview figure{max-width:95px}.worry-card .mission{margin-top:8px}#worryPanel{padding:12px}}@media(max-width:600px){.boss-label #bossName{max-width:145px}.health b{font-size:12px}#hud{gap:7px}.health{padding:7px}#controls .stick label{font-size:9px}}
#endText{text-wrap:balance;word-break:keep-all;line-break:strict}

:lang(zh-CN){font-family:system-ui,'PingFang SC','Noto Sans SC','Microsoft YaHei',sans-serif}:lang(ja){font-family:system-ui,'Hiragino Sans','Hiragino Kaku Gothic ProN','Noto Sans JP','Yu Gothic UI',Meiryo,sans-serif;line-break:strict}:lang(ko){font-family:system-ui,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',sans-serif;word-break:keep-all}
.lang{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:#75849a;padding:4px 8px}.lang select{font:inherit;color:inherit;background:transparent;border:1px solid #c9d3dc;border-radius:999px;padding:4px 8px;cursor:pointer}.lang select:focus-visible{outline:3px solid #e78d3b;outline-offset:2px}
:lang(ja) h1,:lang(ko) h1{font-size:clamp(28px,8.6vw,48px);letter-spacing:-1px;word-break:keep-all}
