:root{color-scheme:dark;--ink:#edf0e9;--muted:#a1afad;--gold:#e8b976;--line:#b4c7bd26;--panel:#111e21;--green:#68c4a5;--red:#df806d;font:16px/1.6 system-ui,-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#0b1417;color:var(--ink)}button,a,input,select{font:inherit}button{color:inherit;cursor:pointer;border:1px solid var(--line);background:#172629;transition:background .18s,border-color .18s,transform .12s}button:hover{background:#293b3c;border-color:#ddbf825c}button:active{transform:scale(.97)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}a{color:inherit;text-decoration:none}#game{position:relative;width:100%;height:100dvh;overflow:hidden;user-select:none;background:#0d2227}#world{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#081315c9,transparent 27%,transparent 64%,#081315c9),linear-gradient(90deg,#09141788,transparent 28%,transparent 78%,#09141766)}.topbar{position:absolute;top:0;left:0;right:0;padding:25px 34px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px;font:600 22px 'Noto Serif TC',serif;letter-spacing:4px}.sigil{color:var(--gold);font:38px Georgia}.brand small{display:block;letter-spacing:4.8px;font:9px/2.2 system-ui;color:var(--gold)}.top-actions{display:flex;gap:10px;align-items:center}.coin{font-size:15px;color:var(--gold);margin-right:14px}.coin b{font-weight:500;letter-spacing:1px}.icon-button{height:38px;width:38px;border-radius:50%;background:#122022a6;font-size:20px}.hero-hud{position:absolute;top:114px;left:34px;display:flex;gap:13px;align-items:center;width:258px}.portrait{width:58px;height:58px;border:1px solid #c6ae7a77;background:#243635;border-radius:50%;position:relative;flex-shrink:0}.portrait-art{position:absolute;inset:0;border-radius:50%;background-image:url('./assets/anime-actors.webp');background-size:250% 250%;background-position:0 0;overflow:hidden}.portrait b{position:absolute;bottom:-7px;left:17px;border:1px solid var(--gold);background:#1e2827;color:var(--gold);font-size:12px;width:24px;text-align:center;border-radius:50%}.hero-info{flex:1}.hero-name{display:flex;justify-content:space-between;font-size:14px;gap:10px;margin-bottom:6px}.hero-name strong{font-weight:500}.hero-name span{color:#d9e3d9;font-size:12px}.meter{overflow:hidden;background:#061014a6;height:7px;border-radius:2px}.meter i{display:block;height:100%;background:#ba6a57;width:100%;transition:width .16s linear}.stamina{height:3px;margin-top:5px}.stamina i{background:#8bcbb8}.xp-row{display:flex;gap:8px;align-items:center;margin-top:7px}.experience{height:3px;flex:1}.experience i{background:var(--gold)}.xp-row span{font-size:10px;color:var(--muted)}.location{position:absolute;top:101px;left:50%;transform:translateX(-50%);text-align:center;pointer-events:none;white-space:nowrap}.eyebrow{font-size:10px;letter-spacing:2.3px;color:var(--gold);font-weight:600}.location h1{font:500 28px/1.6 'Noto Serif TC',serif;letter-spacing:6px;margin:4px 0}.location>span{color:#bfcec8;font-size:12px;letter-spacing:2px}.quest{position:absolute;right:34px;top:118px;width:228px;border-left:2px solid #d7b58177;padding:0 0 0 18px}.quest strong{display:block;font-size:16px;font-weight:500;margin-top:8px;letter-spacing:1px}.quest p{color:var(--muted);font-size:13px;margin:5px 0 12px}.quest-bottom{display:flex;justify-content:space-between;font-size:12px;color:var(--gold)}#saveState{color:#849f96;font-size:10px}.navigation{position:absolute;left:30px;top:235px;display:flex;flex-direction:column;gap:8px}.navigation button{display:flex;align-items:center;gap:14px;border:0;background:transparent;padding:10px 12px;color:#c0cfca;position:relative;text-align:left;border-radius:5px}.navigation button:hover{background:#a8c9bc1a;color:var(--gold)}.navigation button>span{font-size:23px;width:28px;text-align:center;color:#d5c5a7}.navigation b{font-weight:400;letter-spacing:2px;font-size:14px}.notice{height:5px;width:5px;border-radius:50%;background:var(--gold);position:absolute;right:2px;top:10px}.boss-hud{position:absolute;top:220px;left:50%;transform:translateX(-50%);width:min(460px,70vw);text-align:center}.boss-hud>div:first-child{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}.boss-hud span{font-size:11px;color:var(--red)}.boss-hud strong{font:500 19px 'Noto Serif TC',serif;letter-spacing:3px}.boss-hud .meter{height:7px;border:1px solid #e8957044}.boss-hud i{background:linear-gradient(90deg,#953c36,#dc886d)}.combat{position:absolute;right:35px;bottom:47px;width:252px;touch-action:none}.skills-row{display:flex;gap:12px;justify-content:flex-end}.ability{position:relative;width:67px;height:67px;border:1px solid #d4c09577;background:radial-gradient(circle at 50% 30%,#405151d9,#152629eb);border-radius:13px;box-shadow:0 4px 14px #0004;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;touch-action:none}.ability>span{font-size:26px;line-height:1.2;color:#f1cf96}.ability b{font-size:11px;font-weight:500;margin-top:3px;z-index:1}.ability kbd{position:absolute;left:6px;top:2px;font:9px system-ui;color:#a8b4ac}.ability i{position:absolute;inset:0;background:#061319c4;display:none;align-items:center;justify-content:center;font:600 20px system-ui;color:#efcb94}.ability.cooldown i{display:flex}.attack-row{display:flex;justify-content:flex-end;align-items:center;gap:15px;margin-top:14px}.attack{height:91px;width:91px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 40% 35%,#6a5940e6,#282d25);border:1px solid #edc185;box-shadow:0 0 0 5px #d5bd7620,0 8px 30px #0005;touch-action:none}.attack>span{font-size:33px;color:#ffdc9d;line-height:1}.attack b{font-size:13px;font-weight:500;letter-spacing:2px}.attack kbd{font:9px system-ui;color:#d8c49a}.dodge{border-radius:50%;height:61px;width:61px}.auto-button{display:block;margin:0 3px 13px auto;border-radius:14px;padding:4px 12px;font-size:10px;letter-spacing:1px;background:#0e2025ad}.auto-button span{color:var(--muted);margin-left:6px}.auto-button[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}.desktop-hint{position:absolute;bottom:31px;left:50%;transform:translateX(-50%);font-size:11px;color:#93aaa0;white-space:nowrap;letter-spacing:1px}.desktop-hint span{margin:0 9px}.joystick{position:absolute;left:43px;bottom:58px;height:116px;width:116px;touch-action:none;border-radius:50%;display:none}.joy-ring{position:absolute;inset:0;border-radius:50%;border:1px solid #d5e4d94a;background:#92ada611;box-shadow:inset 0 0 0 18px #c5d8ce08}.stick{width:44px;height:44px;background:radial-gradient(#abc3ad50,#adc4b121);border:1px solid #cbd9c065;border-radius:50%;position:absolute;top:36px;left:36px;pointer-events:none}.joystick>span{position:absolute;left:0;right:0;bottom:-23px;font-size:11px;text-align:center;color:#aabdb5}.event-feed{position:absolute;bottom:91px;left:35px;pointer-events:none;display:flex;flex-direction:column;gap:5px;max-width:280px}.feed-item{font-size:12px;color:#b4c8bd;animation:feed-in .3s ease}.feed-item.rare{color:var(--gold)}@keyframes feed-in{from{transform:translateY(9px);opacity:0}to{transform:translateY(0);opacity:1}}.banner{position:absolute;top:34%;left:50%;transform:translate(-50%,-50%);pointer-events:none;text-align:center;min-width:280px;padding:17px 35px;background:linear-gradient(90deg,transparent,#0c171adb,transparent);font:500 25px 'Noto Serif TC',serif;color:var(--gold);letter-spacing:4px}.banner small{font:12px system-ui;display:block;color:#d3ded5;letter-spacing:1px;margin-top:8px}.portal-button{position:absolute;bottom:30%;left:50%;transform:translateX(-50%);border-color:var(--gold);background:#172b28ee;border-radius:3px;padding:12px 24px;color:var(--gold);box-shadow:0 0 25px #eabc6730}.portal-button:active{transform:translateX(-50%) scale(.97)}.veil{position:absolute;inset:0;background:#031012a8;backdrop-filter:blur(7px);z-index:10}.panel{position:absolute;z-index:11;top:50%;left:50%;transform:translate(-50%,-50%);width:min(900px,calc(100% - 60px));max-height:85dvh;background:linear-gradient(140deg,#182b2df5,#0d191ffb);border:1px solid #b4b0914a;border-radius:8px;box-shadow:0 30px 120px #0009;display:flex;flex-direction:column}.panel>header{padding:23px 30px 19px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}h2{margin:3px 0 0;font:500 26px/1.5 'Noto Serif TC',serif;letter-spacing:3px}.panel-content{padding:25px 30px;overflow:auto;overscroll-behavior:contain;user-select:text}.panel-content p{color:var(--muted);margin:4px 0 18px;font-size:14px}.panel-content h3{font:500 18px 'Noto Serif TC',serif;letter-spacing:1px;margin:0 0 13px}.primary{background:linear-gradient(100deg,#dab777,#eec990);border-color:#e8c58c;color:#172324;font-weight:650;border-radius:3px;padding:12px 20px}.primary:hover{background:#f3d6a6}.secondary{padding:9px 15px;border-radius:3px;font-size:14px}.danger{color:#f0a098;border-color:#a65f574f}.welcome{position:absolute;z-index:12;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,90%);padding:36px 25px;text-align:center;background:linear-gradient(#101f23ed,#0c171aec);border:1px solid #d7c09355;border-radius:5px;box-shadow:0 20px 100px #0007}.welcome-symbol{font-size:47px;color:var(--gold);margin-top:17px}.welcome h2{font-size:42px;letter-spacing:8px;margin-top:5px}.english-title{color:#c8aa79;font:12px Georgia;margin-top:7px}.welcome p{font-size:14px;color:#b1c3b8;margin:27px 0 19px}.welcome-rules{display:flex;justify-content:center;gap:20px;color:#bdc9c0;font-size:12px}.welcome-rules span+span{position:relative}.welcome-rules span+span:before{content:'·';position:absolute;left:-12px;color:#8a9c8c}.welcome .primary{display:block;width:100%;margin-top:30px}.welcome .primary>span{margin-left:20px}.welcome>small{font-size:11px;color:#859d94;display:block;margin-top:17px}.toast{position:absolute;z-index:30;left:50%;bottom:22px;transform:translateX(-50%);background:#203935f5;border:1px solid #c4c19477;padding:10px 22px;color:#f4dfb5;font-size:14px;max-width:90%;text-align:center;border-radius:4px;box-shadow:0 5px 30px #0006;pointer-events:none}.hidden{display:none!important}.two-columns{display:grid;grid-template-columns:1fr 1.12fr;gap:25px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 24px}.stat{padding:12px;background:#8aa99e0c;border:1px solid var(--line);border-radius:4px}.stat span{display:block;font-size:12px;color:var(--muted)}.stat b{font-size:22px;font-weight:500;color:var(--gold)}.equipment-list,.item-list{display:flex;flex-direction:column;gap:8px}.item{padding:12px;display:flex;align-items:center;gap:13px;text-align:left;width:100%;background:#101f24;border:1px solid #aebbac25;border-radius:4px;position:relative}.item.selected{border-color:var(--gold);background:#26332d}.item-icon{font-size:24px;display:grid;place-items:center;flex:0 0 44px;height:44px;background:#8cb0a317;border:1px solid #a3c3ae22;border-radius:4px;color:var(--gold)}.item strong{font-size:14px;font-weight:500;display:block}.item small{display:block;color:var(--muted);font-size:12px}.item .rank{margin-left:auto;font-size:11px;white-space:nowrap}.common{color:#c2d4c9}.crafted{color:#78c5ad}.set{color:#9caaff}.boss{color:#e7b06d}.unique{color:#e9c8ed}.detail{border:1px solid var(--line);background:#a4c4b007;padding:20px;border-radius:4px;margin-top:15px}.detail>strong{display:block;font:500 21px 'Noto Serif TC',serif;margin-bottom:12px}.detail .description{font-size:14px;color:#b9c8bb;margin:10px 0}.detail dl{display:grid;grid-template-columns:1fr 1fr;font-size:14px;gap:7px;margin:12px 0}.detail dt{color:var(--muted)}.detail dd{margin:0;text-align:right}.positive{color:#8fd7b7}.negative{color:#e49989}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.actions button{flex:1;white-space:nowrap}.section-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-label h3{margin:0}.section-label span{font-size:12px;color:var(--muted)}.empty-state{padding:25px;text-align:center;border:1px dashed var(--line);color:var(--muted);font-size:14px}.world-list{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.world-card{background:#102126;border:1px solid #c0c6a530;overflow:hidden;border-radius:4px}.world-art{height:128px;background-image:linear-gradient(transparent,#102126),url('./assets/anime-forest.webp');background-size:cover;background-position:center}.world-card:nth-child(2) .world-art{filter:hue-rotate(40deg) saturate(.6)}.world-card:nth-child(3) .world-art{filter:sepia(.6) hue-rotate(330deg)}.world-card-body{padding:17px}.world-card h3{margin:6px 0}.world-card p{font-size:13px;min-height:63px}.world-card button{width:100%}.world-card .eyebrow{font-size:10px;letter-spacing:1px}.world-meta{display:flex;justify-content:space-between;font-size:12px;color:#a0baa9;margin-bottom:17px}.difficulty{display:flex;align-items:center;gap:12px;margin:20px 0 0;font-size:14px}.difficulty select{background:#162a2c;color:var(--gold);padding:6px 14px;border:1px solid var(--line);border-radius:3px}.tip{margin-top:18px!important;color:#90a99d!important;font-size:12px!important}.skill-tree{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}.skill-card{background:#102126;border:1px solid var(--line);padding:15px;border-radius:5px}.skill-card .glyph{font-size:28px;color:var(--gold)}.skill-card strong{display:block;margin:4px 0;font-size:15px}.skill-card p{font-size:12px;min-height:38px;margin:5px 0 13px}.skill-card button{font-size:12px;padding:7px 9px;width:100%}.skill-card.learned{border-color:#b3b78a65;background:#28372a44}.skill-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:14px}.skill-heading span{font-size:14px;color:var(--gold)}.advancements{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.advancement{padding:14px;text-align:left}.advancement b{display:block;color:var(--gold)}.advancement small{font-size:12px;color:var(--muted)}.resource-strip{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:23px;padding-bottom:17px;border-bottom:1px solid var(--line);font-size:14px;color:var(--gold)}.forge-tabs{display:flex;gap:8px;margin-bottom:20px}.forge-tabs button{padding:7px 18px;font-size:14px;border-radius:3px}.forge-tabs .active{border-color:var(--gold);color:var(--gold)}.forge-options{display:flex;flex-direction:column;gap:12px}.forge-option{padding:16px;border:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px;border-radius:4px}.forge-option strong{font-size:15px;font-weight:500}.forge-option p{font-size:12px;margin:4px 0 0}.forge-option button{flex-shrink:0;white-space:nowrap}.journal-row{padding:13px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:14px}.journal-row span{color:var(--muted)}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.key-list{font-size:14px;line-height:2.2;color:var(--muted)}.key-list b{color:var(--gold);font-weight:400;display:inline-block;min-width:105px}.result{text-align:center;padding:10px 0 20px}.result .result-icon{font-size:50px;color:var(--gold)}.result h3{font-size:27px}.reward-strip{display:flex;justify-content:center;gap:30px;color:var(--gold);margin:20px 0}.result .primary{min-width:210px}.result .actions{justify-content:center}.result .actions button{flex:0 1 200px}.item-list{max-height:300px;overflow:auto}.equipped-tag{font-size:11px;color:var(--green)}.gem-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.gem-row button{font-size:12px;padding:8px 10px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.muted{color:var(--muted)}.version-note{font-size:12px;color:#7e998f;margin-top:20px}.sound-on{border-color:var(--gold);color:var(--gold)}
@media(pointer:coarse){.joystick{display:block}.desktop-hint{display:none}.event-feed{bottom:228px}.ability kbd,.attack kbd{display:none}}
@media(min-width:1600px){.topbar{padding:30px 48px}.hero-hud{left:48px}.navigation{left:44px}.combat{right:50px;bottom:60px}.quest{right:48px}}
@media(max-width:900px){.quest{width:180px;right:22px}.hero-hud{width:220px;left:22px}.topbar{padding:20px 22px}.location h1{font-size:24px}.location .eyebrow{font-size:8px;letter-spacing:1px}.navigation{left:17px}.desktop-hint{font-size:9px}.world-list{gap:10px}.world-card-body{padding:12px}.world-card p{min-height:84px}}
@media(max-width:640px){.topbar{padding:calc(14px + env(safe-area-inset-top)) 17px 10px}.brand{font-size:17px;letter-spacing:3px;gap:8px}.sigil{font-size:30px}.brand small{font-size:7px;letter-spacing:3px}.top-actions{gap:7px}.coin{font-size:13px;margin-right:2px}.icon-button{width:32px;height:32px;font-size:17px}.hero-hud{top:calc(80px + env(safe-area-inset-top));left:17px;width:190px;gap:9px}.portrait{width:43px;height:43px}.portrait b{left:10px;font-size:10px;width:22px;bottom:-8px}.hero-name{font-size:13px;gap:4px;margin-bottom:4px}.hero-name span{font-size:10px}.xp-row{margin-top:4px}.xp-row span{font-size:9px}.location{top:calc(81px + env(safe-area-inset-top));left:auto;right:17px;transform:none;text-align:right}.location .eyebrow{display:none}.location h1{font-size:20px;letter-spacing:2px;margin:0}.location>span{font-size:9px;letter-spacing:.6px}.quest{left:19px;top:calc(151px + env(safe-area-inset-top));right:auto;width:190px;padding-left:10px}.quest .eyebrow{font-size:8px;letter-spacing:1.5px}.quest strong{font-size:13px;letter-spacing:.5px;margin-top:3px}.quest p{font-size:11px;margin:3px 0 5px}.quest-bottom{font-size:10px}#saveState{display:none}.navigation{top:auto;bottom:0;left:0;right:0;padding:6px 14px calc(7px + env(safe-area-inset-bottom));height:auto;flex-direction:row;justify-content:space-around;background:#0c1a1cf0;border-top:1px solid #b8c29b29;gap:0}.navigation button{flex-direction:column;gap:0;padding:2px 16px;line-height:1.4}.navigation button>span{font-size:22px}.navigation b{font-size:11px;letter-spacing:1px}.notice{right:12px;top:5px}.combat{right:15px;bottom:calc(89px + env(safe-area-inset-bottom));width:206px}.skills-row{gap:8px}.ability{width:57px;height:58px;border-radius:11px}.ability>span{font-size:25px}.ability b{font-size:10px}.attack-row{margin-top:12px;gap:12px}.attack{width:80px;height:80px}.attack>span{font-size:29px}.attack b{font-size:12px}.dodge{height:53px;width:53px;border-radius:50%}.auto-button{font-size:9px;padding:4px 9px;margin-bottom:10px}.joystick{left:24px;bottom:calc(118px + env(safe-area-inset-bottom));height:106px;width:106px}.stick{width:42px;height:42px;top:32px;left:32px}.joystick>span{font-size:10px;bottom:-21px}.event-feed{bottom:calc(284px + env(safe-area-inset-bottom));left:18px;max-width:190px}.feed-item{font-size:10px}.desktop-hint{display:none}.boss-hud{top:calc(239px + env(safe-area-inset-top));width:75vw}.boss-hud strong{font-size:16px;letter-spacing:2px}.boss-hud span{font-size:9px}.banner{top:38%;font-size:23px;padding:12px 25px}.banner small{font-size:11px}.portal-button{bottom:41%;font-size:13px;padding:10px 18px;white-space:nowrap}.panel{width:calc(100% - 22px);max-height:calc(100dvh - 35px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:7px}.panel>header{padding:17px 18px 14px}h2{font-size:23px}.panel-content{padding:18px}.two-columns{grid-template-columns:1fr;gap:22px}.stat-grid{gap:6px;margin-bottom:19px}.stat{padding:9px}.stat b{font-size:19px}.stat span{font-size:11px}.world-list{grid-template-columns:1fr}.world-card{display:grid;grid-template-columns:105px 1fr}.world-art{height:auto;min-height:155px;background-position:center}.world-card p{min-height:0;margin-bottom:10px;font-size:12px}.world-card h3{font-size:17px}.world-card-body{padding:13px}.world-meta{margin-bottom:11px;font-size:11px}.world-card button{font-size:13px;padding:9px}.skill-tree{grid-template-columns:repeat(2,1fr);gap:9px}.skill-card{padding:12px}.skill-card strong{font-size:14px}.skill-card p{font-size:12px;min-height:40px}.skill-heading{align-items:start;gap:10px}.skill-heading h3{font-size:17px}.skill-heading span{font-size:12px;white-space:nowrap}.advancements{grid-template-columns:1fr}.advancement{padding:11px 14px}.advancement b{font-size:14px}.help-grid{grid-template-columns:1fr;gap:15px}.forge-option{padding:12px;gap:9px}.forge-option strong{font-size:14px}.forge-option button{font-size:12px;padding:8px 9px}.resource-strip{gap:13px;font-size:12px}.forge-tabs{gap:5px}.forge-tabs button{padding:6px 11px;font-size:13px}.toast{bottom:calc(72px + env(safe-area-inset-bottom));font-size:12px;width:max-content}.welcome{padding:26px 22px}.welcome h2{font-size:35px}.welcome .eyebrow{font-size:9px}.item-list{max-height:245px}.detail{padding:16px}.detail>strong{font-size:19px}.actions button{font-size:13px}.hero-info{min-width:0}}
@media(max-height:520px) and (min-width:641px){.topbar{padding:10px 20px}.hero-hud{top:70px}.location{top:65px}.quest{top:70px}.navigation{top:145px;gap:0}.navigation button{padding:4px 8px}.combat{bottom:24px;right:25px}.ability{width:52px;height:52px}.attack{width:70px;height:70px}.joystick{bottom:25px;width:106px;height:106px}.event-feed{bottom:170px}.boss-hud{top:153px}.panel{max-height:94dvh}.welcome{padding:16px 24px}.welcome-symbol{display:none}.welcome p{margin:12px 0}.welcome .primary{margin-top:16px}.welcome h2{font-size:32px}.welcome>small{margin-top:10px}.desktop-hint{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
