:root{color-scheme:dark;--ink:#edf0dd;--muted:#a9b9b6;--gold:#ecc47d;--dark:#15232c;--panel:#20333b;--line:#6a817866;--green:#b0ce98;--red:#e88d80;font-family:"Microsoft JhengHei","PingFang TC",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:#101b23;color:var(--ink);display:grid;place-items:center;overscroll-behavior:none}button,input,select{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button:disabled{opacity:.46;cursor:not-allowed}button{touch-action:manipulation}button:hover:not(:disabled){filter:brightness(1.12)}button:active:not(:disabled){transform:translateY(2px)}[hidden]{display:none!important}
#game-shell{width:min(1280px,100vw);height:min(720px,100dvh);aspect-ratio:16/9;position:relative;overflow:hidden;background:#273e55;box-shadow:0 24px 100px #0008;border:1px solid #45605b55}#scene{position:absolute;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}#screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:22px;z-index:5;background:linear-gradient(115deg,#10202ccb,#10202c65)}#screen:empty{display:none}#hud{position:absolute;inset:0;z-index:2;pointer-events:none;padding:14px}#hud button{pointer-events:auto}
.eyebrow{font-size:11px;letter-spacing:3px;color:var(--gold);font-weight:700;margin:0 0 9px}.brand{display:flex;align-items:center;gap:9px;color:var(--gold);font-weight:800;letter-spacing:2px}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--gold);transform:rotate(45deg);font-size:18px}.brand-mark span{transform:rotate(-45deg)}.panel{width:min(760px,100%);max-height:100%;overflow:auto;background:linear-gradient(145deg,#263d43f5,#1a2c35f5);border:1px solid #81978977;box-shadow:7px 7px 0 #0b182e77;padding:25px;scrollbar-width:thin;scrollbar-color:#79988d #1b2e36}.panel.wide{width:min(1050px,100%)}.panel.small{width:min(520px,100%)}.panel h1,.panel h2{margin:0;font-size:28px;letter-spacing:2px}.panel h3{margin:0 0 10px;font-size:16px}.panel p{line-height:1.7;color:var(--muted);font-size:14px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:20px}.panel-head .eyebrow{margin-bottom:5px}.back{border:1px solid var(--line);background:#152a32;padding:9px 15px;font-size:13px}.divider{height:1px;background:var(--line);margin:18px 0}.row{display:flex;gap:10px;align-items:center}.row.wrap{flex-wrap:wrap}.btn{border:1px solid #aabd9566;background:#354e4c;padding:12px 18px;font-weight:700;min-height:44px;text-align:center;box-shadow:0 3px 0 #11282d;transition:filter .15s}.btn.primary{background:var(--gold);border-color:#f5d79b;color:#26312e;box-shadow:0 4px 0 #98784b}.btn.ghost{background:#1a2c35}.btn.danger{background:#7a4140;border-color:#d7847488}.btn.full{width:100%}.muted{color:var(--muted);font-size:13px}.tag{display:inline-block;border:1px solid #c3d2a433;padding:4px 8px;font-size:11px;letter-spacing:1px;color:#c9d6b8}.note{border-left:3px solid var(--gold);background:#15283299;padding:11px 14px;font-size:13px;color:#d6dfca;line-height:1.7;margin:15px 0}.pill{background:#132a32;border:1px solid #9ab39b44;padding:5px 9px;color:var(--gold);font-size:12px;white-space:nowrap}
.title-screen{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:16px 32px}.title-main{max-width:540px;margin:auto 0}.title-main h1{font-size:clamp(36px,7vw,76px);line-height:1.2;letter-spacing:8px;margin:16px 0;color:#f2e5bf;text-shadow:4px 4px 0 #132532}.title-main .subtitle{color:#c3d7d1;font-size:17px;letter-spacing:4px;margin-bottom:25px}.title-main p{color:#b3c9c5;line-height:1.9;font-size:14px;max-width:380px}.title-actions{display:flex;gap:12px;margin:22px 0 15px}.title-actions .btn{min-width:145px}.title-bottom{display:flex;justify-content:space-between;font-size:11px;color:#a3bcb5;gap:10px;flex-wrap:wrap}.title-bottom .row{gap:7px}.ghost-icon{width:38px;height:38px;display:grid;place-items:center;font-size:17px;background:#152b32aa;border:1px solid var(--line)}
.form-grid{display:grid;grid-template-columns:1fr 220px;gap:24px}.field{display:block;margin-bottom:16px;font-size:13px;color:var(--muted)}.field strong{display:block;color:#dce4cf;font-size:14px;margin-bottom:8px}input[type=text],select{width:100%;background:#14272f;border:1px solid #78948988;color:#edf0dd;padding:11px 12px;border-radius:0}fieldset{margin:0 0 17px;padding:0;border:0}legend{font-size:14px;font-weight:700;margin-bottom:9px}.choices{display:flex;gap:7px}.choice{flex:1;background:#172a33;border:1px solid #6a837b66;padding:10px 7px;font-size:13px;text-align:center}.choice.selected{border-color:var(--gold);background:#4b5141;color:#ffe4aa;box-shadow:inset 0 -3px 0 var(--gold)}.choice small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.portrait{background:radial-gradient(ellipse at center,#54756555,#182a32);border:1px solid var(--line);padding:16px;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}.portrait canvas{width:140px;height:160px;image-rendering:pixelated}.portrait .name{font-size:20px;font-weight:800;margin:8px 0}.portrait .tag{margin-bottom:10px}.profile-stats{font-size:13px;color:#d4dfc9;line-height:1.8}.stats-numbers{display:flex;gap:16px;justify-content:center}.stats-numbers b{font-size:22px;color:var(--gold)}
.camp-grid{display:grid;grid-template-columns:230px 1fr;gap:20px}.camp-actions{display:grid;grid-template-columns:1fr 1fr;gap:11px}.action-card{min-height:100px;padding:17px;text-align:left;border:1px solid #9fb7a966;background:#30484a;box-shadow:0 4px 0 #142a30;display:flex;flex-direction:column;justify-content:center;gap:8px}.action-card:first-child{grid-column:1/-1;background:linear-gradient(110deg,#d6b572,#efd295);color:#253537;min-height:85px}.action-card strong{font-size:17px}.action-card span{font-size:12px;line-height:1.6;color:#c3d5ca}.action-card:first-child span{color:#566550}.seal-row{display:flex;gap:7px;align-items:center;margin:16px 0 12px}.seal{width:32px;height:32px;display:grid;place-items:center;border:1px solid #aabdab55;background:#132832;font-weight:bold;font-size:13px;opacity:.45}.seal.done{background:#49664f;border-color:#b6d491;color:#dcecba;opacity:1}.seal-row .muted{margin-left:auto}.camp-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;font-size:12px;color:var(--muted)}.camp-footer select{width:145px;padding:7px;font-size:12px}
.world-map{display:grid;grid-template-columns:1fr 180px 1fr;grid-template-rows:155px 155px;gap:12px;position:relative}.region-card{position:relative;overflow:hidden;border:1px solid var(--region);background:linear-gradient(115deg,#172b31, var(--shade));padding:15px;text-align:left;display:flex;flex-direction:column;justify-content:center;min-height:140px}.region-card .loc{font-size:10px;letter-spacing:2px;color:var(--region);margin-bottom:7px}.region-card strong{font-size:20px;margin-bottom:7px;z-index:1}.region-card .boss-label{color:#d0ded0;font-size:12px;z-index:1}.region-card .badge{position:absolute;right:9px;top:8px;font-size:10px;background:#20392b;padding:4px 6px;color:#d4e8a8}.region-card canvas{position:absolute;right:-6px;bottom:-4px;width:145px;height:108px;image-rendering:pixelated;opacity:.5}.region-card .explore{font-size:11px;color:var(--region);margin-top:13px;z-index:1}.region-card.snow{grid-column:1;grid-row:1}.region-card.fire{grid-column:3;grid-row:1}.region-card.water{grid-column:3;grid-row:2}.region-card.thunder{grid-column:1;grid-row:2}.region-card.ancient{grid-column:2;grid-row:1/3;text-align:center;align-items:center;background:linear-gradient(160deg,#4b4941,#202b33);border-color:#dec18055}.region-card.ancient canvas{right:auto;bottom:70px;opacity:.35;width:160px;height:150px}.region-card.ancient strong{font-size:20px}.region-card.ancient .boss-label{margin-top:95px}.region-card.ancient:disabled{opacity:.7}.region-card.ancient .explore{white-space:normal;line-height:1.7}
.weapon-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.weapon-card{border:1px solid var(--line);background:#172b33;padding:17px}.weapon-card .weapon-name{font-size:18px;font-weight:800;color:var(--weapon);display:flex;align-items:center;gap:12px}.blade-icon{display:inline-block;width:8px;height:35px;background:var(--weapon);border-right:2px solid #f9f4dc;transform:rotate(30deg);margin:2px 12px}.weapon-card p{font-size:12px;margin:8px 0}.recipe{font-size:12px;line-height:1.9;color:var(--muted);margin:10px 0}.recipe .enough{color:#c3df9b}.weapon-card .btn{padding:9px 12px;font-size:13px;width:100%}.inventory{display:flex;flex-wrap:wrap;gap:9px;margin-top:15px}.inventory span{background:#152a31;padding:8px;border:1px solid var(--line);font-size:12px;color:#c3d6c9}.pack-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.pack-card{border:1px solid var(--line);background:#172b32;padding:20px}.pack-card h3{font-size:19px}.pack-card.health h3{color:#f5a699}.pack-card.stamina h3{color:#c4db98}.pack-line{display:flex;justify-content:space-between;align-items:center;margin:15px 0;gap:10px}.stepper{display:flex;align-items:center;gap:14px}.stepper button{width:35px;height:35px;border:1px solid var(--line);background:#365047;font-size:20px}.stepper strong{font-size:21px;color:var(--gold)}.bottle-display{display:flex;gap:8px;justify-content:center;margin:15px 0}.bottle{display:flex;flex-direction:column;align-items:center;gap:7px;width:53px;padding:10px 0;background:#2e4143;border:1px solid #a9bfa533;font-size:12px}.bottle::before{content:"";width:15px;height:22px;background:var(--potion);border:3px solid #d7e2ce;box-shadow:0 -5px 0 -1px #a78961}.bottle.big::before{width:22px;height:28px}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.help-grid article{border:1px solid var(--line);padding:13px;font-size:13px;line-height:1.8}.help-grid kbd{font:inherit;border:1px solid #769286;padding:2px 6px;background:#14272e;margin:0 2px}.help-grid h3{color:var(--gold)}.result-icon{text-align:center;font-size:40px;color:var(--gold);margin:10px 0 16px}.result-center{text-align:center}.result-center p{font-size:14px}.result-center .row{justify-content:center;margin-top:22px}
.status-card{position:absolute;left:14px;top:12px;min-width:190px;padding:10px 12px;background:#132932e8;border:1px solid #8ba39577;font-size:11px}.status-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:5px}.status-heading strong{font-size:12px;color:#e4eaca}.stat-line{display:flex;align-items:center;gap:7px;height:23px}.stat-line .stat-label{width:29px;font-size:10px;color:#b9c9b4}.stat-cells{display:flex;gap:2px}.heart-cell{position:relative;display:inline-block;width:12px;height:18px;font-size:15px;color:#64716b}.heart-cell i{position:absolute;left:0;top:0;overflow:hidden;height:18px;color:#ed9388;white-space:nowrap;font-style:normal}.energy-cell{display:block;width:9px;height:12px;border:1px solid #94ad80;position:relative;background:#344738}.energy-cell i{position:absolute;left:0;bottom:0;background:#b4d68a;width:100%}.stat-number{font-size:10px;color:#b7c8b3;margin-left:auto;white-space:nowrap}.weapon-hud{margin-top:4px;font-size:10px;color:#e4ce9a}.place-card{position:absolute;right:64px;top:12px;padding:10px 13px;background:#132932df;border:1px solid #8ba39566;text-align:right}.place-card strong{font-size:13px;letter-spacing:1px}.place-card small{display:block;font-size:10px;color:#bdcec0;margin-top:4px}.pause-button{position:absolute;right:14px;top:12px;border:1px solid #a7bea177;width:40px;height:40px;background:#18313a;color:#edf0dd;font-size:15px}.potion-bar{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);display:flex;gap:5px;background:#142b33ba;padding:6px;border:1px solid #87a38d55}.potion-button{position:relative;min-width:66px;min-height:48px;padding:6px;background:#244047;border:1px solid #a4b99777;color:var(--potion);font-size:11px}.potion-button b{font-size:16px}.potion-button kbd{display:inline-block;font:inherit;font-size:9px;color:#dbe3cb;margin-right:3px}.bag-hud{position:absolute;bottom:88px;left:50%;transform:translateX(-50%);font-size:11px;color:#d9e3c6;background:#132a32b5;padding:5px 9px;pointer-events:none}.level-guide{position:absolute;left:14px;bottom:15px;color:#c5d6c6;background:#142b33bd;padding:7px 11px;font-size:10px;line-height:1.7;max-width:215px}.level-guide b{color:var(--gold)}#toast{position:absolute;z-index:9;top:120px;left:50%;transform:translateX(-50%);padding:12px 18px;background:#eee3bfdc;color:#273a38;font-size:13px;font-weight:700;box-shadow:3px 3px 0 #14252c88;max-width:80%;text-align:center;opacity:0;transition:opacity .2s;pointer-events:none}#toast.visible{opacity:1}
#touch-controls{position:absolute;inset:0;pointer-events:none;z-index:3;display:none}#touch-controls button{pointer-events:auto;touch-action:none;user-select:none;border:1px solid #d1e0b577;background:#19333dbb;color:#e8edda;font-size:12px;font-weight:700;min-width:51px;height:51px;box-shadow:0 3px 0 #122c34aa}#touch-controls button.held{background:#e4c281cc;color:#253b37}.move-pad{position:absolute;left:16px;bottom:20px;display:flex;gap:8px}.move-pad button{width:57px;font-size:20px!important}.fight-pad{position:absolute;right:16px;bottom:20px;display:grid;grid-template-columns:51px 51px;gap:7px}.fight-pad .attack{background:#d0ac68dc!important;color:#243835!important}.fight-pad .guard{background:#537865cc}#rotate-hint{position:absolute;inset:0;z-index:30;display:none;background:#162a32f7;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;font-size:65px;color:var(--gold)}#rotate-hint strong{font-size:22px}#rotate-hint span{font-size:14px;color:var(--muted)}
@media(pointer:coarse){#touch-controls{display:block}.level-guide{display:none}.potion-bar{bottom:18px}.potion-button{min-width:53px;min-height:46px}.potion-button kbd{display:none}.bag-hud{bottom:83px}.panel{overscroll-behavior:contain}}
@media(max-height:620px),(max-width:900px){#game-shell{width:100vw;height:100dvh;border:none}#screen{padding:12px}.panel{padding:17px}.panel-head{margin-bottom:12px}.panel h2{font-size:23px}.title-screen{padding:10px 18px}.title-main h1{font-size:48px;margin:10px 0}.title-main .subtitle{font-size:13px;margin-bottom:12px}.title-main p{font-size:12px;margin:10px 0}.title-actions{margin:15px 0}.title-bottom{font-size:10px}.world-map{grid-template-rows:130px 130px;grid-template-columns:1fr 150px 1fr;gap:8px}.region-card{padding:12px;min-height:120px}.region-card strong{font-size:17px}.region-card canvas{width:115px;height:90px}.region-card.ancient .boss-label{margin-top:75px}.region-card.ancient canvas{bottom:65px;width:125px;height:120px}.camp-grid{grid-template-columns:175px 1fr;gap:14px}.portrait{padding:12px}.portrait canvas{width:95px;height:108px}.portrait .name{font-size:16px}.profile-stats{font-size:11px}.action-card{min-height:72px;padding:12px;gap:4px}.action-card:first-child{min-height:70px}.action-card strong{font-size:15px}.action-card span{font-size:11px}.seal-row{margin:10px 0}.seal{width:27px;height:27px}.camp-footer{margin-top:12px}.note{padding:8px 12px;margin:11px 0;font-size:12px}.panel p{font-size:12px}.status-card{left:9px;top:9px;padding:7px 9px}.place-card{top:9px;right:57px;padding:8px}.pause-button{right:9px;top:9px}.form-grid{grid-template-columns:1fr 160px;gap:15px}.field,fieldset{margin-bottom:12px}.choice{padding:8px 6px}.pack-card{padding:13px}.pack-line{margin:12px 0}.help-grid article{font-size:12px}.level-guide{max-width:150px}.weapon-card{padding:12px}.weapon-card .weapon-name{font-size:16px}.btn{padding:10px 14px}.panel-head .eyebrow{font-size:9px}}
@media(max-height:420px){#screen{padding:7px}.panel{padding:13px}.panel-head{margin-bottom:9px}.panel h2{font-size:20px}.world-map{grid-template-rows:115px 115px}.region-card{min-height:110px;padding:10px}.region-card .explore{margin-top:8px}.panel p{margin:8px 0}.camp-grid{grid-template-columns:150px 1fr}.portrait canvas{width:70px;height:80px}.action-card{min-height:63px}.action-card:first-child{min-height:60px}.camp-footer{margin-top:8px}.title-main h1{font-size:40px}.title-main .subtitle{margin-bottom:5px}.title-main p{font-size:11px;line-height:1.6}.title-actions{margin:10px 0}.title-main{margin:10px 0}.status-card{min-width:165px}.heart-cell{width:10px;font-size:13px}.energy-cell{width:8px}.stat-line{height:19px}.place-card small{font-size:9px}#toast{top:100px;font-size:12px;padding:9px 13px}.fight-pad{right:9px;bottom:11px;grid-template-columns:45px 45px;gap:6px}#touch-controls button{height:45px;min-width:45px}.move-pad{left:9px;bottom:11px}.move-pad button{width:48px}.potion-bar{bottom:12px;gap:3px;padding:4px}.potion-button{min-width:47px;min-height:41px;padding:4px;font-size:10px}.bag-hud{bottom:67px;font-size:10px}.weapon-hud{font-size:9px}}
@media(max-width:600px) and (orientation:portrait){#rotate-hint{display:flex}}
@media(max-width:900px){#touch-controls{display:block}.level-guide{display:none}.potion-button kbd{display:none}.potion-bar{bottom:18px}.bag-hud{bottom:83px}}
.world-interactions{position:absolute;pointer-events:none}.world-target{position:absolute;transform:translate(-50%,-100%);width:76px;height:76px;padding:0;border:1px solid transparent;background:transparent;color:#d1e9d8;font-size:11px;pointer-events:auto;touch-action:manipulation}.world-target span{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;background:#142b33df;border:1px solid #7fa88d77;padding:3px 6px}.world-target:hover{border-color:#b0ce9866;background:#b0ce9810}.world-target:active:not(:disabled){transform:translate(-50%,-100%)}.chest-target{height:66px;color:#c6d6dc}.chest-target.unlocked{color:#ffe09c}.chest-target.unlocked span{border-color:#ecc47d}.dialogue-badge{display:inline-block;padding:5px 10px;border:1px solid #b0ce9877;color:#cde2b3;font-size:12px}.npc-dialogue p{color:#e0e5d6;line-height:1.9}.npc-dialogue .note{font-size:12px}
body[data-cinematic=true] #screen{background:transparent;padding:0;pointer-events:none}.intro-screen{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.intro-controls{display:flex;justify-content:flex-end;gap:8px;padding:18px;pointer-events:none}.intro-controls button{pointer-events:auto;background:#15232ee8;min-height:42px}.intro-caption{background:linear-gradient(0deg,#0d1928f5,#132337e8);padding:14px 25px 16px;text-align:center;border-top:1px solid #bda16c77}.intro-caption>span{color:#c2ae81;font-size:10px;letter-spacing:3px}.intro-caption h2{margin:6px 0;font-size:23px;color:#f3dfad}.intro-caption p{margin:6px auto 10px;color:#d0dbd1;font-size:13px;line-height:1.6;max-width:760px}.intro-progress{height:3px;background:#65766d55;max-width:480px;margin:auto}.intro-progress i{display:block;height:100%;background:#ecc47d;width:0}@media(max-height:420px){.intro-controls{padding:10px;gap:6px}.intro-controls button{font-size:11px;padding:7px 10px;min-height:36px}.intro-caption{padding:8px 15px 10px}.intro-caption h2{font-size:18px;margin:4px 0}.intro-caption p{font-size:11px;margin:4px auto 6px}.intro-caption>span{font-size:8px}}
@media(prefers-reduced-motion:reduce){button,#toast{transition:none}}