:root{--bg: #F4EDDE;--ink: #2E2A24;--cinnabar: #B54534;--gold: #BE9A3E;--moss: #7D9B6A;--paper-deep: #EAE0C8;--plaque: #4A3423}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--ink);font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;overflow:hidden;display:flex;align-items:center;justify-content:center}#app{height:min(100vh,940px);width:100%;max-width:520px;margin:0 auto;position:relative;box-shadow:0 0 40px #0000001f}.scene{position:absolute;top:0;right:0;bottom:0;left:0;display:none;flex-direction:column}.scene.active{display:flex}.scene.page-bg{background-size:cover;background-position:center}.btn{min-height:48px;border:none;border-radius:24px;cursor:pointer;font-size:17px;font-weight:600;padding:0 32px;font-family:inherit}.btn-primary{background:var(--cinnabar);color:var(--bg);box-shadow:0 2px 8px #b5453459}.btn-secondary{background:#f4edded9;color:var(--ink);border:1.5px solid var(--ink)}.btn:disabled{opacity:.4;cursor:default}.icon-btn{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--ink);background:#f4edded9;color:var(--ink);font-size:18px;cursor:pointer;flex-shrink:0}.panel{background:var(--bg);border:2px solid var(--ink);border-radius:12px;padding:20px;box-shadow:0 6px 24px #2e2a2440}.dim{position:absolute;top:0;right:0;bottom:0;left:0;background:#2e2a248c;display:none;z-index:30}.dim.active{display:flex;align-items:center;justify-content:center}.toast{position:absolute;top:20%;left:50%;transform:translate(-50%);background:var(--ink);color:var(--bg);padding:10px 22px;border-radius:20px;font-size:14px;opacity:0;transition:opacity .3s;pointer-events:none;z-index:50;white-space:nowrap}.banner-slot,.ad-zone{height:90px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#eae0c8bf;color:#a89e86;font-size:12px;border-top:1px dashed #c9bfa6}#scene-boot{align-items:center;justify-content:center;gap:24px;background:var(--bg)}#boot-logo{width:160px;height:160px;border-radius:24px;background:var(--cinnabar);display:flex;align-items:center;justify-content:center;color:var(--bg);font-size:34px;font-weight:800;writing-mode:vertical-rl;letter-spacing:8px}#boot-bar{width:200px;height:4px;background:var(--paper-deep);border-radius:2px;overflow:hidden}#boot-bar i{display:block;height:100%;width:0;background:var(--cinnabar);transition:width .2s}#boot-legal{position:absolute;bottom:24px;text-align:center;font-size:10px;color:#8a8272;line-height:1.6;padding:0 24px}#boot-age{position:absolute;top:16px;right:16px;font-size:11px;color:var(--moss);border:1px solid var(--moss);border-radius:4px;padding:2px 6px}#scene-home{align-items:center;padding-top:40px}.home-top{width:100%;display:flex;justify-content:space-between;align-items:center;font-weight:700;padding:0 24px}.home-top .brand{text-shadow:0 1px 3px rgba(244,237,222,.8)}#home-character{width:200px;margin:32px 0 14px;border-radius:16px;overflow:hidden;background:#f4eddee6;border:2px solid var(--ink);display:flex;flex-direction:column;align-items:center}#home-portrait{width:100%;height:220px;object-fit:cover;object-position:top}#home-character .cname{font-size:17px;font-weight:700;padding-top:8px}#home-character .cskill{font-size:12px;color:#8a8272;padding-bottom:10px}#home-progress{font-size:13px;color:var(--ink);margin-bottom:22px;padding:4px 16px;background:#f4eddecc;border-radius:14px}#home-actions{display:flex;flex-direction:column;gap:12px;align-items:center;flex:1}#home-actions .btn-primary{min-width:220px}#scene-select{padding-top:12px}#select-top{display:flex;align-items:center;gap:12px;padding:4px 16px 12px}#select-top h2{font-size:18px;flex:1;text-align:center;text-shadow:0 1px 3px rgba(244,237,222,.8)}#select-top .stars{font-size:13px;color:var(--gold);font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.4)}#chapter-scroll{flex:1;display:flex;gap:14px;overflow-x:auto;padding:8px 20px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.chapter-card{flex:0 0 82%;scroll-snap-align:center;border-radius:14px;padding:0 0 14px;overflow:hidden;background:#f4eddeeb;border:2px solid var(--ink);display:flex;flex-direction:column;gap:12px}.chapter-card.locked{filter:saturate(.35);opacity:.78}.chapter-card .ch-banner{width:100%;height:120px;background-size:cover;background-position:center;border-bottom:2px solid var(--ink);position:relative}.chapter-card .ch-banner .ch-title{position:absolute;left:12px;bottom:10px;color:#f4edde;font-size:16px;font-weight:800;text-shadow:0 1px 4px rgba(0,0,0,.7);background:#2e2a248c;padding:2px 12px;border-radius:4px}.chapter-card h3{font-size:15px;display:flex;justify-content:space-between;align-items:center;padding:0 16px}.chapter-card .teaser{font-size:12px;color:#8a8272;padding:0 16px}.level-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 16px}.level-cell{aspect-ratio:1;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;background:var(--bg);border:2px solid var(--cinnabar);font-weight:700;position:relative}.level-cell .lv-name{font-size:10px;font-weight:400;color:#8a8272;padding:0 2px;text-align:center}.level-cell.done{background:var(--gold);border-color:var(--gold);color:var(--bg)}.level-cell.done .lv-name{color:var(--bg)}.level-cell.locked{background:#ddd3bc;border-color:#c9bfa6;color:#a89e86;cursor:default}.level-cell .lock{font-size:16px}.level-cell.pulse{animation:pulse 1.6s infinite}@keyframes pulse{0%,to{box-shadow:0 0 #b5453480}50%{box-shadow:0 0 0 8px #b5453400}}.chapter-locked-tip{display:flex;align-items:center;justify-content:center;gap:8px;padding:24px 0;color:#8a8272;font-size:14px}#dim-hero .panel{width:86%;max-width:420px}#dim-hero h3{text-align:center;margin-bottom:14px}.hero-list{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;max-height:60vh;overflow-y:auto}.hero-card{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:10px;border:2px solid transparent;background:var(--paper-deep);cursor:pointer;text-align:left;width:100%}.hero-card.selected{border-color:var(--cinnabar)}.hero-card.locked{opacity:.55;cursor:default}.hero-card .h-avatar{width:48px;height:48px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--cinnabar);color:var(--bg);display:flex;align-items:center;justify-content:center;font-size:20px}.hero-card .h-avatar img{width:100%;height:100%;object-fit:cover;object-position:top}.hero-card.locked .h-avatar img{filter:grayscale(1)}.hero-card .h-info b{font-size:15px}.hero-card .h-info small{display:block;font-size:11px;color:#8a8272;margin-top:2px}#scene-game{background-size:cover;background-position:center}#scene-game:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 36%,#d6b2701f,#d6b2700a 45%,#60482c2e)}#scene-game>*{position:relative;z-index:1}#game-plaque{display:flex;align-items:stretch;padding:14px 16px 10px;gap:10px;position:relative}#game-plaque:before,#game-plaque:after{content:"";position:absolute;top:0;width:170px;height:26px;z-index:0;background:linear-gradient(180deg,#c14a38,#a03a2b 55%,#7e2e22);box-shadow:0 3px 8px #00000059,inset 0 2px 4px #ffffff2e}#game-plaque:before{left:-56px;transform:rotate(-13deg);clip-path:polygon(0 50%,15% 0,100% 0,100% 100%,15% 100%)}#game-plaque:after{right:-56px;transform:rotate(13deg);clip-path:polygon(0 0,85% 0,100% 50%,85% 100%,0 100%)}#plaque-body{flex:1;background:var(--plaque);border:2px solid var(--gold);border-radius:10px;color:var(--gold);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 12px;box-shadow:inset 0 0 12px #0006,0 2px 8px #0000004d;position:relative;z-index:1}#plaque-title{font-size:16px;letter-spacing:2px}#plaque-steps{font-size:11px;opacity:.85;margin-top:2px}.plaque-side{width:44px;border:2px solid var(--gold);border-radius:10px;background:var(--plaque);color:var(--gold);font-size:16px;cursor:pointer;position:relative;z-index:1}#game-board-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:8px;position:relative}#level-hint{position:absolute;top:12px;left:50%;transform:translate(-50%) translateY(-6px);max-width:84%;padding:8px 16px;border-radius:12px;z-index:6;background:#f4eddef2;border:1.5px solid var(--plaque);color:var(--ink);font-size:13px;line-height:1.5;text-align:center;box-shadow:0 4px 14px #2e2a244d;opacity:0;transition:opacity .35s,transform .35s;pointer-events:none}#level-hint.show{opacity:1;transform:translate(-50%) translateY(0)}#level-hint:before{content:"💡 "}.board-stack{position:relative}#stage-scene{position:absolute;left:50%;bottom:-3%;z-index:0;width:170%;height:auto;transform:translate(-50%);pointer-events:none;filter:drop-shadow(0 22px 26px rgba(43,32,20,.38))}#board{touch-action:none;position:relative;z-index:1}#game-board-wrap.embed{padding:0;position:relative;display:block}#game-board-wrap.embed .board-stack{position:absolute;top:0;right:0;bottom:0;left:0}#game-board-wrap.embed #board{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}#game-actions{display:flex;justify-content:center;gap:18px;padding:6px 16px 12px}#game-dpad{display:grid;grid-template-columns:repeat(3,58px);grid-template-rows:repeat(2,46px);gap:6px;justify-content:center;padding:0 16px 6px;flex-shrink:0}.dpad-btn{border:2px solid var(--gold);border-radius:10px;background:linear-gradient(180deg,#b54534e0,#8e3527e0);color:#f4edde;font-size:16px;cursor:pointer;font-family:inherit;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff26;touch-action:manipulation;user-select:none;-webkit-user-select:none}.dpad-btn:active{transform:translateY(1px);filter:brightness(1.15)}.dpad-up{grid-column:2;grid-row:1}.dpad-left{grid-column:1;grid-row:2}.dpad-down{grid-column:2;grid-row:2}.dpad-right{grid-column:3;grid-row:2}.plaque-btn{min-width:96px;min-height:52px;border:2px solid var(--gold);border-radius:10px;background:linear-gradient(180deg,#b54534,#8e3527);color:#f4edde;font-size:17px;font-weight:700;cursor:pointer;position:relative;font-family:inherit;box-shadow:0 3px 10px #00000059,inset 0 1px #ffffff26}.plaque-btn:active{transform:translateY(1px)}.plaque-btn .sub{position:absolute;top:-7px;right:-7px;background:var(--gold);color:var(--ink);font-size:10px;font-weight:800;border-radius:9px;padding:1px 6px}.plaque-btn.breathe{animation:breathe 1.2s ease-in-out infinite}@keyframes breathe{0%,to{box-shadow:0 3px 10px #00000059,0 0 #be9a3eb3}50%{box-shadow:0 3px 10px #00000059,0 0 0 9px #be9a3e00}}#game-adzone.ad-zone{background:transparent;border-top:none;padding:6px 14px 10px}.ad-banner{width:100%;height:100%;max-height:72px;display:flex;align-items:center;gap:12px;background:linear-gradient(180deg,#33291e,#221c14);border:1.5px solid rgba(190,154,62,.6);border-radius:12px;padding:6px 12px;position:relative;box-shadow:0 4px 14px #00000059}.ad-thumb{width:52px;height:52px;border-radius:10px;flex-shrink:0;background:linear-gradient(135deg,#b54534,#be9a3e);display:flex;align-items:center;justify-content:center;color:#f4edde;font-size:24px;font-weight:800;box-shadow:inset 0 0 8px #0000004d}.ad-thumb:after{content:"西"}.ad-text{flex:1;color:#e7d8b4;font-size:13px;text-align:left}.ad-tag{position:absolute;right:10px;bottom:6px;font-size:9px;line-height:1.4;color:#f4edde8c;border:1px solid rgba(244,237,222,.35);border-radius:3px;padding:0 4px}#dim-pause .panel{width:76%;max-width:340px;display:flex;flex-direction:column;gap:10px}#dim-pause h3{text-align:center;margin-bottom:6px}#scene-result{align-items:center;justify-content:center;gap:18px;padding:24px}#scene-result:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#2e2a2466}#scene-result>*{position:relative}#result-stars{display:flex;gap:14px;font-size:52px}#result-stars .star{color:#6b6152;transform:scale(.6);opacity:0;text-shadow:0 2px 6px rgba(0,0,0,.5)}#result-stars .star.lit{color:var(--gold);animation:starpop .45s forwards}@keyframes starpop{to{transform:scale(1);opacity:1}}#result-title{font-size:24px;font-weight:800;color:#f4edde;text-shadow:0 2px 6px rgba(0,0,0,.6)}#result-detail{font-size:14px;color:#e7d8b4;text-shadow:0 1px 3px rgba(0,0,0,.6)}#result-story{max-width:86%;padding:10px 18px;border-radius:12px;background:linear-gradient(180deg,#4a3423eb,#2e2418eb);border:1.5px solid var(--gold);color:var(--gold);font-size:14px;line-height:1.6;text-align:center;box-shadow:0 4px 16px #0006,inset 0 0 10px #be9a3e26;animation:storyin .5s ease-out}@keyframes storyin{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}#result-actions{display:flex;flex-direction:column;gap:12px;margin-top:12px;align-items:center}#result-actions .btn-primary{min-width:220px}