/* ======================================================
   WORLD OF ALENA — TEMPLATE VISUAL OFICIAL / AZUL ACRÍLICO
   public/styles.css é a fonte única de aparência estática em azul acrílico.
   JS controla apenas estado, geometria calculada e variáveis CSS dinâmicas.
   ====================================================== */

:root{
    color-scheme:dark;
    --woe-theme-name:azul-acrilico;

    --woe-z-game:0;
    --woe-z-base-ui:10;
    --woe-z-map:50;
    --woe-z-minimap:80;
    --woe-z-minimap-overlay:90;
    --woe-z-window:200;
    --woe-z-menu:300;
    --woe-z-body:999999;

    --woe-acrylic-bg:#03111f;
    --woe-acrylic-bg-2:#071b2e;
    --woe-acrylic-surface:rgba(8,28,54,.78);
    --woe-acrylic-surface-strong:rgba(10,38,74,.88);
    --woe-acrylic-surface-soft:rgba(92,190,255,.10);
    --woe-acrylic-head:rgba(15,68,124,.78);
    --woe-acrylic-head-2:rgba(9,42,82,.86);
    --woe-acrylic-border:rgba(126,214,255,.58);
    --woe-acrylic-border-soft:rgba(126,214,255,.24);
    --woe-acrylic-border-hot:rgba(160,232,255,.92);
    --woe-acrylic-text:#eafaff;
    --woe-acrylic-muted:#bdefff;
    --woe-acrylic-title:#85dcff;
    --woe-acrylic-chip:#8ee1ff;
    --woe-acrylic-blue:#31b3ff;
    --woe-acrylic-blue-2:#0966ca;
    --woe-acrylic-deep:#08244e;
    --woe-acrylic-danger:#ff6b84;
    --woe-acrylic-success:#7fffc0;
    --woe-acrylic-warning:#ffd27a;
    --woe-acrylic-radius:18px;
    --woe-acrylic-radius-sm:12px;
    --woe-acrylic-gap:10px;
    --woe-acrylic-shadow:0 22px 70px rgba(0,0,0,.58), 0 0 42px rgba(31,145,255,.20), inset 0 1px 0 rgba(255,255,255,.10), inset 0 0 0 1px rgba(255,255,255,.045);
    --woe-acrylic-shadow-soft:0 12px 34px rgba(0,0,0,.44), 0 0 22px rgba(31,145,255,.16), inset 0 1px 0 rgba(255,255,255,.08);
    --woe-acrylic-focus:0 0 0 2px rgba(142,225,255,.26), 0 0 18px rgba(49,179,255,.30);
    --woe-acrylic-panel-bg:radial-gradient(circle at 50% 0%, rgba(72,184,255,.18), transparent 44%), linear-gradient(180deg, var(--woe-acrylic-surface-strong), rgba(4,15,32,.90));
    --woe-acrylic-button-bg:linear-gradient(180deg, rgba(49,179,255,.32), rgba(8,47,96,.92));
    --woe-acrylic-button-bg-active:linear-gradient(180deg, rgba(142,225,255,.92), rgba(49,179,255,.78));
    --woe-acrylic-slot-bg:linear-gradient(180deg, rgba(16,53,94,.88), rgba(5,17,36,.94));

    /* Aliases oficiais atuais apontam para o tema azul acrílico. */
    --woe-ui-bg:var(--woe-acrylic-bg);
    --woe-ui-panel:var(--woe-acrylic-panel-bg);
    --woe-ui-panel-2:rgba(7,25,50,.74);
    --woe-ui-panel-3:var(--woe-acrylic-deep);
    --woe-ui-head:var(--woe-acrylic-head);
    --woe-ui-head-2:var(--woe-acrylic-head-2);
    --woe-ui-line:var(--woe-acrylic-border);
    --woe-ui-line-soft:var(--woe-acrylic-border-soft);
    --woe-ui-line-hot:var(--woe-acrylic-border-hot);
    --woe-ui-text:var(--woe-acrylic-text);
    --woe-ui-muted:var(--woe-acrylic-muted);
    --woe-ui-blue:var(--woe-acrylic-blue);
    --woe-ui-gold:var(--woe-acrylic-chip);
    --woe-ui-danger:var(--woe-acrylic-danger);
    --woe-ui-success:var(--woe-acrylic-success);
    --woe-ui-radius:var(--woe-acrylic-radius);
    --woe-ui-radius-sm:var(--woe-acrylic-radius-sm);
    --woe-ui-gap:var(--woe-acrylic-gap);
    --woe-ui-shadow:var(--woe-acrylic-shadow);
    --woe-ui-shadow-soft:var(--woe-acrylic-shadow-soft);
    --woe-ui-focus:var(--woe-acrylic-focus);

    --woe-ui-scale:1;
    --woe-ui-opacity:.92;

    /* Menu/mobile usa os mesmos tokens do template oficial. */
    --mm-bg:var(--woe-acrylic-surface);
    --mm-bg2:var(--woe-acrylic-panel-bg);
    --mm-line:var(--woe-acrylic-border);
    --mm-lite:rgba(255,255,255,.16);
    --mm-shadow:rgba(0,0,0,.44);
    --mm-gold:var(--woe-acrylic-chip);
    --mm-green:var(--woe-acrylic-success);
    --mm-red:var(--woe-acrylic-danger);
    --mm-blue:var(--woe-acrylic-blue);
    --mm-safe-top:env(safe-area-inset-top,0px);
    --mm-safe-bottom:env(safe-area-inset-bottom,0px);
}


*,*::before,*::after{box-sizing:border-box;}
html{margin:0;padding:0;width:100%;height:100%;min-height:100dvh;}
body{margin:0;padding:0;}

/* ===== Páginas oficiais ===== */

body.woe-page-login{
    width:100%;
    height:100%;
    min-height:100dvh;
    overflow:hidden;
    -webkit-user-select:none;
    user-select:none;
    -webkit-tap-highlight-color:transparent;
    background:var(--woe-acrylic-bg);
    font-family:Arial, Helvetica, sans-serif;
    color:#fff;
}

.nl-login-gate{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:calc(18px + env(safe-area-inset-top, 0px)) 18px calc(18px + env(safe-area-inset-bottom, 0px));
    box-sizing:border-box;
    background:
        radial-gradient(circle at 50% 12%, rgba(49,179,255,.26), transparent 42%),
        linear-gradient(180deg, rgba(2,8,18,.96), rgba(5,19,38,.98));
}

.nl-login-card{
    width:min(420px, 100%);
    border:1px solid var(--woe-acrylic-border);
    outline:0;
    border-radius:var(--woe-acrylic-radius);
    background:var(--woe-acrylic-panel-bg);
    box-shadow:var(--woe-acrylic-shadow);
    backdrop-filter:blur(16px) saturate(150%);
    -webkit-backdrop-filter:blur(16px) saturate(150%);
    padding:24px;
    text-align:center;
    image-rendering:auto;
}

.nl-login-logo{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:260px;
    max-width:86%;
    min-height:120px;
    margin-bottom:18px;
}

.nl-login-logo img{
    display:block;
    max-width:100%;
    max-height:180px;
    object-fit:contain;
    filter:drop-shadow(0 6px 10px rgba(0,0,0,.75));
}

.nl-login-title{
    font-size:22px;
    font-weight:900;
    margin-bottom:8px;
    text-shadow:2px 2px #000;
}

.nl-login-subtitle{
    margin:0 0 18px;
    font-size:13px;
    line-height:1.45;
    color:rgba(235,245,255,.86);
    text-shadow:1px 1px #000;
}

.nl-login-button{
    width:100%;
    min-height:48px;
    border:1px solid var(--woe-acrylic-border);
    outline:0;
    border-radius:var(--woe-acrylic-radius-sm);
    background:var(--woe-acrylic-button-bg);
    color:#fff;
    font-weight:900;
    font-size:16px;
    cursor:pointer;
    text-shadow:1px 1px #000;
}

.nl-login-button:hover{filter:brightness(1.08);}
.nl-login-button:disabled{filter:grayscale(.35) brightness(.8);cursor:default;}

.nl-login-status{
    min-height:18px;
    margin:12px 0 0;
    padding:0 6px;
    font-size:12px;
    line-height:1.35;
    font-weight:700;
    color:rgba(235,245,255,.9);
    text-shadow:1px 1px #000;
}

@media (max-width:700px) and (orientation:portrait){
    .nl-login-gate{
        align-items:flex-start;
        padding:calc(12px + env(safe-area-inset-top, 0px)) 12px calc(12px + env(safe-area-inset-bottom, 0px));
    }
    .nl-login-card{padding:16px;}
    .nl-login-logo{min-height:80px;margin-bottom:10px;}
    .nl-login-logo img{max-height:120px;}
    .nl-login-title{font-size:19px;}
    .nl-login-button{min-height:46px;}
}


/* ===== Mundo oficial ===== */

body.woe-page-world{
    width:100%;
    height:100%;
    min-height:100dvh;
    overflow:hidden;
    touch-action:none;
    overscroll-behavior:none;
    -webkit-user-select:none;
    user-select:none;
    -webkit-tap-highlight-color:transparent;
    background:var(--woe-acrylic-bg);
}

body.woe-page-world canvas{
    display:block;
    width:100vw;
    height:100dvh;
    max-width:100vw;
    max-height:100dvh;
    touch-action:none;
    background:var(--woe-acrylic-bg-2);
}

#woeGraphicsLoadingOverlay{
    position:fixed;
    inset:0;
    z-index:999999;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(180deg, rgba(3, 10, 24, .98), rgba(5, 22, 44, .96));
    color:#fff;
    font-family:Arial, sans-serif;
    pointer-events:all;
}
#woeGraphicsLoadingOverlay .woe-graphics-loading-box{
    min-width:260px;
    max-width:min(420px, calc(100vw - 32px));
    padding:22px 24px;
    border-radius:16px;
    background:rgba(7, 24, 48, .94);
    border:1px solid rgba(64, 174, 255, .42);
    box-shadow:0 18px 60px rgba(0,0,0,.5), 0 0 42px rgba(0, 128, 255, .16);
    text-align:center;
}
#woeGraphicsLoadingOverlay .woe-graphics-loading-title{
    font-weight:800;
    font-size:18px;
    margin-bottom:8px;
}
#woeGraphicsLoadingOverlay .woe-graphics-loading-text{
    font-size:13px;
    line-height:1.35;
    opacity:.9;
}

#woeConnectionNotice{
    position:fixed;
    top:calc(12px + env(safe-area-inset-top, 0px));
    left:50%;
    transform:translateX(-50%) translateY(-120%);
    z-index:1000000;
    max-width:min(520px, calc(100vw - 24px));
    padding:10px 14px;
    border-radius:16px;
    border:1px solid rgba(92, 190, 255, .52);
    background:linear-gradient(135deg, rgba(7, 33, 70, .72), rgba(9, 79, 139, .46));
    color:#eef8ff;
    font-family:Arial, sans-serif;
    font-size:13px;
    font-weight:800;
    letter-spacing:.1px;
    text-align:center;
    box-shadow:0 18px 60px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.18), 0 0 34px rgba(40, 154, 255, .22);
    backdrop-filter:blur(14px) saturate(150%);
    -webkit-backdrop-filter:blur(14px) saturate(150%);
    opacity:0;
    pointer-events:none;
    transition:opacity .22s ease, transform .22s ease;
}
#woeConnectionNotice.is-visible{
    opacity:1;
    transform:translateX(-50%) translateY(0);
}
#woeConnectionNotice .woe-connection-title{
    display:block;
    font-size:13px;
}
#woeConnectionNotice .woe-connection-subtitle{
    display:block;
    margin-top:2px;
    color:rgba(226, 244, 255, .78);
    font-size:11px;
    font-weight:700;
}



/* ===== Estados, variáveis dinâmicas e depuração oficial ===== */
.woe-hidden{display:none!important;}

.woe-graphics-fps-overlay{
    position:fixed;left:8px;bottom:8px;z-index:120;pointer-events:none;
    padding:4px 7px;border:1px solid rgba(255,255,255,.22);
    background:rgba(0,0,0,.58);color:#9eff9e;
    font:700 12px Arial, Helvetica, sans-serif;text-shadow:1px 1px #000;border-radius:3px;
}
#woeDebugF3Overlay{
    position:fixed;z-index:120;pointer-events:none;overflow:visible;font-family:Arial, Helvetica, sans-serif;
}
#woeDebugF3Panel{
    position:absolute;left:10px;top:64px;max-width:min(760px, calc(100vw - 20px));
    padding:10px;border:1px solid rgba(255,255,255,.28);background:rgba(0,0,0,.72);
    color:#fff;font:13px/18px Arial, Helvetica, sans-serif;text-shadow:1px 1px #000;pointer-events:auto;
}
#woeDebugF3Panel.is-collapsed{min-width:64px;min-height:42px;padding:6px;}
#woeDebugF3Minimize{
    position:absolute;right:8px;top:8px;width:48px;height:26px;
    border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.10);
    color:#fff;border-radius:4px;cursor:pointer;pointer-events:auto;
}
#woeDebugF3MetricsBody{pointer-events:none;}
.woe-debug-line{color:#fff;}
.woe-debug-line.is-title{color:#78ff9a;padding-right:58px;}
.woe-debug-line.is-chunk-description{color:#ffd166;}

body.woe-pixi-main-enabled #game + canvas,
.woe-pixi-main-view{
    position:fixed;left:0;top:0;width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;
    pointer-events:none;z-index:0;background:var(--woe-acrylic-bg-2);
}

.wme-empty-state{grid-column:1 / -1;opacity:.75;}
.woe-minimap-debug-row{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;}
.woe-minimap-legend-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--woe-minimap-legend-color,currentColor);border:1px solid rgba(0,0,0,.6);vertical-align:-1px;margin-right:4px;}
.woe-minimap-legend-cross{display:inline-block;width:10px;height:10px;color:var(--woe-minimap-legend-color,currentColor);font-weight:bold;margin-right:4px;}

#woePlanePortalWindow .woe-plane-color{background:var(--woe-plane-color, rgba(255,255,255,.18));}
#woeGuardianGateWindow .wgh-skin-frame{width:var(--wgh-skin-frame-width, 64px);height:var(--wgh-skin-frame-height, 64px);}
.mm-hud-bar b{width:var(--mm-bar-value,0%);}
.mm-item-tooltip .mm-tooltip-title{color:var(--item-rarity-title, #fff);text-shadow:0 0 12px var(--item-rarity-glow, rgba(255,255,255,.18));}
.mm-tooltip-badges .rarity{border-color:var(--item-rarity-color, currentColor);color:var(--item-rarity-title, var(--item-rarity-color, currentColor));box-shadow:0 0 10px var(--item-rarity-glow, transparent);}
.mm-tooltip-badges .element{border-color:var(--item-element-color, currentColor);color:var(--item-element-color, currentColor);box-shadow:0 0 10px var(--item-element-glow, transparent);}
.mm-slot.inactive-item-slot{opacity:.55;filter:grayscale(1);}

/* ===== Componentes oficiais ===== */

/* ===== Cliente: app.js — 384 ===== */
.woe-standard-overlay{position:fixed;inset:0;z-index:2147483200;display:none;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 35%,rgba(28,116,210,.22),rgba(2,8,22,.72));backdrop-filter:blur(3px);pointer-events:auto;font-family:Arial,Helvetica,sans-serif;color:var(--woe-acrylic-text);text-align:center;padding:20px;box-sizing:border-box}
.woe-standard-card{width:min(560px,calc(100vw - 28px));box-sizing:border-box;border:1px solid rgba(111,207,255,.62);border-radius:18px;background:linear-gradient(180deg,rgba(12,48,92,.98),rgba(5,18,42,.98));box-shadow:0 22px 70px rgba(0,0,0,.62),0 0 36px rgba(0,124,255,.22),inset 0 0 0 1px rgba(255,255,255,.07);padding:24px;overflow:hidden}
.woe-standard-kicker{font-size:12px;letter-spacing:.20em;text-transform:uppercase;color:var(--woe-acrylic-title);font-weight:900;margin-bottom:8px}
.woe-standard-title{font-size:26px;font-weight:950;line-height:1.08;margin:0 0 10px;color:#ffffff;text-shadow:0 2px 12px rgba(77,183,255,.34)}
.woe-standard-text{font-size:15px;line-height:1.48;color:var(--woe-acrylic-muted);margin:0}
.woe-standard-button{display:inline-flex;align-items:center;justify-content:center;margin-top:18px;min-width:132px;height:42px;padding:0 22px;border:1px solid var(--woe-acrylic-border-hot);border-radius:999px;background:var(--woe-acrylic-button-bg);color:#fff;font-weight:900;font-size:15px;letter-spacing:.02em;cursor:pointer;box-shadow:0 10px 28px rgba(0,0,0,.32),0 0 18px rgba(49,179,255,.20);text-shadow:0 1px 8px rgba(0,0,0,.45)}
.woe-standard-button:hover,.woe-standard-button:focus{outline:none;box-shadow:var(--woe-acrylic-focus),0 10px 28px rgba(0,0,0,.32)}
.woe-standard-button:disabled{opacity:.62;cursor:wait}

/* ===== Módulo: animation-manager.js — 1696 ===== */
#woePlanePortalWindow{
    position:fixed;
    left:50%; top:50%;
    transform:translate(-50%,-50%);
    width:min(440px, calc(100vw - 24px));
    max-height:min(680px, calc(100dvh - 24px));
    z-index:5200;
    display:none;
    padding:10px;
    touch-action:pan-y;
    overscroll-behavior:contain;
}
#woePlanePortalWindow.is-open{display:flex;flex-direction:column;gap:10px;}
#woePlanePortalWindow .woe-template-body,
#woePlanePortalWindow .woe-ui-body{
    flex:1 1 auto;
    min-height:0;
    max-height:calc(100dvh - 132px);
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y;
    overscroll-behavior:contain;
}
#woePlanePortalWindow .woe-plane-portal-title{display:flex;flex-direction:column;gap:2px;}
#woePlanePortalWindow .woe-plane-portal-title small{font-weight:600;color:var(--woe-ui-muted);}
#woePlanePortalWindow .woe-plane-portal-list{display:grid;grid-template-columns:1fr;gap:8px;touch-action:pan-y;}
#woePlanePortalWindow .woe-plane-row{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    min-height:48px;padding:8px 10px;
    border:1px solid rgba(86,154,255,.30);
    border-radius:12px;
    background:linear-gradient(180deg, rgba(22,42,72,.98), rgba(12,24,42,.98));
    color:var(--woe-ui-text);
    cursor:pointer;
    text-align:left;
    touch-action:manipulation;
}
#woePlanePortalWindow .woe-plane-row:hover{border-color:rgba(134,194,255,.88);filter:brightness(1.08);}
#woePlanePortalWindow .woe-plane-row[disabled]{opacity:.54;cursor:default;filter:none;}
#woePlanePortalWindow .woe-plane-name{display:flex;flex-direction:column;gap:2px;font-weight:900;}
#woePlanePortalWindow .woe-plane-name small{font-weight:600;color:var(--woe-ui-muted);}
#woePlanePortalWindow .woe-plane-color{width:18px;height:18px;border-radius:6px;border:1px solid rgba(255,255,255,.35);box-shadow:0 0 12px rgba(255,255,255,.08) inset;}

/* ===== Módulo: body-manager.js — 230 ===== */
#woedBodyRoot{position:fixed;inset:0;z-index:var(--woe-z-body,999999);display:none;align-items:center;justify-content:center;padding:20px;background:radial-gradient(circle at 50% 35%,rgba(28,116,210,.20),rgba(2,8,22,.76));backdrop-filter:blur(3px);font-family:Arial,Helvetica,sans-serif;color:var(--woe-acrylic-text);pointer-events:auto;text-align:center;box-sizing:border-box}
#woedBodyRoot.open{display:flex}
.woed-body-card{width:min(520px,100%);max-height:calc(100vh - 40px);overflow:auto;border:1px solid rgba(111,207,255,.62);border-radius:18px;background:linear-gradient(180deg,rgba(12,48,92,.98),rgba(5,18,42,.98));box-shadow:0 22px 70px rgba(0,0,0,.62),0 0 36px rgba(0,124,255,.20),inset 0 0 0 1px rgba(255,255,255,.07);padding:24px;box-sizing:border-box}
.woed-body-kicker{font-size:12px;letter-spacing:.20em;text-transform:uppercase;color:var(--woe-acrylic-title);font-weight:900;margin-bottom:8px}
.woed-body-title{font-size:30px;font-weight:950;color:#fff;text-shadow:0 2px 16px rgba(77,183,255,.34);margin-bottom:10px}
.woed-body-btn{display:block;width:100%;min-height:48px;margin:16px 0 0;border:1px solid rgba(136,225,255,.82);border-radius:13px;background:var(--woe-acrylic-button-bg-active);color:#fff;font-weight:950;font-size:16px;cursor:pointer;box-shadow:0 10px 28px rgba(0,120,255,.35),inset 0 1px 0 rgba(255,255,255,.28)}
.woed-body-btn:hover{filter:brightness(1.08)}
.woed-body-btn:disabled{opacity:.6;cursor:not-allowed}
.woed-body-status{min-height:18px;color:var(--woe-acrylic-muted);font-size:14px;line-height:1.45;margin-top:10px}
body.woed-interactState canvas{filter:grayscale(.25) brightness(.72)}

/* ===== Módulo: guardian-hub.js — 364 ===== */
#woeGuardianGateOverlay{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:12px;box-sizing:border-box;background:rgba(1,8,20,.58);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-family:Arial,Helvetica,sans-serif;color:var(--woe-ui-text);touch-action:auto;}
#woeGuardianGateWindow{width:min(620px,calc(100vw - 24px));max-height:min(760px,calc(100vh - 24px));padding:12px;border:1px solid rgba(86,154,255,.42);border-radius:18px;background:linear-gradient(180deg,rgba(17,34,62,.98),rgba(8,18,34,.98));box-shadow:0 22px 70px rgba(0,0,0,.62),0 0 42px rgba(0,128,255,.18);display:flex;flex-direction:column;gap:10px;box-sizing:border-box;}
#woeGuardianGateWindow .wgh-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 2px 4px;}
#woeGuardianGateWindow .wgh-title{display:flex;flex-direction:column;gap:2px;font-weight:950;font-size:18px;}
#woeGuardianGateWindow .wgh-title small{font-weight:700;font-size:12px;color:var(--woe-ui-muted);}
#woeGuardianGateWindow .wgh-body{display:flex;flex-direction:column;gap:10px;overflow:auto;}
#woeGuardianGateWindow .wgh-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:flex-end;}
#woeGuardianGateWindow .wgh-list{display:grid;grid-template-columns:1fr;gap:9px;}
#woeGuardianGateWindow .wgh-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-height:78px;padding:9px 10px;border:1px solid rgba(86,154,255,.30);border-radius:14px;background:linear-gradient(180deg,rgba(22,42,72,.98),rgba(12,24,42,.98));color:var(--woe-ui-text);text-align:left;box-sizing:border-box;}
#woeGuardianGateWindow .wgh-card.is-active{border-color:rgba(106,255,184,.88);box-shadow:0 0 20px rgba(76,255,184,.12);}
#woeGuardianGateWindow .wgh-spritebox{width:70px;height:70px;border:1px solid rgba(136,225,255,.28);border-radius:13px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:inset 0 0 18px rgba(0,0,0,.20);}
#woeGuardianGateWindow .wgh-skin-frame{position:relative;display:block;overflow:hidden;flex:0 0 auto;background:rgba(7,22,41,.72);border-radius:8px;}
#woeGuardianGateWindow .wgh-skin-img{position:absolute;left:0;top:0;display:block;max-width:none;max-height:none;image-rendering:pixelated;image-rendering:crisp-edges;transform-origin:0 0;user-select:none;-webkit-user-drag:none;}
#woeGuardianGateWindow .wgh-skin-img.is-loading{opacity:0;}
#woeGuardianGateWindow .wgh-skin-img.is-missing{display:none;}
#woeGuardianGateWindow .wgh-main{min-width:0;display:flex;flex-direction:column;gap:4px;}
#woeGuardianGateWindow .wgh-name{font-weight:950;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#woeGuardianGateWindow .wgh-meta{font-weight:700;color:var(--woe-ui-muted);font-size:12px;}
#woeGuardianGateWindow .wgh-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;}
#woeGuardianGateWindow .wgh-btn{border:1px solid rgba(136,225,255,.34);border-radius:12px;background:rgba(255,255,255,.08);color:var(--woe-acrylic-text);font-weight:950;padding:8px 10px;cursor:pointer;font:inherit;min-height:34px;}
#woeGuardianGateWindow .wgh-btn:hover{border-color:rgba(136,225,255,.88);filter:brightness(1.08);}
#woeGuardianGateWindow .wgh-btn.primary{background:var(--woe-acrylic-button-bg-active);border-color:rgba(136,225,255,.82);box-shadow:0 10px 28px rgba(0,120,255,.26);color:#fff;}
#woeGuardianGateWindow .wgh-btn.danger{border-color:rgba(255,112,112,.48);color:#ffd0d0;background:rgba(120,20,32,.26);}
#woeGuardianGateWindow .wgh-btn.ghost{background:rgba(255,255,255,.04);}
#woeGuardianGateWindow .wgh-btn[disabled]{opacity:.56;cursor:default;filter:none;}
#woeGuardianGateWindow .wgh-gender-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
#woeGuardianGateWindow .wgh-gender{min-height:38px;border:1px solid rgba(136,225,255,.30);border-radius:13px;background:rgba(255,255,255,.06);color:#ddecff;font-weight:950;cursor:pointer;font:inherit;}
#woeGuardianGateWindow .wgh-gender.is-active{background:linear-gradient(180deg,rgba(49,179,255,.34),rgba(9,102,202,.36));border-color:rgba(136,225,255,.88);box-shadow:0 8px 22px rgba(0,120,255,.18);color:#fff;}
#woeGuardianGateWindow .wgh-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:9px;}
#woeGuardianGateWindow .wgh-skin{min-height:118px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid rgba(86,154,255,.26);border-radius:14px;background:rgba(255,255,255,.06);color:var(--woe-acrylic-text);cursor:pointer;font:inherit;font-weight:900;text-align:center;padding:8px;}
#woeGuardianGateWindow .wgh-skin:hover{border-color:rgba(136,225,255,.88);background:rgba(49,179,255,.14);}
#woeGuardianGateWindow .wgh-skin.is-active{border-color:rgba(106,255,184,.86);box-shadow:0 0 20px rgba(76,255,184,.12);}
#woeGuardianGateWindow .wgh-skin small{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--woe-acrylic-muted);font-weight:750;}
#woeGuardianGateWindow .wgh-note{font-size:12px;color:var(--woe-ui-muted);font-weight:700;line-height:1.35;}
#woeGuardianGateWindow .wgh-error{min-height:16px;color:var(--woe-acrylic-danger);font-size:12px;font-weight:850;}
#woeGuardianGateWindow .wgh-field{display:flex;flex-direction:column;gap:6px;}
#woeGuardianGateWindow .wgh-label{font-size:12px;color:var(--woe-acrylic-muted);font-weight:900;}
#woeGuardianGateWindow .wgh-input{width:100%;box-sizing:border-box;border:1px solid rgba(136,225,255,.38);border-radius:13px;background:rgba(3,17,31,.34);color:#fff;font:inherit;font-weight:900;font-size:18px;padding:12px 13px;outline:none;}
#woeGuardianGateWindow .wgh-input:focus{border-color:rgba(136,225,255,.92);box-shadow:0 0 0 3px rgba(49,179,255,.14);}
#woeGuardianGateWindow .wgh-create-preview{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:10px;border:1px solid rgba(86,154,255,.26);border-radius:14px;background:rgba(255,255,255,.05);}
#woeGuardianHubBusy{position:fixed;inset:0;z-index:2147483640;display:flex;align-items:center;justify-content:center;background:rgba(1,8,20,.28);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);pointer-events:auto;}
#woeGuardianHubBusy .wgh-busy-card{min-width:150px;padding:16px 22px;border:1px solid rgba(136,225,255,.62);border-radius:18px;background:linear-gradient(180deg,rgba(17,34,62,.98),rgba(8,18,34,.98));box-shadow:0 18px 52px rgba(0,0,0,.50),0 0 26px rgba(0,128,255,.22);color:#fff;font-weight:950;text-align:center;}
#woeGuardianGateOverlay.is-busy #woeGuardianGateWindow{pointer-events:none;}
@media (max-width:640px){#woeGuardianGateWindow{width:calc(100vw - 18px);padding:10px;}#woeGuardianGateWindow .wgh-card{grid-template-columns:auto 1fr;}#woeGuardianGateWindow .wgh-actions{grid-column:1 / -1;justify-content:stretch;}#woeGuardianGateWindow .wgh-actions .wgh-btn{flex:1 1 auto;}#woeGuardianGateWindow .wgh-grid{grid-template-columns:repeat(2,1fr);}}

/* ===== Atalhos integrados em public/modulos/settings-manager.js ===== */
.woe-hotkeys-presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.woe-hotkeys-presets button,.woe-hotkeys-row button{border:1px solid rgba(136,225,255,.30);border-radius:11px;background:rgba(255,255,255,.08);color:var(--woe-acrylic-text);font-weight:900;padding:8px 10px;cursor:pointer}
.woe-hotkeys-presets button:hover,.woe-hotkeys-row button:hover{background:rgba(49,179,255,.20);border-color:rgba(136,225,255,.62)}
.woe-hotkeys-note{font-size:12px;color:var(--woe-acrylic-muted);margin:6px 0 10px;opacity:.86}
.woe-hotkeys-group{margin-top:12px;margin-bottom:5px;color:var(--woe-acrylic-title);font-weight:950;text-transform:uppercase;font-size:12px;letter-spacing:.08em}
.woe-hotkeys-row{display:grid;grid-template-columns:1fr 88px 92px;align-items:center;gap:8px;padding:7px;border-bottom:1px solid rgba(136,225,255,.10);border-radius:10px}
.woe-hotkeys-row.waiting{background:rgba(49,179,255,.18);outline:1px solid rgba(136,225,255,.70)}
.woe-hotkeys-row.duplicate kbd{outline:1px solid rgba(255,105,105,.80);color:#ffdada}
.woe-hotkeys-row kbd{background:var(--woe-acrylic-deep);border:1px solid rgba(136,225,255,.28);border-radius:9px;min-height:28px;display:flex;align-items:center;justify-content:center;font-weight:950;color:#fff}
@media(max-width:560px){.woe-hotkeys-row{grid-template-columns:1fr 70px 78px;font-size:12px}}

/* ===== Módulo: map-editor.js — 152 ===== */
#woe-map-editor-toggle{position:fixed;left:12px;top:52px;z-index:2147483000;border:1px solid rgba(136,225,255,.70);border-radius:13px;padding:10px 13px;color:#fff;background:linear-gradient(180deg,rgba(18,74,132,.96),rgba(7,31,70,.96));font-weight:950;box-shadow:0 10px 28px rgba(0,0,0,.40),0 0 22px rgba(0,124,255,.18);cursor:pointer}
#woe-map-editor-toggle.is-on{background:var(--woe-acrylic-button-bg-active);box-shadow:0 10px 30px rgba(0,120,255,.35)}
#woe-map-editor-panel{position:fixed;left:12px;top:96px;width:350px;max-width:calc(100vw - 24px);max-height:72vh;overflow:hidden;display:none;flex-direction:column;gap:10px;z-index:2147483000;color:var(--woe-acrylic-text);background:linear-gradient(180deg,rgba(12,48,92,.98),rgba(5,18,42,.98));border:1px solid rgba(111,207,255,.62);border-radius:18px;padding:12px;box-shadow:0 22px 70px rgba(0,0,0,.62),0 0 36px rgba(0,124,255,.20),inset 0 0 0 1px rgba(255,255,255,.07);font:13px Arial,Helvetica,sans-serif;box-sizing:border-box}
#woe-map-editor-panel .wme-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
#woe-map-editor-panel .wme-kicker{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--woe-acrylic-title);font-weight:950}
#woe-map-editor-panel .wme-title{font-size:18px;font-weight:950;color:#fff;line-height:1.1}
#woe-map-editor-panel .wme-close{border:1px solid rgba(136,225,255,.40);border-radius:11px;padding:6px 10px;background:rgba(255,255,255,.10);color:#fff;font-weight:950;cursor:pointer}
#woe-map-editor-panel .wme-status{color:var(--woe-acrylic-muted);line-height:1.35;background:rgba(255,255,255,.06);border:1px solid rgba(136,225,255,.16);border-radius:12px;padding:8px}
#woe-map-editor-panel .wme-row{display:flex;align-items:center;gap:8px}
#woe-map-editor-panel .wme-row span{min-width:64px;color:var(--woe-acrylic-title);font-weight:900}
#woe-map-editor-panel select{flex:1;padding:8px;border-radius:11px;background:var(--woe-acrylic-deep);color:#fff;border:1px solid rgba(136,225,255,.30);font-weight:800}
#woe-map-editor-panel [data-grid]{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;overflow:auto;padding-right:2px;max-height:42vh}
#woe-map-editor-panel .wme-help{color:var(--woe-acrylic-muted);opacity:.78;font-size:12px;line-height:1.35}

/* ===== Módulo: menus.js — 5898 ===== */
/* Tokens de menus definidos no :root oficial acima. */

#menuModuleRoot {
    pointer-events:none;
    color:var(--woe-acrylic-text);
    font-family:Arial, Helvetica, sans-serif;
    image-rendering:auto;
    text-shadow:none;
}

.mm-btn, .mm-button, .mm-slot, .mm-window, .mm-drawer, .mm-logo, .mm-big {
    box-sizing: border-box;
    border: 1px solid var(--mm-line); border-radius:var(--woe-acrylic-radius-sm);
    box-shadow:var(--woe-acrylic-shadow-soft); backdrop-filter:blur(12px) saturate(145%); -webkit-backdrop-filter:blur(12px) saturate(145%);
}

.mm-btn, .mm-button, .mm-big, .mm-close, .mm-drawer-close {
    pointer-events: auto;
    cursor: pointer;
    color: #fff;
    background:var(--woe-acrylic-button-bg);
    font-weight: bold;
    border-radius:var(--woe-acrylic-radius-sm);
    touch-action: manipulation;
}

.mm-btn:hover, .mm-button:hover, .mm-big:hover, .mm-close:hover, .mm-drawer-close:hover { filter: brightness(1.2); color:var(--woe-acrylic-chip); }

.mm-topbar {
    position: fixed;
    z-index: var(--woe-z-menu);
    top: calc(12px + var(--mm-safe-top));
    left: 12px;
    display: flex;
    gap: 8px;
    align-items: center;
    pointer-events: auto;
    max-width: calc(100vw - 24px);
}

.mm-btn, .mm-button { min-height: 40px; padding: 0 12px; }
.mm-logo { color: var(--mm-gold); background:var(--woe-acrylic-surface); }
.mm-menu-toggle { display: inline-block; min-width: 48px; font-size: 22px; }
.mm-logo, .mm-desktop { display: none !important; }

.mm-crosshair {
    position: absolute;
    left: 50%; top: 50%; transform: translate(-50%, -50%);
    font-size: 18px;
    opacity: .25;
}



.mm-mobile-status-hud {
    position: fixed;
    z-index: var(--woe-z-base-ui);
    top: calc(8px + var(--mm-safe-top));
    left: 50%;
    transform: translateX(-50%);
    display:flex; align-items:center; gap:8px; flex-wrap:wrap;
    max-width:min(520px, calc(100vw - 128px));
    min-height:30px;
    padding:5px 10px;
    color:var(--woe-acrylic-text); font-size:12px; font-weight:950;
    background:linear-gradient(145deg, rgba(12,72,126,.76), rgba(8,28,61,.70));
    border:1px solid rgba(142,225,255,.62);
    border-radius:999px;
    box-shadow:0 8px 22px rgba(0,0,0,.35), inset 0 0 14px rgba(142,225,255,.13);
    backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px);
    pointer-events:none; text-shadow:0 1px 2px #000;
}
.mm-hud-life { color:#fff; }
.mm-hud-bar { position:relative; display:block; width:54px; height:5px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.15); }
.mm-hud-bar b { display:block; height:100%; border-radius:999px; }
.mm-hud-bar.hp b { background:linear-gradient(90deg,#ff5f6d,#ffc371); }
.mm-hud-bar.xp b { background:linear-gradient(90deg,#7ad7ff,#f2d16b); }
.mm-combat-hint-chip { display:none !important; }
.mm-combat-hint-chip.show { display:none !important; }
.mm-combat-hint-chip span { display:none !important; }
.mm-side-button {
    position:fixed; z-index:var(--woe-z-base-ui);
    right:calc(12px + env(safe-area-inset-right,0px));
    width:46px; height:46px; border-radius:15px;
    color:var(--woe-acrylic-text); font-size:23px; font-weight:1000;
    background:linear-gradient(145deg, rgba(12,72,126,.88), rgba(8,28,61,.84));
    border:1px solid rgba(142,225,255,.74);
    box-shadow:0 10px 24px rgba(0,0,0,.42), inset 0 0 18px rgba(142,225,255,.18), 0 0 16px rgba(64,190,255,.20);
    backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px);
    pointer-events:auto; overflow:hidden;
    display:flex; align-items:center; justify-content:center;
}
.mm-side-button span { position:relative; z-index:1; }
.mm-side-inventory { bottom:calc(104px + var(--mm-safe-bottom)); }
.mm-action-toast {
    position:fixed; z-index:calc(var(--woe-z-window) + 10);
    left:50%; bottom:calc(154px + var(--mm-safe-bottom));
    transform:translateX(-50%) translateY(8px); opacity:0; pointer-events:none;
    padding:8px 14px; color:var(--woe-acrylic-text); font-weight:1000;
    background:linear-gradient(145deg, rgba(12,72,126,.92), rgba(8,28,61,.88));
    border:1px solid rgba(142,225,255,.78); border-radius:999px;
    box-shadow:0 12px 30px rgba(0,0,0,.48), inset 0 0 18px rgba(142,225,255,.16);
    transition:opacity .12s ease, transform .12s ease;
}
.mm-action-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
#menuModuleRoot .mm-action-toast:not(.show) { opacity:0; pointer-events:none; }
#menuModuleRoot.mm-action-busy [data-action],
#menuModuleRoot.mm-action-busy #mmDrawerToggle,
#menuModuleRoot.mm-action-busy .mm-side-button {
    filter:saturate(.82) brightness(.92);
}
#menuModuleRoot.mm-action-busy [data-action]:not(.mm-switch-btn):not([data-action="inventory"]),
#menuModuleRoot.mm-action-busy #mmDrawerToggle,
#menuModuleRoot.mm-action-busy .mm-side-button:not(.mm-side-inventory) {
    pointer-events:none;
}

.mm-hotbar {
    position: fixed;
    z-index: var(--woe-z-base-ui);
    left: 50%;
    bottom: calc(12px + var(--mm-safe-bottom));
    transform: translateX(-50%);
    display: grid;
    grid-template-columns: repeat(6, 60px);
    gap: 4px;
    padding: 6px;
    background:var(--woe-acrylic-surface);
    border:1px solid var(--woe-acrylic-border-soft);
    pointer-events: auto;
}

.mm-slot {
    width: 60px;
    height: 60px;
    background:var(--woe-acrylic-slot-bg);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
    user-select: none;
}

/* Inventário oficial: formato retrato, grid compacto e sem estilo especial nos slots.
   Os slots usam o estilo base do jogo, que encaixa melhor os itens. */

.mm-admin-inventory-switch { align-items:center; gap:3px; padding:2px; border:1px solid rgba(136,225,255,.32); background:rgba(3,17,31,.34); border-radius:999px; }
.mm-admin-inventory-switch .mm-switch-btn { border:0; border-radius:999px; padding:5px 9px; color:var(--woe-acrylic-muted); background:transparent; font-weight:950; cursor:pointer; }
.mm-admin-inventory-switch .mm-switch-btn.active { color:var(--woe-acrylic-bg-2); background:var(--woe-acrylic-button-bg-active); box-shadow:0 0 14px rgba(67,194,255,.35); }
.mm-inventory-status { min-height:18px; color:var(--woe-acrylic-chip); font-size:12px; font-weight:850; text-align:center; margin:-2px 0 6px; text-shadow:0 1px 2px #000; }
#mmInventoryGrid.is-adm-items { grid-template-columns:repeat(6, 60px); }
.mm-slot.adm-item-slot { border-color:rgba(142,225,255,.72); background:radial-gradient(circle at 50% 20%,rgba(142,225,255,.18),rgba(13,38,70,.85)); }
.mm-slot.adm-item-slot.selected { outline:3px solid var(--woe-acrylic-chip); box-shadow:0 0 18px rgba(142,225,255,.55); }
.mm-slot.magic-item-slot { border-color:rgba(180,126,255,.65); box-shadow:inset 0 0 12px rgba(137,84,255,.25); overflow:hidden; }
.mm-slot.charge-slot::before { content:""; position:absolute; left:0; right:0; bottom:0; height:calc(var(--charge-ratio, 1) * 100%); opacity:.58; z-index:0; transition:height .18s ease; }
.mm-slot.charge-atk::before { background:linear-gradient(0deg, rgba(255,171,54,.78), rgba(255,80,38,.35)); }
.mm-slot.charge-def::before { background:linear-gradient(0deg, rgba(102,234,255,.76), rgba(83,115,255,.34)); }
.mm-slot.magic-item-slot .mm-slot-img, .mm-slot.magic-item-slot .mm-icon, .mm-slot.magic-item-slot .mm-mode, .mm-slot.magic-item-slot small, .mm-slot .mm-key { z-index:1; }
.mm-slot.pending-attack { outline:2px solid var(--woe-acrylic-warning); border-color:rgba(255,210,122,.88) !important; box-shadow:0 0 0 2px rgba(255,109,44,.65), 0 0 22px rgba(255,213,87,.88), inset 0 0 18px rgba(255,170,65,.62); transform:translateY(-2px); }
.mm-slot.pending-attack::after { content:""; position:absolute; inset:-7px; border-radius:18px; border:1px solid rgba(126,214,255,.82); box-shadow:0 0 18px rgba(255,190,68,.78); pointer-events:none; animation:mmPendingAttackPulse .82s ease-in-out infinite alternate; }
@keyframes mmPendingAttackPulse { from { opacity:.55; transform:scale(.98); } to { opacity:1; transform:scale(1.04); } }
.mm-slot.defense-slot { border-color:rgba(104,235,255,.46); }
.mm-slot.blocked-by-inventory { opacity:.22; background:rgba(3,17,31,.48); box-shadow:none; }
.mm-slot.mm-server-move-source { outline:2px solid rgba(142,225,255,.95); box-shadow:0 0 18px rgba(142,225,255,.55), inset 0 0 10px rgba(142,225,255,.2); }
.mm-mode { position:absolute; right:2px; bottom:2px; font-size:9px; font-weight:1000; line-height:1; padding:2px 3px; border-radius:5px; color:var(--woe-acrylic-bg); background:var(--woe-acrylic-chip); box-shadow:0 1px 3px rgba(0,0,0,.50); }
.mm-mode.def { background:var(--woe-acrylic-muted); }
.mm-mode.atk { background:var(--woe-acrylic-warning); }
.mm-adm-loading { grid-column:1 / -1; text-align:center; }
#mmPanelInventory {
    width: min(500px, calc(100vw - 24px));
    max-height: calc(100dvh - 132px - var(--mm-safe-top) - var(--mm-safe-bottom));
    padding: 12px 12px 10px;
}
.mm-inventory {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(60px, 60px));
    gap: 5px;
    align-items: start;
}
#mmPanelInventory .mm-slot-count {
    padding: 4px 7px;
    font-size: 13px;
    border-width: 2px;
    background: rgba(0,0,0,.28);
}
#mmPanelInventory .mm-inventory {
    display: grid;
    grid-template-columns: repeat(6, 60px);
    grid-auto-rows: 60px;
    gap: 4px;
    justify-content: center;
    align-content: start;
    padding: 4px 0 0;
}

/* Estrutura oficial de slots e janelas: mantém layout, z-index e display sem CSS externo. */
.mm-slot:hover, .mm-slot.selected { outline: 2px solid var(--woe-acrylic-border-hot); }
.mm-slot.locked { opacity:.55; cursor:not-allowed; background:rgba(7,25,50,.58); border-color:rgba(255,255,255,.12); }
.mm-slot.locked:hover { outline:none; }
.mm-lock { font-size:20px; filter: drop-shadow(0 2px 2px #000); }
.mm-icon { font-size: 28px; line-height: 1; }
.mm-slot-img { width:42px; height:42px; object-fit:contain; image-rendering:pixelated; }
.mm-empty { opacity: .35; width: 60%; height: 60%; border: 1px dashed rgba(255,255,255,.25); }
.mm-key { position:absolute; left:4px; top:2px; color:var(--woe-acrylic-chip); font-size:11px; }
.mm-cursor-item { position:fixed; z-index:350; width:46px; height:46px; pointer-events:none; align-items:center; justify-content:center; background:linear-gradient(145deg, rgba(11,65,112,.88), rgba(11,29,58,.82)); border:1px solid rgba(142,225,255,.72); box-shadow:0 8px 22px rgba(0,0,0,.45), inset 0 0 16px rgba(142,225,255,.18), 0 0 14px rgba(64,190,255,.25); transform:translate(-50%, -118%); border-radius:8px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); opacity:0; will-change:left, top, transform, opacity; }
.mm-cursor-item.show { opacity:1; animation:mm-cursor-pickup .16s ease-out both, mm-cursor-float 1.25s ease-in-out .16s infinite; }
.mm-cursor-item.server-preview { border-color:rgba(255,210,122,.78); box-shadow:0 8px 22px rgba(0,0,0,.45), inset 0 0 16px rgba(255,210,122,.14), 0 0 16px rgba(255,210,122,.22); }
@keyframes mm-cursor-pickup { from { opacity:0; transform:translate(-50%, -118%) scale(.74) rotate(-5deg); } to { opacity:1; transform:translate(-50%, -118%) scale(1) rotate(0deg); } }
@keyframes mm-cursor-float { 0%, 100% { margin-top:0; } 50% { margin-top:-3px; } }
.mm-item-tooltip { position:fixed; z-index:360; pointer-events:none; transform:translate(-50%, -112%); min-width:190px; max-width:min(290px, calc(100vw - 18px)); padding:9px 10px; color:var(--woe-acrylic-text); background:linear-gradient(145deg, rgba(12,72,126,.92), rgba(8,28,61,.88)); border:1px solid rgba(142,225,255,.78); border-radius:12px; box-shadow:0 12px 30px rgba(0,0,0,.48), inset 0 0 22px rgba(142,225,255,.16), 0 0 18px rgba(64,190,255,.28); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); text-shadow:0 1px 2px rgba(0,0,0,.75); }
.mm-defense-toolkit { position:fixed; z-index:358; pointer-events:none; display:none; min-width:188px; max-width:min(230px, calc(100vw - 18px)); padding:9px 10px; color:var(--woe-acrylic-text); background:linear-gradient(145deg, rgba(12,72,126,.92), rgba(8,28,61,.88)); border:1px solid rgba(142,225,255,.78); border-radius:12px; box-shadow:0 12px 30px rgba(0,0,0,.48), inset 0 0 22px rgba(142,225,255,.16), 0 0 18px rgba(64,190,255,.28); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); text-shadow:0 1px 2px rgba(0,0,0,.75); opacity:0; transform:translateX(-4px); transition:opacity .12s ease, transform .12s ease; }
.mm-defense-toolkit.show { display:block; opacity:1; transform:translateX(0); }
.mm-defense-toolkit .mm-defense-preview { margin-top:7px; padding-top:5px; border-top:1px solid rgba(142,225,255,.18); }
.mm-defense-toolkit .mm-tooltip-row.preview b { color:var(--woe-acrylic-muted); text-shadow:0 0 8px rgba(122,234,255,.42), 0 1px 2px #000; }
.mm-item-tooltip.below { transform:translate(-50%, 8%); }
.mm-tooltip-title { font-weight:1000; font-size:13px; line-height:1.18; color:#fff; margin-bottom:3px; overflow-wrap:anywhere; }
.mm-tooltip-badges { display:flex; flex-wrap:wrap; gap:5px; margin:2px 0 5px; }
.mm-tooltip-badges span { font-size:10px; font-weight:1000; line-height:1; border:1px solid currentColor; border-radius:999px; padding:3px 6px; background:rgba(3,17,31,.36); text-transform:uppercase; letter-spacing:.02em; }
.mm-tooltip-badges .element { background:rgba(3,17,31,.28); }
.mm-tooltip-sub { display:inline-flex; font-size:10px; font-weight:1000; letter-spacing:.04em; text-transform:uppercase; color:var(--woe-acrylic-bg-2); background:var(--woe-acrylic-chip); border-radius:999px; padding:2px 6px; margin-bottom:6px; box-shadow:0 1px 4px rgba(0,0,0,.38); }
.mm-tooltip-sub.atk { background:var(--woe-acrylic-warning); color:#1b2a36; }
.mm-tooltip-sub.def { background:var(--woe-acrylic-muted); color:var(--woe-acrylic-bg-2); }
.mm-tooltip-body { display:grid; gap:3px; }
.mm-tooltip-row { display:flex; justify-content:space-between; gap:12px; font-size:11px; line-height:1.18; border-top:1px solid rgba(142,225,255,.13); padding-top:3px; }
.mm-tooltip-row span { color:var(--woe-acrylic-muted); }
.mm-tooltip-row b { color:#fff; font-weight:950; text-align:right; }
.mm-tooltip-row b.bonus { color:#ffd27a; text-shadow:0 0 8px rgba(255,210,122,.35), 0 1px 2px #000; }
.mm-tooltip-row b.charges { color:var(--woe-acrylic-chip); }
.mm-cursor-item small, .mm-cursor-item .mm-cursor-qty { position:absolute; right:3px; top:1px; min-width:16px; text-align:center; font-size:12px; line-height:1; color:#fff; background:rgba(3,17,31,.72); border:1px solid rgba(255,255,255,.42); border-radius:999px; padding:2px 4px; text-shadow:1px 1px #000; box-shadow:0 1px 4px rgba(0,0,0,.50); }
.mm-slot small.mm-qty { position:absolute; right:3px; top:2px; min-width:16px; text-align:center; font-size:11px; line-height:1; color:#fff; background:rgba(3,17,31,.72); border:1px solid rgba(255,255,255,.38); border-radius:999px; padding:2px 4px; text-shadow:1px 1px #000; box-shadow:0 1px 3px rgba(0,0,0,.50); }

.mm-window {
    position: fixed;
    z-index: var(--woe-z-window);
    top: calc(66px + var(--mm-safe-top));
    left: 50%;
    transform: translateX(-50%);
    width: min(760px, calc(100vw - 24px));
    max-height: calc(100dvh - 172px - var(--mm-safe-top) - var(--mm-safe-bottom));
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background:var(--woe-acrylic-panel-bg);
    padding: 14px;
    display: none;
    pointer-events: auto;
}
.mm-window.open { display: block; }
/* InventárioV1 fica montado o tempo todo. Abrir/fechar não cria layout nem dispara loading. */
#mmPanelInventory.mm-inventory-v1-window {
    display: block !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}
#mmPanelInventory.mm-inventory-v1-window.open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}
.mm-window, .mm-drawer, .mm-items-list, .mm-inventory {
    touch-action: pan-y;
    overscroll-behavior: contain;
}
.mm-slot, .mm-btn, .mm-button, .mm-close, .mm-drawer-close, .mm-big {
    -webkit-user-select:none;
    user-select:none;
    -webkit-touch-callout:none;
}
.mm-window-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
.mm-title { color: var(--mm-gold); font-weight: 900; font-size: 18px; }
.mm-close { min-width:36px; min-height:34px; font-size:22px; }
.mm-note, .mm-status { color:var(--woe-acrylic-muted); font-size:13px; margin:8px 0; }
#mmPanelInventory .mm-note, #mmPanelInventory .mm-status { display:none !important; }
.mm-slot-count { margin-left:auto; color:#fff; font-weight:900; background:rgba(3,17,31,.48); border:1px solid var(--woe-acrylic-border-soft); padding:6px 9px; }
.mm-status {
    position: fixed;
    z-index: var(--woe-z-window);
    left: 50%;
    bottom: calc(86px + var(--mm-safe-bottom));
    transform: translateX(-50%);
    min-height: 18px;
    max-width: calc(100vw - 24px);
    padding: 7px 10px;
    color:var(--woe-acrylic-text);
    background: linear-gradient(145deg, rgba(12,72,126,.86), rgba(8,28,61,.82));
    border: 1px solid rgba(142,225,255,.68);
    border-radius: 12px;
    box-shadow: 0 10px 26px rgba(0,0,0,.42), inset 0 0 18px rgba(142,225,255,.14);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    pointer-events: none;
}
.mm-inv-tools { display:flex; flex-wrap:wrap; gap:8px; }

.mm-panel-grid {
    display:grid;
    grid-template-columns: repeat(2, minmax(120px, 1fr));
    gap:10px;
}
.mm-big {
    min-height: 86px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-size:28px;
}
.mm-big span { font-size:14px; }
.mm-status-inline { color:var(--woe-acrylic-chip); background:rgba(3,17,31,.48); border:1px solid var(--woe-acrylic-border-soft); padding:8px; margin:8px 0 10px; }
.mm-items-list { display:grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap:10px; align-items:start; }
.mm-item-card { display:flex; gap:10px; align-items:center; background:rgba(3,17,31,.36); border:1px solid var(--woe-acrylic-border-soft); padding:8px; }
.mm-item-img { width:48px; height:48px; object-fit:contain; image-rendering:pixelated; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); flex:0 0 auto; }
.mm-item-info { display:grid; gap:6px; min-width:0; flex:1; }
.mm-item-file { color:var(--woe-acrylic-muted); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mm-item-name { width:100%; box-sizing:border-box; min-height:34px; padding:6px 8px; border:1px solid var(--woe-acrylic-border-soft); background:rgba(234,250,255,.92); color:#03111f; font-weight:bold; }
.mm-item-options-title { margin-top:2px; color:#ffd27a; font-size:12px; font-weight:bold; text-transform:uppercase; letter-spacing:.04em; }
.mm-check { display:flex; align-items:center; gap:8px; color:#fff; font-size:13px; user-select:none; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.22); padding:7px 8px; border-radius:6px; min-height:32px; }
.mm-item-card .mm-check { order: 5; }
.mm-item-card .mm-item-actions { order: 6; }
.mm-check input { width:18px; height:18px; flex:0 0 auto; accent-color:#ffd27a; }
.mm-item-actions { display:flex; gap:6px; flex-wrap:wrap; }
.mm-item-save, .mm-item-add { min-height:34px; flex:1; }

.mm-about { display:grid; gap:10px; }
.mm-about-card { display:flex; gap:14px; align-items:center; background:rgba(3,17,31,.34); border:1px solid var(--woe-acrylic-border-soft); padding:12px; }
.mm-about-logo { width:96px; height:96px; object-fit:contain; image-rendering:auto; filter:drop-shadow(0 5px 8px rgba(0,0,0,.65)); flex:0 0 auto; }
.mm-about-card h3 { margin:0 0 6px; color:var(--mm-gold); }
.mm-about-card p { margin:4px 0; }
.mm-about-link { color:var(--woe-acrylic-chip); font-weight:bold; }


.mm-backdrop {
    position: fixed;
    z-index: var(--woe-z-menu);
    inset: 0;
    background: rgba(0,0,0,.55);
    display: none;
    pointer-events: auto;
}
.mm-backdrop.open { display:block; }
.mm-drawer {
    position: fixed;
    z-index: var(--woe-z-menu);
    top: 0;
    right: 0;
    height: 100dvh;
    width: min(340px, 88vw);
    max-height: 100dvh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: calc(18px + var(--mm-safe-top)) 14px calc(18px + var(--mm-safe-bottom));
    background:var(--woe-acrylic-panel-bg); backdrop-filter:blur(14px) saturate(150%); -webkit-backdrop-filter:blur(14px) saturate(150%);
    pointer-events: auto;
    transform: translateX(105%);
    transition: transform .16s ease;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.mm-drawer.open { transform: translateX(0); }
.mm-drawer-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.mm-drawer-title { color: var(--mm-gold); font-weight:bold; font-size:20px; }
.mm-drawer-close { width:40px; height:38px; border:1px solid var(--woe-acrylic-border); background:linear-gradient(180deg, rgba(255,107,132,.38), rgba(74,10,24,.92)); color:#fff; font-size:28px; font-weight:900; line-height:28px; cursor:pointer; box-shadow:var(--woe-acrylic-shadow-soft); backdrop-filter:blur(12px) saturate(145%); -webkit-backdrop-filter:blur(12px) saturate(145%); }
.mm-drawer .mm-btn, .mm-drawer .mm-button { min-height:50px; text-align:left; display:grid; grid-template-columns:28px 1fr auto; justify-content:stretch; align-items:center; gap:8px; }
.mm-drawer .mm-btn b { font-size:14px; font-weight:900; }
.mm-menu-icon { width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; font-size:20px; line-height:1; filter: drop-shadow(0 1px 1px rgba(0,0,0,.65)); }

.mm-drawer-group {
    margin: 8px 0 2px;
    padding: 7px 8px;
    color: var(--mm-gold);
    background: rgba(255,255,255,.07);
    border:1px solid var(--woe-acrylic-border-soft);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: 12px;
}

@media (max-width: 760px) {
    .mm-desktop { display:none; }
    .mm-menu-toggle { display:inline-block; }
    .mm-topbar { right:auto; justify-content:flex-start; }
    .mm-window {
        top: calc(58px + var(--mm-safe-top));
        left:8px;
        right:8px;
        transform:none;
        width:auto;
        max-height: calc(100dvh - 92px - var(--mm-safe-top) - var(--mm-safe-bottom));
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        padding: 10px;
    }

.mm-admin-inventory-switch { align-items:center; gap:3px; padding:2px; border:1px solid rgba(136,225,255,.32); background:rgba(3,17,31,.34); border-radius:999px; }
.mm-admin-inventory-switch .mm-switch-btn { border:0; border-radius:999px; padding:5px 9px; color:var(--woe-acrylic-muted); background:transparent; font-weight:950; cursor:pointer; }
.mm-admin-inventory-switch .mm-switch-btn.active { color:var(--woe-acrylic-bg-2); background:var(--woe-acrylic-button-bg-active); box-shadow:0 0 14px rgba(67,194,255,.35); }
.mm-inventory-status { min-height:18px; color:var(--woe-acrylic-chip); font-size:12px; font-weight:850; text-align:center; margin:-2px 0 6px; text-shadow:0 1px 2px #000; }
#mmInventoryGrid.is-adm-items { grid-template-columns:repeat(6, 60px); }
.mm-slot.adm-item-slot { border-color:rgba(142,225,255,.72); background:radial-gradient(circle at 50% 20%,rgba(142,225,255,.18),rgba(13,38,70,.85)); }
.mm-slot.adm-item-slot.selected { outline:3px solid var(--woe-acrylic-chip); box-shadow:0 0 18px rgba(142,225,255,.55); }
.mm-adm-loading { grid-column:1 / -1; text-align:center; }
#mmPanelInventory {
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: min(414px, calc(100vw - 16px));
        padding: 10px 8px 8px;
    }
    #mmPanelInventory .mm-inventory {
        grid-template-columns: repeat(6, 44px);
        gap: 4px;
    }
    .mm-drawer {
        width: min(330px, 92vw);
        padding: calc(12px + var(--mm-safe-top)) 10px calc(12px + var(--mm-safe-bottom));
        gap: 8px;
    }
    .mm-drawer .mm-btn, .mm-drawer .mm-button { min-height:46px; }
    .mm-hotbar { grid-template-columns: repeat(6, 44px); gap:4px; padding:4px; }
    .mm-slot { width:44px; height:44px; }
    .mm-icon { font-size:23px; }
    .mm-inventory { grid-template-columns: repeat(auto-fill, minmax(44px, 44px)); }
}

@media (max-width: 390px) {
    .mm-hotbar { grid-template-columns: repeat(6, 40px); }
    .mm-slot { width:40px; height:40px; }
    .mm-icon { font-size:21px; }
    #mmPanelInventory { width: min(330px, calc(100vw - 12px)); }
    #mmPanelInventory .mm-inventory { grid-template-columns: repeat(6, 40px); }
}

@media (max-height: 520px) and (orientation: landscape) {
    .mm-topbar { top: calc(6px + var(--mm-safe-top)); left: 8px; }
    .mm-window {
        top: 0px;
        max-height: calc(100dvh - 58px - var(--mm-safe-top) - var(--mm-safe-bottom));
        padding: 8px;
    }

.mm-admin-inventory-switch { align-items:center; gap:3px; padding:2px; border:1px solid rgba(136,225,255,.32); background:rgba(3,17,31,.34); border-radius:999px; }
.mm-admin-inventory-switch .mm-switch-btn { border:0; border-radius:999px; padding:5px 9px; color:var(--woe-acrylic-muted); background:transparent; font-weight:950; cursor:pointer; }
.mm-admin-inventory-switch .mm-switch-btn.active { color:var(--woe-acrylic-bg-2); background:var(--woe-acrylic-button-bg-active); box-shadow:0 0 14px rgba(67,194,255,.35); }
.mm-inventory-status { min-height:18px; color:var(--woe-acrylic-chip); font-size:12px; font-weight:850; text-align:center; margin:-2px 0 6px; text-shadow:0 1px 2px #000; }
#mmInventoryGrid.is-adm-items { grid-template-columns:repeat(6, 60px); }
.mm-slot.adm-item-slot { border-color:rgba(142,225,255,.72); background:radial-gradient(circle at 50% 20%,rgba(142,225,255,.18),rgba(13,38,70,.85)); }
.mm-slot.adm-item-slot.selected { outline:3px solid var(--woe-acrylic-chip); box-shadow:0 0 18px rgba(142,225,255,.55); }
.mm-adm-loading { grid-column:1 / -1; text-align:center; }
#mmPanelInventory {
        width: min(416px, calc(100vw - 18px));
        max-height: calc(100dvh - 64px - var(--mm-safe-top) - var(--mm-safe-bottom));
        padding: 8px 8px 6px;
    }
    #mmPanelInventory .mm-inventory {
        grid-template-columns: repeat(6, 38px);
        gap: 4px;
    }
    .mm-hotbar {
        bottom: calc(6px + var(--mm-safe-bottom));
        grid-template-columns: repeat(6, 38px);
        gap: 3px;
        padding: 3px;
    }
    .mm-slot { width:38px; height:38px; }
    .mm-slot-img { width:29px; height:29px; }
    .mm-drawer { width:min(300px, 86vw); }
}


/* UI simples: inventário/defesa têm a largura da hotbar, 6 slots por linha e mesmo tamanho. */
:root { --mm-ui-slot: 60px; --mm-ui-gap: 4px; --mm-ui-pad: 6px; --mm-hotbar-width: calc((var(--mm-ui-slot) * 6) + (var(--mm-ui-gap) * 5) + (var(--mm-ui-pad) * 2)); }
#mmPanelInventory {
    left: 50%; right: auto; transform: translateX(-50%);
    width: var(--mm-hotbar-width); max-width: calc(100vw - 16px);
    padding: var(--mm-ui-pad);
}
#mmPanelInventory .mm-inventory {
    display:grid; grid-template-columns: repeat(6, var(--mm-ui-slot)); gap: var(--mm-ui-gap);
    justify-content:start; align-items:start; box-sizing:border-box;
}
#mmPanelInventory .mm-slot, #mmDefenseHotbarV1 .mm-slot, #mmHotbar .mm-slot {
    width:var(--mm-ui-slot); height:var(--mm-ui-slot);
}
.mm-item-tooltip { transform:none; max-width:min(210px, calc(100vw - 18px)); }
@media (max-width: 760px) {
    :root { --mm-ui-slot: 44px; --mm-ui-gap: 4px; --mm-ui-pad: 4px; }
    #mmPanelInventory { width: var(--mm-hotbar-width); padding: var(--mm-ui-pad); }
    #mmPanelInventory .mm-inventory { grid-template-columns: repeat(6, var(--mm-ui-slot)); gap: var(--mm-ui-gap); }
}
@media (max-height: 520px) and (orientation: landscape), (max-width:390px) {
    :root { --mm-ui-slot: 38px; --mm-ui-gap: 3px; --mm-ui-pad: 3px; }
}

@media (pointer: coarse) {
    .mm-btn, .mm-button, .mm-close, .mm-drawer-close { min-height:44px; }
    .mm-slot { touch-action: manipulation; }
    .mm-cursor-item { transform:translate(-50%, -135%); }
    .mm-item-tooltip { transform:none; max-width:min(190px, calc(100vw - 18px)); padding:7px 8px; }
    .mm-defense-toolkit { max-width:min(190px, calc(100vw - 18px)); padding:7px 8px; }
    .mm-item-tooltip .mm-tooltip-title { font-size:12px; line-height:1.12; }
    .mm-item-tooltip .mm-tooltip-sub { font-size:9px; padding:2px 5px; margin-bottom:4px; }
    .mm-item-tooltip .mm-tooltip-body { gap:2px; }
    .mm-item-tooltip .mm-tooltip-row { font-size:10px; line-height:1.1; padding-top:2px; }
    .mm-mobile-status-hud { top:calc(6px + var(--mm-safe-top)); font-size:11px; max-width:calc(100vw - 144px); gap:6px; padding:4px 8px; }
    .mm-hud-bar { width:42px; }
    .mm-combat-hint-chip { display:none !important; }
    .mm-combat-hint-chip span { display:none !important; }
    .mm-side-button { right:10px; } .mm-side-inventory { bottom:calc(112px + var(--mm-safe-bottom)); }
}
}


/* InventárioV1: um único inventário, hotbar inferior = slots 1-6, defesa = 3 slots superiores. */
#menuModuleRoot.inventory-open-v1 #mmHotbar { display:grid !important; opacity:.98 !important; z-index:calc(var(--woe-z-window) + 4) !important; }
.mm-inventory-v1-window {
    width: min(96vw, 438px) !important;
    max-height: calc(100dvh - 112px - var(--mm-safe-top) - var(--mm-safe-bottom)) !important;
    padding: 8px !important;
}
.mm-defense-hotbar-v1 {
    display: grid !important;
    grid-template-columns: repeat(4, var(--mm-invv1-slot, 48px)) !important;
    gap: var(--mm-invv1-gap, 6px) !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}
.mm-inventory-v1-grid {
    display: grid !important;
    grid-template-columns: repeat(6, var(--mm-invv1-slot, 48px)) !important;
    gap: var(--mm-invv1-gap, 6px) !important;
    justify-content: center !important;
    align-items: center !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    overflow: visible !important;
}
.mm-inventory-v1-grid .mm-slot,
.mm-defense-hotbar-v1 .mm-slot,
.mm-hotbar .mm-slot {
    width: var(--mm-invv1-slot, 48px) !important;
    height: var(--mm-invv1-slot, 48px) !important;
    border-radius: 10px !important;
}
.mm-inventory-hotbar-slot-v1,
.mm-bottom-hotbar-slot-v1 {
    border-color: rgba(255, 215, 102, .62) !important;
    box-shadow: 0 0 0 1px rgba(255, 215, 102, .22), inset 0 0 16px rgba(255, 215, 102, .08) !important;
}
.mm-defense-hotbar-slot-v1 {
    border-color: rgba(115, 218, 255, .65) !important;
    box-shadow: 0 0 0 1px rgba(115, 218, 255, .22), inset 0 0 16px rgba(115, 218, 255, .08) !important;
}
/* Slots liberados não recebem cainteractStateo. O cainteractStateo aparece apenas no próximo slot bloqueado. */
.mm-v1-rule-slot::before { content: none !important; display: none !important; }
.mm-v1-rule-slot .mm-key { z-index:5; }
.mm-inventory-v1-grid .mm-slot .mm-mode,
.mm-defense-hotbar-v1 .mm-slot .mm-mode,
.mm-hotbar .mm-slot .mm-mode {
    font-size: 8px !important;
    padding: 1px 3px !important;
}
.mm-hotbar {
    grid-template-columns: repeat(6, var(--mm-invv1-slot, 48px)) !important;
    gap: var(--mm-invv1-gap, 6px) !important;
}

/* Inventário oficial no layout azul acrílico. */
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
    border: 1px solid rgba(142,225,255,.72) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(87,177,255,.20), transparent 46%),
        linear-gradient(180deg, rgba(17,35,64,.92), rgba(7,16,32,.90)) !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08), 0 0 26px rgba(64,190,255,.20) !important;
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
    text-shadow: none !important;
    image-rendering: auto;
}
#menuModuleRoot #mmPanelInventory .mm-inventory-v1-grid {
    border: 1px solid rgba(142,225,255,.18) !important;
    border-radius: 14px !important;
    padding: 8px !important;
    background: rgba(5,14,28,.34) !important;
    box-shadow: inset 0 0 18px rgba(64,190,255,.08) !important;
}
@media (max-width: 520px) {
    #menuModuleRoot { --mm-invv1-slot: 42px; --mm-invv1-gap: 5px; }
    .mm-inventory-v1-window { width: min(96vw, 316px) !important; padding: 7px !important; }
}
@media (max-width: 380px) {
    #menuModuleRoot { --mm-invv1-slot: 38px; --mm-invv1-gap: 4px; }
    .mm-inventory-v1-window { width: min(97vw, 282px) !important; }
}

/* InventárioV1 UNIFICADO: um único estilo para TODOS os slots V1.
   Inventário, defesa e hotbar usam a mesma medida, mesmo fundo, mesma borda,
   mesmo ícone e mesma regra de leitura. Sem estilo separado para hotbar. */
#menuModuleRoot {
    --mm-invv1-slot: 60px;
    --mm-invv1-icon: 56px;
    --mm-invv1-gap: 6px;
}
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
    width: min(96vw, 452px) !important;
}
#menuModuleRoot #mmPanelInventory .mm-inventory-v1-grid {
    grid-template-columns: repeat(6, var(--mm-invv1-slot, 60px)) !important;
    gap: var(--mm-invv1-gap, 6px) !important;
    padding: 8px !important;
}
#menuModuleRoot .mm-defense-hotbar-v1 {
    grid-template-columns: repeat(3, var(--mm-invv1-slot, 60px)) !important;
    gap: var(--mm-invv1-gap, 6px) !important;
}
#menuModuleRoot .mm-hotbar {
    grid-template-columns: repeat(6, var(--mm-invv1-slot, 60px)) !important;
    gap: var(--mm-invv1-gap, 6px) !important;
    padding: 6px !important;
    background: rgba(5,14,28,.34) !important;
    border: 1px solid rgba(142,225,255,.22) !important;
    border-radius: 10px !important;
    box-shadow: inset 0 0 18px rgba(64,190,255,.08), 0 10px 24px rgba(0,0,0,.35) !important;
}

/* O SLOT é um só: mesma aparência nos 3 lugares. */
#menuModuleRoot .mm-inventory-v1-grid .mm-slot,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot,
#menuModuleRoot .mm-hotbar .mm-slot {
    width: var(--mm-invv1-slot, 60px) !important;
    height: var(--mm-invv1-slot, 60px) !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, rgba(18,38,68,.94), rgba(8,16,32,.96)) !important;
    border: 2px solid rgba(92,151,221,.78) !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,.46), 0 4px 10px rgba(0,0,0,.38) !important;
    overflow: visible !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot::after,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot::after,
#menuModuleRoot .mm-hotbar .mm-slot::after {
    display: none !important;
    content: none !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot-img,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot-img,
#menuModuleRoot .mm-hotbar .mm-slot-img {
    width: var(--mm-invv1-icon, 56px) !important;
    height: var(--mm-invv1-icon, 56px) !important;
    max-width: var(--mm-invv1-icon, 56px) !important;
    max-height: var(--mm-invv1-icon, 56px) !important;
    object-fit: contain !important;
    image-rendering: pixelated !important;
    z-index: 3 !important;
    filter: drop-shadow(0 2px 2px rgba(0,0,0,.68)) !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-icon,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-icon,
#menuModuleRoot .mm-hotbar .mm-icon {
    font-size: calc(var(--mm-invv1-slot, 60px) * .78) !important;
    z-index: 3 !important;
}

/* ATK/DEF não vira outro estilo: só muda a cor da borda do mesmo slot. */
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.magic-attack-slot,
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.charge-atk,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.magic-attack-slot,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.charge-atk,
#menuModuleRoot .mm-hotbar .mm-slot.magic-attack-slot,
#menuModuleRoot .mm-hotbar .mm-slot.charge-atk,
#menuModuleRoot .mm-inventory-hotbar-slot-v1,
#menuModuleRoot .mm-bottom-hotbar-slot-v1 {
    border-color: rgba(255,205,92,.92) !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.magic-defense-slot,
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.charge-def,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.magic-defense-slot,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.charge-def,
#menuModuleRoot .mm-hotbar .mm-slot.magic-defense-slot,
#menuModuleRoot .mm-hotbar .mm-slot.charge-def,
#menuModuleRoot .mm-defense-hotbar-slot-v1 {
    border-color: rgba(126,232,255,.92) !important;
}

/* Nada por cima do item: badge ATK/DEF e overlay de carga não competem com o ícone. */
#menuModuleRoot .mm-inventory-v1-grid .mm-slot .mm-mode,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot .mm-mode,
#menuModuleRoot .mm-hotbar .mm-slot .mm-mode {
    display: none !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.charge-slot::before,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.charge-slot::before,
#menuModuleRoot .mm-hotbar .mm-slot.charge-slot::before,
#menuModuleRoot .mm-v1-rule-slot.magic-item-slot::before {
    display: none !important;
    content: none !important;
}

/* Quantidade e tecla ficam pequenas; o item continua sendo o foco. */
#menuModuleRoot .mm-inventory-v1-grid .mm-slot small.mm-qty,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot small.mm-qty,
#menuModuleRoot .mm-hotbar .mm-slot small.mm-qty {
    right: -3px !important;
    top: -4px !important;
    min-width: 14px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    padding: 2px 4px !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.78) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.55) !important;
    z-index: 6 !important;
}
#menuModuleRoot .mm-v1-rule-slot .mm-key {
    left: -3px !important;
    top: -5px !important;
    min-width: 13px !important;
    height: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 9px !important;
    font-weight: 1000 !important;
    line-height: 1 !important;
    padding: 1px 3px !important;
    border-radius: 999px !important;
    color: #fff7b8 !important;
    background: rgba(0,0,0,.70) !important;
    border: 1px solid rgba(255,220,110,.44) !important;
    text-shadow: 0 1px 1px #000 !important;
    z-index: 7 !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-empty,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-empty,
#menuModuleRoot .mm-hotbar .mm-empty {
    opacity: .33 !important;
    width: 44% !important;
    height: 44% !important;
}

@media (max-width: 520px) {
    #menuModuleRoot {
        --mm-invv1-slot: 54px;
        --mm-invv1-icon: 50px;
        --mm-invv1-gap: 5px;
    }
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window { width: min(96vw, 416px) !important; }
}
@media (max-width: 380px) {
    #menuModuleRoot {
        --mm-invv1-slot: 48px;
        --mm-invv1-icon: 44px;
        --mm-invv1-gap: 4px;
    }
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window { width: min(97vw, 374px) !important; }
}

/* Ajuste final: mantém UM estilo para todos os slots, fixa a defesa e devolve a pintura de carga.
   Não cria estilo separado para hotbar/inventário/defesa; só trata estados do mesmo slot. */
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}
#menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1 {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 11 !important;
    width: max-content !important;
    max-width: 100% !important;
    margin: 6px auto 8px !important;
    padding: 6px 8px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, rgba(8,22,44,.88), rgba(4,12,26,.72)) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.30), inset 0 0 14px rgba(64,190,255,.08) !important;
    backdrop-filter: blur(8px) saturate(135%);
    -webkit-backdrop-filter: blur(8px) saturate(135%);
}
#menuModuleRoot #mmPanelInventory .mm-inventory-v1-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    padding-bottom: 14px !important;
}

/* Pintura/carga do item: fica atrás do ícone em TODOS os slots de carga. */
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.charge-slot::before,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.charge-slot::before,
#menuModuleRoot .mm-hotbar .mm-slot.charge-slot::before,
#menuModuleRoot .mm-v1-rule-slot.magic-item-slot::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    height: calc(var(--charge-ratio, 1) * 100%) !important;
    opacity: .46 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    border-radius: 10px !important;
    transition: height .18s ease !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.charge-atk::before,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.charge-atk::before,
#menuModuleRoot .mm-hotbar .mm-slot.charge-atk::before {
    background: linear-gradient(0deg, rgba(255,171,54,.82), rgba(255,80,38,.30)) !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot.charge-def::before,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot.charge-def::before,
#menuModuleRoot .mm-hotbar .mm-slot.charge-def::before {
    background: linear-gradient(0deg, rgba(102,234,255,.78), rgba(83,115,255,.30)) !important;
}
#menuModuleRoot .mm-inventory-v1-grid .mm-slot-img,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot-img,
#menuModuleRoot .mm-hotbar .mm-slot-img,
#menuModuleRoot .mm-inventory-v1-grid .mm-icon,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-icon,
#menuModuleRoot .mm-hotbar .mm-icon {
    position: relative !important;
    z-index: 3 !important;
}

/* ATK/DEF volta a aparecer sem tampar o item: chip pequeno do mesmo estilo de slot. */
#menuModuleRoot .mm-inventory-v1-grid .mm-slot .mm-mode,
#menuModuleRoot .mm-defense-hotbar-v1 .mm-slot .mm-mode,
#menuModuleRoot .mm-hotbar .mm-slot .mm-mode {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    right: 2px !important;
    bottom: 2px !important;
    min-width: 20px !important;
    min-height: 11px !important;
    padding: 1px 3px !important;
    border-radius: 5px !important;
    font-size: 8px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    letter-spacing: -.02em !important;
    z-index: 8 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.75) !important;
    text-shadow: none !important;
    pointer-events: none !important;
}
#menuModuleRoot .mm-slot .mm-mode.atk {
    color:#1b2a36 !important;
    background: rgba(255,210,122,.96) !important;
    border: 1px solid rgba(255,245,180,.72) !important;
}
#menuModuleRoot .mm-slot .mm-mode.def {
    color:var(--woe-acrylic-bg-2) !important;
    background: rgba(194,247,255,.96) !important;
    border: 1px solid rgba(230,255,255,.72) !important;
}
#menuModuleRoot .mm-slot.item-visualized {
    border-color: var(--item-rarity-color, rgba(92,151,221,.78)) !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,.46), 0 0 14px var(--item-rarity-glow, rgba(142,225,255,.18)), 0 4px 10px rgba(0,0,0,.38) !important;
}
#menuModuleRoot .mm-slot.item-visualized .mm-slot-img,
#menuModuleRoot .mm-slot.item-visualized .mm-icon {
    filter: drop-shadow(0 2px 2px rgba(0,0,0,.68)) drop-shadow(0 0 6px var(--item-rarity-glow, rgba(142,225,255,.20))) !important;
}
#menuModuleRoot .mm-slot .mm-item-element-chip {
    position:absolute !important;
    left: 3px !important;
    bottom: 3px !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 999px !important;
    background: var(--item-element-color, #8ee1ff) !important;
    border: 1px solid rgba(0,0,0,.58) !important;
    box-shadow: 0 0 8px var(--item-element-glow, rgba(142,225,255,.42)), inset 0 0 2px rgba(255,255,255,.58) !important;
    z-index: 10 !important;
    pointer-events:none !important;
}
#menuModuleRoot .mm-slot.item-visual-disabled {
    border-color: rgba(100,105,116,.62) !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,.55), 0 4px 10px rgba(0,0,0,.38) !important;
}
#menuModuleRoot .mm-slot.item-visual-disabled .mm-item-element-chip { display:none !important; }
#menuModuleRoot .mm-slot small.mm-qty,
#menuModuleRoot .mm-v1-rule-slot .mm-key {
    z-index: 9 !important;
}

#menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1.mm-inventory-side-trade-v1 {
    border: 1px solid rgba(255, 210, 126, .24) !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, rgba(48,31,12,.18), rgba(9,14,24,.26)) !important;
    padding-top: 22px !important;
    position: relative !important;
}
#menuModuleRoot .mm-inventory-side-label-v1 {
    position: absolute !important;
    left: 10px !important;
    top: 4px !important;
    font-size: 10px !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    color: rgba(255,224,168,.92) !important;
    pointer-events: none !important;
}
#menuModuleRoot .mm-inventory-side-empty-v1 {
    font-size: 11px !important;
    color: rgba(220,232,255,.72) !important;
    padding: 10px 8px !important;
}
#menuModuleRoot .mm-inventory-side-trade-slot-v1 {
    border-color: rgba(255, 190, 118, .72) !important;
    box-shadow: 0 0 0 1px rgba(255, 190, 118, .20), inset 0 0 16px rgba(255, 156, 70, .08) !important;
}
#menuModuleRoot .mm-inventory-side-key {
    position: absolute !important;
    left: 4px !important;
    top: 3px !important;
    z-index: 6 !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    color: rgba(255,236,190,.95) !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.8) !important;
    pointer-events: none !important;
}


/* Ajuste final de layout: defesa em faixa lateral rolável, sem criar estilo novo.
   A defesa ocupa a largura útil da janela e não quebra para segunda linha;
   se futuramente a loja liberar mais slots, eles entram na rolagem horizontal.
   O inventário comum continua rolando verticalmente no espaço restante. */
#menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1 {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: var(--mm-invv1-gap, 6px) !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    touch-action: pan-x !important;
    scroll-snap-type: x proximity !important;
    margin: 6px 0 8px !important;
    padding: 6px 8px 8px !important;
}
#menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1 .mm-slot {
    flex: 0 0 var(--mm-invv1-slot, 60px) !important;
    scroll-snap-align: start !important;
}
#menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1::-webkit-scrollbar {
    height: 4px !important;
}
#menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1::-webkit-scrollbar-thumb {
    background: rgba(142,225,255,.34) !important;
    border-radius: 999px !important;
}
#menuModuleRoot #mmPanelInventory .mm-inventory-v1-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
    box-sizing: border-box !important;
}

/* Ajuste final de acabamento:
   - usa somente o contrato atual .mm-inventory-v1-window;
   - tira o botão X do fluxo do cabeçalho para liberar espaço vertical;
   - reduz tooltip/toolkit em aproximadamente 50px para não atrapalhar os slots. */
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
    position: fixed !important;
    overflow: visible !important;
}
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-close {
    position: absolute !important;
    top: -18px !important;
    right: -18px !important;
    z-index: 80 !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    flex: 0 0 auto !important;
    font-size: 26px !important;
    line-height: 1 !important;
    padding: 0 !important;
}
#menuModuleRoot .mm-item-tooltip {
    min-width: 150px !important;
    max-width: min(240px, calc(100vw - 18px)) !important;
}
#menuModuleRoot .mm-defense-toolkit {
    min-width: 138px !important;
    max-width: min(180px, calc(100vw - 18px)) !important;
}
@media (max-width: 520px) {
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-close {
        top: -12px !important;
        right: -10px !important;
    }
    #menuModuleRoot .mm-item-tooltip { max-width: min(160px, calc(100vw - 18px)) !important; }
    #menuModuleRoot .mm-defense-toolkit { max-width: min(140px, calc(100vw - 18px)) !important; }
}


/* ===== Inventário V1 sem cabeçalho + compacto em landscape =====
   Contrato atual: o painel é #mmPanelInventory.mm-inventory-v1-window.
   O header foi removido do DOM; o X fica fora do painel e os slots sobem. */
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
    position: fixed !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    padding-top: 8px !important;
}
#menuModuleRoot #mmPanelInventory .mm-inventory-v1-head,
#menuModuleRoot #mmPanelInventory .mm-inventory-v1-title,
#menuModuleRoot #mmPanelInventory .mm-window-head {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-close {
    position: absolute !important;
    top: -18px !important;
    right: -18px !important;
    z-index: 80 !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    flex: 0 0 auto !important;
    font-size: 26px !important;
    line-height: 1 !important;
    padding: 0 !important;
}

@media (orientation: landscape) and (max-height: 620px) {
    #menuModuleRoot {
        --mm-invv1-slot: 50px;
        --mm-invv1-icon: 46px;
        --mm-invv1-gap: 4px;
    }
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
        width: min(96vw, 392px) !important;
        max-height: calc(100dvh - 86px - var(--mm-safe-top) - var(--mm-safe-bottom)) !important;
        padding: 6px !important;
        padding-top: 6px !important;
    }
    #menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1,
    #menuModuleRoot #mmPanelInventory #mmDefenseHotbarV1 {
        height: 80px !important;
        min-height: 80px !important;
        max-height: 80px !important;
        margin: 2px auto 5px !important;
        padding: 4px 6px !important;
    }
    #menuModuleRoot #mmPanelInventory .mm-inventory-v1-grid {
        padding: 5px !important;
        padding-bottom: 8px !important;
    }
    #menuModuleRoot .mm-hotbar {
        padding: 4px !important;
        bottom: calc(8px + var(--mm-safe-bottom)) !important;
    }
}
@media (orientation: landscape) and (max-height: 480px) {
    #menuModuleRoot {
        --mm-invv1-slot: 44px;
        --mm-invv1-icon: 40px;
        --mm-invv1-gap: 4px;
    }
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window {
        width: min(96vw, 350px) !important;
        max-height: calc(100dvh - 70px - var(--mm-safe-top) - var(--mm-safe-bottom)) !important;
    }
    #menuModuleRoot #mmPanelInventory .mm-defense-hotbar-v1,
    #menuModuleRoot #mmPanelInventory #mmDefenseHotbarV1 {
        height: 80px !important;
        min-height: 80px !important;
        max-height: 80px !important;
    }
}
@media (max-width: 520px) {
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-close {
        top: -12px !important;
        right: -10px !important;
    }
}

/* ===== Módulo: pixi-renderer.js — 2132 ===== */
body.woe-pixi-main-enabled #game{
    position:fixed!important;
    left:0!important;
    top:0!important;
    z-index:2!important;
    background:transparent!important;
}
body.auth-locked .nl-pixi-main-canvas{
    display:none!important;
}

/* ===== Módulo: settings-manager.js — 657 ===== */
#menuModuleRoot {
    transform-origin: top left;
}

#menuModuleRoot .mm-panel,
#menuModuleRoot .mm-window,
#menuModuleRoot .mm-hotbar,
#menuModuleRoot .mm-topbar,
#menuModuleRoot .mm-mobile {
    opacity: var(--woe-ui-opacity);
}

#menuModuleRoot {
    font-size: 14px;
}

.nl-settings-btn {
    z-index: var(--woe-z-window,200);
    font-family: Arial, Helvetica, sans-serif;
}

body > .nl-settings-btn {
    position: fixed;
    right: 12px;
    top: 58px;
}

.nl-settings-panel {
    position: fixed;
    left: 50%;
    top: 48px;
    transform: translateX(-50%);
    width: min(760px, calc(100vw - 28px));
    max-width: calc(100vw - 28px);
    max-height: calc(100vh - 70px);
    z-index: var(--woe-z-window,200);
    pointer-events: auto;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: linear-gradient(180deg,rgba(12,48,92,.98),rgba(5,18,42,.98));
    border: 1px solid rgba(111,207,255,.62);
    border-radius: 18px;
    box-shadow: 0 22px 70px rgba(0,0,0,.62), 0 0 36px rgba(0,124,255,.20), inset 0 0 0 1px rgba(255,255,255,.07);
    color:var(--woe-acrylic-text);
    font-family: Arial, Helvetica, sans-serif;
}

.nl-settings-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:44px;
    padding:0 12px;
    background:rgba(255,255,255,.06);
    border-bottom:1px solid rgba(136,225,255,.16);
    color:#fff;
    font-size:16px;
    font-weight:950;
    text-shadow:0 2px 12px rgba(77,183,255,.30);
    cursor:move;
}

.nl-settings-close {
    width:34px;
    height:34px;
    border:1px solid rgba(136,225,255,.42);
    border-radius:11px;
    background:rgba(255,255,255,.10);
    color:#fff;
    font-size:24px;
    font-weight:900;
    cursor:pointer;
}

.nl-settings-body {
    max-height: calc(100vh - 132px);
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    padding:16px;
    box-sizing:border-box;
}

.nl-settings-tabs {
    display:grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap:6px;
    margin-bottom:10px;
}

.nl-settings-tab {
    min-height:34px;
    border:1px solid rgba(136,225,255,.30);
    border-radius:11px;
    background:rgba(255,255,255,.08);
    color:var(--woe-acrylic-text);
    font-size:12px;
    font-weight:900;
    cursor:pointer;
    box-shadow: inset 0 -3px rgba(0,0,0,.25);
}

.nl-settings-tab.active {
    background:rgba(49,179,255,.24);
    border-color:rgba(136,225,255,.85);
    color:#fff;
}

.nl-settings-tab-panel[hidden] {
    display:none!important;
}



#woeGraphicsLoadingOverlay {
    position:fixed;
    inset:0;
    display:none;
    align-items:center;
    justify-content:center;
    z-index:999999;
    background:radial-gradient(circle at 50% 35%,rgba(28,116,210,.20),rgba(2,8,22,.76));
    backdrop-filter:blur(3px);
    pointer-events:all;
    font-family:Arial, Helvetica, sans-serif;
}

.woe-graphics-loading-box {
    min-width:260px;
    max-width:calc(100vw - 32px);
    padding:18px 22px;
    border:1px solid rgba(111,207,255,.62);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(12,48,92,.98),rgba(5,18,42,.98));
    color:#fff;
    text-align:center;
    box-shadow:var(--woe-acrylic-shadow);
}

.woe-graphics-loading-title {
    color:var(--woe-acrylic-title);
    font-size:18px;
    font-weight:900;
    margin-bottom:8px;
    text-shadow:2px 2px #000;
}

.woe-graphics-loading-text {
    font-size:13px;
    line-height:1.35;
    color:var(--woe-acrylic-muted);
}

.nl-settings-section {
    margin: 14px 0 8px;
    padding: 7px 9px;
    color: #85dcff;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .5px;
    background:rgba(255,255,255,.06);
    border-left:4px solid var(--woe-acrylic-blue);
    border-radius:10px;
}

.nl-setting-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 6px 8px;
    margin-bottom: 6px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(136,225,255,.14);
    border-radius:12px;
    box-sizing:border-box;
    font-size: 14px;
    line-height:1.25;
}

.nl-setting-row span {
    color:var(--woe-acrylic-text);
    font-weight:700;
}

.nl-setting-row input[type="checkbox"] {
    width: 24px;
    height: 24px;
    accent-color:var(--woe-acrylic-blue);
}

.nl-setting-range {
    display: block;
}

.nl-setting-range input {
    width: 100%;
    margin-top: 8px;
    accent-color:var(--woe-acrylic-blue);
}

.nl-setting-row select,
.nl-setting-row .mm-input {
    min-width: 130px;
    min-height:34px;
    border:1px solid rgba(136,225,255,.30);
    border-radius:11px;
    background:var(--woe-acrylic-deep);
    color:#fff;
    font-weight:800;
    padding:4px 8px;
}

.nl-settings-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
}

.nl-settings-actions .mm-btn {
    min-height:38px;
    font-weight:900;
}

.nl-settings-status {
    margin-top: 10px;
    color: #85dcff;
    font-size: 12px;
    line-height: 1.4;
    min-height: 16px;
    font-weight:800;
}

@media (max-width: 640px) {
    .nl-settings-panel {
        top: 10px;
        width: calc(100vw - 18px);
        max-height: calc(100vh - 20px);
    }
    .nl-settings-body {
        max-height: calc(100vh - 78px);
        padding:12px;
    }
    .nl-settings-actions {
        grid-template-columns:1fr;
    }
    .nl-settings-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ===== Template UI canônico ===== */
/* Classe canônica para novos derivados. */
.woe-ui-panel,
.woe-ui-window,
.woe-ui-card,
.woe-template-panel{
    box-sizing:border-box;
    border:2px solid var(--woe-ui-line);
    border-radius:var(--woe-ui-radius);
    background:var(--woe-ui-panel);
    color:var(--woe-ui-text);
    box-shadow:var(--woe-ui-shadow);
    text-shadow:none;
    font-family:Arial, Helvetica, sans-serif;
}
.woe-ui-head, .woe-ui-header, .woe-template-head{
    box-sizing:border-box;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:8px 10px;
    border:1px solid var(--woe-ui-line-soft);
    border-radius:var(--woe-ui-radius-sm);
    background:var(--woe-ui-head);
    color:var(--woe-ui-text);
    font-weight:900;
}
.woe-ui-body, .woe-template-body{
    box-sizing:border-box;
    min-height:0;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    padding:10px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--woe-ui-radius-sm);
    background:var(--woe-ui-panel-2);
    color:var(--woe-ui-text);
}

/* Derivados oficiais: login, loading, menus, janelas, configurações, hotkeys e minimapa. */
.nl-auth-gate,
#woeGraphicsLoadingOverlay{
    font-family:Arial, Helvetica, sans-serif !important;
    color:var(--woe-ui-text) !important;
    background:
        radial-gradient(circle at 50% 18%, rgba(79,141,255,.18), transparent 34%),
        linear-gradient(rgba(4,9,18,.66), rgba(4,9,18,.88)),
        linear-gradient(135deg, var(--woe-acrylic-bg) 0%, var(--woe-acrylic-bg-2) 52%, #020a14 100%) !important;
}
.nl-auth-card,
#woeGraphicsLoadingOverlay .woe-graphics-loading-box{
    box-sizing:border-box !important;
    border:2px solid var(--woe-ui-line) !important;
    outline:none !important;
    border-radius:var(--woe-ui-radius) !important;
    background:var(--woe-ui-panel) !important;
    color:var(--woe-ui-text) !important;
    box-shadow:var(--woe-ui-shadow) !important;
    image-rendering:auto !important;
    text-shadow:none !important;
}
.nl-auth-title,
#woeGraphicsLoadingOverlay .woe-graphics-loading-title{
    color:var(--woe-ui-text) !important;
    text-shadow:0 0 12px rgba(79,141,255,.28) !important;
    letter-spacing:.02em;
}
.nl-auth-status,
#woeGraphicsLoadingOverlay .woe-graphics-loading-text{
    color:var(--woe-ui-muted) !important;
    text-shadow:none !important;
}

/* Botões unificados. */
.woe-ui-button,
.woe-template-button,
.nl-auth-button,
#menuModuleRoot .mm-topbar .mm-btn,
#menuModuleRoot .mm-btn,
#menuModuleRoot .mm-button,
#menuModuleRoot .mm-close,
#menuModuleRoot .mm-drawer-close,
#nlSettingsPanel button,
#woe-minimap-overlay button,
#woe-map-editor button{
    box-sizing:border-box !important;
    border:1px solid rgba(86,154,255,.46) !important;
    border-radius:12px !important;
    background:var(--woe-acrylic-button-bg) !important;
    color:var(--woe-ui-text) !important;
    box-shadow:0 6px 14px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.06) !important;
    outline:none !important;
    text-shadow:none !important;
    transition:filter .12s ease, border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}
.woe-ui-button:hover,
.woe-template-button:hover,
.nl-auth-button:hover,
#menuModuleRoot .mm-btn:hover,
#menuModuleRoot .mm-button:hover,
#menuModuleRoot .mm-close:hover,
#menuModuleRoot .mm-drawer-close:hover,
#nlSettingsPanel button:hover,
#woe-minimap-overlay button:hover,
#woe-map-editor button:hover{
    border-color:var(--woe-ui-line-hot) !important;
    filter:brightness(1.08) !important;
    box-shadow:0 0 16px rgba(79,141,255,.23), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.woe-ui-button:active,
.woe-template-button:active,
.nl-auth-button:active,
#menuModuleRoot .mm-btn:active,
#nlSettingsPanel button:active{
    transform:translateY(1px);
}

/* Inputs, selects e textareas unificados. */
.woe-ui-input,
.woe-ui-select,
.woe-template-input,
input, select, textarea,
#nlSettingsPanel input, #nlSettingsPanel select, #nlSettingsPanel textarea,
#menuModuleRoot input, #menuModuleRoot select, #menuModuleRoot textarea,
#woe-map-editor input, #woe-map-editor select, #woe-map-editor textarea{
    box-sizing:border-box !important;
    border:1px solid rgba(86,154,255,.38) !important;
    border-radius:12px !important;
    background:var(--woe-acrylic-deep) !important;
    color:var(--woe-ui-text) !important;
    outline:none !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.025) !important;
    text-shadow:none !important;
}
select, .woe-ui-select{
    cursor:pointer;
    color-scheme:dark;
    accent-color:var(--woe-ui-blue);
}
input:focus, select:focus, textarea:focus,
.woe-ui-input:focus, .woe-ui-select:focus{
    border-color:var(--woe-ui-line-hot) !important;
    box-shadow:var(--woe-ui-focus), inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

/* Scrolls unificados para todos os derivados oficiais. */
.woe-ui-body,
.woe-template-body,
.nl-auth-card,
#menuModuleRoot .mm-inventory,
#menuModuleRoot .mm-about,
#menuModuleRoot .mm-drawer,
#nlSettingsPanel .nl-settings-body,
#woe-minimap-overlay,
#woeGraphicsLoadingOverlay .woe-graphics-loading-box{
    scrollbar-width:thin;
    scrollbar-color:var(--woe-acrylic-blue) var(--woe-acrylic-deep);
}
.woe-ui-body::-webkit-scrollbar,
.woe-template-body::-webkit-scrollbar,
.nl-auth-card::-webkit-scrollbar,
#menuModuleRoot .mm-inventory::-webkit-scrollbar,
#menuModuleRoot .mm-about::-webkit-scrollbar,
#menuModuleRoot .mm-drawer::-webkit-scrollbar,
#nlSettingsPanel .nl-settings-body::-webkit-scrollbar,
#woe-minimap-overlay::-webkit-scrollbar,
#woeGraphicsLoadingOverlay .woe-graphics-loading-box::-webkit-scrollbar{
    width:9px; height:9px;
}
.woe-ui-body::-webkit-scrollbar-track,
.woe-template-body::-webkit-scrollbar-track,
.nl-auth-card::-webkit-scrollbar-track,
#menuModuleRoot .mm-inventory::-webkit-scrollbar-track,
#menuModuleRoot .mm-about::-webkit-scrollbar-track,
#menuModuleRoot .mm-drawer::-webkit-scrollbar-track,
#nlSettingsPanel .nl-settings-body::-webkit-scrollbar-track,
#woe-minimap-overlay::-webkit-scrollbar-track,
#woeGraphicsLoadingOverlay .woe-graphics-loading-box::-webkit-scrollbar-track{
    background:var(--woe-acrylic-deep);
    border-radius:999px;
}
.woe-ui-body::-webkit-scrollbar-thumb,
.woe-template-body::-webkit-scrollbar-thumb,
.nl-auth-card::-webkit-scrollbar-thumb,
#menuModuleRoot .mm-inventory::-webkit-scrollbar-thumb,
#menuModuleRoot .mm-about::-webkit-scrollbar-thumb,
#menuModuleRoot .mm-drawer::-webkit-scrollbar-thumb,
#nlSettingsPanel .nl-settings-body::-webkit-scrollbar-thumb,
#woe-minimap-overlay::-webkit-scrollbar-thumb,
#woeGraphicsLoadingOverlay .woe-graphics-loading-box::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg, var(--woe-acrylic-title), var(--woe-acrylic-blue-2));
    border:2px solid var(--woe-acrylic-deep);
    border-radius:999px;
}

/* Slots, itens e tooltips. */
.woe-ui-slot,
#menuModuleRoot .mm-slot{
    position:relative;
    border-color:rgba(96,160,255,.42) !important;
    background:var(--woe-acrylic-slot-bg) !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.035), 0 4px 12px rgba(0,0,0,.22) !important;
}
.woe-ui-slot:hover,
#menuModuleRoot .mm-slot:hover{
    border-color:var(--woe-ui-line-hot) !important;
    box-shadow:0 0 14px rgba(76,139,255,.26), inset 0 0 0 1px rgba(255,255,255,.05) !important;
}
.woe-ui-tooltip,
#menuModuleRoot .mm-tooltip,
[role=tooltip]{
    box-sizing:border-box;
    border:1px solid var(--woe-ui-line);
    border-radius:12px;
    background:rgba(3,17,31,.94);
    color:var(--woe-ui-text);
    box-shadow:var(--woe-ui-shadow-soft);
    text-shadow:none;
}

/* Estados por raridade para derivados novos. */
[data-rarity=common]{ --woe-rarity-line:rgba(174,189,214,.42); }
[data-rarity=rare]{ --woe-rarity-line:rgba(79,141,255,.78); }
[data-rarity=epic]{ --woe-rarity-line:rgba(161,100,255,.78); }
[data-rarity=legendary]{ --woe-rarity-line:rgba(215,180,106,.9); }
.woe-ui-slot[data-rarity],
#menuModuleRoot .mm-slot[data-rarity]{
    border-color:var(--woe-rarity-line, rgba(96,160,255,.42)) !important;
}


/* ===== Azul acrílico oficial aplicado a todos os componentes de template ===== */
body.woe-page-world,
body.woe-page-login{
    background:
        radial-gradient(circle at 50% 0%, rgba(49,179,255,.12), transparent 34%),
        linear-gradient(180deg, var(--woe-acrylic-bg), #020a14);
}

#menuModuleRoot .mm-window,
#menuModuleRoot .mm-drawer,
#menuModuleRoot .mm-hotbar,
#menuModuleRoot .mm-mobile-status-hud,
#menuModuleRoot .mm-side-button,
#menuModuleRoot .mm-action-toast,
#menuModuleRoot .mm-item-tooltip,
#menuModuleRoot .mm-defense-toolkit,
.nl-settings-panel,
#woe-map-editor-panel,
.woe-standard-card,
.woed-body-card,
#woeGraphicsLoadingOverlay .woe-graphics-loading-box,
#woeGuardianGateWindow,
#woeGuardianHubBusy .wgh-busy-card{
    background:var(--woe-acrylic-panel-bg) !important;
    border:1px solid var(--woe-acrylic-border) !important;
    border-radius:var(--woe-acrylic-radius) !important;
    box-shadow:var(--woe-acrylic-shadow) !important;
    color:var(--woe-acrylic-text) !important;
    backdrop-filter:blur(14px) saturate(150%) !important;
    -webkit-backdrop-filter:blur(14px) saturate(150%) !important;
    text-shadow:none !important;
}

#menuModuleRoot .mm-slot,
#menuModuleRoot .mm-big,
#menuModuleRoot .mm-item-card,
#menuModuleRoot .mm-about-card,
#woeGuardianGateWindow .wgh-card,
.nl-setting-row,
.woe-ui-body,
.woe-template-body{
    background:var(--woe-acrylic-slot-bg) !important;
    border:1px solid var(--woe-acrylic-border-soft) !important;
    border-radius:var(--woe-acrylic-radius-sm) !important;
    color:var(--woe-acrylic-text) !important;
    box-shadow:var(--woe-acrylic-shadow-soft) !important;
}

#menuModuleRoot .mm-title,
#menuModuleRoot .mm-drawer-title,
#menuModuleRoot .mm-drawer-group,
.nl-settings-section,
.woe-hotkeys-group,
.wme-kicker,
.woe-graphics-loading-title{
    color:var(--woe-acrylic-title) !important;
}

#menuModuleRoot .mm-btn,
#menuModuleRoot .mm-button,
#menuModuleRoot .mm-close,
#menuModuleRoot .mm-drawer-close,
.nl-login-button,
.nl-settings-close,
.nl-settings-tab,
#woe-map-editor-toggle,
#woe-map-editor-panel .wme-close,
.woe-hotkeys-presets button,
.woe-hotkeys-row button{
    background:var(--woe-acrylic-button-bg) !important;
    border:1px solid var(--woe-acrylic-border) !important;
    border-radius:var(--woe-acrylic-radius-sm) !important;
    color:var(--woe-acrylic-text) !important;
    box-shadow:var(--woe-acrylic-shadow-soft) !important;
    text-shadow:none !important;
}

#menuModuleRoot .mm-btn:hover,
#menuModuleRoot .mm-button:hover,
#menuModuleRoot .mm-close:hover,
#menuModuleRoot .mm-drawer-close:hover,
.nl-login-button:hover,
.nl-settings-tab.active,
#woe-map-editor-toggle.is-on{
    background:var(--woe-acrylic-button-bg-active) !important;
    color:var(--woe-acrylic-bg) !important;
    border-color:var(--woe-acrylic-border-hot) !important;
}



/* ===== Configurações vivas da interface =====
   O SettingsManager só altera variáveis CSS no :root.
   O styles.css continua sendo o contrato visual oficial. */
body.woe-page-world #menuModuleRoot,
body.woe-page-world #nlSettingsPanel,
body.woe-page-world #woe-map-editor-toggle,
body.woe-page-world #woe-map-editor-panel,
body.woe-page-world #woePlanePortalWindow,
body.woe-page-world #woeGuardianGateWindow,
body.woe-page-world #woeGraphicsFpsOverlay,
body.woe-page-world #woeDebugF3Panel {
    zoom: var(--woe-ui-scale);
}

#nlSettingsPanel,
#woe-map-editor-toggle,
#woe-map-editor-panel,
#woe-minimap-small,
#woe-minimap-overlay,
#woePlanePortalWindow,
#woeGuardianGateWindow,
#woeGraphicsFpsOverlay,
#woeDebugF3Panel,
#menuModuleRoot .mm-window,
#menuModuleRoot .mm-drawer,
#menuModuleRoot .mm-hotbar,
#menuModuleRoot .mm-topbar,
#menuModuleRoot .mm-mobile-status-hud,
#menuModuleRoot .mm-side-button,
#menuModuleRoot .mm-defense-toolkit,
#menuModuleRoot .mm-combat-hint-chip {
    opacity: var(--woe-ui-opacity) !important;
}

#menuModuleRoot.inventory-open-v1 #mmHotbar {
    opacity: var(--woe-ui-opacity) !important;
}

#menuModuleRoot .mm-action-toast.show {
    opacity: var(--woe-ui-opacity) !important;
}

#menuModuleRoot .mm-action-toast:not(.show) {
    opacity: 0 !important;
}

body[data-woe-hud="off"] #woeGraphicsFpsOverlay,
body[data-woe-hud="off"] #menuModuleRoot [data-woe-ui~="hud-optional"] {
    display: none !important;
    pointer-events: none !important;
}

@media (prefers-reduced-motion: reduce){
    *, *::before, *::after{
        animation-duration:.001ms !important;
        animation-iteration-count:1 !important;
        scroll-behavior:auto !important;
        transition-duration:.001ms !important;
    }
}

/* ===== Módulo: ui-manager.js — 604 ===== */
#woeMobileOrientationOverlay{
    position:fixed;
    inset:0;
    z-index:2147483647;
    display:none;
    align-items:center;
    justify-content:center;
    padding:calc(18px + env(safe-area-inset-top, 0px)) calc(18px + env(safe-area-inset-right, 0px)) calc(18px + env(safe-area-inset-bottom, 0px)) calc(18px + env(safe-area-inset-left, 0px));
    box-sizing:border-box;
    background:radial-gradient(circle at 50% 18%, rgba(50, 154, 255, .16), transparent 34%), linear-gradient(180deg, rgba(2, 8, 18, .98), rgba(5, 19, 38, .98));
    color:#f4fbff;
    font-family:Arial, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    text-align:center;
    pointer-events:all;
    touch-action:none;
    -webkit-user-select:none;
    user-select:none;
}
#woeMobileOrientationOverlay.is-visible{ display:flex; }
#woeMobileOrientationOverlay .woe-orientation-card{
    width:min(420px, calc(100vw - 32px));
    padding:24px 22px 22px;
    border-radius:22px;
    border:1px solid rgba(98, 196, 255, .38);
    background:linear-gradient(180deg, rgba(10, 30, 62, .94), rgba(5, 17, 34, .96));
    box-shadow:0 20px 70px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.16), 0 0 42px rgba(31, 145, 255, .18);
}
#woeMobileOrientationOverlay .woe-orientation-icon{
    width:86px;
    height:86px;
    margin:0 auto 16px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:24px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.14);
    font-size:48px;
    line-height:1;
    animation:woeRotatePhoneHint 1.8s ease-in-out infinite;
    transform-origin:center center;
}
#woeMobileOrientationOverlay .woe-orientation-title{
    margin:0 0 8px;
    font-size:22px;
    font-weight:900;
    letter-spacing:.2px;
}
#woeMobileOrientationOverlay .woe-orientation-text{
    margin:0;
    color:rgba(226, 244, 255, .86);
    font-size:14px;
    line-height:1.45;
    font-weight:700;
}
#woeMobileOrientationOverlay .woe-orientation-note{
    margin-top:14px;
    color:rgba(178, 219, 255, .72);
    font-size:12px;
    line-height:1.35;
    font-weight:700;
}
@keyframes woeRotatePhoneHint{
    0%, 100% { transform:rotate(0deg); }
    45%, 60% { transform:rotate(90deg); }
}
body.woe-orientation-locked{
    overflow:hidden !important;
}

/* ===== Utilitários oficiais ===== */
.woe-hidden{display:none!important;}

/* Alternador Defesa/Slots no mesmo padrão do botão fechar do inventário. */
#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-side-toggle {
    position: absolute !important;
    top: -18px !important;
    right: 32px !important;
    z-index: 80 !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    flex: 0 0 auto !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    padding: 0 !important;
    text-transform: none !important;
}

#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-side-toggle.no-side {
    opacity: .72 !important;
}

#menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-side-toggle[hidden] {
    display: none !important;
}
@media (max-width: 520px) {
    #menuModuleRoot #mmPanelInventory.mm-inventory-v1-window > .mm-inventory-v1-side-toggle {
        top: -12px !important;
        right: 42px !important;
    }
}
#menuModuleRoot .mm-slot .mm-mode.offer {
  left: 2px;
  right: auto;
  bottom: 2px;
  background:var(--woe-acrylic-success);
  color:#032014;
}
#menuModuleRoot .mm-slot.trade-offer-slot {
  outline: 1px solid rgba(173,255,159,.45);
}

/* ===== Configurações locais da interface ===== */
#menuModuleRoot [data-woe-ui]:not([data-woe-ui~="toast"]) {
    opacity: var(--woe-ui-opacity);
}

#menuModuleRoot .mm-action-toast {
    opacity: 0;
}

#menuModuleRoot .mm-action-toast.show {
    opacity: var(--woe-ui-opacity);
}

#menuModuleRoot .mm-window,
#menuModuleRoot .mm-panel,
#menuModuleRoot .mm-drawer,
#menuModuleRoot .mm-hotbar,
#menuModuleRoot .mm-topbar,
#menuModuleRoot .mm-mobile-status-hud,
#menuModuleRoot .mm-side-button,
#menuModuleRoot .mm-defense-toolkit,
#menuModuleRoot .mm-combat-hint-chip,
#menuModuleRoot .mm-action-toast {
    font-size: 1em;
}

body[data-woe-hud="off"] #menuModuleRoot [data-woe-ui~="hud-optional"] {
    display: none !important;
    pointer-events: none !important;
}

body[data-woe-compact-mobile="on"] #menuModuleRoot [data-woe-ui~="hud"],
body[data-woe-compact-mobile="on"] #menuModuleRoot .mm-window,
body[data-woe-compact-mobile="on"] #menuModuleRoot .mm-panel {
    --woe-ui-scale: .92;
}

body[data-woe-compact-mobile="on"] #menuModuleRoot .mm-slot {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    font-size: 15px !important;
}


/* ===== AppSync: menu de ordens azul acrílico ===== */
.appsync-ordens-menu {
    position: fixed;
    left: 50%;
    bottom: 84px;
    transform: translateX(-50%) translateY(10px);
    z-index: 9999;
    width: min(360px, calc(100vw - 28px));
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
}

.appsync-ordens-menu.is-open {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

.appsync-ordens-menu[hidden] {
    display: none !important;
}

.appsync-ordens-card {
    border: 1px solid rgba(132, 207, 255, .36);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(8, 31, 66, .82), rgba(8, 68, 114, .56));
    box-shadow: 0 18px 48px rgba(0, 10, 30, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
    backdrop-filter: blur(18px) saturate(145%);
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    color: #eaf8ff;
    overflow: hidden;
}

.appsync-ordens-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 14px 10px;
    border-bottom: 1px solid rgba(150, 220, 255, .18);
}

.appsync-ordens-title {
    font-size: 15px;
    font-weight: 900;
    letter-spacing: .02em;
    text-shadow: 0 0 16px rgba(90, 190, 255, .42);
}

.appsync-ordens-subtitle {
    margin-top: 2px;
    font-size: 11px;
    font-weight: 700;
    color: rgba(219, 245, 255, .68);
}

.appsync-ordens-close {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(172, 224, 255, .25);
    border-radius: 999px;
    background: rgba(10, 45, 86, .58);
    color: #eaf8ff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.appsync-ordens-list {
    display: grid;
    gap: 8px;
    padding: 12px;
    max-height: 202px; /* 3 opções visíveis + espaçamento */
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(142, 219, 255, .62) rgba(5, 37, 79, .32);
}

.appsync-ordens-list::-webkit-scrollbar {
    width: 8px;
}

.appsync-ordens-list::-webkit-scrollbar-track {
    background: rgba(5, 37, 79, .32);
    border-radius: 999px;
}

.appsync-ordens-list::-webkit-scrollbar-thumb {
    background: rgba(142, 219, 255, .62);
    border-radius: 999px;
}


.appsync-ordens-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    border: 1px solid rgba(126, 207, 255, .24);
    border-radius: 14px;
    background: rgba(5, 37, 79, .52);
    color: #f2fbff;
    padding: 11px 12px;
    cursor: pointer;
    text-align: left;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.appsync-ordens-item:hover,
.appsync-ordens-item:focus-visible {
    background: rgba(25, 91, 152, .66);
    border-color: rgba(165, 229, 255, .48);
    outline: none;
}

.appsync-ordens-item-label {
    font-size: 14px;
    font-weight: 900;
}

.appsync-ordens-item-meta {
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    font-weight: 800;
    color: rgba(219, 245, 255, .58);
}

.appsync-ordens-empty {
    padding: 12px;
    border-radius: 14px;
    background: rgba(5, 37, 79, .38);
    color: rgba(219, 245, 255, .72);
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

/* AppSync/inventário local: slot selecionado para ordens. */
#menuModuleRoot .mm-hotbar .mm-slot.appsync-hotbar-selected {
    outline: 2px solid rgba(98, 206, 255, .95);
    box-shadow: 0 0 0 2px rgba(12, 45, 70, .85), 0 0 14px rgba(98, 206, 255, .55);
    transform: translateY(-2px);
}

/* AppSync: submenu de player e controles de ataque */
.appsync-ordens-subitem.is-muted {
    opacity: .72;
}

.appsync-ataque-controles {
    position: fixed;
    right: 18px;
    bottom: 92px;
    /* Acima do aviso de ataque para ficar disponível imediatamente. */
    z-index: 10060;
    display: flex;
    gap: 8px;
    align-items: center;
}

.appsync-ataque-controles[hidden] {
    display: none !important;
}

.appsync-ataque-btn {
    border: 1px solid rgba(142, 219, 255, .42);
    border-radius: 999px;
    background: linear-gradient(145deg, rgba(11, 49, 95, .88), rgba(12, 102, 161, .72));
    color: #effbff;
    padding: 10px 14px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .02em;
    cursor: pointer;
    box-shadow: 0 12px 34px rgba(0, 18, 44, .38), inset 0 1px 0 rgba(255, 255, 255, .14);
}

.appsync-ataque-sair {
    border-color: rgba(255, 112, 112, .56);
    background: linear-gradient(145deg, rgba(102, 16, 35, .9), rgba(196, 46, 62, .74));
}

.appsync-ataque-aviso {
    position: fixed;
    inset: 0;
    z-index: 10040;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(2, 8, 18, .72);
    backdrop-filter: blur(7px);
}

.appsync-ataque-aviso[hidden] {
    display: none !important;
}

.appsync-ataque-aviso-card {
    width: min(470px, calc(100vw - 30px));
    border: 1px solid rgba(255, 135, 113, .48);
    border-radius: 22px;
    padding: 22px;
    background: linear-gradient(160deg, rgba(45, 13, 24, .97), rgba(11, 30, 57, .97));
    color: #f6fbff;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .52), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.appsync-ataque-aviso-kicker {
    margin-bottom: 5px;
    color: #ffb19e;
    font-size: 11px;
    font-weight: 1000;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.appsync-ataque-aviso-title {
    margin: 0 0 10px;
    font-size: clamp(21px, 4vw, 29px);
    line-height: 1.08;
}

.appsync-ataque-aviso-attacker,
.appsync-ataque-aviso-text,
.appsync-ataque-aviso-danger {
    margin: 0 0 10px;
    font-size: 14px;
    font-weight: 750;
    line-height: 1.42;
}

.appsync-ataque-aviso-attacker {
    color: #ffd8c6;
    font-size: 15px;
    font-weight: 950;
}

.appsync-ataque-aviso-danger {
    margin-bottom: 18px;
    border-left: 3px solid rgba(255, 171, 79, .86);
    padding: 9px 11px;
    background: rgba(255, 155, 62, .10);
    color: #ffe7b7;
}

.appsync-ataque-aviso-session-toggle {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 18px;
    color: #e8f4ff;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
    cursor: pointer;
    user-select: none;
}

.appsync-ataque-aviso-session-toggle input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: #38bdf8;
    cursor: pointer;
    flex: 0 0 auto;
}

.appsync-ataque-aviso-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.appsync-ataque-aviso-btn {
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 14px;
    min-height: 42px;
    padding: 10px 15px;
    color: #f7fbff;
    font-size: 13px;
    font-weight: 950;
    cursor: pointer;
}

.appsync-ataque-aviso-cancel {
    background: rgba(255, 255, 255, .08);
}

.appsync-ataque-aviso-confirm {
    border-color: rgba(133, 220, 255, .56);
    background: linear-gradient(145deg, rgba(21, 94, 150, .96), rgba(12, 145, 190, .88));
}

.appsync-troca-convite {
    position: fixed;
    left: 50%;
    top: 84px;
    transform: translateX(-50%) translateY(-8px);
    z-index: 10001;
    width: min(340px, calc(100vw - 28px));
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease;
}

.appsync-troca-convite.is-open {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

.appsync-troca-convite[hidden] {
    display: none !important;
}

.appsync-troca-card {
    border: 1px solid rgba(160, 224, 255, .38);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(8, 31, 66, .9), rgba(7, 76, 122, .72));
    color: #effbff;
    padding: 14px;
    box-shadow: 0 18px 48px rgba(0, 10, 30, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
    backdrop-filter: blur(16px) saturate(145%);
    -webkit-backdrop-filter: blur(16px) saturate(145%);
}

.appsync-troca-title {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 4px;
}

.appsync-troca-text {
    font-size: 12px;
    font-weight: 700;
    color: rgba(226, 247, 255, .78);
    margin-bottom: 12px;
}

.appsync-troca-actions {
    display: flex;
    gap: 8px;
}

.appsync-troca-actions button {
    flex: 1;
    border: 1px solid rgba(172, 224, 255, .25);
    border-radius: 12px;
    background: rgba(10, 45, 86, .64);
    color: #eaf8ff;
    padding: 9px 10px;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.appsync-troca-actions button:hover,
.appsync-troca-actions button:focus-visible {
    background: rgba(25, 91, 152, .72);
    outline: none;
}


/* AppSync: verificação de sessão ao alternar janela */
.appsync-online-check-overlay {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: grid;
    place-items: center;
    background: rgba(0, 8, 20, .58);
    backdrop-filter: blur(8px) saturate(120%);
    -webkit-backdrop-filter: blur(8px) saturate(120%);
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease;
}

.appsync-online-check-overlay.is-open {
    opacity: 1;
    pointer-events: auto;
}

.appsync-online-check-overlay[hidden] {
    display: none !important;
}

.appsync-online-check-card {
    width: min(360px, calc(100vw - 32px));
    border: 1px solid rgba(142, 219, 255, .42);
    border-radius: 20px;
    background: linear-gradient(145deg, rgba(8, 31, 66, .94), rgba(7, 76, 122, .80));
    color: #effbff;
    padding: 18px;
    text-align: center;
    box-shadow: 0 22px 64px rgba(0, 10, 30, .56), inset 0 1px 0 rgba(255, 255, 255, .14);
}

.appsync-online-check-title {
    font-size: 16px;
    font-weight: 950;
    letter-spacing: .02em;
    margin-bottom: 8px;
}

.appsync-online-check-status {
    font-size: 12px;
    font-weight: 750;
    line-height: 1.4;
    color: rgba(226, 247, 255, .78);
    margin-bottom: 16px;
}

.appsync-online-check-continue {
    min-width: 150px;
    border: 1px solid rgba(172, 224, 255, .36);
    border-radius: 999px;
    background: linear-gradient(145deg, rgba(11, 49, 95, .94), rgba(12, 102, 161, .78));
    color: #effbff;
    padding: 11px 16px;
    font-size: 13px;
    font-weight: 950;
    cursor: pointer;
    box-shadow: 0 12px 34px rgba(0, 18, 44, .38), inset 0 1px 0 rgba(255, 255, 255, .14);
}

.appsync-online-check-continue:disabled {
    opacity: .68;
    cursor: wait;
}


/* Slots de venda/free */
#menuModuleRoot .mm-sale-value,
#menuModuleRoot .mm-slot .mm-sale-value {
    position: absolute !important;
    right: 3px !important;
    bottom: 3px !important;
    z-index: 8 !important;
    padding: 1px 4px !important;
    border-radius: 999px !important;
    background: rgba(72, 220, 130, .9) !important;
    color: rgba(5, 28, 14, .95) !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    pointer-events: none !important;
}

.mm-sale-value-dialog {
    position: fixed;
    inset: 0;
    z-index: 13000;
    display: grid;
    place-items: center;
    background: rgba(0, 8, 20, .54);
    backdrop-filter: blur(8px) saturate(120%);
    -webkit-backdrop-filter: blur(8px) saturate(120%);
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease;
}

.mm-sale-value-dialog.is-open {
    opacity: 1;
    pointer-events: auto;
}

.mm-sale-value-dialog[hidden] {
    display: none !important;
}

.mm-sale-value-card {
    width: min(340px, calc(100vw - 28px));
    border: 1px solid rgba(160, 224, 255, .38);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(8, 31, 66, .94), rgba(7, 76, 122, .78));
    color: #effbff;
    padding: 14px;
    box-shadow: 0 18px 48px rgba(0, 10, 30, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.mm-sale-value-title {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 6px;
}

.mm-sale-value-text {
    font-size: 12px;
    font-weight: 700;
    color: rgba(226, 247, 255, .82);
    margin-bottom: 12px;
}

.mm-sale-value-option[hidden] {
    display: none !important;
}

.mm-sale-value-option {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(166, 232, 184, .32);
    border-radius: 12px;
    padding: 10px;
    background: rgba(49, 152, 93, .18);
    font-size: 13px;
    font-weight: 900;
}

.mm-sale-value-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.mm-sale-value-actions button {
    flex: 1;
    border: 1px solid rgba(172, 224, 255, .25);
    border-radius: 12px;
    background: rgba(10, 45, 86, .64);
    color: #eaf8ff;
    padding: 9px 10px;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

#menuModuleRoot .mm-inventory-side-peer-sale-slot-v1 {
    outline: 1px dashed rgba(134, 216, 255, .45) !important;
}


.appsync-morte-aviso {
    position: fixed;
    left: 50%;
    top: 96px;
    transform: translateX(-50%) translateY(-10px);
    z-index: 13010;
    max-width: min(420px, calc(100vw - 32px));
    padding: 14px 18px;
    border: 1px solid rgba(255, 122, 122, .42);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(78, 9, 28, .94), rgba(135, 28, 44, .82));
    color: #fff3f3;
    font-size: 14px;
    font-weight: 900;
    text-align: center;
    box-shadow: 0 18px 48px rgba(28, 0, 8, .46), inset 0 1px 0 rgba(255,255,255,.14);
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease;
}

.appsync-morte-aviso.is-open {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.appsync-morte-aviso[hidden] {
    display: none !important;
}


.appsync-global-message {
    position: fixed;
    left: 50%;
    top: 18px;
    transform: translateX(-50%) translateY(-10px);
    z-index: 2147483000;
    width: max-content;
    max-width: min(520px, calc(100vw - 28px));
    padding: 12px 16px;
    border-radius: 16px;
    border: 1px solid rgba(182, 226, 255, .38);
    background: linear-gradient(145deg, rgba(8, 31, 66, .96), rgba(7, 76, 122, .86));
    color: #f2fbff;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.25;
    text-align: center;
    box-shadow: 0 18px 48px rgba(0, 10, 30, .48), inset 0 1px 0 rgba(255, 255, 255, .14);
    opacity: 0;
    pointer-events: none;
    transition: opacity .14s ease, transform .14s ease;
}

.appsync-global-message.is-open {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.appsync-global-message[hidden] {
    display: none !important;
}

.appsync-global-message-erro {
    border-color: rgba(255, 122, 122, .52);
    background: linear-gradient(145deg, rgba(78, 9, 28, .96), rgba(135, 28, 44, .86));
    color: #fff3f3;
}

.appsync-global-message-morte {
    border-color: rgba(255, 92, 92, .62);
    background: linear-gradient(145deg, rgba(78, 9, 28, .98), rgba(168, 33, 50, .9));
    color: #fff7f7;
}

.appsync-global-message-sucesso {
    border-color: rgba(120, 235, 154, .52);
    background: linear-gradient(145deg, rgba(14, 75, 48, .96), rgba(20, 132, 82, .86));
    color: #f1fff6;
}


.appsync-respawn-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147482500;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: radial-gradient(circle at center, rgba(78, 9, 28, .40), rgba(0, 0, 0, .78));
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease;
}

.appsync-respawn-overlay.is-open {
    opacity: 1;
    pointer-events: auto;
}

.appsync-respawn-overlay[hidden] {
    display: none !important;
}

.appsync-respawn-card {
    width: min(420px, calc(100vw - 36px));
    border: 1px solid rgba(255, 122, 122, .48);
    border-radius: 24px;
    padding: 24px 22px;
    background: linear-gradient(145deg, rgba(50, 8, 22, .96), rgba(115, 24, 39, .92));
    color: #fff7f7;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .56), inset 0 1px 0 rgba(255,255,255,.15);
    text-align: center;
}

.appsync-respawn-title {
    font-size: 24px;
    font-weight: 1000;
    margin-bottom: 10px;
}

.appsync-respawn-text {
    font-size: 14px;
    font-weight: 800;
    line-height: 1.35;
    opacity: .94;
    margin-bottom: 18px;
}

.appsync-respawn-button {
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 16px;
    padding: 12px 22px;
    min-width: 160px;
    background: linear-gradient(145deg, rgba(255, 232, 158, .95), rgba(255, 170, 72, .92));
    color: #3a1608;
    font-size: 15px;
    font-weight: 1000;
    cursor: pointer;
    box-shadow: 0 12px 28px rgba(0,0,0,.30);
}

.appsync-respawn-button:disabled {
    opacity: .62;
    cursor: wait;
}



/* ===== Configuração unificada dos HUDs externos =====
   Elementos fora de #menuModuleRoot também obedecem tamanho e opacidade.
   Estados fechados continuam com opacity:0; a variável só vale no estado visível. */
body.woe-page-world #woalenaStatusHud {
    scale: var(--woe-ui-scale);
    transform-origin: left bottom;
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world #woe-minimap-small {
    scale: var(--woe-ui-scale);
    transform-origin: left top;
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world .appsync-ordens-menu {
    scale: var(--woe-ui-scale);
    transform-origin: center bottom;
}

body.woe-page-world .appsync-ordens-menu.is-open {
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world .appsync-ataque-controles {
    scale: var(--woe-ui-scale);
    transform-origin: right bottom;
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world .appsync-ataque-aviso-card {
    scale: var(--woe-ui-scale);
    transform-origin: center center;
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world .appsync-troca-convite {
    scale: var(--woe-ui-scale);
    transform-origin: center top;
}

body.woe-page-world .appsync-troca-convite.is-open {
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world .appsync-global-message {
    scale: var(--woe-ui-scale);
    transform-origin: center top;
}

body.woe-page-world .appsync-global-message.is-open {
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world .appsync-morte-aviso {
    scale: var(--woe-ui-scale);
    transform-origin: center top;
}

body.woe-page-world .appsync-morte-aviso.is-open {
    opacity: var(--woe-ui-opacity) !important;
}

body.woe-page-world #menuModuleRoot .mm-crosshair,
body.woe-page-world #menuModuleRoot .mm-item-tooltip {
    opacity: var(--woe-ui-opacity) !important;
}

/* O toast deve respeitar a opacidade apenas enquanto estiver ativo.
   Sem .show/aria-hidden=false ele precisa permanecer totalmente oculto. */
body.woe-page-world #menuModuleRoot .mm-action-toast,
body.woe-page-world #menuModuleRoot .mm-action-toast[aria-hidden="true"] {
    opacity: 0 !important;
    pointer-events: none !important;
}

body.woe-page-world #menuModuleRoot .mm-action-toast.show[aria-hidden="false"] {
    opacity: var(--woe-ui-opacity) !important;
}

/* Confirmação de retirada/compra/saque contextual */
.mm-context-price {
    margin: 0 0 12px;
    border: 1px solid rgba(166, 232, 184, .32);
    border-radius: 12px;
    padding: 10px;
    background: rgba(49, 152, 93, .18);
    color: rgba(230, 255, 238, .95);
    font-size: 13px;
    font-weight: 900;
}

.mm-context-price[hidden],
.mm-context-action-buttons button[hidden] {
    display: none !important;
}

.mm-context-action-buttons {
    flex-wrap: wrap;
}

.mm-context-action-buttons button {
    min-width: 92px;
}
