@charset "UTF-8";
:root{font-family:"PingFang SC","Microsoft YaHei",sans-serif;color:#28413d;background:#d8debf;font-synthesis:none;--ink:#28413d;--paper:#fbf7e9;--gold:#e6a748;--muted:#798679;--line:#28413d21}*{box-sizing:border-box}body{margin:0;overflow:hidden;overscroll-behavior:none}button{font:inherit;cursor:pointer;touch-action:manipulation;transition:background .18s,transform .18s,box-shadow .18s}button:active{transform:translateY(2px)}button:disabled{cursor:wait;opacity:.6}button:focus-visible{outline:3px solid #d58e36;outline-offset:5px}.hidden{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.masthead{position:fixed;top:max(26px,env(safe-area-inset-top));left:36px;right:36px;display:flex;justify-content:space-between;align-items:center;z-index:5;pointer-events:none}.wordmark{display:flex;align-items:center;gap:12px;filter:drop-shadow(0 1px 10px #fbf7e9a0)}.wordmark strong{font-size:23px;letter-spacing:4px;display:block}.wordmark div>span{display:block;font-size:10px;letter-spacing:2px;margin-top:5px}.sun-seal{width:34px;height:34px;border:2px solid #b88339;border-radius:50%;position:relative;background:#eab957}.sun-seal:after{content:"";position:absolute;inset:9px;border:2px solid var(--paper);border-radius:50%}nav{display:flex;gap:8px;pointer-events:auto}.utility{border:1px solid #fff9;background:#fbf7e9e8;border-radius:30px;color:var(--ink);padding:10px 15px;font-size:12px;box-shadow:0 3px 16px #28413d08}.utility:hover,.secondary:hover{background:#fffdf4}.eyebrow{font-size:11px;letter-spacing:3px;font-weight:600;margin:0;color:#8b6a37}.gate{position:fixed;inset:0;display:flex;align-items:center;padding:100px 7.5vw 55px;pointer-events:none;background:linear-gradient(90deg,#f7f3e6d9 0%,#f7f3e6aa 24%,#f7f3e600 59%)}.intro-card{width:400px;pointer-events:auto}.intro-card h1{font-size:clamp(40px,4.5vw,67px);line-height:1.22;letter-spacing:2px;margin:22px 0;color:#24433d;font-weight:800}.intro-copy{font-size:14px;line-height:2;color:#596e61;margin:0 0 27px}.primary{display:block;width:100%;border:1px solid #24433d;background:#294a42;color:#fffae9;border-radius:15px;padding:17px 24px;letter-spacing:2px;font-weight:600;font-size:16px;box-shadow:0 8px 22px #28413d1c}.primary:hover{background:#365b4e;box-shadow:0 10px 26px #28413d29}.intro-card .primary{max-width:288px}.session-note{display:block;font-size:10px;color:#7c876e;letter-spacing:1px;margin:12px 0 26px}.intro-keys{display:flex;flex-wrap:wrap;gap:12px 18px;max-width:355px;color:#6b7b6a;font-size:11px}.intro-keys span,footer span{display:flex;align-items:center;gap:6px}kbd{font:inherit;font-weight:600;border:1px solid #28413d20;border-bottom-width:2px;border-radius:5px;padding:3px 6px;background:#fffbefad;color:#4e6154}.touch-hint{display:none;font-size:12px;color:#617764;line-height:1.8}.stage-card{position:fixed;top:29px;left:50%;transform:translateX(-50%);width:280px;text-align:center;pointer-events:none}.stage-card>div{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:9px}.stage-card strong{font-size:15px;letter-spacing:1px}.stage-card .eyebrow{font-size:10px;letter-spacing:1px}.stage-card #timer{font-size:12px;font-variant-numeric:tabular-nums}.stage-card>span{display:block;font-size:10px;letter-spacing:2px;margin-top:7px;color:#5e7463}progress,meter{display:block;width:100%;height:5px;border:0;overflow:hidden;border-radius:10px;background:#28413d1c;appearance:none}progress::-webkit-progress-bar{background:#28413d1c;border-radius:10px}progress::-webkit-progress-value{background:#b28b40;border-radius:10px}progress::-moz-progress-bar{background:#b28b40}meter::-webkit-meter-bar{border:0;background:#28413d1c;border-radius:10px}meter::-webkit-meter-optimum-value{background:#578c74;border-radius:10px}meter::-moz-meter-bar{background:#578c74}.health-card{position:fixed;left:36px;bottom:44px;width:254px;background:#fbf7e9ef;border:1px solid #fff9;border-radius:16px;padding:15px 18px;box-shadow:0 6px 30px #28413d0c}.health-card>div:first-child{display:flex;justify-content:space-between;font-size:11px;margin-bottom:9px}.health-card strong{font-size:13px;font-variant-numeric:tabular-nums}.health-card strong span{font-size:10px;color:#91a08c;font-weight:400}.health-card meter{height:8px}.growth{display:flex;align-items:center;gap:9px;margin-top:11px;font-size:10px;color:#74826c;white-space:nowrap}.growth progress{flex:1;height:3px}.growth b{font-weight:600;color:var(--ink)}.skills{position:fixed;right:36px;bottom:44px;display:flex;gap:8px}.skill{display:flex;align-items:center;gap:10px;background:#fbf7e9ef;border:1px solid #fff9;border-radius:14px;padding:12px 16px;min-width:111px}.skill>kbd{font-size:11px;min-width:28px;text-align:center}.skill>span{font-size:11px;line-height:1.6}.skill strong{display:block;font-size:10px;letter-spacing:1px;color:#698669}.skill.wing{background:#f6dfaaef}.skill.cooldown{opacity:.74}.skill.cooldown strong{color:#8c806c;font-variant-numeric:tabular-nums}footer{position:fixed;bottom:14px;left:0;width:100%;display:flex;justify-content:center;gap:20px;color:#526b58;font-size:10px;pointer-events:none}footer kbd{border:0;background:none;padding:0}.overlay{position:fixed;inset:0;z-index:10;display:flex;justify-content:center;align-items:center;padding:24px;background:#183d3659;backdrop-filter:blur(6px)}.panel{width:390px;padding:34px;border-radius:26px;background:var(--paper);box-shadow:0 25px 80px #17332d38;text-align:center;border:1px solid #fff9}h2{font-size:27px;letter-spacing:1px;margin:17px 0 11px}.panel>p:not(.eyebrow),.choice-panel>p:not(.eyebrow){color:#7c8773;font-size:12px;line-height:1.85;margin:0 0 24px}.secondary{border:1px solid var(--line);border-radius:13px;background:transparent;color:#6a7b68;display:block;width:100%;padding:12px 20px;margin-top:10px;font-size:12px}.pause-help{font-size:11px;line-height:2;color:#8d957e;margin-top:22px}.choice-panel{width:min(870px,100%);text-align:center;color:var(--paper)}.choice-panel>.eyebrow{color:#f5d18c}.choice-panel>p:not(.eyebrow){color:#e3e9d8}.choice-panel>small{font-size:11px;letter-spacing:1px;opacity:.7}#cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 22px}#cards button{position:relative;min-height:232px;padding:26px 23px;text-align:left;border:1px solid #fff8;background:var(--paper);border-radius:20px;color:var(--ink);box-shadow:0 14px 26px #17332d13}#cards button:hover{transform:translateY(-5px);background:#fffcef;box-shadow:0 20px 30px #17332d2b}#cards .offer-number{display:block;color:#b69353;font-size:12px;font-weight:600;letter-spacing:2px;margin-bottom:25px}#cards strong{display:block;font-size:19px;margin:0 0 9px;line-height:1.5}#cards .offer-tag{display:block;color:#a08044;font-size:10px;letter-spacing:.5px;margin-bottom:14px}#cards .offer-copy{display:block;font-size:12px;line-height:1.9;color:#7b8773}.result-sun{display:block;width:39px;height:39px;margin:0 auto 22px;border-radius:50%;background:#edb857;box-shadow:0 0 0 9px #edb85722,0 0 0 18px #edb8570b}.result-stats{display:flex;justify-content:space-around;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:19px 0;margin:21px 0}.result-stats strong{display:block;font-size:23px;font-weight:600;margin-bottom:6px}.result-stats span{font-size:10px;color:#8a927e}.panel>.result-build{margin-bottom:22px;font-size:11px;color:#94733f}.toast{position:fixed;left:50%;top:123px;transform:translateX(-50%);padding:11px 20px;border-radius:24px;background:#294a42ee;color:#fff5d8;font-size:12px;letter-spacing:1px;box-shadow:0 6px 22px #183d3614;max-width:80vw;text-align:center;pointer-events:none}#touch-controls{display:none}#error{position:fixed;bottom:10px;left:10px;right:10px;background:#642e24;color:#fff5e4;padding:14px 18px;border-radius:10px;z-index:30;font-size:12px;line-height:1.6}
@media(max-width:900px){.masthead{left:22px;right:22px;top:22px}.wordmark strong{font-size:19px}.wordmark div>span{font-size:9px;letter-spacing:1px}.sun-seal{width:29px;height:29px}.sun-seal:after{inset:7px}.stage-card{width:230px;top:26px}.health-card{left:22px;bottom:45px;width:220px}.skills{right:22px;bottom:45px}.skill{padding:11px;min-width:98px}.gate{padding-left:6vw}.intro-card{width:350px}.intro-card h1{font-size:49px}.wordmark{gap:9px}}
@media(max-width:620px){.masthead{top:max(18px,env(safe-area-inset-top));left:18px;right:18px}.wordmark strong{font-size:19px;letter-spacing:3px}.wordmark div>span{display:none}.utility{padding:8px 11px;font-size:10px}nav{gap:5px}.gate{padding:0 26px 28px;align-items:flex-end;background:linear-gradient(0deg,#f7f3e6fc 0%,#f7f3e6ed 34%,#f7f3e600 72%)}.intro-card{width:100%}.intro-card h1{font-size:42px;line-height:1.15;margin:12px 0}.intro-card h1 br{display:none}.intro-copy{font-size:12px;line-height:1.8;margin-bottom:17px}.intro-card .primary{max-width:none;padding:15px 22px}.session-note{text-align:center;margin:11px 0 18px;font-size:9px}.intro-keys{font-size:9px;gap:9px 13px;max-width:none}.stage-card{top:78px;width:230px}.stage-card>div{margin-bottom:7px}.stage-card>span{font-size:9px}.health-card{left:18px;bottom:41px;width:190px;padding:11px 13px;border-radius:13px}.skills{right:18px;bottom:41px;gap:5px;flex-direction:column}.skill{padding:7px 9px;gap:7px;min-width:95px;border-radius:11px}.skill>span{font-size:10px}.skill>kbd{font-size:9px;min-width:23px;padding:2px 4px}.skill strong{font-size:9px}footer{font-size:8px;gap:11px;bottom:14px}.overlay{padding:19px}.panel{padding:29px 25px;width:min(380px,100%);max-height:calc(100dvh - 38px);overflow:auto}h2{font-size:24px}.choice-panel h2{margin:12px 0}.choice-panel>p:not(.eyebrow){margin-bottom:0}#cards{grid-template-columns:1fr;gap:10px;margin:17px 0}#cards button{min-height:0;padding:17px 18px 17px 49px;border-radius:15px}#cards .offer-number{position:absolute;left:17px;top:20px;margin:0;font-size:11px}#cards strong{font-size:16px;margin:0 0 3px}#cards .offer-tag{font-size:9px;margin:0 0 5px}#cards .offer-copy{font-size:11px;line-height:1.65}.toast{top:143px;font-size:11px;max-width:90vw;white-space:nowrap}}
@media(pointer:coarse){.desktop-hint{display:none!important}.touch-hint{display:block}.session-note{margin-bottom:12px}body[data-view="playing"] #touch-controls{display:block}.health-card{bottom:186px}.skills{bottom:186px}#touch-controls{position:fixed;inset:0;pointer-events:none;z-index:4}#move-pad,#aim-pad{position:absolute;bottom:max(29px,env(safe-area-inset-bottom));width:114px;height:114px;border:1px solid #fbf7e9c0;background:#fbf7e939;border-radius:50%;pointer-events:auto;touch-action:none;box-shadow:inset 0 0 0 16px #fbf7e91f}#move-pad{left:25px}#aim-pad{right:25px}#move-pad i,#aim-pad i{position:absolute;left:calc(50% - 21px);top:calc(50% - 21px);width:42px;height:42px;background:#fbf7e99c;border:1px solid #fff8;border-radius:50%;box-shadow:0 3px 12px #28413d10}#move-pad span,#aim-pad span{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:9px;color:#4f6958}#touch-controls button{position:absolute;bottom:156px;width:47px;height:47px;border-radius:50%;border:1px solid #fff9;background:#fbf7e9dc;color:var(--ink);font-size:10px;pointer-events:auto;touch-action:none}#touch-dash{left:27px}#touch-wings{right:27px;background:#f6dfaadd!important}#touch-charge{right:82px}}
@media(pointer:coarse) and (max-width:620px){.health-card{bottom:auto;top:143px;width:176px;padding:9px 11px}.health-card>div:first-child{font-size:10px;margin-bottom:6px}.health-card strong{font-size:11px}.growth{font-size:9px;margin-top:7px}.skills{display:none}.toast{top:229px}#touch-controls button{bottom:152px}.touch-hint{font-size:10px;text-align:center;margin:0;line-height:1.7}.gate{padding-bottom:max(25px,env(safe-area-inset-bottom))}}
@media(max-height:550px) and (orientation:landscape){.masthead{top:15px}.gate{padding-top:60px;padding-bottom:24px}.intro-card{width:330px}.intro-card h1{font-size:37px;margin:10px 0}.intro-copy{font-size:11px;line-height:1.7;margin-bottom:12px}.intro-card .primary{padding:12px 20px;font-size:14px}.session-note{margin:8px 0 13px}.intro-keys{font-size:9px;gap:8px 13px}.stage-card{top:20px}.health-card{bottom:26px}.skills{bottom:26px}footer{bottom:6px}.panel{padding:23px 28px;max-height:94dvh;overflow:auto}.panel h2{font-size:23px;margin:10px 0}.panel>p:not(.eyebrow){margin-bottom:15px}.pause-help{margin-top:12px}.choice-panel h2{font-size:24px;margin:9px 0}.choice-panel>p:not(.eyebrow){margin-bottom:0}#cards{margin:16px 0}#cards button{min-height:190px;padding:19px}#cards .offer-number{margin-bottom:14px}.result-sun{display:none}.result-stats{padding:12px 0;margin:14px 0}.result-stats strong{font-size:20px}}
@media(pointer:coarse) and (max-height:550px) and (orientation:landscape){.health-card{top:80px;bottom:auto;left:22px;width:185px}.skills{display:none}.touch-hint{font-size:10px;text-align:left}.toast{top:87px}#move-pad,#aim-pad{width:97px;height:97px;bottom:20px}#touch-controls button{bottom:129px;width:42px;height:42px}.stage-card{width:210px}}
@media(prefers-reduced-motion:reduce){button{transition:none}.overlay{backdrop-filter:none}}

/* Keep the title in two intentional lines at every screen width. */
.intro-card h1>span{display:block;white-space:nowrap}
@media(min-width:901px) and (min-height:551px){.intro-card{width:440px}.intro-card h1{font-size:60px}}
@media(max-width:620px){.intro-card h1{font-size:clamp(32px,10vw,42px)}}

/* Desktop status must be readable without enlarging the mobile controls. */
@media(min-width:621px) and (pointer:fine){
  .stage-card{width:300px}
  .stage-card strong{font-size:16px}
  .stage-card .eyebrow,.stage-card>span{font-size:12px}
  .stage-card #timer{font-size:16px}
  .health-card{width:270px}
  .health-card>div:first-child,.health-card strong span,.growth{font-size:12px}
  .health-card strong{font-size:16px}
  .growth b{font-size:14px}
  .skill{min-width:124px}
  .skill>kbd{font-size:12px}
  .skill>span,.skill strong{font-size:14px}
  footer{font-size:12px}
  .intro-keys{font-size:12px;max-width:390px;line-height:1.6}
}
@media(min-width:621px) and (max-width:900px) and (pointer:fine){.stage-card{top:86px}.toast{top:176px}}

/* Small cream backplates keep the top status legible over darker scenery. */
body:not([data-view="title"]) .wordmark{position:relative;isolation:isolate;filter:none}
body:not([data-view="title"]) .wordmark::before,
body:not([data-view="title"]) .stage-card::before{
  content:"";position:absolute;inset:-10px -14px;z-index:-1;pointer-events:none;
  border:1px solid #fff9;border-radius:15px;
  background:linear-gradient(145deg,#fbf7e9f5,#fbf7e9df);
  box-shadow:0 3px 14px #28413d08;
}
body:not([data-view="title"]) .stage-card{isolation:isolate}

.rotate-gate{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:30px;background:rgba(250,246,228,.97);color:#28413d}.rotate-card{width:min(340px,100%);text-align:center}.rotate-card h2{font-size:27px;line-height:1.4;margin:16px 0}.rotate-card p:not(.eyebrow){font-size:14px;line-height:1.9;color:#607365}.rotate-card small{display:block;font-size:12px;color:#7e8a75;margin:22px 0}.rotate-card .secondary{width:100%;padding:13px;margin-top:25px}.rotate-phone{display:block;width:92px;height:48px;border:3px solid #927142;border-radius:11px;margin:0 auto 30px;box-shadow:inset 0 0 0 5px #fbf7e9;background:linear-gradient(120deg,#b4c3a5,#f4cd72);position:relative}.rotate-phone:after{content:"";position:absolute;width:3px;height:15px;right:4px;top:13px;border-radius:3px;background:#927142}.orientation-blocked #touch-controls{display:none!important}

/* Landscape touch HUD leaves the central aiming lane open. */
@media (pointer:coarse) and (orientation:landscape) and (max-height:550px){
 body:not([data-view="title"]) .wordmark{display:none}
 .masthead{top:max(10px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));justify-content:flex-end}
 .utility{min-height:44px;padding:8px 12px;font-size:11px}
 .health-card{top:10px;bottom:auto;left:max(14px,env(safe-area-inset-left));width:180px;padding:9px 12px;border-radius:12px}
 .health-card>div:first-child{margin-bottom:5px}.health-card meter{height:5px}.growth{margin-top:6px}
 .stage-card{top:16px;width:200px}.stage-card>div{margin-bottom:5px}.stage-card>span{display:none}.stage-card strong{font-size:13px}
 .toast{top:80px;font-size:11px;padding:8px 14px}
 .gate{padding:65px 7vw 12px}.intro-card{width:380px}.intro-card h1{font-size:32px;margin:8px 0}.intro-copy{font-size:12px;line-height:1.6;margin-bottom:10px}.session-note{margin:8px 0}.touch-hint{margin:8px 0;font-size:11px}.intro-card .primary{padding:11px 18px}
 .panel{max-height:calc(100dvh - 28px);overflow:auto;padding:20px 28px}.choice-panel{max-height:calc(100dvh - 28px);overflow:auto}.choice-panel h2{font-size:22px;margin:8px 0}.choice-panel>p:not(.eyebrow){margin-bottom:8px}#cards{margin:12px 0;gap:10px}#cards button{min-height:155px;padding:16px}#cards .offer-number{margin-bottom:8px}#cards strong{font-size:16px}#cards .offer-tag{margin-bottom:7px}#cards .offer-copy{font-size:11px;line-height:1.5}
}