#ui-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:#f8fafc;overflow:hidden}#ui-overlay button,#ui-overlay .interactive,.overlay-menu,.modal-backdrop,.touch-joystick-zone,.touch-action-btn,.icon-pill-btn{pointer-events:auto}.vignette-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity .4s ease;background:radial-gradient(circle at center,transparent 45%,rgba(225,29,72,.45) 85%,rgba(159,18,57,.75) 100%);z-index:2}.vignette-overlay.active{opacity:1;animation:pulse-vignette 2s ease-in-out infinite}@keyframes pulse-vignette{0%,to{opacity:.55}50%{opacity:.85}}.hud-pill{position:absolute;top:18px;left:18px;display:flex;align-items:center;gap:12px;padding:8px 16px;background:#0f172aa6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.14);border-radius:9999px;box-shadow:0 8px 24px -4px #00000080,inset 0 1px 1px #ffffff26;z-index:5;transition:all .25s ease;user-select:none}.hud-relic-badge{display:flex;align-items:center;gap:8px}.hud-relic-badge .relic-icon{width:16px;height:16px;transition:stroke .3s ease,filter .3s ease;filter:drop-shadow(0 0 6px currentColor)}.hud-power-name{font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#f8fafc}.hud-separator{width:1px;height:16px;background:#ffffff29}.hud-hearts{display:flex;align-items:center;gap:6px}.heart-svg{width:16px;height:16px;transition:transform .2s ease,fill .3s ease,filter .3s ease}.heart-svg.filled path{fill:#f43f5e;filter:drop-shadow(0 0 5px rgba(244,63,94,.5))}.heart-svg.empty path{fill:#0f172a80;stroke:#ffffff59;stroke-width:1.5}.heart-svg.pulsing{animation:heart-beat .9s ease-in-out infinite}@keyframes heart-beat{0%,to{transform:scale(1)}30%{transform:scale(1.22)}60%{transform:scale(.96)}}.hud-energy-container{display:flex;align-items:center;width:64px}.hud-energy-track{width:100%;height:6px;background:#0f172ad9;border:1px solid rgba(255,255,255,.18);border-radius:9999px;overflow:hidden;box-shadow:inset 0 1px 3px #000000b3;position:relative}.hud-energy-fill{height:100%;width:100%;border-radius:9999px;transition:width .12s ease-out,background .3s ease,box-shadow .3s ease}.hud-energy-fill.energy-fuego{background:linear-gradient(90deg,#ea580c,#fb923c,#fef08a);box-shadow:0 0 8px #fb923cb3}.hud-energy-fill.energy-embestida{background:linear-gradient(90deg,#0284c7,#38bdf8,#e0f2fe);box-shadow:0 0 8px #38bdf8b3}.hud-energy-fill.energy-raices{background:linear-gradient(90deg,#16a34a,#4ade80,#dcfce7);box-shadow:0 0 8px #4ade80b3}.hud-energy-fill.energy-default{background:linear-gradient(90deg,#d97706,#facc15,#fef9c3);box-shadow:0 0 8px #facc15b3}.hud-posture-wrap{display:flex;align-items:center;gap:6px;transition:opacity .25s ease}.hud-posture-track{width:48px;height:6px;background:#0f172ad9;border-radius:9999px;border:1px solid rgba(147,197,253,.25);overflow:hidden;box-shadow:inset 0 1px 3px #000000b3;position:relative}.hud-posture-fill{height:100%;width:100%;border-radius:9999px;background:linear-gradient(90deg,#3b82f6,#60a5fa,#bfdbfe);box-shadow:0 0 6px #60a5fab3;transition:width .1s ease-out,background .25s ease}.hud-posture-fill.posture-warning{background:linear-gradient(90deg,#d97706,#f59e0b,#fde68a);box-shadow:0 0 8px #f59e0bcc}.hud-posture-fill.posture-danger{background:linear-gradient(90deg,#dc2626,#ef4444,#fca5a5);box-shadow:0 0 10px #ef4444e6;animation:pulse-danger .5s infinite alternate}@keyframes pulse-danger{0%{opacity:.7}to{opacity:1}}.icon-pill-btn{position:absolute;top:18px;right:18px;width:38px;height:38px;display:flex;justify-content:center;align-items:center;background:#0f172aa6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.14);border-radius:50%;color:#e2e8f0;cursor:pointer;box-shadow:0 8px 24px -4px #00000080;transition:all .2s ease;z-index:5}.icon-pill-btn:hover{background:#1e293bd9;color:#38bdf8;border-color:#38bdf866;transform:scale(1.06)}.icon-pill-btn:active{transform:scale(.94)}.dialogue-card{position:absolute;bottom:24px;left:50%;transform:translate(-50%) translateY(0);width:90%;max-width:540px;padding:16px 22px;background:#0f172ae0;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(250,204,21,.45);border-radius:16px;box-shadow:0 16px 40px -8px #000000b3,0 0 25px #facc151f;z-index:8;opacity:1;transition:opacity .3s ease,transform .3s ease}.dialogue-card.hidden{opacity:0;transform:translate(-50%) translateY(14px);pointer-events:none}.dialogue-header{display:flex;align-items:center;gap:8px;margin-bottom:6px}.dialogue-badge{font-size:9px;font-weight:800;letter-spacing:1px;padding:2px 7px;background:#facc152e;color:#facc15;border:1px solid rgba(250,204,21,.4);border-radius:6px}.dialogue-speaker{font-size:11px;font-weight:700;letter-spacing:.8px;color:#f8fafc;text-transform:uppercase}.dialogue-text{font-size:13px;line-height:1.55;font-weight:400;color:#cbd5e1;margin:0}.radial-wheel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1);width:260px;height:260px;z-index:9;opacity:1;transition:opacity .2s ease,transform .2s ease;pointer-events:auto}.radial-wheel.hidden{opacity:0;transform:translate(-50%,-50%) scale(.92);pointer-events:none}.radial-center-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:#0f172ae6;backdrop-filter:blur(12px);border:2px solid #facc15;box-shadow:0 0 20px #facc1559;display:flex;justify-content:center;align-items:center;z-index:2}.radial-sector{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:86px;height:58px;padding:6px;background:#0f172abf;backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.14);border-radius:12px;color:#94a3b8;font-size:10px;font-weight:700;letter-spacing:.8px;box-shadow:0 6px 18px #0006;transition:all .18s ease;cursor:pointer}.radial-sector svg{transition:transform .2s ease,fill .2s ease}.radial-sector.active,.radial-sector:hover{background:#1e293bf2;border-color:#facc15;color:#f8fafc;transform:scale(1.08);box-shadow:0 0 20px #facc1573}.radial-sector.locked{opacity:.42;filter:grayscale(.9);cursor:not-allowed;border-style:dashed;border-color:#ffffff26}.radial-sector.locked:hover,.radial-sector.locked.active{background:#0f172ad9;border-color:#ef444480;color:#ef4444;transform:scale(1);box-shadow:0 0 10px #ef444433}.radial-sector.sector-north{top:14px;left:50%;transform:translate(-50%)}.radial-sector.sector-north.active{transform:translate(-50%) scale(1.08);color:#fb923c;border-color:#fb923c}.radial-sector.sector-east{top:50%;right:14px;transform:translateY(-50%)}.radial-sector.sector-east.active{transform:translateY(-50%) scale(1.08);color:#38bdf8;border-color:#38bdf8}.radial-sector.sector-south{bottom:14px;left:50%;transform:translate(-50%)}.radial-sector.sector-south.active{transform:translate(-50%) scale(1.08);color:#4ade80;border-color:#4ade80}.radial-sector.sector-west{top:50%;left:14px;transform:translateY(-50%)}.radial-sector.sector-west.active{transform:translateY(-50%) scale(1.08);color:#f472b6;border-color:#f472b6}.virtual-gamepad{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:6;transition:opacity .25s ease}.virtual-gamepad.hidden{display:none!important}.touch-joystick-zone{position:absolute;bottom:30px;left:30px;width:130px;height:130px;display:flex;justify-content:center;align-items:center;pointer-events:auto;touch-action:none}.touch-joystick-base{position:relative;width:110px;height:110px;border-radius:50%;background:#0f172a59;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid rgba(255,255,255,.25);box-shadow:0 8px 24px #00000059;display:flex;justify-content:center;align-items:center}.touch-joystick-thumb{position:absolute;width:46px;height:46px;border-radius:50%;background:#ffffff8c;border:2px solid #FFFFFF;box-shadow:0 4px 15px #38bdf880;transform:translate(0);transition:transform .05s ease-out;pointer-events:none}.touch-actions-zone{position:absolute;bottom:30px;right:30px;display:flex;flex-direction:column;align-items:center;gap:22px;pointer-events:auto}.touch-action-btn{width:64px;height:64px;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 8px 25px #00000073;transition:transform .12s ease,background .15s ease,filter .12s ease;user-select:none;touch-action:none}.touch-action-btn *,.touch-mini-btn *{pointer-events:none}.touch-action-btn:active,.touch-action-btn.touch-pressed{transform:scale(.91);filter:brightness(1.25)}.touch-action-btn.attack-btn{background:#f43f5e80;backdrop-filter:blur(12px);border:2px solid rgba(255,255,255,.5)}.touch-action-btn.attack-btn:active{background:#f43f5ed9}.touch-action-btn.skill-btn{position:relative;width:58px;height:58px;background:#facc1559;backdrop-filter:blur(12px);border:2px solid rgba(253,224,71,.6)}.touch-action-btn.skill-btn:active{background:#facc15bf}.touch-skill-label{font-size:8px;font-weight:800;letter-spacing:.5px;color:#0f172a;margin-top:2px}.swipe-hint{position:absolute;font-size:11px;opacity:.7;pointer-events:none}.swipe-hint.hint-n{top:-20px;left:50%;transform:translate(-50%)}.swipe-hint.hint-e{top:50%;right:-20px;transform:translateY(-50%)}.swipe-hint.hint-s{bottom:-20px;left:50%;transform:translate(-50%)}.swipe-hint.hint-w{top:50%;left:-20px;transform:translateY(-50%)}.overlay-menu{position:absolute;top:0;left:0;width:100%;height:100%;z-index:20;display:flex;justify-content:center;align-items:center;background:#080c16a6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:opacity .3s ease,visibility .3s ease;pointer-events:auto}.overlay-menu.hidden{opacity:0;visibility:hidden;pointer-events:none}#main-menu{background:url(/assets/images/cover.jpg) center/cover no-repeat;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:8% 0 10%;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.menu-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 52px;background:#0a0612d9;border:1px solid rgba(168,85,247,.4);border-radius:24px;box-shadow:0 20px 50px -10px #000000f2,0 0 40px #a855f726,inset 0 1px 2px #ffffff26;max-width:90%;width:400px;transition:opacity .4s ease,transform .4s ease}.menu-card.hidden{opacity:0;pointer-events:none;transform:translateY(20px);position:absolute}.brand-badge{display:inline-flex;align-items:center;gap:8px;padding:4px 12px;border-radius:9999px;background:#facc151f;border:1px solid rgba(250,204,21,.3);color:#facc15;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:14px}.title-container{text-align:center;display:flex;flex-direction:column;align-items:center;z-index:10}.game-title{font-family:Outfit,sans-serif;font-size:58px;font-weight:900;letter-spacing:4px;background:linear-gradient(90deg,#ff4500,gold,#32cd32 66%,#00bfff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0 0 6px;-webkit-text-stroke:2.5px #000;filter:drop-shadow(0px 8px 12px rgba(0,0,0,.9))}.game-subtitle{font-size:16px;font-weight:800;letter-spacing:6px;color:#c084fc;text-transform:uppercase;margin:0;-webkit-text-stroke:1px #000;text-shadow:0 4px 8px rgba(0,0,0,.9)}.press-enter-msg{font-family:Outfit,sans-serif;font-size:22px;font-weight:800;letter-spacing:4px;color:#fff;text-transform:uppercase;-webkit-text-stroke:1px #000;text-shadow:0 4px 12px rgba(0,0,0,.9);animation:blink 2s infinite ease-in-out;cursor:pointer;z-index:10;transition:opacity .3s;touch-action:manipulation;-webkit-tap-highlight-color:transparent;padding:12px 24px;text-align:center}.press-enter-msg.hidden{opacity:0;pointer-events:none;position:absolute}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}.menu-heading{font-family:Outfit,sans-serif;font-size:26px;font-weight:700;letter-spacing:1.5px;color:#f8fafc;margin:0 0 24px}.menu-buttons{display:flex;flex-direction:column;gap:12px;width:100%}.modern-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 24px;border-radius:12px;font-family:Inter,sans-serif;font-size:13px;font-weight:600;letter-spacing:.8px;cursor:pointer;transition:all .2s ease;border:1px solid transparent;user-select:none}.modern-btn.primary{background:linear-gradient(135deg,#f59e0b,#d97706);color:#0f172a;border-color:#fef08a66;box-shadow:0 4px 18px #f59e0b59}.modern-btn.primary:hover{background:linear-gradient(135deg,#fbbf24,#f59e0b);transform:translateY(-2px);box-shadow:0 8px 24px #f59e0b80}.modern-btn.primary:active{transform:translateY(1px)}.modern-btn.secondary{background:#1e293bb3;color:#f8fafc;border-color:#ffffff26;box-shadow:0 4px 15px #00000040}.modern-btn.secondary:hover{background:#334155d9;border-color:#38bdf866;color:#38bdf8;transform:translateY(-2px)}.modern-btn.secondary:active{transform:translateY(1px)}.modern-btn.tertiary{background:transparent;color:#94a3b8;border-color:transparent}.modern-btn.tertiary:hover{background:#ffffff0d;color:#f8fafc}.modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;z-index:30;background:#000000a6;backdrop-filter:blur(14px);display:flex;justify-content:center;align-items:center;transition:opacity .25s ease;pointer-events:auto}.modal-backdrop.hidden{opacity:0;visibility:hidden;pointer-events:none}.modal-box{background:#0f172aeb;border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:32px 36px;color:#f8fafc;width:440px;max-width:90%;box-shadow:0 25px 60px -15px #000000e6}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.modal-header h3{font-family:Outfit,sans-serif;font-size:16px;font-weight:700;letter-spacing:1px;color:#f8fafc;margin:0}.modal-close-btn{background:transparent;border:none;color:#94a3b8;font-size:18px;cursor:pointer;padding:4px;border-radius:6px;line-height:1;transition:color .15s ease}.modal-close-btn:hover{color:#f8fafc}.settings-list{display:flex;flex-direction:column;gap:16px;text-align:left}.setting-item{display:flex;align-items:flex-start;gap:14px}.setting-icon{font-size:18px;line-height:1.2}.setting-item strong{font-size:13px;color:#f8fafc;display:block;margin-bottom:2px}.setting-item p{font-size:12px;color:#94a3b8;line-height:1.45;margin:0}.cinematic-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:25;background:#000;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;transition:opacity .6s cubic-bezier(.16,1,.3,1),visibility .6s ease;pointer-events:auto;cursor:pointer}.cinematic-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.cinematic-image-layer{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;will-change:transform;pointer-events:none}.camera-slow-zoom-in{animation:camSlowZoomIn 12s cubic-bezier(.25,1,.5,1) forwards}.camera-slow-zoom-out{animation:camSlowZoomOut 12s cubic-bezier(.25,1,.5,1) forwards}.camera-pan-right{animation:camPanRight 6s ease-out forwards}.camera-pan-up{animation:camPanUp 8s ease-out forwards}.camera-slow-tilt-up{animation:camSlowTiltUp 15s ease-in-out forwards}.camera-shake{animation:camShake .4s infinite;transform-origin:center}.camera-static{transform:scale(1)}@keyframes camSlowZoomIn{0%{transform:scale(1)}to{transform:scale(1.15)}}@keyframes camSlowZoomOut{0%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes camPanRight{0%{transform:scale(1.15) translate(-5%)}to{transform:scale(1.15) translate(5%)}}@keyframes camPanUp{0%{transform:scale(1.15) translateY(5%)}to{transform:scale(1.15) translateY(-5%)}}@keyframes camSlowTiltUp{0%{transform:scale(1.2) translateY(10%)}to{transform:scale(1.2) translateY(-10%)}}@keyframes camShake{0%{transform:scale(1.05) translate(2px,1px) rotate(0)}10%{transform:scale(1.05) translate(-1px,-2px) rotate(-1deg)}20%{transform:scale(1.05) translate(-3px) rotate(1deg)}30%{transform:scale(1.05) translateY(2px) rotate(0)}40%{transform:scale(1.05) translate(1px,-1px) rotate(1deg)}50%{transform:scale(1.05) translate(-1px,2px) rotate(-1deg)}60%{transform:scale(1.05) translate(-3px,1px) rotate(0)}70%{transform:scale(1.05) translate(2px,1px) rotate(-1deg)}80%{transform:scale(1.05) translate(-1px,-1px) rotate(1deg)}90%{transform:scale(1.05) translate(2px,2px) rotate(0)}to{transform:scale(1.05) translate(1px,-2px) rotate(-1deg)}}.cinematic-transition-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:0;transition:opacity .45s ease}.transition-fade-black{background:#000;opacity:1}.transition-flash-white{background:#fff;opacity:1;transition:opacity .12s}.transition-crossfade{background:#000;opacity:1;transition:opacity .45s ease}.transition-clear{opacity:0!important}.cinematic-vignette{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;background:radial-gradient(circle at center,transparent 40%,rgba(0,0,0,.45) 80%,rgba(0,0,0,.85) 100%),linear-gradient(to top,rgba(0,0,0,.8) 0%,transparent 40%);z-index:2}.btn-skip-cinematic{position:absolute;top:22px;right:22px;z-index:10;display:flex;align-items:center;gap:6px;padding:8px 16px;background:#0f172aa6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.18);border-radius:9999px;color:#cbd5e1;font-family:Inter,sans-serif;font-size:11px;font-weight:600;letter-spacing:1px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 16px #0006}.btn-skip-cinematic:hover{background:#1e293be6;color:#f8fafc;border-color:#facc1580;transform:translateY(-1px)}.btn-skip-cinematic:active{transform:translateY(1px)}.cinematic-caption-box{position:relative;z-index:5;width:86%;max-width:780px;margin-bottom:28px;padding:20px 28px;background:#080c16d1;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.14);border-radius:18px;box-shadow:0 20px 50px -10px #000000d9,0 0 30px #00000080;user-select:none}.cinematic-speaker{font-size:10px;font-weight:800;letter-spacing:1.8px;color:#facc15;text-transform:uppercase;margin-bottom:8px;display:inline-block}.cinematic-text{font-family:Inter,sans-serif;font-size:14px;line-height:1.65;font-weight:400;color:#f1f5f9;margin:0;letter-spacing:.2px}.cinematic-prompt{display:flex;justify-content:flex-end;align-items:center;gap:5px;font-size:10px;font-weight:500;color:#94a3b8;margin-top:10px;letter-spacing:.5px}.cinematic-prompt-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#facc15;animation:pulse-dot 1.2s infinite ease-in-out}@keyframes pulse-dot{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}.vertical-power-gauge{position:absolute;right:22px;top:50%;transform:translateY(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 8px;background:#0a0f1dc7;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.18);border-radius:20px;box-shadow:0 10px 30px #000000a6,inset 0 0 15px #ffffff0a;user-select:none;pointer-events:none;transition:border-color .3s ease,box-shadow .3s ease}.gauge-header{display:flex;flex-direction:column;align-items:center;gap:3px}.gauge-icon{filter:drop-shadow(0 0 6px rgba(251,146,60,.8));transition:stroke .3s ease,filter .3s ease}.gauge-pct{font-family:Outfit,sans-serif;font-size:9px;font-weight:700;color:#e2e8f0;letter-spacing:.5px}.gauge-track{position:relative;width:12px;height:125px;background:#030712d9;border:1px solid rgba(255,255,255,.15);border-radius:9999px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:inset 0 2px 8px #000c}.gauge-fill{width:100%;border-radius:9999px;position:relative;transition:height .12s ease-out,background .3s ease,box-shadow .3s ease}.gauge-tip-light{position:absolute;top:0;left:0;width:100%;height:4px;background:#ffffffe6;border-radius:9999px;box-shadow:0 0 8px #fff}.gauge-lines{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.gauge-lines .tick{position:absolute;left:2px;right:2px;height:1px;background:#ffffff2e}.gauge-lines .tick-75{top:25%}.gauge-lines .tick-50{top:50%}.gauge-lines .tick-25{top:75%}.gauge-rune-badge{display:flex;justify-content:center;align-items:center;width:24px;height:18px;background:#0f172ae6;border-radius:6px;border:1px solid rgba(255,255,255,.12)}#gauge-power-abbr{font-family:Outfit,sans-serif;font-size:8px;font-weight:800;letter-spacing:.6px;color:#facc15}.gauge-fill.energy-fuego{background:linear-gradient(0deg,#b91c1c,#ea580c 45%,#f97316 75%,#fef08a);box-shadow:0 0 14px #f97316d9}.gauge-fill.energy-embestida{background:linear-gradient(0deg,#0369a1,#0284c7 45%,#38bdf8 75%,#e0f2fe);box-shadow:0 0 14px #38bdf8d9}.gauge-fill.energy-plantas,.gauge-fill.energy-raices{background:linear-gradient(0deg,#15803d,#16a34a 45%,#4ade80 75%,#dcfce7);box-shadow:0 0 14px #4ade80d9}.gauge-fill.energy-default{background:linear-gradient(0deg,#b45309,#d97706 45%,#facc15 75%,#fef9c3);box-shadow:0 0 14px #facc15d9}.touch-actions-cluster{position:absolute;bottom:18px;right:18px;width:230px;height:200px;pointer-events:auto;user-select:none;touch-action:none}.main-attack-btn{position:absolute;right:58px;bottom:10px;width:68px;height:68px;border-radius:50%;background:radial-gradient(circle,#f43f5e 20%,#be123c);border:2.5px solid rgba(255,255,255,.65);box-shadow:0 8px 24px #e11d4880,inset 0 2px 6px #fff6;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .1s ease,box-shadow .1s ease}.main-attack-btn:active{transform:scale(.91);background:radial-gradient(circle,#fb7185 20%,#e11d48);box-shadow:0 2px 10px #e11d48cc}.touch-action-btn.skill-btn,.skill-weak-btn{position:absolute;right:12px;bottom:74px;width:54px;height:54px;border-radius:50%;background:#facc1559;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:2px solid #facc15;box-shadow:0 6px 18px #facc1573;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .1s ease,background .15s ease;user-select:none;touch-action:none}.touch-action-btn.skill-btn:active,.skill-weak-btn:active{transform:scale(.91);background:#facc15bf}.touch-action-btn.skill-btn .swipe-hint{position:absolute;font-size:11px;line-height:1;opacity:.85;filter:drop-shadow(0 1px 3px rgba(0,0,0,.9));pointer-events:none;transition:transform .15s ease,opacity .15s ease}.touch-action-btn.skill-btn .swipe-hint.hint-n{top:-14px;left:50%;transform:translate(-50%)}.touch-action-btn.skill-btn .swipe-hint.hint-e{top:50%;right:-14px;transform:translateY(-50%)}.touch-action-btn.skill-btn .swipe-hint.hint-s{bottom:-14px;left:50%;transform:translate(-50%)}.touch-action-btn.skill-btn .swipe-hint.hint-w{top:50%;left:-14px;transform:translateY(-50%)}.skill-strong-btn{position:absolute;right:80px;bottom:96px;width:52px;height:52px;border-radius:50%;background:#f59e0b61;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid #f59e0b;box-shadow:0 6px 18px #f59e0b66;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .1s ease}.skill-strong-btn:active{transform:scale(.91);background:#f59e0bbf}.defend-btn{position:absolute;right:140px;bottom:46px;width:48px;height:48px;border-radius:50%;background:#3b82f661;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid #60a5fa;box-shadow:0 6px 16px #3b82f659;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .1s ease}.defend-btn:active{transform:scale(.91);background:#3b82f6bf}.dash-btn{position:absolute;right:0;bottom:12px;width:50px;height:50px;border-radius:50%;background:#94a3b859;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid #e2e8f0;box-shadow:0 6px 16px #0006;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .1s ease}.dash-btn:active{transform:scale(.91);background:#e2e8f0a6}.touch-mini-btn{position:absolute;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .1s ease,filter .1s ease;user-select:none;touch-action:none}.touch-mini-btn:active,.touch-mini-btn.touch-pressed{transform:scale(.9);filter:brightness(1.25)}.heal-btn{right:140px;bottom:104px;width:48px;height:48px;background:#22c55e6b;border:2px solid #4ade80;box-shadow:0 4px 16px #22c55e8c}.switch-btn{right:18px;bottom:140px;width:44px;height:44px;background:#facc1552;border:1.5px solid #facc15;box-shadow:0 4px 14px #facc1566}.btn-subtext{font-family:Outfit,sans-serif;font-size:7.5px;font-weight:800;letter-spacing:.4px;color:#fff;margin-top:1px}.btn-subtext.main-txt{font-size:8.5px;letter-spacing:.6px}.touch-sub-label{font-family:Outfit,sans-serif;font-size:7px;font-weight:800;color:#facc15;letter-spacing:.3px}@media (max-height: 580px){.vertical-power-gauge{top:65px;right:14px;transform:none;padding:6px}.gauge-track{height:90px}}#damage-numbers-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:15}.damage-number{position:absolute;left:0;top:0;font-family:Outfit,sans-serif;font-weight:800;font-size:16px;color:#fff;text-shadow:0px 2px 0px #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;pointer-events:none;opacity:0;transform-origin:center;will-change:transform,opacity}.damage-number.animate{animation:damage-pop .85s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes damage-pop{0%{transform:scale(.5);opacity:0}15%{transform:scale(1.2);opacity:1}30%{transform:scale(1);opacity:1}to{transform:scale(1);opacity:1}}
