@import "https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@300;400;700;900&display=swap";:root{--color-bg:#0a0c10;--color-panel:#161b22;--color-panel-border:#30363d;--color-text-main:#c9d1d9;--color-text-muted:#8b949e;--color-jade:#2ea043;--color-jade-glow:#2ea04366;--color-gold:#d29922;--color-gold-glow:#d2992266;--color-danger:#f85149;--color-danger-glow:#f8514966;--color-qi:#38bdf8;--color-qi-track:#0f172a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background-color:var(--color-bg);color:var(--color-text-main);font-family:Noto Serif TC,serif;font-weight:400;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(circle at 50% 20%, #1a202c 0%, var(--color-bg) 60%);width:100vw;height:100vh;overflow:hidden}#root{border-left:1px solid var(--color-panel-border);border-right:1px solid var(--color-panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#0a0c10d9;max-width:800px;height:100%;margin:0 auto;position:relative;box-shadow:0 0 50px #00000080}button{cursor:pointer;background:0 0;border:none;font-family:Noto Serif TC,serif}.app-container{flex-direction:column;justify-content:space-between;height:100vh;display:flex}.header{text-align:center;border-bottom:1px solid var(--color-panel-border);z-index:10;background:#161b22b3;padding:15px}.title{letter-spacing:4px;color:var(--color-gold);text-shadow:0 0 10px var(--color-gold-glow);font-size:20px;font-weight:900}.tab-container{flex:1;position:relative;overflow-y:auto}.tab-content{flex-direction:column;height:100%;display:flex}.main-view{flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex;position:relative}.meditation-area{justify-content:center;align-items:center;width:250px;height:250px;margin-bottom:20px;display:flex;position:relative}.meditation-circle{background:radial-gradient(circle, var(--color-jade-glow) 0%, transparent 70%);z-index:0;border:2px dashed #2ea0434d;border-radius:50%;width:100%;height:100%;animation:10s ease-in-out infinite breathe;position:absolute;box-shadow:0 0 50px #2ea04333}@keyframes breathe{0%{opacity:.6;transform:scale(1)rotate(0)}50%{opacity:1;transform:scale(1.1)rotate(180deg)}to{opacity:.6;transform:scale(1)rotate(360deg)}}.character-img{object-fit:cover;z-index:2;border:3px solid #d29922b3;border-radius:50%;width:180px;height:180px;animation:6s ease-in-out infinite float-char;position:relative;box-shadow:0 0 40px #38bdf880}@keyframes float-char{0%{transform:translateY(0);box-shadow:0 0 40px #38bdf880}50%{transform:translateY(-10px);box-shadow:0 0 60px #38bdf8cc}to{transform:translateY(0);box-shadow:0 0 40px #38bdf880}}.particles-container{z-index:3;pointer-events:none;border-radius:50%;position:absolute;inset:0;overflow:hidden}.qi-particle{background:var(--color-qi);width:6px;height:6px;box-shadow:0 0 10px var(--color-qi), 0 0 20px var(--color-jade);opacity:0;border-radius:50%;animation:linear infinite ascend;position:absolute;bottom:-10px}@keyframes ascend{0%{opacity:0;transform:translateY(0)scale(1)}20%{opacity:.9}80%{opacity:.8}to{opacity:0;transform:translateY(-250px)scale(.3)}}.realm-text{z-index:1;color:var(--color-text-main);text-shadow:0 0 15px #ffffff4d;flex-direction:column;align-items:center;gap:5px;font-size:28px;font-weight:700;display:flex;position:relative}.qi-rate{color:var(--color-jade);font-family:monospace;font-size:14px}.progress-section{z-index:2;flex-direction:column;align-items:center;gap:10px;padding:15px;display:flex;position:relative}.qi-bar-container{background-color:var(--color-qi-track);border:1px solid var(--color-panel-border);border-radius:10px;width:80%;height:20px;position:relative;overflow:hidden;box-shadow:inset 0 0 10px #000c}.qi-bar-fill{background:linear-gradient(90deg, #0ea5e9, var(--color-qi));height:100%;box-shadow:0 0 10px var(--color-qi);transition:width .2s linear}.qi-text{color:#fff;text-shadow:0 0 2px #000,0 0 4px #000;mix-blend-mode:difference;font-family:monospace;font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.btn-breakthrough,.btn-fight,.btn-upgrade{letter-spacing:2px;color:#1a202c;background:var(--color-gold);text-transform:uppercase;box-shadow:0 0 10px var(--color-gold-glow);opacity:.5;pointer-events:none;border-radius:8px;padding:10px 30px;font-size:16px;font-weight:700;transition:all .3s}.btn-breakthrough.ready,.btn-upgrade.ready,.btn-fight{opacity:1;pointer-events:auto;cursor:pointer}.btn-breakthrough.ready{animation:1.5s infinite pulse}.btn-breakthrough:hover,.btn-fight:hover,.btn-upgrade.ready:hover{box-shadow:0 0 20px var(--color-gold);transform:translateY(-2px)}.btn-breakthrough:active,.btn-fight:active,.btn-upgrade:active{transform:translateY(0)}@keyframes pulse{0%{box-shadow:0 0 10px var(--color-gold-glow)}50%{box-shadow:0 0 25px var(--color-gold)}to{box-shadow:0 0 10px var(--color-gold-glow)}}.logs-panel{background:var(--color-panel);border-top:1px solid var(--color-panel-border);flex-direction:column-reverse;height:120px;padding:10px;display:flex;overflow-y:auto}.log-entry{color:var(--color-text-muted);margin-bottom:6px;font-size:13px;line-height:1.4;animation:.3s ease-in fadeIn}.log-entry .timestamp{color:#58a6ff;margin-right:8px;font-family:monospace}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.navbar{background:var(--color-bg);border-top:1px solid var(--color-panel-border);height:60px;display:flex}.nav-btn{color:var(--color-text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;font-size:16px;font-weight:700;transition:all .3s;display:flex}.nav-btn.active{color:var(--color-gold);box-shadow:inset 0 -3px 0 var(--color-gold);background:#d299221a}.dungeon-tab,.cave-tab{padding:20px;overflow-y:auto}.tab-title{color:var(--color-qi);margin-bottom:5px;font-size:22px}.tab-desc{color:var(--color-text-muted);margin-bottom:20px;font-size:14px}.dungeon-list{flex-direction:column;gap:15px;display:flex}.dungeon-card{background:var(--color-panel);border:1px solid var(--color-panel-border);border-radius:8px;justify-content:space-between;align-items:center;padding:15px;display:flex}.dungeon-card.locked{opacity:.6;filter:grayscale()}.dungeon-card.locked .btn-fight{opacity:.2;pointer-events:none}.dungeon-info h3{color:var(--color-text-main);margin-bottom:5px}.enemy-text{color:var(--color-danger);font-size:14px}.req-text{color:var(--color-text-muted);margin-top:5px;font-size:12px}.inventory-section{flex-direction:column;gap:20px;margin-bottom:30px;display:flex}.spirit-stone-box{color:#fff;background:#2ea0431a;border:1px solid #2ea0434d;border-radius:8px;align-items:center;gap:10px;padding:15px;font-size:20px;font-weight:700;display:flex}.items-grid{flex-wrap:wrap;gap:10px;margin-top:10px;display:flex}.item-badge{color:var(--color-qi);border:1px solid var(--color-panel-border);background:#1f2937;border-radius:20px;padding:5px 12px;font-size:14px}.array-section{background:var(--color-panel);border:1px dashed var(--color-qi);border-radius:8px;flex-direction:column;gap:10px;padding:20px;display:flex}.array-section h3{color:var(--color-qi)}.modal-overlay{z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000c;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.modal-content{background:var(--color-panel);border:1px solid var(--color-gold);text-align:center;box-shadow:0 0 30px var(--color-gold-glow);border-radius:8px;max-width:80%;padding:30px}.modal-title{color:var(--color-gold);margin-bottom:15px;font-size:24px}.btn-close-modal{border:1px solid var(--color-text-muted);color:var(--color-text-main);cursor:pointer;background:0 0;border-radius:4px;margin-top:20px;padding:8px 24px;transition:all .2s}.btn-close-modal:hover{color:#fff;background:#ffffff1a}.combat-modal-overlay{z-index:200;background:#0a0c10fa;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.combat-arena-container{flex-direction:column;align-items:center;gap:40px;width:100%;max-width:600px;display:flex}.combat-title{color:var(--color-danger);text-shadow:0 0 15px var(--color-danger-glow);letter-spacing:2px;font-size:28px}.combat-arena{background:radial-gradient(circle,#161b22cc 0%,#0000 80%);border-radius:20px;justify-content:space-between;align-items:center;width:100%;padding:20px;display:flex}.combat-entity{flex-direction:column;align-items:center;gap:15px;width:120px;display:flex}.entity-avatar{filter:drop-shadow(0 0 10px #fff3);font-size:70px;transition:transform .2s}.entity-name{color:#fff;font-weight:700}.health-bar-container{background:#30363d;border:1px solid #000;border-radius:6px;width:100%;height:12px;overflow:hidden}.health-bar-fill{height:100%;transition:width .3s ease-out}.player-hp{background:var(--color-jade);box-shadow:0 0 10px var(--color-jade)}.enemy-hp{background:var(--color-danger);box-shadow:0 0 10px var(--color-danger)}.clash-icon{font-size:40px;animation:1s infinite alternate pulse}.combat-action-logs{text-align:center;justify-content:center;align-items:center;width:100%;height:80px;display:flex}.combat-action-text{color:var(--color-gold);text-shadow:0 0 15px var(--color-gold-glow);font-size:20px}.btn-close-combat{color:var(--color-jade);border:2px solid var(--color-jade);cursor:pointer;background:0 0;border-radius:8px;padding:12px 40px;font-size:18px;transition:all .3s}.btn-close-combat:hover{background:var(--color-jade);color:#000;box-shadow:0 0 20px var(--color-jade)}@keyframes attack-bump{0%{transform:translate(0)scale(1)}50%{transform:translate(30px)scale(1.2)}to{transform:translate(0)scale(1)}}@keyframes attack-bump-reverse{0%{transform:translate(0)scale(1)}50%{transform:translate(-30px)scale(1.2)}to{transform:translate(0)scale(1)}}.attack-bump{animation:.3s ease-out attack-bump}.attack-bump-reverse{animation:.3s ease-out attack-bump-reverse}@keyframes screen-shake{0%{filter:blur(2px)contrast(1.5)hue-rotate(-20deg);transform:translate(1px,1px)rotate(0)}10%{transform:translate(-1px,-2px)rotate(-1deg)}20%{transform:translate(-3px)rotate(1deg)}30%{transform:translate(3px,2px)rotate(0)}40%{transform:translate(1px,-1px)rotate(1deg)}50%{filter:blur()contrast()hue-rotate();transform:translate(-1px,2px)rotate(-1deg)}60%{transform:translate(-3px,1px)rotate(0)}70%{transform:translate(3px,1px)rotate(-1deg)}80%{transform:translate(-1px,-1px)rotate(1deg)}90%{transform:translate(1px,2px)rotate(0)}to{filter:none;transform:translate(1px,-2px)rotate(-1deg)}}.screen-shake{animation:.4s screen-shake}.bounce-in{animation:.5s cubic-bezier(.175,.885,.32,1.275) bounce-in}@keyframes bounce-in{0%{opacity:0;transform:scale(.5)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.banner-container{z-index:1000;pointer-events:none;flex-direction:column;gap:10px;width:90%;display:flex;position:absolute;top:10px;left:50%;transform:translate(-50%)}.banner-item{color:#fff;box-shadow:0 4px 15px #00000080, 0 0 10px var(--color-jade);text-align:center;border:1px solid var(--color-jade);letter-spacing:1px;background:#2ea043e6;border-radius:8px;padding:12px 20px;font-weight:700}.slide-down{animation:4s ease-in-out forwards slide-down}@keyframes slide-down{0%{opacity:0;transform:translateY(-50px)}10%{opacity:1;transform:translateY(0)}80%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-50px)}}.floating-text{pointer-events:none;z-index:210;text-shadow:2px 2px #000,-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000;font-size:24px;font-weight:900;animation:1s ease-out forwards float-up-fade;position:absolute;top:0;left:50%;transform:translate(-50%)}.float-dmg{color:#ff4d4d}.float-crit{color:#ffb84d;font-size:32px;animation:1.2s ease-out forwards float-up-fade-crit}.float-dodge{color:#8c8c8c;font-size:20px}@keyframes float-up-fade{0%{opacity:1;transform:translate(-50%)scale(.5)}20%{transform:translate(-50%,-20px)scale(1.2)}to{opacity:0;transform:translate(-50%,-60px)scale(1)}}@keyframes float-up-fade-crit{0%{opacity:1;transform:translate(-50%)scale(.5)}20%{transform:translate(-50%,-20px)scale(1.5)}to{opacity:0;transform:translate(-50%,-80px)scale(1)}}.combat-char-img{object-fit:cover;border:2px solid var(--color-gold);width:90px;height:90px;box-shadow:0 0 15px var(--color-gold-glow);border-radius:50%}.top-corner-actions{z-index:50;gap:10px;display:flex;position:absolute;top:15px;right:15px}.icon-btn{border:1px solid var(--color-panel-border);color:var(--color-gold);cursor:pointer;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0a0c10b3;border-radius:20px;padding:8px 12px;font-size:14px;transition:all .3s}.icon-btn:hover{background:var(--color-panel);box-shadow:0 0 10px var(--color-gold-glow)}.chat-panel{border-left:1px solid var(--color-gold);z-index:60;background:#0a0c10fa;flex-direction:column;width:320px;transition:transform .3s cubic-bezier(.19,1,.22,1);display:flex;position:absolute;top:0;bottom:0;right:0;transform:translate(100%);box-shadow:-5px 0 20px #000c}.chat-panel.open{transform:translate(0)}.chat-header{border-bottom:1px solid var(--color-panel-border);color:var(--color-text-main);background:#161b2280;justify-content:space-between;align-items:center;padding:15px;display:flex}.icon-btn-close{color:var(--color-danger);cursor:pointer;background:0 0;border:none;font-size:18px}.chat-messages{flex-direction:column;flex:1;gap:15px;padding:15px;display:flex;overflow-y:auto}.chat-bubble-container{flex-direction:column;max-width:80%;display:flex}.chat-bubble-container.others{align-self:flex-start}.chat-bubble-container.me{align-self:flex-end;align-items:flex-end}.chat-sender{color:var(--color-gold);opacity:.8;margin-bottom:3px;font-size:12px}.chat-bubble-container.me .chat-sender{color:var(--color-jade)}.chat-bubble{word-wrap:break-word;border-radius:12px;padding:10px 14px;font-size:14px;line-height:1.4}.chat-bubble-container.others .chat-bubble{color:#fff;background:#1f2937;border-top-left-radius:2px}.chat-bubble-container.me .chat-bubble{color:#fff;background:#2ea04333;border:1px solid #2ea04366;border-top-right-radius:2px}.chat-input-area{border-top:1px solid var(--color-panel-border);background:#0a0c10;padding:15px;display:flex}.chat-input-area input{border:1px solid var(--color-panel-border);color:#fff;background:#161b22;border-radius:20px;outline:none;flex:1;padding:10px}.chat-input-area button{background:var(--color-gold);color:#000;cursor:pointer;border:none;border-radius:20px;margin-left:10px;padding:0 15px;font-weight:700}