
:root{font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#f8f3dc;background:#102f2b;font-synthesis:none;--gold:#f4d58e;--cream:#f6f0d7;--green:#254b3e}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0}button:focus-visible,a:focus-visible{outline:3px solid #f9db8c;outline-offset:5px}button:disabled{cursor:default;opacity:.4}button{transition:transform .18s,background .18s}button:hover:not(:disabled){transform:translateY(-2px)}button:active{transform:translateY(1px)}[hidden]{display:none!important}.topbar{height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid #d9e4ca1c;background:#173a32;position:relative;z-index:2}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--cream);font-weight:750;font-size:21px;letter-spacing:3px}.brand-icon{color:var(--gold);font-size:44px;line-height:1}.brand-sub{display:block;font-size:8px;letter-spacing:3.5px;margin-top:5px;font-weight:500}.edition{font-size:12px;color:#a6bdb0;letter-spacing:2px}.top-actions{display:flex;gap:23px;align-items:center}.icon-button{width:42px;height:42px;border:1px solid #afc3ad45;border-radius:50%;background:transparent;color:var(--cream);font-size:21px}.text-button{background:transparent;color:var(--cream);font-size:13px;letter-spacing:1px;padding:12px 0}.text-button span{margin-left:20px}main{position:relative;max-width:1800px;margin:auto}#canvas-wrap{position:absolute;top:0;width:100%;height:650px;overflow:hidden;pointer-events:none}canvas{width:100%;height:100%;object-fit:cover;display:block}.home{position:relative;z-index:1;min-height:835px;padding:70px 6% 0;background:linear-gradient(90deg,#123b31e8 0%,#153e3290 34%,transparent 68%)}.hero-copy{width:53%;position:relative}.eyebrow{font-size:10px;letter-spacing:3px;color:#b5c7a7;font-weight:550}.eyebrow i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#d9ca79;margin-right:9px}h1{font-size:clamp(44px,6vw,80px);font-weight:850;line-height:1.2;margin:24px 0 10px;letter-spacing:5px;text-shadow:0 4px 0 #143c2e}h1>span{display:block;color:#f1d389}.title-spark{display:inline-block;color:#b4cc8b;font-size:65px;font-weight:300;vertical-align:middle;margin-left:26px}.subtitle{letter-spacing:7px;font-size:16px;color:#e6e7ca;margin-top:20px}.intro{font-size:14px;line-height:2.1;color:#b6cbb9;margin:21px 0 27px}.hero-actions{display:flex;gap:14px}.primary,.secondary{padding:17px 26px;border-radius:12px;font-size:16px;font-weight:700;min-height:54px}.primary{background:#f1d18c;color:#25493b;box-shadow:0 4px 0 #b4965c}.primary span{margin-left:40px;font-size:22px}.secondary{background:#1c4c3ad9;border:1px solid #bed0ac55;color:#e6ebd4}.home-note{display:flex;gap:18px;font-size:10px;color:#afc5ae;margin-top:23px}.scene-label{position:absolute;right:6%;top:537px;color:#e1e8cd;background:#163e32ab;border:1px solid #bed0ac33;border-radius:30px;padding:11px 19px;font-size:11px;letter-spacing:2px}.little-dot{display:inline-block;width:6px;height:6px;background:#d6d993;border-radius:50%;margin-right:8px}.chapter-strip{position:relative;margin-top:80px;padding:28px 0 27px;border-top:1px solid #bfceb440;display:grid;grid-template-columns:1fr auto;gap:24px}.chapter-strip h2{font-size:20px;letter-spacing:2px;font-weight:500;margin:10px 0 0}.chapter-preview{display:grid;grid-template-columns:repeat(4,1fr);grid-column:1/-1;gap:15px}.preview-card{border:1px solid #a1b59840;border-radius:13px;padding:17px;display:flex;align-items:center;gap:13px;background:#254b3d80;text-align:left;color:var(--cream);position:relative;overflow:hidden}.preview-card .chapter-number{font-size:11px;color:#b9c6ac}.preview-card b{display:block;font-size:13px;margin:4px 0}.preview-card small{font-size:10px;color:#b4c6ae}.preview-card canvas{width:56px;height:55px;flex-shrink:0}footer{display:flex;justify-content:space-between;border-top:1px solid #a8b99c26;padding:22px 6%;font-size:10px;color:#9fb6a4;letter-spacing:1px;background:#15392f;position:relative}body.playing .topbar,body.playing footer{display:none}body.playing main{height:100dvh;max-width:none;overflow:hidden}body.playing #canvas-wrap{position:relative;top:0;margin:auto;width:min(100vw,177.777dvh);height:min(100dvh,56.25vw)}body.playing canvas{object-fit:contain}body.playing #game-ui{position:absolute;inset:0;margin:auto;width:min(100vw,177.777dvh);height:min(100dvh,56.25vw);pointer-events:none;container-type:inline-size}body.playing{background:#102e29;overflow:hidden}.game-top{display:flex;position:absolute;inset:3% 3% auto;align-items:center;gap:15px}.level-card{background:#12392edc;border:1px solid #d8e5c433;border-radius:13px;padding:10px 18px;display:grid;gap:4px}.level-card span{font-size:10px;letter-spacing:2px;color:#bfd1b4}.level-card b{font-size:18px;font-weight:500}.stat-card{margin-left:auto;background:#13392fde;border-radius:14px;padding:12px 20px;display:flex;gap:18px;color:#f2d184;font-size:20px}.round-button{pointer-events:auto;width:48px;height:48px;border-radius:50%;background:#f2dfaa;color:#224332;font-weight:bold;font-size:20px}#boss-hud{position:absolute;top:15%;left:33%;width:34%;text-align:center;font-size:15px;color:#fcf0bd}#boss-hud small{font-size:11px}.meter{height:12px;border-radius:20px;background:#182f2eaa;padding:3px;margin:6px}.meter i{display:block;height:100%;width:100%;background:#e9c877;border-radius:10px}.objective{position:absolute;top:16%;left:3%;font-size:13px;max-width:28%;line-height:1.7;color:#edf0d5;background:#193d329c;border-radius:12px;padding:9px 14px}#toast{position:absolute;top:31%;left:20%;width:60%;text-align:center;font-size:18px;text-shadow:0 2px 7px #000;color:#fff4cf}.controls{position:absolute;bottom:5%;inset-inline:3%;display:flex;justify-content:space-between;align-items:end;pointer-events:none}.controls button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;width:72px;height:72px;border-radius:50%;background:#204e42df;border:2px solid #d5e3bf66;color:#f6efcf;font-size:27px;box-shadow:0 5px 0 #12392b80}.controls small{display:block;font-size:10px;margin-top:0}.move-controls,.action-controls{display:flex;gap:12px;align-items:end}.controls .jump{width:90px;height:90px;background:#ead098;color:#294e3f;border-color:#f7e6b8;font-size:32px}.controls .cast{background:#749c85}.controls .skill{width:65px;height:65px;background:#576c71}.controls button.pressed{background:#a6bd8b;transform:translateY(3px)}.keyboard-note{position:absolute;bottom:0;width:100%;text-align:center;color:#bad0b599;font-size:10px;letter-spacing:1px}dialog{color:#304d3e;background:#f5f0dc;border:1px solid #e7dfb8;border-radius:25px;width:min(920px,94vw);max-height:90dvh;padding:38px;box-shadow:0 24px 100px #051e2cb0}dialog::backdrop{background:#0c2b26b5;backdrop-filter:blur(7px)}.close{position:absolute;right:15px;top:12px;background:transparent;font-size:28px;color:#546e54;width:44px;height:44px}dialog h2{font-size:30px;letter-spacing:2px;margin:10px 0 12px}dialog p{line-height:1.9;color:#6c7d68}dialog .eyebrow{color:#849277}dialog .secondary{color:#355641;background:#e7ead3;border-color:#bac7a3}dialog .primary{margin:8px 8px 5px 0}dialog .text-button{color:#4e6d56}.map-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}.map-card{background:#e7ebd6;border:1px solid #c0ceab;padding:17px 10px;border-radius:16px;text-align:center;color:#335840}.map-card canvas{width:100%;height:82px;object-fit:contain}.map-card b{display:block;font-size:15px;margin:12px 0 6px}.map-card small{font-size:11px;color:#6f8063}.map-card .stars{color:#b58d3e;margin-top:10px;letter-spacing:4px}.partner-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.partner-card{padding:18px 12px;text-align:center;border:1px solid #bfcca9;border-radius:15px;background:#e7ead7}.partner-card.selected{outline:3px solid #87a875}.partner-card canvas{width:100%;height:86px;object-fit:contain}.partner-card h3{margin:8px 0;font-size:17px}.partner-card p{font-size:12px;line-height:1.7}.partner-card button{font-size:12px;padding:10px 18px}.story-portrait{width:165px;height:145px!important;float:right;margin:10px 30px}.modal-actions{margin-top:25px;display:flex;gap:10px;flex-wrap:wrap}.setting{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid #ccd4b5;gap:18px}.setting span{display:block;font-size:12px;color:#7a896d;margin-top:4px}.setting select{padding:12px;background:#e1e7cf;border:1px solid #b8c5a4;border-radius:8px;font:inherit;color:#38563e}.setting input{width:24px;height:24px;accent-color:#58866a}.reward{font-size:46px;color:#caa854;letter-spacing:8px;margin:25px 0}.bestiary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}.bestiary>div{padding:12px;background:#e9ecd9;border-radius:12px;text-align:center}.bestiary canvas{height:65px;object-fit:contain}.bestiary small{font-size:11px;color:#74806a}.bestiary b{display:block;font-size:13px;margin:8px 0}.save-notice{color:#8a542b!important;font-size:12px}.ending-art{height:160px!important;width:100%;object-fit:contain}
@media(min-width:1450px){.home{padding-top:95px}#canvas-wrap{height:760px}.scene-label{top:605px}.chapter-strip{margin-top:110px}}@media(max-width:800px){.edition{display:none}.topbar{height:74px;padding-inline:5%}.home{padding-top:45px;min-height:900px}.hero-copy{width:80%}h1{font-size:58px}.intro{font-size:13px}.home-note{gap:12px;font-size:9px}.scene-label{top:550px;right:5%;font-size:9px}.chapter-strip{margin-top:147px}.chapter-preview{grid-template-columns:repeat(2,1fr)}footer span:last-child{display:none}.map-grid,.partner-grid,.bestiary{grid-template-columns:repeat(2,1fr)}dialog{padding:28px 22px}dialog h2{font-size:24px}.story-portrait{width:110px;margin:10px 0}#canvas-wrap{height:650px}canvas{object-position:61% center}.home{background:linear-gradient(90deg,#153e32d9,transparent)}.stat-card{font-size:16px;padding:8px 12px}.level-card b{font-size:14px}.level-card{padding:6px 12px}.objective{font-size:11px}.controls button{width:58px;height:58px}.controls .jump{width:70px;height:70px}.controls .skill{width:56px;height:56px}.keyboard-note{display:none}}
@media(orientation:portrait){body.playing #canvas-wrap{height:55dvh;width:100vw;top:22dvh}body.playing canvas{object-fit:cover;object-position:center}body.playing #game-ui{height:100dvh;width:100vw}.game-top{top:3%}.objective{top:12%;max-width:60%}.controls{bottom:8%}.controls button{width:56px;height:62px}.move-controls,.action-controls{gap:7px}#toast{top:24%;left:8%;width:84%;font-size:14px}#boss-hud{top:18%;left:18%;width:64%}.stat-card{gap:5px;font-size:14px;padding:10px}.round-button{width:42px;height:42px}.game-top{gap:8px}.level-card b{font-size:12px}.objective{font-size:11px}}@media(prefers-reduced-motion:reduce){button{transition:none}}

#error{position:fixed;bottom:20px;left:10%;right:10%;background:#f2d398;color:#304d3e;padding:20px;border-radius:15px;z-index:100}body.playing .controls{padding-bottom:env(safe-area-inset-bottom)}

@media(orientation:portrait){.stat-card{white-space:nowrap;flex-direction:column;gap:2px;align-items:center}.level-card span{font-size:8px;letter-spacing:1px}.objective{max-width:85%}.controls small{font-size:9px}}
/* Combat 1.1: movement and physical actions flank the four selectable auto skills. */
.support-panel{position:absolute;left:3%;top:26%;pointer-events:auto}.support-panel button{min-height:44px;padding:9px 14px;border-radius:12px;color:#e6efd4;background:#264f40e8;border:1px solid #a7c7ad66;font-size:12px}.support-panel button span:first-child{color:#ecd893;font-size:17px}.auto-skill-panel{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);width:400px;pointer-events:auto}.auto-skill-heading{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:0 4px 8px;color:#f5e9bc;text-shadow:0 2px 5px #183a2e}.auto-skill-heading small{font-size:10px;color:#bed1b8}#skill-selector{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}#skill-selector button{position:relative;min-height:76px;background:#173d33ed;color:#e7eddb;border:1px solid #a2bd9a77;border-radius:12px;overflow:hidden;padding:8px 4px 12px;touch-action:manipulation}#skill-selector .skill-symbol{display:block;font-size:23px;color:var(--element);line-height:1.1}#skill-selector b{font-size:12px;margin-right:2px}#skill-selector small{display:block;font-size:9px;color:#a9c2af;margin-top:4px;white-space:nowrap}#skill-selector .skill-cooldown{font-size:9px;color:var(--element)}#skill-selector button.selected{background:#345b48;border:2px solid var(--element);box-shadow:0 0 0 3px #dfedc815}#skill-selector button.selected:before{content:'✓';position:absolute;top:4px;right:6px;color:var(--element);font-size:12px}#skill-selector button.counter .skill-match{color:#f5df9b}#skill-selector .skill-progress{position:absolute;height:3px;background:var(--element);bottom:0;left:0;transition:width .1s linear}.controls .lift,.controls .pounce{width:68px;height:68px;font-size:21px;background:#34564be8}.controls .lift.available{border-color:#f4d389;box-shadow:0 0 0 3px #f4d38922}.controls .pounce{background:#536d50dd}.boss-title{display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px}.boss-title b{font-weight:600}#boss-phase{font-size:9px;padding:3px 6px;border:1px solid #dccb9266;border-radius:8px;color:#f3daa3}#boss-hud{top:3%;left:33%;width:34%;padding:10px 13px;background:#173b31d9;border:1px solid #a6c09c44;border-radius:15px}#boss-counter{color:#ead595;font-size:11px}#boss-status{color:#b8dfcf;font-size:10px;line-height:1.5;min-height:15px}#boss-move{font-size:12px;line-height:1.6;color:#fae4aa;min-height:19px}.meter{height:10px}#game-ui:has(#boss-hud:not([hidden])) .objective{display:none}#toast{top:40%;font-size:15px}.help-skills{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.help-skills small{display:block;font-size:11px;margin-top:7px}.element-cycle{padding:16px;text-align:center;background:#e7ebd4;border-radius:12px;color:#47634b;font-size:20px;letter-spacing:3px}.stat-card{font-size:17px}.keyboard-note{font-size:9px}
@container (max-width:1000px){.auto-skill-panel{bottom:27%;width:315px}#skill-selector button{min-height:59px;padding-top:5px;padding-bottom:6px}#skill-selector .skill-symbol{display:inline;font-size:20px;margin-right:3px}#skill-selector b{font-size:11px}#skill-selector small{font-size:8px;margin-top:3px}.auto-skill-heading{font-size:10px;margin-bottom:4px}.auto-skill-heading small{font-size:8px}.controls button{width:57px;height:57px}.controls .lift,.controls .pounce{width:55px;height:55px}.controls .jump{width:72px;height:72px}.controls small{font-size:9px}.action-controls,.move-controls{gap:8px}#boss-hud{top:19%;left:35%;width:38%;padding:5px 10px}.boss-title{font-size:12px}#boss-status,#boss-counter{font-size:9px}#boss-phase{font-size:8px}.support-panel{top:34%}.support-panel button{font-size:10px;padding:5px 8px}.objective{font-size:10px;max-width:28%;top:21%;padding:6px 9px}#toast{top:47%;font-size:12px}.level-card{padding:6px 10px}.level-card b{font-size:14px}.stat-card{font-size:14px;padding:8px 10px;gap:8px}.round-button{width:42px;height:42px}.game-top{gap:8px}.keyboard-note{display:none}}
@media(orientation:portrait){.auto-skill-panel{bottom:17%;width:94%}#skill-selector button{min-height:70px}#skill-selector .skill-symbol{display:block;font-size:24px}#skill-selector b{font-size:12px}#skill-selector small{font-size:9px}.auto-skill-heading{font-size:12px;margin-bottom:7px}.auto-skill-heading small{font-size:10px}.controls{bottom:3%;inset-inline:3%}.controls .lift,.controls .pounce{width:48px;height:59px}.controls .jump{width:62px;height:68px}.move-controls button{width:49px;height:59px}.action-controls{gap:6px}.move-controls{gap:6px}.support-panel{left:3%;top:19%}.support-panel button{font-size:10px}#boss-hud{top:12%;left:27%;width:70%;padding:8px 9px}#toast{top:29%;font-size:12px;left:5%;width:90%}.objective{top:12%;max-width:90%;font-size:11px}.game-top{gap:6px}.game-top .round-button{width:34px;height:40px;font-size:18px}.game-top .stat-card{font-size:13px;padding:6px 9px}.game-top .level-card{padding:7px 9px}.element-cycle{font-size:15px;letter-spacing:1px}}

.hero-actions{flex-wrap:wrap}.hero-actions .secondary{padding-inline:19px}

@media(orientation:landscape) and (max-height:500px){.auto-skill-panel{bottom:2%;width:250px}#skill-selector{gap:5px}#skill-selector button{min-height:59px}#skill-selector .skill-symbol{font-size:17px}#skill-selector small{font-size:8px}.auto-skill-heading small{font-size:8px}#boss-hud{top:19%;left:35%;width:38%}.support-panel{top:27%}#toast{top:41%}.controls{bottom:3%}}
@media(orientation:portrait){.game-top .round-button{width:44px;height:44px;flex-shrink:0}}

.game-top .round-button{min-width:44px;min-height:44px}
