:root{--bg: #17151c;--panel: #2e2c33;--panel-edge: #57535c;--panel-dark: #121016;--ink: #e8e2d4;--ink-dim: #bdb6a6;--gold: #f0c050;--accent: #f0a030;--hp: #b8282a;--mp: #2a6cb8;--xp: #c07a20}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,PingFang TC,Noto Sans TC,sans-serif;-webkit-tap-highlight-color:transparent}#app{max-width:430px;min-height:100vh;margin:0 auto}.stone{background:var(--panel);border:2px solid var(--panel-edge);outline:2px solid var(--panel-dark);border-radius:6px;box-shadow:inset 0 0 0 2px #3d3a43;color:var(--ink)}.title{color:var(--gold);text-align:center;font-weight:500}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}button.stone:not(:disabled):active{border-color:var(--gold)}.screen{padding:16px;display:flex;flex-direction:column;gap:12px}.screen.center{align-items:center;text-align:center;padding-top:48px}.row{display:flex;gap:8px;align-items:center;justify-content:space-between}.sub{text-align:center;color:var(--ink-dim);margin:-8px 0 8px}.home .title{font-size:30px;margin:40px 0 8px;letter-spacing:2px}.menu{display:flex;flex-direction:column;gap:14px;margin-top:12px}.big{padding:14px;font-size:18px;color:var(--gold)}.small{padding:4px 10px;font-size:13px}.notice{padding:10px 12px;font-size:14px;line-height:1.6}.notice.bad{border-color:#8a3a3a}.notice .row{margin-top:8px;justify-content:flex-start}.count{color:var(--ink-dim);font-size:14px}.stats{padding:14px 24px;line-height:2;text-align:left;min-width:220px}.outcome{color:var(--ink-dim)}.bar{position:relative;height:13px;background:#0d0c10;border:1px solid #000;border-radius:2px;font-size:11px;line-height:12px;text-align:center;color:#fff}.bar-fill{position:absolute;inset:0 auto 0 0;border-radius:1px;transition:width .25s}.bar-fill.hp{background:var(--hp)}.bar-fill.mp{background:var(--mp)}.bar-fill.xp{background:var(--xp)}.bar span{position:relative}.dungeon{display:flex;flex-direction:column;min-height:100vh}.hud{display:flex;gap:8px;align-items:center;padding:8px 10px;background:#201e25;border-bottom:2px solid var(--panel-dark)}.portrait{width:44px;height:44px;border-radius:50%;border:2px solid var(--panel-edge);background:#3a3540;object-fit:cover;object-position:top}.bars{flex:1;display:flex;flex-direction:column;gap:3px}.gold{color:var(--gold);font-size:14px}.floor-title{align-self:center;margin:8px 0 4px;padding:3px 18px;font-size:14px;color:var(--gold)}.foe-bar{padding:0 48px 4px}.event{text-align:center;font-size:13px;color:var(--gold);min-height:18px;margin-bottom:2px}.grid{display:grid;gap:0;padding:6px 10px;background:#232028}.cell{aspect-ratio:1;padding:0;border:0;background:#3a3a3e;border-radius:2px;position:relative;display:flex;align-items:center;justify-content:center;overflow:visible}.cell.wall{background:#2a2730;box-shadow:inset 0 -3px #1d1b21}.cell.target{outline:2px solid var(--accent);z-index:2}.sprite{width:125%;height:125%;object-fit:contain;pointer-events:none;margin-top:-25%}.sprite.placeholder{width:80%;height:80%;margin:0;border-radius:50%;background:#5a3a63;display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff}.sprite.object{width:92%;height:92%;margin:0}.sprite.opened{opacity:.6}.tip{color:var(--ink-dim);font-size:13px;text-align:center;padding:10px 16px}.question{padding:10px 14px 0}.card{position:relative;padding:22px 12px 12px;margin-top:12px;text-align:center}.card-title{position:absolute;top:-13px;left:50%;transform:translate(-50%);padding:2px 14px;font-size:12px;color:var(--ink-dim);white-space:nowrap}.prompt{font-size:24px;color:var(--accent)}.prompt.sentence{font-size:16px;color:var(--ink);line-height:1.5}.ipa{font-size:13px;color:var(--ink-dim);margin-top:2px}.hint{font-size:14px;color:var(--ink-dim);margin-top:6px}.speak{position:absolute;right:8px;bottom:8px;background:none;border:0;font-size:20px}.listen{padding:10px 18px;color:var(--accent)}.feedback{margin-top:10px;font-size:15px}.feedback.bad{color:#ff8a7a}.feedback .example{color:var(--ink-dim);font-size:13px;margin-top:4px;line-height:1.5}.option{display:block;width:100%;margin:8px 0;padding:10px 6px;font-size:15px}.spell{display:flex;gap:8px;margin-top:8px}.spell input{flex:1;padding:10px;font-size:16px}.spell .option{width:auto;margin:0;padding:10px 16px}.skills{margin-top:auto;display:flex;gap:8px;justify-content:center;padding:10px;background:#201e25;border-top:2px solid var(--panel-dark)}.skill{min-width:64px;padding:6px 8px;display:flex;flex-direction:column;align-items:center;font-size:14px}.skill small{font-size:11px;color:var(--ink-dim)}.skill.go{color:var(--gold)}.sprite.portrait{width:44px;height:44px;margin:0;object-fit:cover;object-position:50% 8%}.cell{background:#45434a url(/tiles/floor.webp);box-shadow:inset 0 0 0 1px #00000047;border-radius:0;background-size:300% 300%;background-position:calc(var(--tx) * 50%) calc(var(--ty) * 50%)}.cell.wall{background-color:#19171d;background-image:url(/tiles/wall.webp);box-shadow:inset 0 0 0 1px #00000059}.dungeon.fighting .grid{padding:4px 52px}.dungeon.fighting .option{padding:8px 6px;margin:6px 0}.field{padding:12px;display:flex;flex-direction:column;gap:8px;font-size:15px}.field.check{flex-direction:row;align-items:center}.field .row{justify-content:flex-start}.file{position:relative;overflow:hidden;display:inline-block}.file input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.dim{color:var(--ink-dim);font-size:13px}.message{color:var(--gold);text-align:center}.report{display:block;margin:4px auto 0;background:none;border:0;color:var(--ink-dim);font-size:12px;text-decoration:underline}.q-white{--q: #cfcfcf}.q-green{--q: #5bbf5b}.q-blue{--q: #4a8fe0}.q-purple{--q: #a65be0}.q-orange{--q: #f0902a}[class*=q-]{border-color:var(--q, var(--panel-edge))}.stats [class*=q-],.bag-item span,.slot span{color:var(--q, var(--ink))}.row.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.panel-stats,.detail{padding:10px 12px;display:flex;flex-direction:column;gap:6px}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px 12px;font-size:14px}.word-affix{color:var(--gold);font-size:13px}.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.slot{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;font-size:11px;min-height:84px}.slot small{color:var(--ink-dim)}.bag{display:grid;grid-template-columns:1fr 1fr;gap:6px}.bag-item{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:13px;text-align:left}.item-icon{width:32px;height:32px;object-fit:contain;flex:none}.item-icon.placeholder{display:inline-flex;align-items:center;justify-content:center;border-radius:6px;background:#3a3540;color:var(--ink-dim);font-size:14px}.section{margin:12px 0 6px;font-size:15px;color:var(--gold)}.actions{flex-wrap:wrap;gap:6px;justify-content:flex-start}.socket{gap:6px;flex-wrap:wrap;justify-content:flex-start;font-size:13px}.codex-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.codex-item{padding:6px 8px;font-size:13px;display:flex;flex-direction:column}.codex-item small{color:var(--ink-dim);font-size:11px}.codex-item.unknown{color:var(--ink-dim)}.shop{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:0 12px 8px}.cell:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:inherit;filter:var(--tint, none);pointer-events:none}.cell:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inherit;pointer-events:none}.cell>*{position:relative;z-index:1}.chapter{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 14px;text-align:left}.chapter strong{font-size:17px;color:var(--gold)}.chapter small{color:var(--ink-dim)}.chapter.current{border-color:var(--gold)}.chapter:disabled strong{color:var(--ink-dim)}.growth{padding:10px 12px;align-items:center}