.glass{outline-offset:0px;-webkit-backdrop-filter:blur(6px);background:#000c;border:2px solid #ffffffe6;border-radius:6px;outline:1.5px solid #000000d9;animation:.3s both sb-fade-in;box-shadow:0 8px 32px #0009,inset 0 0 0 1px #000000bf,inset 0 0 40px #000000a6}@keyframes sb-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.spell-bar.glass{pointer-events:auto;font-family:var(--font-hud);flex-direction:column;align-items:center;gap:0;padding:10px 16px 8px;display:flex;position:relative;-webkit-backdrop-filter:blur(24px)!important;background:#000000f2!important}.spell-bar-spells{align-items:center;gap:10px;display:flex}.spell-bar-separator{background:#ffffff26;align-self:center;width:1px;height:40px;margin:0 4px}.spell-bar-resources{justify-content:space-between;align-items:center;width:100%;padding-top:10px;display:flex}.spell-bar-pa{justify-content:flex-start;align-items:center;gap:5px;display:flex}.spell-bar-pm{justify-content:flex-end;align-items:center;gap:5px;display:flex}.pa-count-text{font-family:var(--font-hud);color:#fca800;letter-spacing:.05em;margin-right:4px;font-size:.85rem;font-weight:800}.pa-diamond{flex-shrink:0;width:6px;height:6px;margin:2px 3px;transition:background .2s,box-shadow .2s;display:block;transform:rotate(45deg)}.pa-diamond--full{background:#fca800;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #fca800a6}.pa-diamond--overflow{background:#00e5ff;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #00e5ffa6}.pa-diamond--overflow-2{background:#fbbf24;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #fbbf24a6}.pa-diamond--empty{background:#ffffff1a;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,inset 0 0 2px #0009}.pm-count-text{font-family:var(--font-hud);color:#9531ff;letter-spacing:.05em;margin-left:4px;font-size:.85rem;font-weight:800}.pm-diamond{flex-shrink:0;width:6px;height:6px;margin:2px 3px;transition:background .2s,box-shadow .2s;display:block;transform:rotate(45deg)}.pm-diamond--full{background:#9531ff;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #9531ffa6}.pm-diamond--overflow{background:#f43f5e;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #f43f5ea6}.pm-diamond--overflow-2{background:#00e5ff;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #00e5ffa6}.pm-diamond--overflow-3{background:#fbbf24;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 0 6px #fbbf24a6}.pm-diamond--empty{background:#ffffff1a;box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,inset 0 0 2px #0009}.spell-card{outline-offset:0px;cursor:pointer;-webkit-user-select:none;user-select:none;background:#000000bf;border:2px solid #ffffff8c;border-radius:5px;outline:1px solid #000000d9;flex-direction:column;width:58px;height:58px;transition:transform .2s cubic-bezier(.4,0,.2,1),border-color .2s,box-shadow .2s;display:flex;position:relative;overflow:visible;box-shadow:0 4px 12px #00000080,inset 0 0 0 1px #000000b3,inset 0 0 14px #00000080}.spell-card:hover:not(.disabled){border-color:#ffffffe6;transform:translateY(-5px);box-shadow:0 10px 22px #0000008c,inset 0 0 0 1px #000000b3,inset 0 0 14px #00000080}.spell-card.active{border-color:#fffffffa;transform:translateY(-3px);box-shadow:0 0 20px #ffffff2e,inset 0 0 0 1px #000000b3,inset 0 0 14px #00000080}.spell-card.disabled{cursor:not-allowed;border-color:#fff3}.spell-card.disabled .spell-card-inner,.spell-card.disabled .spell-icon-img{opacity:.4;filter:grayscale()}.spell-card.disabled .spell-pa-cost,.spell-card.disabled .spell-index-badge,.spell-card.disabled .spell-cooldown-overlay{opacity:.5;filter:grayscale()}.spell-card--empty{cursor:default;pointer-events:none;box-shadow:none;background:#00000073;border-style:dashed;border-color:#ffffff26}.spell-card-inner{background:#1e1e1e;border-radius:3px;position:absolute;inset:0;overflow:hidden}.spell-card-inner:before{content:"";pointer-events:none;z-index:1;transition:background-color .3s;position:absolute;inset:0}.family-warrior .spell-card-inner:before{background-color:#ef444473}.family-mage .spell-card-inner:before{background-color:#3b82f673}.family-ninja .spell-card-inner:before{background-color:#10b98173}.family-common .spell-card-inner:before{background-color:#0000}.spell-card-inner:after{content:"";pointer-events:none;z-index:2;background:linear-gradient(#0000 60%,#000c 100%);position:absolute;inset:0}.spell-icon-img{object-fit:cover;filter:grayscale()contrast(1.15);z-index:0;width:100%;height:100%;display:block;position:absolute;inset:0}.spell-index-badge{color:#ffffffb3;width:18px;height:18px;font-family:var(--font-hud);z-index:10;background:#000000bf;border:1px solid #ffffff59;border-radius:3px;justify-content:center;align-items:center;font-size:.75rem;font-weight:400;display:flex;position:absolute;top:5px;left:5px}.spell-pa-cost{z-index:10;background:#fca800;justify-content:center;align-items:center;width:16px;height:16px;margin-left:-8px;display:flex;position:absolute;bottom:-8px;left:50%;transform:rotate(45deg);box-shadow:-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000,0 -1px #000,0 1px #000,-1px 0 #000,1px 0 #000,0 2px 6px #000c}.spell-pa-cost-text{color:#fff;font-family:var(--font-hud);text-shadow:-1.5px -1.5px #000,1.5px -1.5px #000,-1.5px 1.5px #000,1.5px 1.5px #000,0 -1.5px #000,0 1.5px #000,-1.5px 0 #000,1.5px 0 #000;margin-top:-1px;margin-left:-1px;font-size:.95rem;font-weight:900;transform:rotate(-45deg)}.spell-cooldown-overlay{background:#0009;border-radius:6px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.spell-cooldown-value{color:#fff;text-shadow:0 2px 6px #0009;font-size:1.05rem;font-weight:900}.spell-tooltip-container{z-index:1000;pointer-events:none;width:240px;position:absolute;bottom:calc(100% + 19px);left:50%;transform:translate(-50%)}.spell-tooltip{outline-offset:0px;-webkit-backdrop-filter:blur(24px);background:#000000f2;border:2px solid #ffffffe6;border-radius:6px;outline:1.5px solid #000000d9;flex-direction:column;gap:12px;width:100%;padding:16px;animation:.2s cubic-bezier(.4,0,.2,1) tooltipFadeIn;display:flex;box-shadow:0 16px 48px #000000d9,inset 0 0 0 1px #000000bf,inset 0 0 40px #000000a6}.spell-keywords-container{flex-direction:column-reverse;gap:8px;display:flex;position:absolute;bottom:0;left:calc(100% + 8px)}.spell-keyword-tooltip .tooltip-title{color:#fca800}.spell-keyword-tooltip{outline-offset:0px;-webkit-backdrop-filter:blur(24px);background:#000000f2;border:2px solid #ffffffe6;border-radius:6px;outline:1.5px solid #000000d9;flex-direction:column;gap:8px;width:200px;height:fit-content;padding:12px 16px;animation:.2s cubic-bezier(.4,0,.2,1) both keywordFadeIn;display:flex;box-shadow:inset 0 0 0 1px #000000bf,inset 0 0 40px #000000a6}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes keywordFadeIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.tooltip-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.tooltip-title{color:#fff;text-transform:uppercase;letter-spacing:.05em;text-shadow:-2px -2px #000,2px -2px #000,-2px 2px #000,2px 2px #000,0 -2px #000,0 2px #000,-2px 0 #000,2px 0 #000;font-size:.9rem;font-weight:900}.family-warrior .spell-tooltip .tooltip-title{color:#ef4444}.family-mage .spell-tooltip .tooltip-title{color:#3b82f6}.family-ninja .spell-tooltip .tooltip-title{color:#10b981}.tooltip-cost{font-family:var(--font-hud);color:#fca800;letter-spacing:.05em;text-shadow:-2px -2px #000,2px -2px #000,-2px 2px #000,2px 2px #000,0 -2px #000,0 2px #000,-2px 0 #000,2px 0 #000;font-size:.9rem;font-weight:800}.tooltip-description{color:#fff;font-size:.82rem;font-style:italic;line-height:1.4}.tooltip-calc-section{background:#0000007a;border:1px solid #ffffff0d;border-radius:5px;flex-direction:column;gap:4px;padding:10px;display:flex}.tooltip-calc-row{justify-content:space-between;align-items:center;display:flex}.calc-label{color:#ffffff80;text-transform:uppercase;font-size:.65rem;font-weight:700}.calc-result{color:#60a5fa;text-shadow:0 0 10px #60a5fa4d;font-size:.95rem;font-weight:900}.tooltip-formula{color:#fff6;text-align:right;font-family:Courier New,Courier,monospace;font-size:.65rem}.tooltip-footer{color:#ffffff80;justify-content:space-between;margin-top:4px;font-size:.7rem;font-weight:700;display:flex}.tooltip-range{color:#9531ff;align-items:center;gap:4px;display:flex}.pmcolor{color:#9531ff;font-weight:700}.pacolor{color:#fca800;font-weight:700}.tooltip-cooldown{color:#f87171}.spell-bar-action{color:#fff;cursor:pointer;background:#60a5fa1f;border:1px solid #60a5fa4d;border-radius:6px;justify-content:center;align-self:center;align-items:center;transition:transform .12s,background .12s,border-color .12s;display:inline-flex}.spell-bar-action:hover:not(:disabled){background:#60a5fa33;transform:translateY(-2px)}.spell-bar-action:disabled{opacity:.4;cursor:not-allowed}.spell-bar-action.grimoire{width:44px;height:44px;font-size:1.1rem}.spell-bar-action.grimoire.active{background:#60a5fa47;border-color:#60a5fa;box-shadow:0 0 16px #60a5fa59}.spell-bar-action.pass{letter-spacing:.06em;text-transform:uppercase;gap:6px;height:44px;padding:10px 16px;font-size:.75rem;font-weight:800}.spell-bar-action.pass.ready{color:#fff;background:#60a5fa38;border-color:#60a5fa;animation:2s ease-in-out infinite passPulse;box-shadow:0 4px 16px #60a5fa59}@keyframes passPulse{0%,to{box-shadow:0 4px 16px #60a5fa4d}50%{box-shadow:0 4px 24px #60a5fa8c}}@media (width<=1024px){.spell-card{width:66px;height:66px}.pa-diamond{width:9px;height:9px}}@media (width<=768px){.spell-bar.glass{padding:8px 10px 6px}.spell-bar-spells{gap:6px}.spell-card{border-radius:4px;width:58px;height:58px}.spell-name{height:18px;font-size:.58rem}.spell-bar-action.grimoire{width:38px;height:38px;font-size:1rem}.spell-bar-action.pass{height:38px;padding:6px 10px;font-size:.65rem}.pa-diamond{width:8px;height:8px}.spell-bar-pa{gap:4px;padding-top:6px}}