:root{--blue:#2d719e;--deep:#123d5c;--cream:#fff8dc;--gold:#ffd45c}
*{box-sizing:border-box}
html,body,button,a,input,select,textarea,canvas{cursor:url("assets/local/misc/鼠标.png") 2 2,auto}
body{margin:0;min-height:100vh;color:#fff;font-family:"Microsoft YaHei",sans-serif;background:#061923 radial-gradient(circle at 50% 0,#285765,transparent 54%)}
button{font:inherit}.hidden{display:none!important}
.game-wrap{width:min(1180px,100%);margin:auto;padding:12px}
.topbar,.hud{display:flex;align-items:center;gap:12px;padding:8px 14px;border:3px solid #b9d9e9;border-radius:16px;background:linear-gradient(#6099bedf,#2c668fdf 48%,#174b75e8 52%);box-shadow:inset 0 0 0 2px #164a6c,0 7px 18px #0008}
.brand{width:240px;text-shadow:2px 2px #174461}.brand small{display:block;color:var(--gold);font:italic bold 12px Georgia}.brand strong{font-size:22px}
.top-actions{margin-left:auto}
.top-actions{display:flex;gap:5px}.top-actions button,.dialog button,.panel button,.ending button{padding:7px 10px;color:#fff;border:2px solid #c5e7f4;border-radius:9px;background:linear-gradient(#68b1d7,#246c98)}
.panel button.danger{border-color:#ffd6c4;background:linear-gradient(#d96b4d,#8a2d22);color:#fff7ef}
.stage{position:relative;margin:9px 0 0;overflow:hidden;border:5px solid #b9d9e9;border-radius:14px 14px 0 0;background:#09131b;box-shadow:0 12px 26px #0009}
canvas{display:block;width:100%;height:auto}
.map-name{position:absolute;z-index:12;left:18px;top:12px;box-sizing:border-box;width:230px;padding:5px 6px;color:#e8f8ff;text-align:center;font-size:14px;line-height:18px;white-space:pre;text-shadow:1px 2px #000;border:1px solid #ffffff88;border-radius:8px;background:#173f58d9}.map-name small,.map-name strong{display:inline;font:inherit}.map-name strong{font-weight:normal}
.money{position:absolute;right:16px;top:15px;display:flex;gap:16px;padding:8px 12px;color:#ffe88b;border:2px solid #d6edf7;border-radius:10px;background:#173f58df}
.effect-bar{position:absolute;z-index:14;right:16px;top:58px;display:flex;flex-wrap:wrap;justify-content:flex-end;max-width:280px;gap:5px}.effect-icon{position:relative;width:40px;height:40px;padding:3px;text-align:center;border:2px solid #c9eaff;border-radius:7px;background:#173f58e8}.effect-icon img{width:28px;height:28px;object-fit:contain;image-rendering:pixelated}.effect-icon small{position:absolute;right:2px;bottom:0;color:#fff;font-size:10px;text-shadow:1px 1px #000}.effect-icon:hover:after{content:attr(data-tip);position:absolute;z-index:40;right:0;top:calc(100% + 6px);width:230px;padding:8px;color:#fff;text-align:left;white-space:pre-line;border:1px solid #9fd2e8;border-radius:7px;background:#102f45f5;box-shadow:0 4px 12px #0008}
.task-assistant{position:absolute;z-index:13;right:16px;top:108px;width:250px;padding:10px;color:#fff;border:2px solid #e9c85e;border-radius:9px;background:#192b35e8;box-shadow:0 4px 14px #0008}.task-assistant strong{display:block;color:#ffe26b;margin-bottom:6px}.task-assistant p{margin:4px 0;font-size:12px;line-height:1.4;white-space:pre-line}.task-assistant small{display:block;margin-top:6px;color:#9fc0ce;text-align:right}
.start-screen{position:absolute;z-index:100;inset:0;display:flex;align-items:center;justify-content:center;background:#0b151d url("assets/local/loading/21795.jpg") center/cover no-repeat}.start-screen:before{content:"";position:absolute;inset:0;background:#07131a55}.start-card{position:relative;width:430px;max-height:92%;overflow:auto;padding:32px;text-align:center;color:#fff;border:2px solid #e7cb78;border-radius:16px;background:#132a35d0;box-shadow:0 12px 40px #000c}.start-card h1{margin:0;color:#ffe489;font-size:42px;text-shadow:2px 3px #563516}.start-card p{margin:5px 0 24px;color:#d7edf4}.start-card button{display:block;width:240px;margin:10px auto;padding:11px;color:#fff3cf;border:2px solid #7c4b22;border-radius:9px;background:linear-gradient(#b98243,#704018 52%,#4b270f);box-shadow:inset 0 1px #ffe1a0,0 3px 9px #0008;font-weight:bold}.loading-progress{height:20px;margin:12px 0 10px;padding:3px;border:2px solid #d9edf3;border-radius:12px;background:#071820}.loading-progress i{display:block;width:0;height:100%;border-radius:8px;background:linear-gradient(90deg,#e68c27,#ffe477);box-shadow:0 0 12px #ffd35c}.loading-tip{min-height:42px;padding:8px;color:#cce7ef;font-size:13px;line-height:1.5}.start-buttons{margin-top:12px}.start-settings,.title-load-menu{padding-top:10px;max-height:82vh;overflow:auto}.start-settings label{display:block;margin:12px auto;width:300px;text-align:left;color:#e3f2f5}.title-load-menu h2{margin:0 0 10px;color:#ffe489}.title-load-menu #titleLoadSlots{max-height:220px;overflow:auto;padding-right:4px}.title-save{margin:7px 0;padding:9px;border:1px solid #7ba6b9;border-radius:8px;background:#0a202bd9}.title-save strong,.title-save small{display:block}.title-save small{margin-top:3px;color:#bcd5df;font-size:11px}.title-save button{width:100%;margin:7px 0 0;padding:7px}
body.login-ready .start-screen{background-image:url("assets/local/loading/登录画面.png")}body.login-ready .start-screen:before{background:transparent}body.login-ready .start-card{width:772px;height:624px;max-height:min(624px,96vh);overflow:visible;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}body.login-ready .start-card h1,body.login-ready .start-card p,body.login-ready #loadingText,body.login-ready #loadingProgress,body.login-ready #loadingTip{display:none}body.login-ready .start-buttons{position:absolute;inset:0;margin:0}body.login-ready .start-buttons button{position:absolute;width:300px;height:60px;margin:0;padding:0;border:0;border-radius:14px;background:linear-gradient(90deg,#6a3b16,#b77735 18%,#7d481e 34%,#c0833d 52%,#6b3b17 76%,#a86b2e);box-shadow:inset 0 3px #f0bc78,inset 0 -4px #3d1f0d,0 4px 10px #0008;color:#fff4d1;font-size:20px;font-weight:bold;letter-spacing:2px;text-shadow:1px 2px #3b1f0f}body.login-ready .start-buttons button:before{content:"";position:absolute;inset:7px;border-radius:10px;background:repeating-linear-gradient(0deg,#ffffff12 0 2px,#00000010 2px 5px);pointer-events:none}body.login-ready #startGameButton{left:380px;top:96px}body.login-ready #loadGameButton{left:380px;top:202px}body.login-ready #startSettingsButton{left:380px;top:307px}body.login-ready #exitGameButton{left:380px;top:413px}body.login-ready .start-settings,body.login-ready .title-load-menu{position:absolute;left:390px;top:76px;width:330px;max-height:500px;overflow:auto;padding:6px;color:#fff;background:#0005;border:0;border-radius:0;box-shadow:none;font-size:12px}body.login-ready .start-settings label{width:auto;margin:5px auto;font-size:12px}body.login-ready .start-settings .key-grid{grid-template-columns:1fr;gap:2px}body.login-ready .start-settings .key-row{padding:2px 4px;font-size:12px}body.login-ready .start-settings .key-row button{min-width:70px;padding:2px 4px!important;font-size:11px!important}
body.login-ready .start-screen{background-image:url("assets/local/loading/登录画面新.png")}
.boss-bar{position:absolute;top:18px;left:50%;width:430px;transform:translateX(-50%);text-align:center;text-shadow:1px 1px #000}.boss-bar i{display:block;height:14px;padding:2px;border:2px solid #e5c37d;border-radius:8px;background:#251312}.boss-bar b{display:block;width:100%;height:100%;border-radius:4px;background:#e62f2a}
.notice{position:absolute;z-index:15;left:50%;top:95px;transform:translateX(-50%);padding:9px 16px;color:#4b3418;font-weight:bold;border:3px solid #ca9639;border-radius:10px;background:#fff0b4;box-shadow:0 5px 20px #000a}
.loot-log{position:absolute;z-index:16;right:16px;bottom:16px;width:250px;color:#fff;font-size:14px;line-height:1.45;text-align:left;text-shadow:1px 1px 2px #000;pointer-events:none}.loot-log p{margin:2px 0;opacity:.95}
.dialog{position:absolute;z-index:20;left:6%;right:6%;bottom:5%;display:flex;gap:16px;min-height:145px;padding:15px 20px;color:#382e24;border:4px solid #806944;border-radius:15px;background:linear-gradient(#fffef1,#ead9a8);box-shadow:inset 0 0 0 3px white,0 8px 28px #000b}.dialog img{width:82px;height:112px;object-fit:contain;image-rendering:pixelated}.dialog>div{flex:1}.dialog strong{color:#176797;font-size:19px}.dialog p{min-height:48px;line-height:1.65}.dialog button{float:right}.dialog #dialogChoices{display:flex;gap:8px;flex-wrap:wrap}
.panel{position:absolute;z-index:30;left:50%;top:50%;width:min(800px,90%);max-height:84%;overflow:auto;transform:translate(-50%,-50%);padding:20px;color:#30291f;border:5px solid #6a8fa5;border-radius:15px;background:linear-gradient(#fffdf0,#e8dfc2);box-shadow:inset 0 0 0 3px white,0 16px 55px #000c}.panel h2{margin-top:0;color:#1b638e}.panel-close{position:absolute;right:10px;top:8px;border:0!important;background:none!important;color:#333!important;font-size:25px}
.stage #miniMap{position:absolute;z-index:12;left:18px;top:44px;width:230px;height:145px;border:1px solid #ffffff88;border-radius:8px;background:#06111b55;pointer-events:none}
.corner-bar{display:grid;grid-template-columns:repeat(4,46px);grid-template-rows:repeat(2,46px);gap:5px;padding:6px;border:2px solid #b9e8ff;border-radius:9px;background:#123c5ddd;pointer-events:auto}
.corner-slot{position:relative;width:46px;height:46px;color:#fff;text-align:center;border:1px solid #8fc3df;border-radius:6px;background:#173b55}.corner-slot img{width:28px;height:28px;object-fit:contain;image-rendering:pixelated}.corner-slot b{position:absolute;left:2px;top:1px;font-size:10px}.corner-slot small{position:absolute;right:2px;bottom:1px;font-size:10px;text-shadow:1px 1px #000}.corner-slot.cool:after{content:attr(data-cool);position:absolute;inset:0;display:grid;place-items:center;font-weight:bold;background:#07131dbb}.corner-slot:hover:before{content:attr(data-tip);position:absolute;right:0;bottom:calc(100% + 7px);z-index:30;width:230px;padding:7px;color:#fff;text-align:left;white-space:pre-line;border:1px solid #a9d8ec;border-radius:6px;background:#102f45f2;box-shadow:0 3px 10px #0008}
.key-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.key-row{display:flex;justify-content:space-between;align-items:center;padding:7px;border-bottom:1px solid #c9b988}.key-row button{min-width:105px}
.key-row select{max-width:150px;padding:4px 6px;border:1px solid #8fc3df;border-radius:6px;background:#173b55;color:#fff}.item-hotkey-grid{margin-top:6px}
.tabs{display:flex;gap:7px;margin-bottom:12px}.tabs button.active{background:#e59632}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.equip-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:14px}
.card{position:relative;min-height:80px;padding:10px;border:2px solid #baa878;border-radius:9px;background:#fffaf0}.card strong,.card small{display:block}.card strong{color:#25678f}.card small{margin:4px 0;color:#756a58;white-space:pre-line}.card img{float:left;width:38px;height:38px;margin-right:9px;object-fit:contain;image-rendering:pixelated}
.card[data-tip]:hover:after{content:attr(data-tip);position:absolute;z-index:50;left:8px;bottom:calc(100% + 6px);width:250px;padding:9px;color:#fff;white-space:pre-line;border:2px solid #9fc8da;border-radius:8px;background:#173c55f5;box-shadow:0 5px 15px #0008}
.bag-grid{display:grid;grid-template-columns:repeat(10,54px);gap:6px;align-items:start;justify-content:start;max-width:594px}.bag-slot{position:relative;width:52px;height:52px;border:2px solid #8d7852;border-radius:7px;background:linear-gradient(#fff8df,#dfc98f);box-shadow:inset 0 0 0 2px #fff8;text-align:center}.bag-slot.empty{background:#d2c6a2aa;box-shadow:inset 0 0 8px #7a684477}.bag-slot img{width:32px;height:32px;margin-top:5px;object-fit:contain;image-rendering:pixelated}.bag-slot b{position:absolute;right:3px;bottom:2px;padding:0 2px;color:#fff;font-size:11px;text-shadow:1px 1px 2px #000;background:#0006;border-radius:3px}.bag-slot span{display:block;overflow:hidden;margin:0 2px;color:#5d4b2e;font-size:10px;white-space:nowrap;text-overflow:ellipsis}.bag-slot button{position:absolute;left:3px;right:3px;bottom:-24px;display:none;padding:2px 0!important;font-size:10px!important;border-width:1px!important}.bag-slot:hover button{display:block}.bag-slot[data-tip]:hover:after{content:attr(data-tip);position:absolute;z-index:70;left:0;bottom:calc(100% + 7px);width:245px;padding:8px;color:#fff;text-align:left;white-space:pre-line;border:2px solid #9fc8da;border-radius:8px;background:#173c55f5;box-shadow:0 5px 15px #0008}
.shop-status{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px;padding:9px;color:#fff;border-radius:8px;background:#285f7e}.row{display:flex;gap:8px;justify-content:space-between;align-items:center;padding:7px;border-bottom:1px solid #d6c9ab}.row span{flex:1}.row input[type=number]{width:64px;padding:6px;border:1px solid #aa936d;border-radius:5px;background:#fffdf4}
.skill-card.locked{opacity:.45}.skill-card .level-pips{color:#df8a1f}.skill-card button:disabled{opacity:.4}.skill-card img{float:none;width:48px;height:48px}.skill-icon{display:inline-block;position:relative;float:left;margin-right:10px}.skill-icon:hover:after{content:attr(data-tip);position:absolute;z-index:60;left:0;bottom:calc(100% + 5px);width:250px;padding:7px;color:#fff;white-space:pre-line;border-radius:6px;background:#173c55f5}
.ending{position:absolute;z-index:40;inset:0;display:grid;place-items:center;background:#061018d8}.ending>div{width:min(550px,80%);padding:30px;text-align:center;color:#4b351d;border:10px solid #8b5927;border-radius:16px;background:#f5e4ae;box-shadow:inset 0 0 35px #a87535,0 15px 50px #000}
.hud{position:relative;z-index:13;min-height:82px;margin:0 0 9px;padding:7px 10px;border-radius:0 0 14px 14px}.portrait{width:58px;height:58px;border:3px solid #d5edf8;border-radius:10px;background:#d8e8cd}.portrait img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.identity{width:105px}.identity strong,.identity span,.identity small{display:block}.identity span{color:#c7e7f4;font-size:12px}.identity .sp-line{display:none}
body.title-mode .hud{display:none}
.meters{flex:0 0 360px;max-width:360px}.meters label{display:grid;grid-template-columns:38px 86px 1fr;align-items:center;margin:3px 0;font-size:12px}.meters i{height:12px;padding:2px;border-radius:8px;background:#092f49}.meters i b{display:block;height:100%;border-radius:5px}.hp b{background:#df3730}.mp b{background:#348ee0}.exp b{background:#efb42c}
.quickslots{display:none}
footer{padding:6px;color:#8eacba;text-align:center;font-size:12px}
@media(max-width:850px){.brand{width:auto}.brand small{display:none}.top-actions button{font-size:11px;padding:6px}.quickslots div{width:40px}.quickslots span{display:none}.grid{grid-template-columns:1fr}.bag-grid{grid-template-columns:repeat(5,54px)}}
