*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{font-family:"Microsoft YaHei","PingFang SC",sans-serif;color:#203e48;background:#a1b8b5;-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{font:inherit;cursor:pointer;border:0}
button:focus-visible,a:focus-visible{outline:3px solid #ee856d;outline-offset:4px}
button:disabled{opacity:.55;cursor:wait}
button[hidden],[hidden]{display:none!important}
#app{position:relative;width:100%;height:100dvh;min-height:0;isolation:isolate;overflow:hidden}
#world{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(15,34,45,.34),transparent 23%,transparent 62%,rgba(18,36,45,.4)),linear-gradient(90deg,rgba(8,37,47,.14),transparent 44%);z-index:1}
.topbar{position:absolute;z-index:10;top:max(26px,env(safe-area-inset-top));left:max(4%,env(safe-area-inset-left));right:max(4%,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:center;gap:12px}
.brand{display:flex;gap:10px;align-items:center;color:#fff4dc;text-decoration:none;font-size:13px;font-weight:700;letter-spacing:.12em;text-shadow:0 2px 8px #142f37a8}
.brand small{display:block;font-size:8px;font-weight:400;letter-spacing:.22em;margin-top:3px;color:#f4e9d1}
.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid #f4d5a3;border-radius:50%;font-family:"STSong","Songti SC","SimSun",serif;font-size:12px;letter-spacing:0;line-height:1.1;text-align:center;background:#233f43a1}
.tools{display:flex;gap:8px}
.tools button{font-size:11px;font-weight:400;background:#203b40b8;color:#f9ead2;padding:9px 11px;border:1px solid #f1d6ad65;border-radius:2px;backdrop-filter:blur(8px)}
.intro{position:absolute;inset:0;z-index:3;pointer-events:none}
.hero-copy{position:absolute;top:17%;left:8%;padding:16px 25px 19px 20px;margin-left:-20px;border-left:2px solid #e0aa76;background:linear-gradient(90deg,#142f3aca,#142f3a00);color:#fff2db;text-shadow:0 2px 14px #10242a}
.eyebrow{font-family:"Trebuchet MS",sans-serif;font-size:10px;font-weight:700;letter-spacing:.18em;display:block}
.eyebrow i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#cf7e64;margin-right:8px;vertical-align:1px}
.hero-copy h1{font-family:"STSong","Songti SC","SimSun",serif;font-weight:700;font-size:clamp(48px,6vw,88px);letter-spacing:.1em;line-height:1.12;margin:20px 0 15px;text-shadow:0 2px 22px #0d2630}
.hero-copy h1 span{color:#c67860}
.hero-copy p{font-size:18px;letter-spacing:.2em;margin:0 0 20px}
.hero-meta{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#f1dfbc;letter-spacing:.14em}
.hero-meta b{font-weight:400;opacity:.5}
.start-dock{position:absolute;bottom:9%;left:8%;width:330px;padding:18px 20px 16px;background:#eee8d8e8;border:1px solid #f8f0d8;box-shadow:0 12px 30px #142d3680;pointer-events:auto}
.intro-caption{display:flex;justify-content:space-between;align-items:baseline;gap:7px;border-bottom:1px solid #afa790;padding-bottom:10px;margin-bottom:12px;font-family:"STSong","Songti SC","SimSun",serif;font-size:16px;font-weight:700;letter-spacing:.06em}
.intro-caption span{font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:9px;font-weight:400;letter-spacing:0;color:#667676}
.session-line{display:flex;justify-content:space-between;font-size:10px;color:#566a69;margin:9px 0 12px}
.session-line span:last-child{letter-spacing:.08em;font-family:"Trebuchet MS"}
.primary{width:100%;min-height:55px;background:#173d49;color:#f8edd6;display:flex;align-items:center;justify-content:space-between;padding:0 19px;border-radius:1px;font-size:15px;letter-spacing:.1em;box-shadow:inset 0 0 0 1px #a8a58b;transition:background .2s,transform .2s}
.primary:hover{background:#31646b;transform:translateY(-1px)}
.primary span{font-size:24px;font-weight:400}
.practice{display:flex;align-items:center;justify-content:space-between;width:100%;padding:11px 0 0;color:#294f52;background:transparent;font-size:12px;border-top:1px solid #c9c9b9;margin-top:7px}
.practice span{font-size:10px;color:#577877}
.control-note{text-align:left;font-size:11px;letter-spacing:.02em;color:#31595b;margin:14px 0 0}
.side-label{position:absolute;right:3%;bottom:25%;writing-mode:vertical-rl;letter-spacing:.22em;font-size:10px;color:#fff1d3;text-shadow:0 2px 7px #102b32}
footer{position:absolute;z-index:8;bottom:max(14px,env(safe-area-inset-bottom));left:4%;right:4%;display:flex;justify-content:space-between;color:#f7f3de;font-size:9px;letter-spacing:.08em}
.loading-panel{position:absolute;z-index:12;top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,84%);text-align:center;background:#f4f5e7ef;padding:36px 26px;border:1px solid #ffffff8c;border-radius:8px;box-shadow:0 15px 80px #43666816}
.loading-panel h1{font-size:26px;margin:18px 0}
.loading-panel p{font-size:12px;color:#688582}
.loading-panel small{font-size:10px;color:#6e8781}
.load-track{height:3px;background:#d3dfd4;margin:24px 0 14px;overflow:hidden}
.load-track i{display:block;height:100%;width:32%;background:#e3a18a;animation:load 1.8s ease-in-out infinite}
@keyframes load{0%{transform:translateX(-100%)}
100%{transform:translateX(420%)}
}
#hud{position:absolute;inset:0;z-index:4;pointer-events:none}
.score-wrap{position:absolute;top:125px;left:5%;display:flex;flex-direction:column}
.score-wrap small{font-size:11px;letter-spacing:.16em}
.score-wrap strong{font-family:Georgia,serif;font-size:51px;font-weight:400;line-height:1.08;letter-spacing:-.06em}
.score-wrap>span{font-size:12px;margin-top:7px;color:#ead4a4}
.timer-wrap{position:absolute;top:123px;right:5%;text-align:right;width:170px}
.timer-wrap>span{font-size:11px;letter-spacing:.1em}
.timer-wrap strong{display:block;font-family:Georgia,serif;font-size:43px;line-height:1.15;font-weight:400}
.timer-wrap small{font-family:"Microsoft YaHei";font-size:12px;margin-left:5px}
.score-wrap,.timer-wrap{isolation:isolate}
.score-wrap::before,.timer-wrap::before{content:"";position:absolute;inset:-8px -12px;z-index:-1;border:1px solid #d7c39b8c;border-radius:1px;background:#1b414bc9;box-shadow:0 5px 18px #122c3680}
.score-wrap,.timer-wrap{color:#fff3d9}
.score-wrap>span,#lives{color:#e9c890}
.progress{height:3px;background:#31535726;margin-top:5px}
.progress i{display:block;background:#c87f67;width:0;height:100%}
#lives{font-size:13px;color:#e9c890;margin-top:9px;letter-spacing:.2em}
.control-pad{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);width:min(370px,72%);height:69px;border-radius:3px;border:1px solid #d4bd8eaa;display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:#173b43d9;color:#fff1cf;pointer-events:auto;touch-action:none}
.control-pad>button{display:grid;place-items:center;flex:none;width:56px;height:56px;background:transparent;color:inherit;font-size:26px;line-height:1;touch-action:manipulation}
.control-pad>div{text-align:center;flex:1}
.control-pad i{display:block;margin:0 auto 8px;width:35px;height:3px;border-radius:6px;background:#f5f6e7}
.control-pad small{font-size:10px;letter-spacing:.12em}
.speed{position:absolute;bottom:9%;right:5%;display:flex;flex-direction:column;align-items:center;color:#fff8e3}
.speed b{font-size:28px;font-family:"Trebuchet MS";font-weight:400}
.speed span{font-size:9px;letter-spacing:.12em}
.character-select{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:8px;margin:0 0 10px}
.character-select button{min-height:48px;border:1px solid #b9b8a6;border-radius:0;background:#f7f4e8;color:#294750;font-size:12px;font-weight:700;text-align:left;padding:7px 10px}
.character-select button i{display:block;font:9px/1 "Georgia",serif;letter-spacing:.14em;color:#9b7556;margin-bottom:4px}
.character-select button[aria-pressed="true"],.character-select button.is-active{border-color:#ba805a;background:#ddc9a9;color:#173d49;box-shadow:inset 0 -3px #ba805a}
.character-detail-line{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 10px}
.character-detail-line button{padding:3px 0;background:none;color:#315b60;font-size:10px;text-decoration:underline;text-underline-offset:3px}
.character-name{overflow:hidden;text-align:center;color:#426566;font-size:10px;font-weight:700;letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap}
.chapter-label{position:absolute;top:106px;left:50%;transform:translateX(-50%);padding:5px 12px;border:1px solid #d3b6848c;border-radius:1px;background:#183b43ae;color:#fff1d6;font-size:10px;font-weight:700;letter-spacing:.1em;white-space:nowrap;backdrop-filter:blur(6px)}
.goal{position:absolute;top:216px;left:5%;width:min(210px,31vw);padding:10px 12px;border-left:2px solid #d08961;background:rgba(255,250,234,.88);color:#254f54;font-size:11px;line-height:1.5;letter-spacing:.02em;border-radius:0 6px 6px 0}
.score-wrap .goal{position:static;margin-top:11px;padding:8px 0 0;border:0;border-top:1px solid #d5c49787;border-radius:0;background:transparent;color:#f2e4c4}
.cargo-track{position:relative;overflow:hidden;height:21px;margin-top:9px;border-radius:12px;background:#e3e1cf;color:#274b4d;text-align:center;font-size:10px;line-height:21px}
.cargo-track i{position:absolute;inset:0 auto 0 0;width:100%;border-radius:12px;background:#a6cfc0;transition:width .15s}
.cargo-track span{position:relative;z-index:1;font-weight:700}
.cargo-track.danger i{background:#eab08a}
.action-jump,.action-boost{position:absolute;right:5%;display:grid;place-items:center;width:66px;height:66px;border-radius:50%;pointer-events:auto;touch-action:manipulation;transition:transform .16s,background .16s;box-shadow:0 8px 26px rgba(30,75,77,.2)}
.action-jump{bottom:7%;background:rgba(238,148,127,.92);color:#244b51;font-size:13px;font-weight:700}
.action-boost{bottom:calc(7% + 78px);overflow:hidden;border:1px solid rgba(255,250,228,.6);background:rgba(37,79,84,.78);color:#fff8e3;font-size:11px;font-weight:700;backdrop-filter:blur(6px)}
.action-jump:active,.action-boost:active{transform:scale(.96)}
#energy-fill{position:absolute;bottom:7px;left:7px;width:0;height:4px;border-radius:4px;background:#f1a28c;pointer-events:none}
.stars{display:flex;justify-content:center;gap:8px;margin:10px 0;color:#df8b70;font-size:23px;letter-spacing:.04em}
#event{position:absolute;top:30%;left:50%;transform:translateX(-50%);max-width:88vw;padding:6px 10px;border-radius:3px;background:#243d45e0;font-size:14px;font-weight:700;line-height:1.45;letter-spacing:.02em;color:#ffe1aa;transition:opacity .3s;white-space:normal;text-align:center}
.choosing-route #event{visibility:hidden}
#countdown{position:absolute;z-index:7;left:50%;top:35%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
#countdown>span{font-size:13px;letter-spacing:.2em}
#countdown strong{display:block;font-family:"Trebuchet MS";font-size:100px;font-weight:400;line-height:1.3;color:#e6a486;text-shadow:0 2px 0 #fff1d8}
#countdown p{font-size:12px;white-space:nowrap}
.modal-wrap{position:absolute;inset:0;z-index:20;background:#2f55513d;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px}
.modal{width:min(420px,100%);max-height:calc(100dvh - 50px);overflow:auto;background:#f7f6e8f5;border:1px solid #fffaf1;border-radius:7px;padding:34px 32px;text-align:center;box-shadow:0 25px 100px #17484733}
.modal h2{font-size:25px;font-weight:600;margin:20px 0 12px;letter-spacing:-.04em}
.modal p{font-size:12px;color:#68807b;line-height:1.8;margin-bottom:24px}
.modal .primary{margin:18px 0 8px}
.text-button{display:block;width:100%;padding:14px 0 0;background:transparent;font-size:12px;color:#59746e}
.secondary{width:100%;border:1px solid #9caf9e;background:transparent;padding:14px 12px;border-radius:4px;font-size:12px;color:#355a56}
.result-score{display:flex;flex-direction:column}
.result-score strong{font-family:"Trebuchet MS";font-size:65px;letter-spacing:-.06em;line-height:1.2}
.result-score>span{font-size:10px;letter-spacing:.2em;color:#809488}
.result-stats{display:flex;justify-content:space-around;margin:24px 0}
.result-stats>div{display:flex;flex-direction:column;gap:8px}
.result-stats strong{font-family:"Trebuchet MS";font-size:21px;font-weight:400}
.result-stats span{font-size:10px;color:#849386}
#share-text{width:100%;height:120px;resize:none;border:1px solid #bacbbf;background:#fffbef;padding:12px;font:12px/1.8 "Microsoft YaHei";color:#41665c;border-radius:3px}
#toast{position:absolute;z-index:50;left:50%;bottom:18%;transform:translateX(-50%);background:#264f52f0;color:#fff8e8;font-size:12px;padding:12px 20px;border-radius:30px;opacity:0;pointer-events:none;transition:opacity .2s;white-space:nowrap}
dialog{width:min(440px,90%);border:0;background:#f8f6e9;border-radius:8px;color:#345953;padding:28px}
dialog::backdrop{background:#24484480;backdrop-filter:blur(6px)}
dialog h2{font-size:21px}
dialog p{font-size:12px;line-height:1.9}
dialog a{font-size:12px;color:#af7052}
dialog .primary{margin-top:24px}
.hit .vignette{background:radial-gradient(ellipse,transparent 35%,#ee806377)}
[data-view="playing"] .vignette{background:linear-gradient(0deg,#23474955,transparent 23%)}

@media(max-width:640px){.topbar{top:max(21px,env(safe-area-inset-top));left:6%;right:6%;align-items:flex-start}
.brand{font-size:14px;gap:9px}
.brand small{font-size:6px}
.brand-mark{font-size:10px;width:36px;height:36px}
.tools{gap:5px;flex-wrap:wrap;justify-content:flex-end;max-width:156px}
.tools button{font-size:9px;padding:8px 9px}
.hero-copy{top:max(112px,14%);left:8%;right:6%;padding:11px 15px 13px 17px}
.hero-copy h1{font-size:clamp(42px,11.5vw,52px);line-height:1.15;margin:12px 0 9px}
.hero-copy p{font-size:13px;margin-bottom:10px;letter-spacing:.14em}
.eyebrow{font-size:8px;letter-spacing:.12em}
.hero-meta{font-size:10px;gap:2px}
.start-dock{bottom:max(6%,48px);left:6%;right:auto;width:88%;padding:14px 16px 13px}
.intro-caption{font-size:14px;margin-bottom:9px;padding-bottom:8px}
.intro-caption span{font-size:8px}
.session-line{font-size:9px;margin-bottom:10px}
.primary{min-height:55px;font-size:14px}
.practice{font-size:11px}
.practice span{font-size:9px}
.control-note{font-size:9px;margin-top:11px;text-align:center}
.side-label{display:none}
.score-wrap{top:101px;left:7%}
.score-wrap strong{font-size:39px}
.score-wrap small{font-size:9px}
.score-wrap>span{font-size:10px}
.timer-wrap{top:99px;right:7%;width:112px}
.timer-wrap>span{font-size:9px}
.timer-wrap strong{font-size:33px}
#lives{font-size:11px}
.control-pad{height:68px;bottom:max(9%,env(safe-area-inset-bottom) + 58px);left:6%;transform:none;width:58%;padding:0 5px}
.control-pad small{font-size:10px;letter-spacing:0}
.speed{top:178px;right:7%;bottom:auto}
.speed b{font-size:22px}
.speed span{font-size:7px}
.character-select{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:8px}
.character-select button{min-height:44px;font-size:11px}
.chapter-label{top:76px;padding:5px 9px;font-size:8px}
.goal{top:181px;left:7%;width:150px;padding:7px 8px;font-size:10px}
.action-jump,.action-boost{right:5%;width:68px;height:68px}
.action-jump{bottom:max(9%,env(safe-area-inset-bottom) + 58px);font-size:12px}
.action-boost{bottom:calc(max(9%,env(safe-area-inset-bottom) + 58px) + 80px);font-size:10px}
#energy-fill{right:7px;bottom:6px;left:7px;height:3px}
.stars{gap:6px;margin:8px 0;font-size:20px}
.modal{padding:26px 23px}
.modal h2{font-size:23px}
.modal p{font-size:11px}
.result-score strong{font-size:56px}
.result-stats{margin:20px 0}
.vignette{background:linear-gradient(180deg,rgba(13,37,46,.34),transparent 38%),linear-gradient(0deg,rgba(17,37,42,.44),transparent 31%)}
#event{top:258px;font-size:13px}
footer{left:6%;right:6%;font-size:8px;bottom:max(16px,env(safe-area-inset-bottom))}
}

@media(orientation:landscape) and (max-height:620px){.hero-copy{top:18%;left:7%;right:auto}
.hero-copy h1{font-size:clamp(30px,6.2vh,34px);line-height:1.16;margin:9px 0}
.start-dock{bottom:6%;left:auto;right:max(7%,env(safe-area-inset-right));width:min(260px,40vw)}
.hero-copy p{font-size:12px;margin-bottom:8px}
.hero-meta{font-size:9px}
.session-line{font-size:9px;margin-bottom:8px}
.primary{min-height:50px;font-size:14px}
.practice{padding-top:9px}
.control-note{margin-top:8px;text-align:left}
.score-wrap,.timer-wrap{top:83px}
.modal{padding:20px}
.modal h2{margin:10px 0}
.result-score strong{font-size:42px}
.result-stats{margin:12px 0}
.result-card p{margin:8px 0}
.control-pad{height:48px;bottom:7%}
.chapter-label{top:76px}
.goal{top:148px}
.action-jump,.action-boost{right:4%;width:58px;height:58px}
.action-jump{bottom:6%}
.action-boost{bottom:calc(6% + 68px)}
}
@media(max-width:420px) and (max-height:720px) and (orientation:portrait){.hero-copy{top:max(112px,16%)}
.hero-copy h1{font-size:35px}
.start-dock{bottom:max(8%,52px)}
.session-line{display:none}
.character-name{margin-bottom:6px}
.control-note{display:block;font-size:9px;margin-top:6px}
.practice{min-height:44px;padding-top:4px}
.primary{min-height:48px}
.control-pad{bottom:max(8%,env(safe-area-inset-bottom) + 52px);left:6%;width:58%;height:64px}
.action-jump,.action-boost{right:5%;width:64px;height:64px}
.action-jump{bottom:max(8%,env(safe-area-inset-bottom) + 52px)}
.action-boost{bottom:calc(max(8%,env(safe-area-inset-bottom) + 52px) + 76px)}
.chapter-label{top:72px}
.goal{top:164px;width:120px}
.speed{top:164px}
}
@media(prefers-reduced-motion:reduce){*{animation-duration:0s!important;transition:none!important}
}

.action-jump span,.action-boost span{font-size:9px;font-weight:400;position:relative;z-index:1}.action-boost b{z-index:1}.action-boost i{opacity:.27}.action-boost.ready{box-shadow:0 0 18px #f8d9ab}.action-jump{align-content:center;gap:3px}.action-boost{align-content:center;gap:4px}.speed{display:none}


.journal-dialog{max-height:88dvh;padding:24px;overflow-y:auto;overscroll-behavior:contain}
.journal-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.journal-heading h2{margin:8px 0 0}.journal-heading button{align-self:flex-start;min-width:44px;min-height:44px;background:transparent;color:#31575a;font-size:28px}
.journal-dialog h3{font-size:14px;margin:24px 0 12px}.journal-dialog p{margin:12px 0;font-size:12px}
.wallet{display:grid;grid-template-columns:1fr auto;align-items:center;background:#e4ebdb;border-radius:8px;padding:16px;font-size:12px}.wallet strong{font-size:28px}.wallet small{grid-column:1/-1;line-height:1.6;color:#527068}
.style-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.style-list button{min-height:76px;padding:12px;border:1px solid #c6d1bc;border-radius:6px;background:#fffbee;color:#31575a;text-align:left}.style-list button[aria-pressed="true"]{border:2px solid #38796c;background:#e9f1df}.style-list button:disabled{cursor:default;opacity:.65}.style-list b,.style-list small{display:block;margin-top:5px}.style-dot{display:inline-block;width:20px;height:6px;border-radius:4px;background:var(--swatch)}
.mission-row{display:grid;grid-template-columns:1fr auto;gap:5px;padding:14px 0;border-bottom:1px solid #dbe0cd;font-size:12px}.mission-row small{grid-column:1;line-height:1.7;color:#627c72}.mission-row>span{grid-column:2;grid-row:1/3;align-self:center;color:#9b613f}.mission-row.completed>span{color:#3b7b69}.journal-dialog .storage-note{font-size:10px;color:#6c7e73;margin-top:24px}.reward-summary{font-size:12px;line-height:1.8;color:#4b715b;background:#e6eddb;border-radius:6px;padding:10px 12px;margin:12px 0}
[data-view="playing"] #journal,[data-view="countdown"] #journal{display:none}
@media(max-width:640px){.tools{max-width:168px}.journal-dialog{padding:20px}.reward-summary{font-size:11px}}

.story-entry{display:block;width:100%;min-height:46px;text-align:left;background:transparent;color:#31575a;border-bottom:1px solid #dbe0cd;font-size:12px}.story-entry:disabled{cursor:default}
#story-dialog{width:min(560px,92%);max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;padding:0;border:1px solid #fff7e8;border-radius:12px;background:#faf6ec;box-shadow:0 24px 80px #163e4855}
.story-art{display:block;width:100%;height:auto;max-height:200px;object-fit:cover;object-position:center 61%;background:#c5d9d3}
.story-body{padding:24px 28px 0}.story-body h2{margin:10px 0;font-size:24px;letter-spacing:.04em}
#story-setting{font-size:11px;color:#6a7970;margin:0 0 20px;line-height:1.8;padding-bottom:15px;border-bottom:1px solid #d7dfd2}
#story-lines p{display:grid;grid-template-columns:34px 1fr;gap:14px;margin:15px 0;font-size:13px;line-height:1.9;color:#294d4e}
#story-lines b{color:#9b634c;font-size:11px;line-height:2.25}
#story-lines .narration{display:block;color:#728179;font-size:11px;padding:0 0 0 48px}
#story-lines .narration b{display:none}
.story-footer{position:sticky;bottom:0;padding:12px 28px 18px;background:#faf6ec;border-top:1px solid #e4e7d9}
.story-footer .primary{margin:0;min-height:46px;justify-content:center;font-size:13px}
#story-reward{margin:20px 0 16px;font-size:11px;line-height:1.8}
#result-story{margin-top:10px}
@media(max-width:640px){.story-art{max-height:154px}.story-body{padding:18px 20px 0}.story-body h2{font-size:21px}#story-lines p{gap:10px;font-size:12px;margin:13px 0}.story-footer{padding:10px 20px 14px}#story-lines .narration{padding-left:44px}}

.action-boost.active:disabled{opacity:1;background:#517b82;box-shadow:0 0 24px #bfece080}

/* 雾钟港主线：单层章节、对白与证据面板。 */
#campaign-dialog{width:min(640px,94vw);max-height:90dvh;overflow:auto;overscroll-behavior:contain;padding:24px;background:#f6f1e7;color:#253e43;border:1px solid #e5d7bb;border-radius:12px;box-shadow:0 28px 90px #102d3f7d}
#campaign-dialog::backdrop{background:#102736b8;backdrop-filter:blur(5px)}
#profile-dialog{width:min(560px,92vw);max-height:90dvh;overflow:auto;position:relative;padding:22px;background:#f6f1e7;color:#263e45}
#profile-dialog[open]{display:grid;grid-template-columns:minmax(0,230px) 1fr;align-items:center;gap:22px}
#profile-art{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px}
#profile-dialog h2{font-size:27px;margin:8px 0}
#profile-dialog p{font-size:13px;line-height:1.7}
#profile-close{position:absolute;right:10px;top:6px;background:none;color:#263e45;font-size:25px}
@media(max-width:640px){#profile-dialog[open]{display:block}#profile-art{display:block;width:min(260px,72vw);margin:4px auto 14px}#profile-dialog h2{font-size:23px}}
#campaign-body{padding:0 4px;text-align:left}
#campaign-body h2{font-size:clamp(22px,4vw,30px);margin:8px 40px 2px 0;color:#263e45}
#campaign-body h3{font-size:15px;margin:20px 0 10px}
#campaign-body p{color:#41595c;margin:10px 0 16px;font-size:13px;line-height:1.8}
#campaign-body .primary,#campaign-body .secondary{margin-top:12px;justify-content:center;min-height:48px}
.campaign-close{position:sticky;float:right;top:0;z-index:2;width:40px;height:40px;font-size:27px;color:#314b50;background:#e7e0d2;border-radius:50%}
.campaign-kicker,.campaign-place,.campaign-step{color:#a7734f;font-size:11px;letter-spacing:.1em}
.campaign-art{width:100%;height:220px;object-fit:cover;border-radius:7px;margin:14px 0 4px;background:#d8d2c5}
.campaign-hook{font-weight:700;color:#264853!important}
.campaign-objective{background:#e6ebdf;border-left:3px solid #b68154;padding:12px;border-radius:4px}
.campaign-chapters{display:grid;gap:10px;margin:22px 0}
.campaign-chapter{min-height:102px;padding:15px 18px;background-position:center;background-size:cover;border:1px solid #9aaea9;border-radius:7px;text-align:left;color:#fff9e9;display:flex;flex-direction:column;justify-content:center;gap:5px}
.campaign-chapter b{font-size:18px}.campaign-chapter span{font-size:11px;line-height:1.5}.campaign-chapter small{font-size:10px;color:#eed7ad}.campaign-chapter:disabled{filter:grayscale(.8);opacity:.55;cursor:default}
.campaign-skills{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.campaign-skill{padding:8px;background:#e5e9dc;border:1px solid #c4d0c7;border-radius:7px;color:#304a4e;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.campaign-skill[aria-pressed=true]{border:2px solid #ac704d;background:#fff6e7}.campaign-skill img{width:52px;height:52px;object-fit:cover;border-radius:50%}.campaign-skill b{font-size:13px}.campaign-skill small{font-size:10px;line-height:1.35}.campaign-skill-detail{color:#96674d!important}
.field-task{padding:16px;border:1px solid #d7c8a9;border-radius:9px;background:#fffcf2}
.field-progress{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.field-progress span{padding:6px 10px;border-radius:16px;background:#e7e3d5;color:#6b766b;font-size:11px}
.field-progress span.current{background:#f1d5a2;color:#614832;font-weight:700}
.field-progress span.done{background:#7dada4;color:#fffdf4}
.field-controls{display:grid;gap:9px}
.field-action{min-height:51px;padding:10px 13px;border:1px solid #afc1b5;border-radius:7px;background:#e9eee3;color:#2d4a4d;text-align:left;font-size:13px;line-height:1.4;touch-action:manipulation}
.field-action:active{background:#d5dfd1}
#campaign-body .field-feedback{margin:14px 0 2px;color:#7a553e;font-size:12px;min-height:25px}
.field-wind-title{color:#405961;font-size:14px}
.field-balance{position:relative;height:34px;margin:6px 12px;border-radius:18px;background:linear-gradient(90deg,#e6bb93,#ded9b3 50%,#9ec8be);box-shadow:inset 0 2px 5px #435e5440}
.field-safe{position:absolute;top:3px;bottom:3px;width:20%;transform:translateX(-50%);border:2px solid #fff7d4;border-radius:13px;background:#fff7c663;box-shadow:0 0 10px #fff6bf}
.field-needle{position:absolute;top:-7px;bottom:-7px;width:5px;transform:translateX(-50%);border-radius:4px;background:#704a36;box-shadow:0 2px 5px #49382a60}
.field-slider{width:100%;height:38px;accent-color:#b87850;touch-action:none}
.field-range-hint{display:block;text-align:center;color:#6b7770;font-size:11px}
.field-lamp{min-height:80px;text-align:center;font-size:16px;font-weight:700;background:radial-gradient(circle,#c1e1db,#416b70);color:#fffaf0;touch-action:none;user-select:none}
.field-lamp.pressed{background:radial-gradient(circle,#fff1a8,#e2a64d);color:#513d28;box-shadow:0 0 22px #f0c670}
.dialogue-stage{position:relative;height:260px;overflow:hidden;margin:14px 0 0;background:#233e48;border-radius:7px 7px 0 0;isolation:isolate}
.dialogue-background{display:block;width:100%;height:100%;object-fit:cover;animation:scene-enter .4s ease-out}
.dialogue-stage::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#17343c94,transparent 60%);pointer-events:none}
.dialogue-location{position:absolute;left:17px;bottom:14px;z-index:2;color:#fff5d7;font-size:11px;letter-spacing:.12em;text-shadow:0 1px 4px #1d333c}
.campaign-portrait{position:absolute;right:18px;bottom:0;z-index:2;width:200px;height:225px;object-fit:cover;object-position:center 28%;border:1px solid #dbc291;border-bottom:0;border-radius:7px 7px 0 0;background:#e8e1d5;box-shadow:0 6px 25px #102a356b;animation:portrait-enter .25s ease-out}
.dialogue-panel{padding:17px 20px 12px;background:#fffaf0;border:1px solid #dccaa9;border-top:3px solid #bb8b57;border-radius:0 0 7px 7px}
.campaign-speaker{display:block;color:#9b684c;font-size:12px;font-weight:700;letter-spacing:.12em}.campaign-line{min-height:90px;font-size:18px!important;line-height:1.8!important;color:#253f48!important}.campaign-step{display:block;text-align:right;color:#87918a;font-size:10px}
@keyframes scene-enter{from{opacity:.75;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}
@keyframes portrait-enter{from{opacity:.5;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.route-status{position:absolute;top:244px;left:50%;transform:translateX(-50%);display:flex;gap:14px;align-items:center;white-space:nowrap;max-width:88vw;padding:6px 12px;border:1px solid #cab58470;background:#173f46cc;color:#ebd6ad;font-size:10px;border-radius:2px}
.route-status b{font-weight:400;color:#c6e1db}.route-status.wind-warning{border-color:#efbb70;background:#594d36e8}.route-status.wind-warning b{color:#ffe3a6}.route-status.gusting b{color:#a6efef}
.route-choice{position:absolute;left:50%;top:32%;transform:translateX(-50%);width:min(390px,88vw);padding:12px;border:1px solid #cfb77b;background:#143a43f2;color:#fff5dd;border-radius:6px;pointer-events:auto;box-shadow:0 8px 30px #112d3850}
.route-choice>div:first-child{display:flex;justify-content:space-between;gap:8px;margin-bottom:10px;font-size:12px}.route-choice>div:first-child span{font-size:10px;color:#ecd29c}
#route-choice-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}#route-choice-options button{display:flex;flex-direction:column;gap:5px;min-height:55px;padding:10px;text-align:left;border:1px solid #b2c3a9;background:#f6f0de;color:#284a4a;border-radius:3px;touch-action:manipulation}#route-choice-options button:first-child{border-color:#d4ac65;background:#ead9b4}#route-choice-options b{font-size:13px}#route-choice-options small{font-size:10px}.route-choice>small{display:block;margin-top:9px;color:#b5cac3;font-size:9px}
#app[data-mode=campaign] .score-wrap strong{font-size:32px}#app[data-mode=campaign] #combo{display:none}
.campaign-evidence-art{width:100%;height:180px;object-fit:contain;background:#e9e5db;border-radius:7px}
.campaign-task-art{width:100%;height:220px;object-fit:cover;object-position:center;border-radius:7px;margin:12px 0 8px;background:#d8d2c5}
.campaign-evidence{display:grid;gap:8px;margin:15px 0}.campaign-evidence-card{display:grid;grid-template-columns:72px 1fr;column-gap:12px;align-items:center;padding:8px;text-align:left;background:#e9eddf;border:1px solid #bfcbbf;border-radius:7px;color:#315158;font-weight:700}.campaign-evidence-card b{font-size:13px}.campaign-evidence-card span{grid-column:2;display:block;margin-top:3px;font-size:12px;font-weight:400;line-height:1.6}.campaign-evidence-thumb{grid-row:span 2;width:72px;height:72px;object-fit:contain;background:#f9f5e8;border-radius:5px}
.campaign-evidence-card[aria-pressed=true]{border:2px solid #a8734d;background:#fff5de}.campaign-evidence-card:disabled{cursor:default;opacity:.78}
.campaign-minigame{padding:12px;border:1px solid #d7c8a9;border-radius:9px;background:#fffcf3}.minigame-intro{margin:2px 0 12px;font-size:13px;line-height:1.65;color:#405a5c}.minigame-status{min-height:28px;margin:12px 0;color:#745037;font-size:12px;line-height:1.6}.minigame-action{width:100%;min-height:48px;margin-top:8px;padding:10px 14px;border:0;border-radius:7px;background:#a8734d;color:#fff9ea;font-weight:700;touch-action:manipulation}
.minigame-tool,.campaign-keepsake{display:flex;align-items:center;gap:12px;margin:9px 0;padding:7px;border-radius:7px;background:#eee7d6;color:#5a5f55;font-size:12px;line-height:1.6}.minigame-tool img,.campaign-keepsake img{width:68px;height:68px;flex:none;object-fit:contain;background:#faf7ed;border-radius:5px}
.minigame-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.minigame-compare-panel{min-width:0;margin:0}.minigame-compare-panel figcaption{padding:5px 0;color:#5e6860;font-size:11px;font-weight:700}.minigame-compare-image{position:relative;cursor:crosshair;touch-action:manipulation}.minigame-compare-image img{display:block;width:100%;aspect-ratio:8/9;object-fit:fill;border:2px solid #b5a584;border-radius:6px;background:#e8dfce;user-select:none}.minigame-compare-image:focus-visible{outline:3px solid #60a9ad}.minigame-spot{position:absolute;display:block;width:19%;aspect-ratio:1;transform:translate(-50%,-50%);border:3px solid #e9aa56;border-radius:50%;box-shadow:0 0 0 4px #fff9d98a,0 0 15px #ffdf9e;pointer-events:none}
.minigame-compare-tabs{display:none;gap:8px;margin:3px 0 8px}.minigame-compare-tab{min-height:44px;flex:1;border:1px solid #b2bbaa;border-radius:6px;background:#e7ecdf;color:#36575b;font-weight:700;touch-action:manipulation}.minigame-compare-tab[aria-pressed=true]{background:#315a61;color:#fff8e8}
.minigame-inspection{margin-top:10px;padding:10px;border:1px solid #c9bea5;border-radius:7px;background:#f0e9d9}.minigame-inspection-label{margin:0 0 8px;color:#415b5d;font-size:11px;font-weight:700}.minigame-inspection-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.minigame-inspection-panel{min-width:0;margin:0}.minigame-inspection-panel canvas{display:block;width:100%;aspect-ratio:1;border:2px solid #a99b7d;border-radius:5px;background:#d5c8ae}.minigame-inspection-panel figcaption{margin-top:4px;color:#5e6860;font-size:11px;text-align:center}.minigame-focus{position:absolute;width:18%;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);border:2px dashed #f2dfaa;border-radius:5px;box-shadow:0 0 0 1px #213b46,0 0 8px #17282e;pointer-events:none}
.minigame-link-board{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.minigame-link-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}.minigame-link-lines path{fill:none;stroke:#ce9c56;stroke-width:5;stroke-linecap:round;opacity:.85;filter:drop-shadow(0 1px 2px #324e60)}.minigame-link-card{position:relative;z-index:1;min-height:118px;padding:6px;border:1px solid #c8c4ae;border-radius:8px;background:#f0ebdc;color:#365257;font-size:11px;font-weight:700;display:flex;flex-direction:column;align-items:center;gap:5px;touch-action:manipulation}.minigame-link-card img{width:min(100%,86px);height:76px;object-fit:contain;border-radius:5px;background:#fffcf4}.minigame-link-card[aria-pressed=true]{outline:3px solid #c6834f;background:#fff2d8}.minigame-link-card.matched{border-color:#7ba9a0;background:#dbe9e3}
.minigame-echo-art{width:100%;height:150px;object-fit:cover;object-position:center;border-radius:7px;margin:2px 0 12px}.minigame-beats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:10px 0}.minigame-beats span{padding:8px 3px;text-align:center;background:#e9e5d7;border-radius:5px;color:#77766c;font-size:10px}.minigame-beats span.played{background:#bfd7d0;color:#294d51;font-weight:700}.minigame-sockets{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:11px 0}.minigame-sockets::before{content:'';position:absolute;left:9%;right:9%;top:50%;height:4px;background:#b89d6c;transform:translateY(-50%)}.minigame-socket{position:relative;z-index:1;min-height:78px;border:2px solid #a8a38a;border-radius:50%;background:radial-gradient(circle,#455e65,#263b48);color:#fff7e9;font-weight:700;box-shadow:0 4px 10px #28414b48;touch-action:manipulation}.minigame-socket small{display:block;margin-top:4px;font-size:10px;font-weight:400}.minigame-socket.lit{border-color:#f1ce83;background:radial-gradient(circle,#fff3b0,#ae774e);color:#4d3d31;box-shadow:0 0 18px #e9c879}.minigame-socket.overlap{background:radial-gradient(circle,#fff8e2,#ad6158)}.minigame-socket:disabled{opacity:1}
.campaign-feedback{color:#a34f3a!important;font-weight:700}.campaign-option{display:block;width:100%;text-align:left;margin:8px 0;padding:13px 15px;border:1px solid #b9c9c1;border-radius:5px;background:#fffbf0;color:#254c52;font-size:13px;line-height:1.5}.campaign-option:hover{background:#e9eee3}
.prompt-card{text-align:left;border-top:4px solid #ba805b}.prompt-card .eyebrow{color:#a66b4e}.prompt-card h2{margin-top:10px}.prompt-card p{font-size:14px;color:#344c50}.prompt-card .campaign-option{min-height:55px}
.campaign-visit-reward{display:block;margin-top:4px;font-size:10px;color:#8d6849;line-height:1.5}
.campaign-storage{font-size:10px!important;color:#81918a!important}
@media(max-width:640px){#campaign-dialog{padding:17px;max-height:94dvh}.campaign-art{height:155px}.campaign-task-art{height:155px}.campaign-chapter{min-height:92px}.dialogue-stage{height:210px}.campaign-portrait{width:152px;height:180px;right:12px}.dialogue-panel{padding:14px 16px 10px}.campaign-line{min-height:80px;font-size:16px!important}.campaign-skill img{width:42px;height:42px}.minigame-link-board{grid-template-columns:repeat(2,minmax(0,1fr))}.minigame-link-card{min-height:110px}.route-status{top:221px;font-size:9px;gap:10px}#app[data-mode=campaign] .speed{display:none}#app[data-mode=campaign] .score-wrap strong{font-size:28px}#app[data-mode=campaign] .score-wrap .goal{font-size:9px;width:142px;margin-top:6px;padding-top:6px}}
@media(max-height:720px) and (orientation:portrait){.dialogue-stage{height:162px}.campaign-portrait{width:125px;height:145px}.dialogue-mode .campaign-place{display:none}.dialogue-mode .campaign-line{min-height:68px}.dialogue-mode .dialogue-panel{padding:11px 14px}.dialogue-mode h2{font-size:21px!important}.route-status{top:207px}#event{top:248px}}
@media(orientation:landscape) and (max-height:620px){.dialogue-stage{height:150px}.campaign-portrait{height:145px;width:130px}.dialogue-panel{padding:10px 16px}.campaign-line{min-height:50px}.route-status{top:224px}}
@media(max-width:480px){.minigame-compare-tabs{display:flex}.minigame-compare{grid-template-columns:1fr}.minigame-compare[data-show=original] .minigame-compare-panel:nth-child(2),.minigame-compare[data-show=copy] .minigame-compare-panel:nth-child(1){display:none}}
