/* ===== Hub Central de Lorencia Estilo MMORPG ===== */
.mmorpg-city-hub {
    max-width: 580px;
    margin: 20px auto 0 auto; /* Posicionado no centro, colado na parte superior */
    background: linear-gradient(135deg, #0d1117 0%, #161b22 100%);
    border: 2px solid #30363d;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    box-sizing: border-box;
}

.city-hub-header {
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 2px solid #21262d;
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.city-hub-title-icon {
    font-size: 28px;
    background: #21262d;
    padding: 8px;
    border-radius: 8px;
    border: 1px solid #30363d;
}

.city-hub-titles h2 {
    margin: 0;
    font-size: 20px;
    color: #58a6ff;
    letter-spacing: 0.5px;
    font-family: inherit;
}

.city-sub {
    font-size: 11px;
    color: #8b949e;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.city-hub-desc {
    color: #8b949e;
    font-size: 13px;
    margin-bottom: 15px;
    text-align: center;
}

/* Grid de botões estilo menu de jogo */
.hub-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.mmorpg-hub-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    background: #12161f;
    border: 1px solid #30363d;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    color: #c9d1d9;
}

.mmorpg-hub-btn:hover {
    background: #1f242d;
    border-color: #58a6ff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(88, 166, 255, 0.2);
}

.mmorpg-hub-btn.full-width {
    grid-column: span 2;
}

.hub-icon {
    font-size: 22px;
    padding: 6px;
    background: #1a202c;
    border-radius: 4px;
    border: 1px solid #30363d;
}

.hub-text {
    display: flex;
    flex-direction: column;
}

.hub-text strong {
    font-size: 14px;
    color: #e6edf3;
}

.hub-text small {
    font-size: 11px;
    color: #8b949e;
}

/* Cores específicas de destaque sutis por categoria */
.btn-hunt:hover { border-color: #3fb950; box-shadow: 0 4px 12px rgba(63, 185, 80, 0.2); }
.btn-shop:hover { border-color: #58a6ff; box-shadow: 0 4px 12px rgba(88, 166, 255, 0.2); }
.btn-skills:hover { border-color: #bc8cff; box-shadow: 0 4px 12px rgba(188, 140, 255, 0.2); }
.btn-bank:hover { border-color: #d29922; box-shadow: 0 4px 12px rgba(210, 153, 34, 0.2); }
.btn-craft:hover { border-color: #f0883e; box-shadow: 0 4px 12px rgba(240, 136, 62, 0.2); }

.mmorpg-close-btn {
    background: #da3633;
    color: white;
    border: none;
    padding: 6px 14px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
    font-size: 12px;
}
.mmorpg-close-btn:hover {
    background: #f85149;
}

/* O hub antigo deixa de ser um menu. As ações passam a existir como NPCs
   dentro da praça da cidade. */
.hub-menu-grid { display: none !important; }
.mmorpg-city-hub { width: 100vw; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.city-hub-header, .city-hub-desc { display: none; }

/* Conteúdo dos NPCs: janela flutuante, não tela cheia. */
#hub-section-container {
    position: fixed;
    z-index: 900;
    left: 50%;
    top: 50%;
    width: min(900px, 88vw);
    max-height: min(66vh, 620px);
    transform: translate(-50%, -50%);
    box-sizing: border-box;
    overflow: hidden;
    padding: 18px !important;
    margin: 0 !important;
    border: 1px solid #3d4850 !important;
    border-radius: 5px;
    /* Janela de NPC: o cenário continua visível fora dela, sem backdrop. */
    background: linear-gradient(145deg, rgba(21, 29, 29, .97), rgba(8, 13, 13, .96));
    box-shadow: inset 0 0 0 1px #292719, 0 18px 52px rgba(0,0,0,.84);
}
#hub-section-container > div:first-child { padding-bottom: 12px; border-bottom: 1px solid #50482f; }
.hub-sub { max-height: calc(min(66vh, 620px) - 88px); overflow-y: auto; padding: 12px 3px 3px; }
#hub-section-container[data-section]:not([data-section="respec"]) { height:min(620px,66vh); }
#hub-section-container[data-section]:not([data-section="respec"]) .hub-sub { height:calc(100% - 67px); box-sizing:border-box; }
#hub-section-container[data-section="repair"]{width:min(390px,calc(100vw - 32px));height:auto!important;max-height:none!important}
#hub-section-container[data-section="repair"] .hub-sub{height:auto!important;max-height:none!important;overflow:visible!important}
#hub-section-container[data-section="craft"]{width:min(980px,calc(100vw - 32px));top:12px;transform:translateX(-50%);height:auto!important;max-height:calc(100vh - 32px)!important}
#hub-section-container[data-section="craft"] .hub-sub{height:auto!important;max-height:calc(100vh - 110px)!important;overflow-y:auto!important;overflow-x:hidden;overscroll-behavior:contain;padding-right:8px}
#hub-section-container[data-section="living_world"]{width:min(1500px,calc(100vw - 28px));height:min(780px,calc(100vh - 30px))!important;max-height:none!important;top:15px;transform:translateX(-50%)}
#hub-section-container[data-section="living_world"] .hub-sub{height:calc(100% - 67px)!important;max-height:none!important;overflow:hidden;padding:0}
.city-hunting-globe{position:absolute;z-index:12;right:18px;top:50%;display:grid;grid-template-columns:34px 1fr;align-items:center;gap:0 7px;min-width:142px;padding:7px 10px;border:1px solid #aa9a56;background:linear-gradient(145deg,#263942e8,#0a1114ee);box-shadow:0 5px 16px #000a,inset 0 0 12px #47829a35;color:#e9d787;text-align:left;transform:translateY(-50%);cursor:url('../assets/img/ui/mu-hand-cursor.png') 4 3,pointer}.city-hunting-globe:hover{border-color:#7ae5ef;filter:brightness(1.2)}.city-hunting-globe span{grid-row:span 2;display:grid;place-items:center;width:34px;height:34px;border:1px solid #73d7df;border-radius:50%;background:radial-gradient(circle,#42a8a9,#10242c 58%,#060a0d 62%);color:#defcff;font-size:22px;box-shadow:0 0 12px #42d9e977}.city-hunting-globe b{font:700 12px Georgia,serif}.city-hunting-globe small{color:#a9c1c3;font:11px Arial,sans-serif}
.living-world-shell{position:relative;display:grid;grid-template-columns:205px minmax(0,1fr) 300px;width:100%;height:100%;overflow:hidden;background:#080c0c var(--world-map) center/cover no-repeat;color:#e7e7dd}.living-world-shell:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#050a0bd8 0 13%,transparent 30% 68%,#050a0bd5 86% 100%);pointer-events:none}.living-world-regions,.living-world-board,.living-world-card{position:relative;z-index:1}.living-world-regions{display:grid;align-content:center;gap:6px;padding:16px 13px;border-right:1px solid #806a35;background:linear-gradient(90deg,#080d0ddd,#11130e9c)}.living-world-regions>small{margin:0 9px 5px;color:#d9bd63;font:700 11px Georgia,serif;letter-spacing:2px}.living-world-region{display:flex;align-items:center;gap:8px;min-height:47px;padding:6px 8px;border:1px solid #4e5145;background:linear-gradient(90deg,#1a1e1dd9,#0c1010dd);color:#dfdfd3;text-align:left;cursor:pointer}.living-world-region:hover,.living-world-region.is-selected{border-color:#7edbea;background:linear-gradient(90deg,#16333adf,#111a1bdd)}.living-world-region i{width:23px;height:23px;border:1px solid var(--region);border-radius:50%;box-shadow:0 0 8px var(--region);background:radial-gradient(circle,var(--region),#101414 62%)}.living-world-region b,.living-world-region small{display:block}.living-world-region b{font:700 13px Georgia,serif}.living-world-region small{margin-top:2px;color:#bdc7c3;font:11px Arial,sans-serif}.living-world-board{min-width:0;height:100%}.living-world-pins{position:absolute;inset:0}.living-world-pin{position:absolute;left:var(--x);top:var(--y);display:grid;justify-items:center;gap:3px;padding:0;border:0;background:transparent;color:#f3ead0;transform:translate(-50%,-50%);cursor:pointer}.living-world-pin i{display:grid;place-items:center;width:44px;height:55px;border:2px solid var(--pin);border-radius:55% 55% 55% 0;background:radial-gradient(circle at 50% 32%,#fff5c7 0 5%,var(--pin) 8%,#162224 48%,#061014 68%);box-shadow:0 0 12px var(--pin),inset 0 0 9px #000;font:700 17px Georgia,serif;transform:rotate(-45deg)}.living-world-pin i::first-letter{transform:rotate(45deg)}.living-world-pin span{padding:2px 6px;background:#071011d9;font:700 11px Georgia,serif;text-shadow:1px 1px #000}.living-world-pin.is-selected i{box-shadow:0 0 22px var(--pin),0 0 0 3px #eaf8ff80,inset 0 0 9px #000;animation:living-world-pulse 1.25s ease-in-out infinite}.living-world-pin.is-locked{filter:grayscale(1);opacity:.52}.living-world-card{align-self:center;margin:0 18px;padding:18px 16px;border:1px solid #a68b45;background:linear-gradient(145deg,#101c23f2,#050a0df2);box-shadow:0 0 0 2px #191308,0 12px 26px #000a,inset 0 0 24px #1c5a7a33}.living-world-card>small{color:#8ed9e9;font:700 11px Georgia,serif;letter-spacing:1.8px}.living-world-card h3{margin:8px 0;border:0;color:#e8f2f3;font:700 20px/1.12 Georgia,serif}.living-world-card p{display:grid;gap:5px;margin:0 0 12px;color:#b5c4c3;font:11px/1.35 Arial,sans-serif}.living-world-card p b{color:#ebcf78;font:700 14px Georgia,serif}.living-world-mobs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.living-world-mob{display:grid;justify-items:center;gap:4px;min-width:0;padding:5px;border:1px solid #53636a;background:#071010;color:#dbe9e7;cursor:pointer}.living-world-mob:hover{border-color:#e0ba59;background:#152420}.living-world-mob-art{width:52px;height:52px;border:1px solid #77735b;background:#172827 center/cover no-repeat;color:#dcece8;font:700 22px/52px Georgia,serif;text-align:center}.living-world-mob b{max-width:100%;overflow:hidden;color:#f1df9d;font:700 11px Georgia,serif;text-overflow:ellipsis;white-space:nowrap}.living-world-mob small{color:#91bac0;font:11px Arial,sans-serif}.living-world-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:12px;border-top:1px solid #4a5859}.living-world-card-foot span{color:#baf252;font:700 11px Georgia,serif}.living-world-card-foot button{padding:10px 14px;border:1px solid #d8af4d;background:linear-gradient(#806320,#342409);color:#fff0b7;font:700 13px Georgia,serif;cursor:pointer}.living-world-card-foot button:disabled{filter:grayscale(1);opacity:.5;cursor:not-allowed}.living-world-empty{grid-column:1/-1;color:#a7b3af;font-size:11px;text-align:center}@keyframes living-world-pulse{50%{filter:brightness(1.4);transform:rotate(-45deg) scale(1.09)}}
@media(max-width:900px){#hub-section-container[data-section="living_world"]{width:calc(100vw - 14px);height:calc(100vh - 14px)!important;top:7px}.living-world-shell{grid-template-columns:150px minmax(0,1fr) 235px}.living-world-regions{padding:8px}.living-world-region{min-height:39px}.living-world-card{margin:0 8px;padding:11px}.living-world-card h3{font-size:15px}.living-world-mob-art{width:40px;height:40px;line-height:40px}}
.living-world-pin i{height:48px;border-radius:50% 50% 50% 12%;transform:none}.living-world-pin.is-selected i{animation:living-world-pulse 1.25s ease-in-out infinite}@keyframes living-world-pulse{50%{filter:brightness(1.4);transform:scale(1.09)}}

/* Mapa Vivo: a imagem aprovada contém a moldura inteira. Não sobrepomos
   elementos visuais nela; somente zonas transparentes de interação. */
#hub-section-container[data-section="living_world"] { padding:0 !important; border:0 !important; background:#080909 !important; box-shadow:0 18px 52px #000d !important; }
#hub-section-container[data-section="living_world"] > div:first-child { display:none; }
#hub-section-container[data-section="living_world"] .hub-sub { height:100% !important; }
.living-world-approved { position:relative; width:100%; height:100%; overflow:hidden; background:#090a09 url('../assets/img/ui/living-world-map-approved-v2.png') center/100% 100% no-repeat; }
.living-world-hotspot, .living-world-devias-hunt, .living-world-close { position:absolute; border:0; background:transparent; cursor:url('../assets/img/ui/mu-hand-cursor.png') 4 3,pointer; }
.living-world-hotspot { left:var(--x); top:var(--y); width:11%; height:18%; transform:translate(-50%,-50%); }
.living-world-hotspot:hover, .living-world-hotspot:focus-visible { outline:2px solid #f7dc78; outline-offset:-4px; filter:drop-shadow(0 0 10px #f7dc78); }
.living-world-devias-hunt { left:79.2%; top:69.8%; width:18.5%; height:10%; }
.living-world-devias-hunt:hover, .living-world-devias-hunt:focus-visible { outline:2px solid #f7dc78; outline-offset:-5px; }
.living-world-close { right:.5%; top:1%; width:4.4%; height:8%; }
.living-world-close:hover, .living-world-close:focus-visible { outline:2px solid #f7dc78; border-radius:50%; }
@media(max-width:900px){ .living-world-approved { background-size:cover; } }

/* Versão interativa: o continente é uma arte de fundo; regiões, pins e
   retratos são componentes reais renderizados a partir dos dados do jogo. */
#hub-section-container[data-section="living_world"] { padding:18px !important; border:1px solid #6d5d35 !important; background:linear-gradient(145deg,#111815,#060a0a) !important; }
#hub-section-container[data-section="living_world"] > div:first-child { display:flex !important; }
#hub-section-container[data-section="living_world"] .hub-sub { height:calc(100% - 67px) !important; padding:0; }
#hub-section-container[data-section="living_world"] > div:first-child { position:relative; justify-content:center !important; min-height:42px; margin:0 0 8px !important; padding:0 56px 10px !important; border-bottom:2px solid #775f2f; background:linear-gradient(180deg,#1d1d1a,#0b0c0c); }
#hub-section-container[data-section="living_world"] #hub-section-title { color:#e8ca78 !important; font:700 26px/42px Georgia,serif; letter-spacing:1.4px; text-shadow:0 2px #000,0 0 12px #b88a3a77; text-transform:uppercase; }
#hub-section-container[data-section="living_world"] #btn-hub-close { position:absolute; right:10px; top:7px; width:29px; height:29px; border-color:#b49a55; color:#f0d987; }
#living-world-map { width:100%; height:100%; }
.living-world-approved { display:none; }
.living-world-shell { grid-template-columns:185px minmax(0,1fr) 306px; background:#080c0c url('../assets/img/maps/living-world-continent-v3.png') center/cover no-repeat; }
.living-world-shell::before { background:linear-gradient(90deg,#050a0be8 0 11%,transparent 30% 68%,#050a0be8 88% 100%); }
.living-world-regions { gap:7px; padding:12px 10px; }
.living-world-region { min-height:48px; }
.living-world-board { min-height:0; }
.living-world-pin i { width:42px; height:50px; border-radius:50% 50% 50% 14%; transform:none; }
.living-world-pin.is-selected i { animation:living-world-pulse 1.25s ease-in-out infinite; }
.living-world-card { display:flex; flex-direction:column; align-self:stretch; max-height:none; margin:14px; padding:22px 19px; overflow:hidden; border:0; background:#071014 url('../assets/img/ui/living-world-card-frame-v1.png') center/100% 100% no-repeat; box-shadow:0 8px 19px #000b; }
.living-world-card h3 { flex:none; }
.living-world-card h3 em { display:block; margin-top:3px; color:#94d7eb; font:italic 14px Georgia,serif; }
.living-world-mobs { grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; max-height:none; margin-top:3px; overflow-y:auto; padding-right:3px; }
.living-world-mob { min-height:91px; }
.living-world-mob-art { width:60px; height:53px; background-color:#162222; background-position:center; background-repeat:no-repeat; background-size:cover; }
.living-world-mob:disabled { cursor:not-allowed; filter:grayscale(1); opacity:.45; }
.living-world-card-foot { margin-top:auto; }
.living-world-loading { display:grid; place-items:center; width:100%; height:100%; color:#e9c96c; font:700 18px Georgia,serif; background:#0a0f0f url('../assets/img/maps/living-world-continent-v3.png') center/cover no-repeat; text-shadow:0 2px #000; }
.living-world-region { position:relative; min-height:59px; padding:3px 23px 3px 5px; border-color:#655c42; background:linear-gradient(90deg,#171713ee,#0b0e0ddd); }
.living-world-region i { flex:0 0 54px; width:54px; height:54px; border:0; border-radius:50%; background-color:transparent; background-size:cover; background-position:center; box-shadow:none; }
.living-world-region em { position:absolute; right:8px; color:var(--region); font-style:normal; font-size:18px; text-shadow:0 0 8px var(--region); }
.living-world-region.is-selected { border-color:#55c7ff; box-shadow:inset 0 0 12px #237ab455,0 0 8px #46b9ed55; }
.living-world-region.is-selected i { filter:brightness(1.22); }
/* Ao passar sobre uma região, mantenha a moldura ornamental intacta. O
   destaque acontece somente nas laterais, usando a cor própria do mapa. */
.living-world-region:hover,
.living-world-region:focus-visible {
    border-color:#655c42;
    background:linear-gradient(90deg,#171713ee,#0b0e0ddd);
    box-shadow:inset 3px 0 10px color-mix(in srgb, var(--region) 55%, transparent), inset -3px 0 10px color-mix(in srgb, var(--region) 55%, transparent);
    outline:0;
}
.living-world-pin i { position:relative; width:54px; height:54px; border:3px solid var(--pin); border-radius:50%; background-color:#101719; background-size:cover; background-position:center; box-shadow:0 0 14px var(--pin),inset 0 0 0 2px #031013; overflow:visible; }
.living-world-pin i::after { content:''; position:absolute; z-index:-1; left:50%; bottom:-18px; width:25px; height:31px; border-right:3px solid var(--pin); border-bottom:3px solid var(--pin); background:linear-gradient(135deg,#0b1820,var(--pin)); box-shadow:0 0 10px var(--pin); transform:translateX(-50%) rotate(45deg); }
.living-world-pin.is-selected i { animation:living-world-pulse 1.25s ease-in-out infinite; }
.living-world-showcase { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin:11px 0 8px; padding:9px 0; border-top:1px solid #9b7b3d; border-bottom:1px solid #70592e; }
.living-world-portrait { min-width:0; padding:3px; border:1px solid #9f8042; background:#071013; cursor:pointer; }
.living-world-portrait:hover { border-color:#e6c366; filter:brightness(1.2); }
.living-world-portrait span { display:block; width:100%; aspect-ratio:1; background:#131a1c center/cover no-repeat; }
.living-world-portrait:disabled { filter:grayscale(1); opacity:.5; cursor:not-allowed; }
.living-world-card { align-items:stretch; text-align:center; }
.living-world-card > small { text-align:left; }
.living-world-card h3 { margin:10px 0 7px; color:#8cd8ff; font-size:25px; }
.living-world-card h3 em { color:#8cd8ff; font-size:18px; }
.living-world-card p { margin:0; text-align:center; }
.living-world-card p b { font-size:19px; }
.living-world-card-foot { justify-content:center; gap:10px; }
.living-world-card-foot button { font-size:16px; }
@media(max-width:900px){ .living-world-shell { grid-template-columns:145px minmax(0,1fr) 240px; } .living-world-card { margin:8px; padding:10px; } .living-world-region{min-height:40px}.living-world-mob{min-height:72px}.living-world-mob-art{width:43px;height:40px} }
/* ---- Skill Master: linhas de aprendizado ----
   Cada linha é uma escada vertical. O trilho da esquerda liga os degraus e é
   ele que mostra a ordem: acima do degrau atual está o que já foi pago,
   abaixo o que ainda está trancado. */
#skills-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.skill-line { min-width: 0; border: 1px solid #3a4436; border-radius: 4px; background: linear-gradient(160deg, #131a16, #0a0f0d); }
.skill-line > header { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border-bottom: 1px solid #2c3529; background: rgba(0,0,0,.3); }
.skill-line > header span { flex: 1 1 auto; color: #d8e6cf; font: 700 12px Georgia, serif; }
.skill-line > header i { flex: 0 0 auto; color: #8fa387; font: 700 11px Consolas, monospace; font-style: normal; }

.skill-line-steps { position: relative; margin: 0; padding: 10px 10px 12px 0; list-style: none; }
/* O trilho nasce no centro da primeira bolinha e morre no centro da última. */
.skill-line-steps::before { content: ''; position: absolute; left: 27px; top: 26px; bottom: 26px; width: 2px; background: linear-gradient(#4a6b45, #2b3a29); }

.skill-step { position: relative; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 7px 0 7px 10px; }
.skill-step-mark { position: relative; z-index: 1; display: grid; place-items: center; width: 22px; height: 22px; margin-left: 6px; border: 2px solid #4a6b45; border-radius: 50%; background: #0d1310; color: #9fb897; font: 800 11px Consolas, monospace; font-style: normal; }
.skill-step-body { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.skill-step-body strong { color: #eaf3e4; font: 700 12px Georgia, serif; }
.skill-step-desc { color: #93a48d; font-size: 11px; line-height: 1.35; }
.skill-step-req { color: #7f9ab5; font: 600 11px "Segoe UI", sans-serif; }
.skill-step-blocked { color: #d99a6a; font: 600 11px "Segoe UI", sans-serif; }
.skill-step-buy { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.skill-step-price { color: #e8c76a; font: 700 11px Georgia, serif; white-space: nowrap; }
.skill-step-buy button { min-width: 88px; padding: 5px 8px; background: #287d42; font-size: 11px; }

/* Aprendida: degrau preenchido, o trilho acima dele já está "pago". */
.skill-step.is-learned .skill-step-mark { border-color: #4fbf72; background: #1c4a2c; color: #b7f5c8; }
.skill-step.is-learned .skill-step-body strong { color: #a8e6b9; }
.skill-step.is-learned .skill-step-price { color: #6f8a6b; text-decoration: line-through; }
/* Liberada agora: é o degrau que pisca pedindo o clique. */
.skill-step.is-available .skill-step-mark { border-color: #e8c76a; background: #3a2f10; color: #ffe9a8; box-shadow: 0 0 8px rgba(232,199,106,.35); }
/* Falta Zen: liberada, mas o botão não resolve ainda. */
.skill-step.is-unaffordable .skill-step-price { color: #e07a6a; }
/* Trancada pela linha: apagada, e o botão não clica. */
.skill-step.is-locked { opacity: .55; }
.skill-step.is-locked .skill-step-mark { border-color: #3b443a; color: #6d7a69; }
.skill-step.is-locked .skill-step-buy button { background: #33403a; cursor: not-allowed; }
@media (max-width: 650px) { #hub-section-container { width: 94vw; max-height: 72vh; padding: 13px !important; } #hub-section-container[data-section]:not([data-section="respec"]) { height:72vh; } #skills-list { grid-template-columns: 1fr; } .hub-sub { max-height: calc(72vh - 80px); } }
.city-npc-plaza {
    display: block;
    min-height: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    border: 0;
    background-position: center;
    background-size: cover;
    box-shadow: inset 0 0 44px #000, 0 6px 22px #000a;
}
#city-canvas { display: block; width: 100%; height: calc(100vh - 102px); min-height: 520px; max-height: none; image-rendering: auto; cursor: pointer; touch-action: none; }

.shop-category-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid #5f5130; }
.shop-category-tabs button { padding: 7px 11px; border: 1px solid #776334; background: linear-gradient(#29291f, #11120f); color: #d8cfaa; font: 700 12px Georgia, serif; }
.shop-category-tabs button:hover, .shop-category-tabs button.active { color: #fff0a7; border-color: #e0ba56; background: linear-gradient(#6d5720, #25200f); box-shadow: 0 0 8px #c8922544; }
.shop-set-tabs { display:flex; flex-wrap:wrap; gap:5px; margin:-4px 0 13px; padding:8px 9px; border:1px solid #403920; background:linear-gradient(90deg,#0d100c,#181811); }
.shop-set-tabs::before { content:'Filtrar set:'; align-self:center; margin-right:3px; color:#9eaa99; font:700 11px Georgia,serif; }
.shop-set-tabs button { padding:5px 9px; border:1px solid #5d5635; background:#15170f; color:#cfc49a; font:700 11px Georgia,serif; }
.shop-set-tabs button:hover, .shop-set-tabs button.active { color:#fff0a7; border-color:#d7ae48; background:linear-gradient(#5f4b1c,#28200d); box-shadow:0 0 7px #c8922538; }
.shop-category-list { display: grid; gap: 7px; }
.shop-item-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 9px 11px; border: 1px solid #413b2a; background: linear-gradient(90deg, #11150f, #191811); }
.shop-item-row strong, .shop-item-row small, .shop-item-row em { display: block; }
.shop-item-row strong { color: #f0d47a; font: 700 14px Georgia, serif; }.shop-item-row small { margin-top: 3px; color: #9faf9d; font-size: 11px; }.shop-item-row em { margin-top: 3px; color: #e8b941; font-size: 11px; font-style: normal; }
.shop-item-controls { display: flex; align-items: center; gap: 7px; }.shop-item-controls input { width: 62px; padding: 6px; border: 1px solid #6c603d; background: #090b09; color: #fff1b6; text-align: center; }.shop-item-controls button { background: #238636; }
.shop-empty { margin: 0; padding: 20px; color: #9da9ad; text-align: center; border: 1px dashed #4b4c43; }
.city-scene-help { display:none; }
.city-chat { position: absolute; z-index: 5; left: 12px; bottom: 12px; width: 315px; color: #dceae1; border: 1px solid #3f4c4e; background: linear-gradient(rgba(9,15,12,.94), rgba(3,7,5,.92)); box-shadow: inset 0 0 0 1px #0a0c09, 0 2px 12px #000c; }
.city-chat-title { display:flex; align-items:center; gap:8px; padding:7px 8px; color:#f5dc82; font:700 12px Georgia,serif; border-bottom:1px solid #5c553a; }.city-chat-title button{margin-left:auto;padding:0 5px;background:#28291e;color:#f3db83;font:700 11px Georgia,serif;line-height:18px;}.city-chat-title #city-chat-minimize{width:22px;font-size:17px;}
.city-chat-tabs{display:flex;border-bottom:1px solid #44432e;}.city-chat-tabs button{flex:1;padding:5px 2px;border:0;border-right:1px solid #393a28;border-radius:0;background:#111610;color:#9da99a;font:700 11px Georgia,serif;}.city-chat-tabs button.active{background:#574820;color:#fff0a8;}.city-chat-log { height: 88px; overflow-y: auto; padding: 6px 8px; font-size: 11px; line-height: 1.4; }
.city-chat-log b { color: #72e7ad; }
.city-friends-panel { min-height:76px; max-height:120px; overflow:auto; padding:6px 8px; border-top:1px solid #4c523c; background:#071009; }.city-friends-panel strong{display:block;margin-bottom:4px;color:#f1d57b;font:700 11px Georgia,serif;}.city-friends-panel p{margin:8px 0;color:#91a398;font-size:11px;}.city-friends-panel button{display:flex;align-items:center;width:100%;gap:6px;padding:4px;border:0;border-bottom:1px solid #263227;background:transparent;color:#dbe8de;text-align:left;font-size:11px;}.city-friends-panel button:hover{background:#1e2b1e;}.city-friends-panel i{width:7px;height:7px;border-radius:50%;background:#4be28a;box-shadow:0 0 5px #4be28a;}.city-friends-panel small{margin-left:auto;color:#69d694;font-size:11px;}
.city-chat-entry{display:flex;align-items:center;border-top:1px solid #4c523c;background:#080d09;}.city-chat-entry span{padding:0 7px;color:#f1d57b;font:700 11px Georgia,serif;}.city-chat input { flex:1; width:auto; box-sizing: border-box; padding: 7px; color: #eaf6ec; background: #0b120d; border: 0; outline: none; font-size: 11px; }.city-chat.minimized{width:170px}.city-chat.minimized .city-chat-body{display:none}
.city-chat, .city-chat * { pointer-events: auto; }
.city-minimap-shell { position:absolute; z-index:6; right:16px; top:12px; width:176px; height:176px; background:url('../assets/img/ui/mu-living-compass-frame.png') center / 100% 100% no-repeat; filter:drop-shadow(0 4px 12px #000e); pointer-events:none; }
#city-minimap { position:absolute; z-index:1; left:8px; top:8px; width:160px; height:160px; border-radius:50%; background:transparent; pointer-events:none; }
.city-coordinates { position:absolute; z-index:6; right:25px; top:190px; width:146px; padding:5px 7px; text-align:center; color:#c8c4ae; background:rgba(3,7,6,.88); border:1px solid #3f4c4e; font:700 11px Georgia,serif; text-shadow:1px 1px #000; }.city-coordinates b{color:#b8d4dd;margin-left:7px}.city-coordinates i{color:#a9dff9;font-style:normal;margin-left:6px}
.city-npc {
    position: absolute;
    z-index: 1;
    width: 165px;
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #f5efd8;
    padding: 8px 10px;
    text-align: left;
    cursor: pointer;
    border: 1px solid #6f6243;
    background: linear-gradient(90deg, rgba(8, 12, 12, .76), rgba(18, 27, 23, .58));
    box-shadow: inset 0 0 0 1px #080a08, 0 2px 7px #000a;
}
.city-npc:hover { border-color: #f0cf6b; transform: translateY(-1px); background: linear-gradient(90deg, rgba(25, 34, 27, .96), rgba(47, 57, 35, .78)); }
.city-npc-portrait { width: 38px; height: 38px; flex: 0 0 38px; border: 1px solid #b79a54; background-color: #11150f; background-image: url('../assets/img/npcs/city-npc-portraits.png'); background-size: 400% 300%; box-shadow: inset 0 0 9px #000, 0 0 6px #000; }
.travel-loading { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s ease, visibility .2s ease; }
.travel-loading.visible { opacity: 1; visibility: visible; pointer-events: auto; }
.travel-loading-backdrop { position: absolute; inset: 0; background: linear-gradient(90deg, #020506ee, #07100bc2, #020506ee), var(--travel-image) center / cover no-repeat; filter: saturate(.75) brightness(.45); }
.travel-loading-card { position: relative; min-width: min(430px, 86vw); padding: 18px 42px 26px; display: flex; flex-direction: column; align-items: center; gap: 7px; color: #d6dfd8; border: 1px solid var(--travel-accent); background: linear-gradient(#07100ddd, #020605ee); box-shadow: inset 0 0 28px #000, 0 0 34px #000; font-family: Georgia, serif; }
.travel-loading-card small { color: var(--travel-accent); letter-spacing: 2px; font-size: 11px; }.travel-loading-card strong { color: #fff1b2; font-size: 28px; text-shadow: 0 2px #000; }.travel-loading-card > span:not(.travel-loading-rune) { font: 12px Segoe UI, sans-serif; }
.travel-loading-rune { color: var(--travel-accent); font-size: 29px; animation: travelRune 1s ease-in-out infinite alternate; }.travel-loading-bar { width: 100%; height: 5px; margin-top: 10px; overflow: hidden; background: #050605; border: 1px solid #564d37; }.travel-loading-bar i { display:block; height:100%; width:40%; background: var(--travel-accent); animation: travelLoad 1.1s ease-in-out infinite; }
@keyframes travelLoad { from { transform: translateX(-110%); } to { transform: translateX(290%); } } @keyframes travelRune { to { transform: scale(1.2); filter: drop-shadow(0 0 8px var(--travel-accent)); } }
.travel-wing-ritual{position:relative;width:250px;height:80px;margin:-5px 0 1px;isolation:isolate}.travel-wing-ritual::before{content:'';position:absolute;z-index:-1;left:50%;top:50%;width:132px;height:40px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse, color-mix(in srgb,var(--travel-accent),transparent 35%),transparent 68%);filter:blur(9px);animation:travel-portal-pulse 1.35s ease-in-out infinite}.travel-wing{position:absolute;bottom:0;width:92px;height:76px;background:center / contain no-repeat;opacity:0;transform-origin:50% 80%;filter:drop-shadow(0 0 7px currentColor);animation:travel-wing-arrive 1.5s cubic-bezier(.2,.8,.25,1) infinite}.wing-spirit{left:14px;color:#71d9ff;background-image:url('../assets/img/characters/wings/wing-of-spirit.png');animation-delay:0s}.wing-soul{left:79px;color:#ba8cff;background-image:url('../assets/img/characters/wings/wing-of-soul.png');animation-delay:.17s}.wing-dragon{right:13px;color:#ff9b5b;background-image:url('../assets/img/characters/wings/wing-of-dragon.png');animation-delay:.34s}.travel-wing-spark{position:absolute;bottom:12px;left:50%;width:4px;height:4px;border-radius:50%;background:var(--travel-accent);box-shadow:0 0 9px var(--travel-accent);opacity:0;animation:travel-spark 1.5s ease-out infinite}.spark-a{animation-delay:.08s}.spark-b{animation-delay:.42s}.spark-c{animation-delay:.76s}@keyframes travel-wing-arrive{0%{opacity:0;transform:translateY(18px) scale(.55) rotate(-12deg)}20%{opacity:1}43%{transform:translateY(-3px) scale(1.04) rotate(3deg)}60%{opacity:1;transform:translateY(1px) scale(.98) rotate(-2deg)}82%{opacity:.78;transform:translateY(-2px) scale(1) rotate(2deg)}100%{opacity:0;transform:translateY(-11px) scale(.86) rotate(0)}}@keyframes travel-spark{0%{opacity:0;transform:translate(-50%,12px) scale(.5)}32%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + 34px),-57px) scale(1.3)}}@keyframes travel-portal-pulse{50%{transform:translate(-50%,-50%) scale(1.23);filter:blur(13px)}}
@media (max-width:520px){.travel-loading-card{min-width:min(330px,90vw);padding-inline:20px}.travel-wing-ritual{transform:scale(.84);margin:-8px 0 -7px}}

/* Transição cinematográfica: trio de asas Tier 1 com batida real em 3D. */
.travel-loading{--travel-haze:rgba(82,156,255,.28);transition:opacity .3s ease,visibility .3s ease}.travel-loading-backdrop{background:linear-gradient(90deg,#020508ed,rgba(5,11,15,.66),#020508ed),var(--travel-image) center/cover no-repeat;filter:saturate(.84) brightness(.54);animation:travel-backdrop 2s ease-out both}.travel-loading::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,var(--travel-haze),transparent 42%),linear-gradient(180deg,rgba(2,5,9,.1),rgba(1,3,5,.68));mix-blend-mode:screen}.travel-loading-card{width:min(650px,92vw);min-width:0;padding:8px 34px 20px;border:0;background:transparent;box-shadow:none;text-align:center}.travel-loading-card::before{content:'';position:absolute;z-index:-1;inset:8px 13% 0;border-radius:50%;background:radial-gradient(ellipse,rgba(1,4,7,.08),rgba(1,4,7,.76) 68%,transparent);filter:blur(9px)}.travel-loading-card strong{font-size:30px;text-shadow:0 2px 5px #000,0 0 18px var(--travel-haze)}.travel-loading-bar{width:min(390px,76%);height:3px;border:0;border-radius:9px;background:rgba(224,239,239,.18);box-shadow:0 0 0 1px rgba(255,255,255,.15),0 0 13px var(--travel-haze)}.travel-loading-bar i{width:36%;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--travel-accent),#fff,transparent);animation:travelLoad 1.25s ease-in-out infinite}.travel-wing-ritual{width:min(560px,86vw);height:164px;margin:-4px 0 1px;perspective:880px}.travel-wing-ritual::before{width:74%;height:46px;top:56%;background:radial-gradient(ellipse,var(--travel-haze),transparent 68%);filter:blur(13px);animation:travel-portal-pulse 1.25s ease-in-out infinite}.travel-wing{bottom:0;width:31%;height:154px;background:none!important;opacity:0;transform-style:preserve-3d;filter:drop-shadow(0 8px 12px rgba(0,0,0,.8));animation:travel-wing-enter 1.95s cubic-bezier(.18,.8,.22,1) infinite}.travel-wing::before,.travel-wing::after{content:'';position:absolute;inset:0;background-image:url('../assets/img/ui/travel-tier1-wings-sheet.png');background-repeat:no-repeat;background-size:300% 100%;background-position:var(--wing-x) 50%;backface-visibility:hidden}.travel-wing::before{clip-path:inset(0 50% 0 0);transform-origin:50% 56%;animation:travel-wing-flap-left .47s ease-in-out infinite alternate}.travel-wing::after{clip-path:inset(0 0 0 50%);transform-origin:50% 56%;animation:travel-wing-flap-right .47s ease-in-out infinite alternate}.wing-spirit{left:1%;--wing-x:0%;animation-delay:0s}.wing-soul{left:34.5%;--wing-x:50%;animation-delay:.13s}.wing-dragon{right:1%;--wing-x:100%;animation-delay:.26s}.travel-wing-spark{bottom:17px;box-shadow:0 0 11px var(--travel-accent);animation:travel-spark 1.55s ease-out infinite}@keyframes travel-backdrop{from{transform:scale(1.07)}to{transform:scale(1)}}@keyframes travel-wing-enter{0%{opacity:0;transform:translateY(34px) scale(.72)}16%{opacity:1}42%{opacity:1;transform:translateY(-3px) scale(1)}78%{opacity:1;transform:translateY(1px) scale(.98)}100%{opacity:0;transform:translateY(-14px) scale(.91)}}@keyframes travel-wing-flap-left{from{transform:perspective(500px) rotateY(26deg) scaleX(.88) translateY(2px)}to{transform:perspective(500px) rotateY(-14deg) scaleX(1.03) translateY(-3px)}}@keyframes travel-wing-flap-right{from{transform:perspective(500px) rotateY(-26deg) scaleX(.88) translateY(2px)}to{transform:perspective(500px) rotateY(14deg) scaleX(1.03) translateY(-3px)}}.travel-loading[data-travel-theme="noria"]{--travel-haze:rgba(74,217,138,.33)}.travel-loading[data-travel-theme="devias"],.travel-loading[data-travel-theme="losttower"]{--travel-haze:rgba(118,194,255,.36)}.travel-loading[data-travel-theme="dungeon"]{--travel-haze:rgba(211,61,82,.31)}.travel-loading[data-travel-theme="tarkan"]{--travel-haze:rgba(236,166,74,.32)}.travel-loading[data-travel-theme="icarus"]{--travel-haze:rgba(182,211,255,.42)}
.npc-dialogue { position: fixed; z-index: 1001; inset: 0; display: grid; place-items: center; padding: 24px; background: transparent; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s ease, visibility .18s ease; }.npc-dialogue.visible { opacity: 1; visibility: visible; pointer-events: none; }.npc-dialogue-box { pointer-events:auto; }
.npc-dialogue-box { width: min(680px, 94vw); min-height: 205px; display: flex; align-items: end; border: 1px solid #c8a650; background: linear-gradient(100deg, #0d1412, #10110df2); box-shadow: inset 0 0 0 2px #2b271a, 0 8px 35px #000; }.npc-dialogue-art { width: 190px; height: 200px; flex: 0 0 190px; background-size: 400% 300%; background-repeat: no-repeat; filter: drop-shadow(0 0 10px #000); }.npc-dialogue-copy { position: relative; flex: 1; align-self: stretch; padding: 22px 48px 18px 18px; }.npc-dialogue-copy small { display:block; color:#94cbb0; font-size:11px; text-transform:uppercase; letter-spacing:1px; }.npc-dialogue-copy strong { display:block; margin:3px 0 10px; color:#ffe28a; font:700 20px Georgia,serif; }.npc-dialogue-copy p { min-height:48px; margin:0 0 13px; color:#dbe7dc; font-size:13px; line-height:1.45; }.npc-dialogue-copy button[data-npc-continue] { background:#277a41; }.npc-dialogue-close { position:absolute; top:7px; right:9px; padding:0; border:0; background:transparent; color:#d9c580; font-size:23px; }
.storage-chest-modal { position:fixed; z-index:1004; inset:0; display:grid; place-items:center; padding:20px; background:transparent; pointer-events:none; }.storage-chest-modal > * { pointer-events:auto; }.storage-chest-modal[hidden] { display:none; }.storage-chest-window { position:relative; width:min(820px,94vw); max-height:82vh; overflow:auto; padding:20px; border:1px solid #4b555b; background:linear-gradient(135deg,#111517,#060808 64%); box-shadow:0 0 0 3px #050607,inset 0 0 28px #000,0 14px 48px #000; color:#dce4d7; }.storage-chest-window header { display:flex; align-items:center; gap:10px; padding:0 20px 12px 0; border-bottom:1px solid #3e484d; }.storage-chest-window header img { width:58px; height:58px; object-fit:contain; }.storage-chest-window header small { display:block; color:#8ea6b0; font-size:11px; letter-spacing:1.2px; }.storage-chest-window h3 { margin:2px 0 0; color:#e1edf0; font:700 23px Georgia,serif; }.storage-chest-window > p { margin:14px 0; color:#bcc9bd; font-size:13px; }.storage-chest-close { position:absolute; top:8px; right:10px; padding:0; border:0; background:transparent; color:#a9c2cb; font-size:24px; }.storage-chest-currencies { display:grid; gap:9px; }.storage-currency { padding:12px; border:1px solid #3b4948; background:linear-gradient(110deg,#0e1414,#070a09); }.storage-currency-name { display:flex; align-items:center; gap:7px; color:#d5e3e6; font:700 17px Georgia,serif; }.storage-currency-name i { width:22px; text-align:center; font-style:normal; }.storage-zen .storage-currency-name i { color:#a7d4df; }.storage-balances { display:flex; gap:18px; margin:7px 0; color:#abbcaf; font-size:12px; }.storage-balances b { margin-left:4px; color:#e1edf0; }.storage-actions { display:grid; grid-template-columns:86px 1fr 1fr; gap:6px; }.storage-actions input { min-width:0; padding:7px; border:1px solid #4e6064; color:#e7f1f3; background:#060807; }.storage-actions button { padding:7px; background:#2a7140; }.storage-actions button:last-child { background:#385d79; }.storage-chest-items { margin-top:14px; padding-top:12px; border-top:1px solid #3e484d; }.storage-items-head { display:flex; align-items:baseline; gap:9px; margin-bottom:8px; }.storage-items-head strong { color:#dbe8ea; font:700 17px Georgia,serif; }.storage-items-head small { color:#93a8aa; font-size:11px; }.storage-item-columns { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.storage-item-columns section { min-height:120px; padding:9px; border:1px solid #39454a; background:linear-gradient(135deg,#0c1011,#080a0a); }.storage-item-columns h4 { margin:0 0 8px; color:#a7c3cb; font:700 12px Georgia,serif; }.storage-item-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(115px,1fr)); gap:6px; max-height:205px; overflow:auto; }.storage-item-card { min-height:86px; display:grid; grid-template-rows:31px minmax(26px,auto) auto; align-items:center; justify-items:center; padding:5px; border:1px solid #39444a; background:#111617; text-align:center; }.storage-item-card strong { max-width:100%; overflow:hidden; color:#dbe5df; font-size:11px; line-height:12px; text-overflow:ellipsis; }.storage-item-card button { padding:3px 7px; border:1px solid #53636a; background:#263e46; color:#dcecf0; font:700 11px Georgia,serif; }.storage-item-card button:hover { background:#31535e; }.storage-item-icon { display:block; width:31px; height:31px; }.storage-item-icon .generated-item-icon,.storage-item-icon .jewel-item-icon { margin:0!important; }.storage-empty { grid-column:1/-1; margin:12px 0; color:#87979a; font-size:11px; text-align:center; }.respec-master-card { padding:20px; border:1px solid #4d5759; background:linear-gradient(135deg,#111611,#080a08); box-shadow:inset 0 0 22px #000; }.respec-master-card small { color:#94cbb0; font-size:11px; letter-spacing:1px; }.respec-master-card h3 { margin:5px 0 8px; color:#dce8ea; font:700 22px Georgia,serif; }.respec-master-card p { color:#ced9cf; line-height:1.5; }.respec-master-details { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:15px 0; }.respec-master-details span { padding:9px; border:1px solid #3c4a4b; color:#aebcaf; font-size:12px; }.respec-master-details b { display:block; margin-top:3px; color:#cce1e6; font-size:14px; }.respec-master-button { width:100%; background:#2a7742; }.respec-master-button:disabled { opacity:.48; cursor:not-allowed; } @media (max-width:620px) { .storage-item-columns { grid-template-columns:1fr; } .storage-chest-window { max-height:88vh; padding:14px; } }
.city-npc-copy { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 3px; }
.city-npc-copy strong { font: 700 13px Georgia, serif; color: #ffdf80; }
.city-npc-copy small { color: #c5d5c7; font-size: 11px; }
.city-npc-talk { color: #90efae; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.city-online-ready { position: absolute; right: 9px; bottom: 7px; z-index: 1; padding: 4px 7px; color: #bdecc9; background: rgba(5, 12, 9, .78); border: 1px solid #3c7a50; font-size: 11px; }
.city-player-marker { position: absolute; z-index: 2; left: 47%; top: 43%; width: 52px; height: 78px; background-position: center; background-size: contain; background-repeat: no-repeat; filter: drop-shadow(0 0 8px #4de5ff) drop-shadow(0 4px 3px #000); pointer-events: none; }
@media (max-width: 600px) { .city-npc-plaza { min-height: 640px; } .city-npc { transform: scale(.86); transform-origin: top left; } }

/* Aço escuro para as janelas da cidade: sem bordas douradas. */
#hub-section-container > div:first-child,
.shop-category-tabs,
.shop-set-tabs,
.city-chat-title,
.city-chat-tabs,
.city-chat-entry,
.city-npc,
.city-npc-portrait,
.npc-dialogue-box,
.online-modal > div { border-color:#465258!important; }
.shop-category-tabs button,
.shop-set-tabs button,
.city-chat-title button,
.city-chat-tabs button { border-color:#4a575c!important; color:#ccd9dc!important; background:#171d1e!important; box-shadow:none!important; }
.shop-category-tabs button:hover,
.shop-category-tabs button.active,
.shop-set-tabs button:hover,
.shop-set-tabs button.active,
.city-chat-tabs button.active { border-color:#6a8993!important; color:#edf6f7!important; background:#2a3940!important; }
.shop-item-row { border-color:#3d484c!important; background:linear-gradient(90deg,#101414,#161a1a)!important; }
.shop-item-row strong,
.city-npc-copy strong,
.npc-dialogue-copy strong,
.online-modal h3 { color:#dce7e9!important; }
.shop-item-row em { color:#a9d7e2!important; }
.city-npc:hover { border-color:#759aa6!important; }
.npc-dialogue-box { background:linear-gradient(100deg,#0d1414,#101313)!important; }

/* ===== Máquina do Chaos: combinação própria, inspirada na leitura clássica do MU ===== */
.chaos-machine { color:#d7dfda; border:1px solid #566067; background:linear-gradient(125deg,#121716,#060909 68%); box-shadow:inset 0 0 30px #000; font-family:Georgia,serif; }
.chaos-machine-title { display:flex; justify-content:space-between; align-items:center; padding:12px 15px; border-bottom:1px solid #4c5658; background:linear-gradient(#202727,#101313); }
.chaos-machine-title small { color:#86bf9d; font:700 11px Arial,sans-serif; letter-spacing:1.5px; }.chaos-machine-title h3 { margin:3px 0 0; color:#e8e9df; font-size:21px; }.chaos-machine-title > span { color:#9bb8bd; font:11px Arial,sans-serif; }
.chaos-recipe-tabs { display:flex; gap:6px; padding:9px 12px; border-bottom:1px solid #3e494a; background:#0a0d0d; }.chaos-recipe-tabs button { padding:6px 10px; border:1px solid #57686a!important; background:#151b1c!important; color:#cbd7d5!important; font:700 11px Georgia,serif; }.chaos-recipe-tabs button.active { border-color:#8bc6bd!important; background:linear-gradient(#285049,#10221f)!important; color:#effff7!important; }
.chaos-machine-body { display:grid; grid-template-columns:minmax(220px,.9fr) minmax(260px,1.35fr); min-height:350px; }.chaos-recipe-info { padding:16px; border-right:1px solid #3c4848; background:linear-gradient(120deg,#101715,#0a0d0d); }.chaos-recipe-info h4 { margin:0 0 8px; color:#e5e5d8; font-size:19px; }.chaos-recipe-info p { min-height:40px; margin:0 0 12px; color:#b7c4bd; font:12px/1.45 Arial,sans-serif; }
.chaos-rate { display:flex; justify-content:space-between; padding:7px 8px; border:1px solid #446054; background:#0a100d; font:11px Arial,sans-serif; }.chaos-rate b { color:#80efac; font-size:14px; }.chaos-cost { margin-top:5px; padding:7px 8px; border:1px solid #404b4a; background:#0b0e0e; color:#aab6b0; font:11px Arial,sans-serif; }.chaos-cost b { color:#ecd77f; }
.chaos-live-bonus,.chaos-destruction-rate { margin-top:5px; padding:7px 8px; border:1px solid #4b5552; background:#0b1010; color:#b8c5bf; font:11px Arial,sans-serif; }
.chaos-live-bonus.active { border-color:#3f9c72; color:#86f5b5; background:linear-gradient(90deg,#0c1c15,#0b1010); }
.chaos-destruction-rate { border-color:#703d3d; color:#f0a1a1; }.chaos-destruction-rate b { color:#ff6c6c; float:right; }.chaos-destruction-rate small { display:block; margin-top:3px; color:#f3d48c; }
.chaos-material-list { display:grid; gap:4px; margin:10px 0 0; padding:0; list-style:none; }.chaos-material-list li { display:grid; grid-template-columns:25px 1fr auto; align-items:center; gap:6px; min-height:29px; padding:2px 6px; border:1px solid #3f4948; background:#0b0e0e; font:11px Arial,sans-serif; }.chaos-material-list li.ready { color:#d7ebdd; }.chaos-material-list li.missing { color:#df8d8d; }.chaos-material-list li em { color:#f2d67a; font-style:normal; }
.chaos-item-visual { width:30px!important; height:30px!important; margin:0!important; display:inline-block; background-repeat:no-repeat; background-position:center; background-size:contain; filter:drop-shadow(0 1px 2px #000); }.chaos-empty-rune { display:grid; width:30px; height:30px; place-items:center; color:#59716a; font-size:22px; }
.chaos-combination-stage { position:relative; isolation:isolate; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; overflow:hidden; background:radial-gradient(circle at 50% 40%,#173126 0,#0a100e 30%,#050707 72%); }.chaos-combination-stage::before { content:''; position:absolute; inset:14px; z-index:-2; border:1px solid #324844; background:repeating-linear-gradient(0deg,transparent 0 38px,#1b2e29 39px),repeating-linear-gradient(90deg,transparent 0 38px,#1b2e29 39px); opacity:.45; }.chaos-orbit { position:absolute; z-index:-1; width:220px; height:220px; border:1px solid #5c8c73; border-radius:50%; box-shadow:0 0 0 24px #18302722,0 0 34px #45d58a3d,inset 0 0 30px #000; }.chaos-orbit::before,.chaos-orbit::after { content:''; position:absolute; inset:23px; border:1px dashed #8dc5a1; border-radius:50%; }.chaos-orbit::after { inset:51px; border-color:#e1c770; }.chaos-orbit i { position:absolute; width:8px; height:8px; border-radius:50%; background:#d9e98a; box-shadow:0 0 8px #d9e98a; }.chaos-orbit i:nth-child(1){top:0;left:50%}.chaos-orbit i:nth-child(2){bottom:21%;left:7%}.chaos-orbit i:nth-child(3){right:7%;top:30%}
.chaos-core { display:grid; place-items:center; width:78px; height:78px; border:2px solid #b1d4b5; border-radius:50%; background:radial-gradient(circle,#79c69d,#1a5142 32%,#07110e 67%); box-shadow:0 0 25px #48d79588,inset 0 0 18px #000; }.chaos-core span { color:#f6efb9; font-size:40px; text-shadow:0 0 10px #fff; }.chaos-target-card { width:min(275px,88%); display:grid; grid-template-columns:42px 1fr; align-items:center; column-gap:10px; padding:9px 11px; border:1px solid #668279; background:#09100ddd; box-shadow:inset 0 0 12px #000; }.chaos-target-card strong { color:#f2eee0; font-size:14px; }.chaos-target-card small { grid-column:2; color:#9edab2; font:11px Arial,sans-serif; }.chaos-wing-preview { grid-row:span 2; font-size:34px; filter:drop-shadow(0 0 8px #d9eaf0); }
.chaos-combine-button { min-width:178px; padding:11px 22px; border:1px solid #91b899!important; background:linear-gradient(#397955,#153422)!important; color:#f0f8e9!important; font:700 15px Georgia,serif; text-shadow:1px 1px #000; }.chaos-combine-button:disabled{border-color:#38433d!important;background:linear-gradient(#202725,#0c100f)!important;color:#718078!important;opacity:1;filter:grayscale(1);cursor:not-allowed}.chaos-combine-hint{display:block;max-width:88%;min-height:14px;color:#a8b8b0;text-align:center;font:11px/1.3 Arial,sans-serif}.chaos-combine-hint.ready{color:#83e6a6}.chaos-combine-hint.missing{color:#d5a08e}.chaos-result { min-height:18px; max-width:88%; color:#b8c6be; text-align:center; font:12px Arial,sans-serif; }.chaos-result.success{color:#7ff2aa}.chaos-result.failure{color:#ff9a93}
.chaos-target-picker { position:relative; padding:8px 12px; border-top:1px solid #3d4947; background:#0b0f0e; }.chaos-target-picker > strong { display:block; margin-bottom:5px; color:#d7e5dd; font-size:11px; }.chaos-target-picker p { margin:3px 0; color:#a0aaa4; font-size:11px; }.chaos-target-custom{position:relative;max-width:350px}.chaos-target-current,.chaos-target-options button{display:grid;grid-template-columns:25px minmax(0,1fr) auto;gap:7px;align-items:center;width:100%;min-height:31px;padding:4px 7px;border:1px solid #60716d;background:#080d0c;color:#dce9e0;text-align:left;font:11px Arial,sans-serif;cursor:url('../assets/img/ui/mu-hand-cursor.png') 4 3,pointer}.chaos-target-current:hover,.chaos-target-options button:hover,.chaos-target-options button.selected{border-color:#9ad5b1;background:#15231e}.chaos-target-current i{font-style:normal;color:#a7d7b7}.chaos-target-options{position:absolute;z-index:20;left:0;right:0;bottom:calc(100% + 3px);display:grid;gap:2px;padding:3px;border:1px solid #516961;background:#070b09;box-shadow:0 7px 17px #000}.chaos-target-options button{grid-template-columns:25px minmax(0,1fr)}.chaos-target-options .chaos-item-visual,.chaos-target-current .chaos-item-visual{width:23px;height:23px}.chaos-machine-foot { padding:8px 13px; border-top:1px solid #3d4947; color:#9ca9a2; font:11px Arial,sans-serif; }
.chaos-combination-stage.is-combining .chaos-orbit { animation:chaosOrbit .75s linear infinite; }.chaos-combination-stage.is-combining .chaos-core { animation:chaosPulse .28s ease-in-out infinite alternate; }.chaos-combination-stage.is-combining::after { content:''; position:absolute; inset:0; background:radial-gradient(circle,rgba(199,255,195,.45),transparent 42%); animation:chaosFlash .72s ease-in-out infinite; pointer-events:none; }
.chaos-outcome-modal { position:fixed; z-index:1800; inset:0; display:grid; place-items:center; padding:20px; background:transparent; pointer-events:none; animation:chaosOutcomeEnter .24s ease-out; }.chaos-outcome-box { position:relative; width:min(350px,calc(100vw - 36px)); padding:22px; border:1px solid #54716a; background:linear-gradient(145deg,rgba(19,33,29,.98),rgba(5,10,9,.98)); box-shadow:0 16px 48px #000, inset 0 0 0 2px #15231f, 0 0 28px rgba(78,218,148,.16); text-align:center; pointer-events:auto; }.chaos-outcome-modal.failure .chaos-outcome-box { border-color:#91464a; background:linear-gradient(145deg,rgba(42,18,18,.98),rgba(10,5,5,.98)); box-shadow:0 16px 48px #000, inset 0 0 0 2px #2b1111, 0 0 28px rgba(244,77,77,.16); }.chaos-outcome-box small { color:#8ccbb0; font:700 11px Arial,sans-serif; letter-spacing:1.6px; }.chaos-outcome-modal.failure small { color:#ef9b9b; }.chaos-outcome-box h3 { margin:5px 0 15px; border:0; color:#e9eddc; font:700 23px Georgia,serif; }.chaos-outcome-close { position:absolute; top:7px; right:9px; padding:0; border:0; background:transparent!important; color:#bbcbc5!important; font:700 22px Arial,sans-serif; }.chaos-outcome-item { display:grid; grid-template-columns:66px 1fr; align-items:center; gap:11px; padding:10px; border:1px solid #3c5a51; background:linear-gradient(90deg,#0a1310,#111b17); text-align:left; }.chaos-outcome-item .chaos-item-visual { width:58px!important; height:58px!important; }.chaos-outcome-item strong { display:block; color:#f2dd85; font:700 16px Georgia,serif; }.chaos-outcome-item span { display:block; margin-top:4px; color:#b9c8be; font:11px/1.3 Arial,sans-serif; }.chaos-outcome-stats { display:grid; gap:3px; margin:9px 0; padding:0; list-style:none; text-align:left; }.chaos-outcome-stats li { display:flex; justify-content:space-between; padding:4px 7px; border-bottom:1px solid #263b34; color:#bacbc0; font:11px Arial,sans-serif; }.chaos-outcome-stats b { color:#8df0b0; }.chaos-outcome-stats .chaos-luck { color:#f3d57a; }.chaos-outcome-box p { margin:10px 0 0; color:#8af0b0; font:700 12px Arial,sans-serif; }.chaos-failure-mark { display:grid; place-items:center; width:68px; height:68px; margin:2px auto 12px; border:2px solid #cf6265; border-radius:50%; color:#ffc4c4; font:700 40px Georgia,serif; box-shadow:0 0 18px #cf414144,inset 0 0 16px #500; }.chaos-outcome-modal.failure .chaos-outcome-box p { color:#ffb4b4; }.chaos-failure-note { display:block; margin-top:10px; color:#d69a9a; font:11px/1.4 Arial,sans-serif; }@keyframes chaosOutcomeEnter { from { opacity:0; transform:scale(.88); } to { opacity:1; transform:scale(1); } }
@keyframes chaosOrbit { to { transform:rotate(360deg); } } @keyframes chaosPulse { to { transform:scale(1.23); filter:brightness(1.75); } } @keyframes chaosFlash { 50% { opacity:.18; } }
@media (max-width:650px){.chaos-machine-body{grid-template-columns:1fr}.chaos-recipe-info{border-right:0;border-bottom:1px solid #3c4848}.chaos-combination-stage{min-height:290px}}

/* ===== Mapa Vivo: atlas próprio, sem reutilizar sprites do jogo ===== */
#hub-section-container[data-section="living_world"]{width:min(1640px,calc(100vw - 26px));height:min(900px,calc(100vh - 22px))!important;top:11px}
#hub-section-container[data-section="living_world"] .hub-sub{height:calc(100% - 67px)!important}
.living-world-shell{grid-template-columns:238px minmax(0,1fr) 308px;border:1px solid #8a7339;background:#060908 url('../assets/img/maps/living-world-continent-v3.png') center/cover no-repeat;box-shadow:0 0 0 3px #090909,0 18px 52px #000d,inset 0 0 44px #000}
.living-world-shell::before{background:linear-gradient(90deg,#050908eF 0 14%,#07100a60 27%,transparent 44% 58%,#08090772 73%,#050807ef 100%)}
.living-world-regions{align-content:center;gap:8px;padding:18px 14px;border-right:1px solid #7c6631;background:linear-gradient(90deg,#080a09f2,#151308d0 74%,#0000)}
.living-world-regions::before,.living-world-regions::after{content:'◆';display:block;margin:0 auto;color:#c8a44f;font-size:17px;text-align:center;text-shadow:0 0 8px #daa62c}
.living-world-regions>small{margin:0 10px 8px;color:#e0c776;font:700 11px Georgia,serif;letter-spacing:2px;text-align:center}
.living-world-region{position:relative;min-height:61px;gap:10px;padding:4px 9px;border:1px solid #51472f;border-radius:1px;background:linear-gradient(104deg,#17140dE8,#0a0b0be8 65%,#17130aab);box-shadow:inset 0 0 0 1px #000,inset 0 0 12px #96712618;color:#e9e0c5;overflow:hidden}
.living-world-region::before{content:'';position:absolute;inset:3px;border:1px solid #2a2c24;pointer-events:none}
.living-world-region:hover,.living-world-region.is-selected{border-color:#7be7ff;background:linear-gradient(104deg,#112a35ed,#0c1215ed 66%,#183a42c9);box-shadow:0 0 14px #4cc8fa55,inset 0 0 0 1px #081014}
.living-world-region i{position:relative;z-index:1;flex:0 0 auto;width:55px;height:55px;border:0;border-radius:50%;box-shadow:none;background-color:transparent;background-repeat:no-repeat}
.living-world-region span{position:relative;z-index:1}.living-world-region b{color:#eee0b5;font:700 16px/1 Georgia,serif;text-shadow:1px 1px #000}.living-world-region small{margin-top:6px;color:#c3af79;font:12px Georgia,serif}.living-world-region em{position:relative;z-index:1;margin-left:auto;color:var(--region);font-style:normal;font-size:17px;text-shadow:0 0 8px var(--region)}
.living-world-region.is-locked{filter:grayscale(.78);opacity:.68}
.living-world-board{background:radial-gradient(ellipse at center,transparent 54%,#05060488 100%)}
.living-world-pins{overflow:hidden}.living-world-pin{z-index:2;gap:2px;filter:drop-shadow(0 4px 4px #000)}
.living-world-pin i{position:relative;display:block;width:62px;height:62px;border:3px solid var(--pin);border-radius:50% 50% 50% 12%;background-color:#070908;background-repeat:no-repeat;box-shadow:0 0 0 2px #061012,0 0 19px var(--pin),inset 0 0 8px #000;transform:rotate(-45deg)}
.living-world-pin i::after{content:'';position:absolute;inset:4px;border:1px solid #f6e0a255;border-radius:50%;pointer-events:none}.living-world-pin span{position:relative;z-index:1;padding:2px 7px;border:1px solid #7d6737;background:linear-gradient(#1a1914ef,#070806ef);color:#fff1bf;font:700 12px Georgia,serif;text-shadow:1px 1px 2px #000;white-space:nowrap}
.living-world-pin.is-selected i{box-shadow:0 0 0 2px #f8e5a1,0 0 28px var(--pin),inset 0 0 8px #000;animation:living-world-map-pulse 1.4s ease-in-out infinite}.living-world-pin.is-locked{filter:grayscale(1);opacity:.54}
@keyframes living-world-map-pulse{50%{filter:brightness(1.35);transform:rotate(-45deg) scale(1.1)}}
.living-world-card{position:relative;align-self:center;min-height:470px;margin:0 14px;padding:28px 22px 24px;border:1px solid #b28b3c;background:linear-gradient(145deg,#111821f4,#06090cf5 65%,#151005f0);box-shadow:0 0 0 3px #100d06,0 12px 25px #000c,inset 0 0 0 2px #1a2630,inset 0 0 28px #000;overflow:hidden;text-align:center}
.living-world-card::before,.living-world-card::after{content:'◆';position:absolute;left:50%;color:#74c8f4;font-size:23px;text-shadow:0 0 11px #2aa8ee;transform:translateX(-50%)}.living-world-card::before{top:4px}.living-world-card::after{bottom:4px}
.living-world-card>small{color:#e3c879;font:700 11px Georgia,serif;letter-spacing:1.5px}.living-world-card h3{margin:13px 0 16px;padding-bottom:14px;border-bottom:1px solid #6d5c34;color:#9dd7ff;font:700 25px/1.07 Georgia,serif;text-shadow:0 1px #000}.living-world-card h3 em{display:block;margin-top:5px;color:#bccbd1;font:italic 13px Georgia,serif}.living-world-card p{margin:0 0 16px}.living-world-card p b{color:#f0d68a;font:700 19px Georgia,serif}
.living-world-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:0}.living-world-portrait{display:grid;grid-template-rows:78px auto;align-items:end;gap:4px;min-width:0;padding:3px;border:1px solid #806532;background:#050707;color:#d9bd73;cursor:pointer}.living-world-portrait:hover{border-color:#d6b85d;box-shadow:0 0 12px #d29e3a66}.living-world-portrait:disabled{filter:grayscale(1);opacity:.5;cursor:not-allowed}.living-world-portrait span{display:block;width:100%;height:78px;background-color:#080b0c;background-repeat:no-repeat}.living-world-portrait small{overflow:hidden;padding:0 2px;color:#d8c187;font:700 11px Georgia,serif;text-overflow:ellipsis;white-space:nowrap}
.living-world-card-foot{display:grid;gap:16px;margin-top:21px;padding-top:17px;border-top:1px solid #655329}.living-world-card-foot span{color:#b9e75e;font:700 16px Georgia,serif;text-shadow:0 0 8px #6fa91e}.living-world-card-foot button{position:relative;padding:13px 10px;border:2px solid #e0b655;background:linear-gradient(#8b6724,#442b09 52%,#261704);box-shadow:inset 0 0 0 2px #2b1c07,0 3px 7px #000;color:#fff0be;font:700 19px Georgia,serif;text-shadow:1px 1px #000}.living-world-card-foot button:hover{filter:brightness(1.18)}
.living-world-empty{grid-column:1/-1;color:#bdc8c4;font-size:11px}
@media(max-width:1080px){.living-world-shell{grid-template-columns:186px minmax(0,1fr) 256px}.living-world-region{min-height:50px}.living-world-region i{width:43px;height:43px}.living-world-region b{font-size:13px}.living-world-region small{font-size:11px}.living-world-card{min-height:400px;padding:24px 15px}.living-world-card h3{font-size:21px}.living-world-portrait{grid-template-rows:62px auto}.living-world-portrait span{height:62px}}

/* Revisão de leitura: reproduz a hierarquia visual do painel aprovado. */
#hub-section-container[data-section="living_world"]{padding:8px;border:1px solid #5e5a50;background:linear-gradient(145deg,#292929,#080909 22%,#17130a 80%,#070808);box-shadow:0 0 0 2px #050505,0 0 0 4px #6e6245,0 18px 50px #000e}
#hub-section-container[data-section="living_world"]::before,#hub-section-container[data-section="living_world"]::after{content:'✦';position:absolute;z-index:7;top:9px;color:#d7ad4c;font-size:20px;text-shadow:0 0 7px #000}#hub-section-container[data-section="living_world"]::before{left:13px}#hub-section-container[data-section="living_world"]::after{right:13px}
#hub-section-container[data-section="living_world"] > div:first-child{margin:0 7px 7px;padding:10px 70px!important;border:1px solid #5e5746!important;background:linear-gradient(#242323,#111212)!important;box-shadow:inset 0 -1px #000,inset 0 1px #524d40!important}
#hub-section-container[data-section="living_world"] > div:first-child h3{position:relative;margin:auto!important;color:#efd17b!important;font:700 27px Georgia,serif!important;letter-spacing:1px;text-shadow:2px 2px #000!important}#hub-section-container[data-section="living_world"] > div:first-child h3::before,#hub-section-container[data-section="living_world"] > div:first-child h3::after{content:'◆';position:absolute;top:50%;color:#b29046;font-size:14px;transform:translateY(-50%)}#hub-section-container[data-section="living_world"] > div:first-child h3::before{left:-42px}#hub-section-container[data-section="living_world"] > div:first-child h3::after{right:-42px}
.living-world-shell{grid-template-columns:215px minmax(0,1fr) 305px;border:1px solid #876e35;background-position:center;color:#e7dec7}.living-world-regions{gap:7px;padding:13px 10px;background:linear-gradient(90deg,#0b0c0beF,#171307d9 80%,#0000)}.living-world-regions::before,.living-world-regions::after{display:none}.living-world-regions>small{margin:0 9px 5px;color:#d1b66b;text-align:left}
.living-world-region{min-height:58px;padding:3px 7px;border-color:#474233;background:linear-gradient(95deg,#16140ee8,#0b0c0ce8);box-shadow:inset 0 0 0 1px #090a09}.living-world-region::before{inset:2px;border-color:#2a291f}.living-world-region:hover,.living-world-region.is-selected{border-color:#47c7f4;background:linear-gradient(95deg,#102a35ef,#0b1111ef);box-shadow:0 0 11px #29bce844,inset 0 0 0 1px #0a2730}.living-world-region i{width:49px;height:49px;border-radius:50%;filter:saturate(.9) contrast(.95);opacity:.92}.living-world-region b{font-size:15px}.living-world-region small{margin-top:4px;color:#d3bd80;font-size:11px}.living-world-region em{font-size:14px}
.living-world-pin{gap:0}.living-world-pin i{width:79px;height:92px;border:0;border-radius:0;background-color:transparent;background-repeat:no-repeat;box-shadow:none;transform:none!important}.living-world-pin i::after{display:none}.living-world-pin span{margin-top:-9px;border:0;background:#0a0908e8;color:#f4e5ad;font:700 13px Georgia,serif;box-shadow:0 1px 2px #000}.living-world-pin.is-selected i{box-shadow:none;animation:living-world-pin-pulse 1.3s ease-in-out infinite}@keyframes living-world-pin-pulse{50%{filter:brightness(1.35) drop-shadow(0 0 9px var(--pin));transform:scale(1.07)!important}}
.living-world-card{min-height:0;margin:0 15px;padding:28px 19px 24px;border-color:#956f2d;background:linear-gradient(145deg,#121a21f8,#080b0eeF 70%,#151006f2);box-shadow:0 0 0 2px #2f250f,0 0 0 4px #080909,0 12px 28px #000d,inset 0 0 0 2px #15232c,inset 0 0 28px #000}.living-world-card::before{content:'◆';top:2px;color:#73c9fb}.living-world-card h3{margin:13px 0 15px;padding-bottom:13px;color:#9bd9ff;font-size:25px}.living-world-card p{padding:11px 0;border-top:1px solid #705a2c;border-bottom:1px solid #705a2c}.living-world-showcase{gap:6px}.living-world-portrait{grid-template-rows:76px auto;padding:3px;border-color:#926c2b;background:#080909}.living-world-portrait span{height:76px}.living-world-card-foot{grid-template-columns:auto 1fr;align-items:center;gap:12px;margin-top:16px;padding-top:15px}.living-world-card-foot span{display:flex;align-items:center;gap:9px;color:#b9e75e;font-size:15px}.living-world-card-foot span::before{content:'EXP';display:grid;place-items:center;width:43px;height:43px;border:1px solid #8bb532;border-radius:50%;background:radial-gradient(circle,#404d13,#151c08 65%,#090b07);box-shadow:0 0 13px #a9e64266,inset 0 0 8px #000;color:#e8ff95;font:700 14px Georgia,serif}.living-world-card-foot button{grid-column:1/-1;padding:12px 9px;font-size:18px}
@media(max-width:1080px){.living-world-shell{grid-template-columns:177px minmax(0,1fr) 250px}.living-world-pin i{width:65px;height:76px}.living-world-region{min-height:48px}.living-world-region i{width:40px;height:40px}.living-world-card-foot span::before{width:34px;height:34px;font-size:11px}.living-world-card-foot span{font-size:12px}}

/* ===== Mapa Vivo v10: composição única com mapa, molduras e áreas alinhadas ===== */
#hub-section-container[data-section="living_world"]{width:min(1680px,calc(100vw - 18px));height:min(940px,calc(100vh - 12px))!important;top:6px;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
#hub-section-container[data-section="living_world"]::before,#hub-section-container[data-section="living_world"]::after{display:none!important}
#hub-section-container[data-section="living_world"]>div:first-child{display:none!important}
#hub-section-container[data-section="living_world"] .hub-sub{height:100%!important;max-height:none!important;padding:0!important}
#living-world-map{width:100%;height:100%}
.living-world-shell{position:relative;display:block;width:100%;height:100%;border:0;background:#050606 url('../assets/img/ui/living-world/living-world-shell-v2.png') center/100% 100% no-repeat;box-shadow:none;overflow:hidden;color:#eadfbe}
.living-world-shell::before{display:none}
.living-world-title{position:absolute;z-index:4;left:22%;top:4.1%;width:56%;margin:0;color:#e7c76f;font:700 clamp(19px,2vw,34px)/1 Georgia,serif;letter-spacing:1.5px;text-align:center;text-shadow:1px 2px 2px #000,0 0 8px #000}
.living-world-close{position:absolute;z-index:8;right:2.5%;top:3.3%;display:grid;place-items:center;width:42px;height:42px;padding:0;border:2px solid #c49a45;border-radius:50%;background:radial-gradient(circle at 45% 35%,#a94b24,#5d180d 62%,#220706);box-shadow:0 0 0 2px #241204,0 0 13px #000,inset 0 0 8px #000;color:#ffe8a5;font:700 28px/1 Georgia,serif;cursor:pointer}.living-world-close:hover{filter:brightness(1.25)}
.living-world-regions{position:absolute;z-index:3;left:4%;top:13.8%;width:13.2%;height:76.2%;display:grid;grid-template-rows:28px repeat(8,minmax(0,1fr));align-content:stretch;gap:0;padding:0;border:0;background:transparent}
.living-world-regions>small{display:flex;align-items:center;margin:0;padding-left:14px;color:#d7bd72;font:700 11px Georgia,serif;letter-spacing:1.7px}
.living-world-region{position:relative;display:flex;align-items:center;gap:8px;min-height:0;height:calc(100% - 4px);box-sizing:border-box;margin:2px 5px;padding:2px 6px;border:1px solid transparent;background:transparent!important;box-shadow:none;color:#e7dbb7;overflow:visible}
.living-world-region::before{display:none}.living-world-region:hover,.living-world-region:focus,.living-world-region:active,.living-world-region.is-selected{border-color:var(--region);background:linear-gradient(90deg,#111716f0,#080b0bee 72%)!important;box-shadow:0 0 9px color-mix(in srgb,var(--region) 45%,transparent),inset 0 0 0 1px #050707;outline:0}
.living-world-region i{flex:0 0 auto;width:56px;height:56px;border:0;border-radius:50%;background-color:transparent!important;background-repeat:no-repeat;filter:saturate(.95) contrast(1.08);opacity:1}.living-world-region span{min-width:0}.living-world-region b{display:block;color:#e6d7ad;font:700 14px/1.05 Georgia,serif;text-shadow:1px 1px #000}.living-world-region small{display:block;margin-top:3px;color:#c7b77d;font:11px Georgia,serif}.living-world-region em{margin-left:auto;color:var(--region);font:normal 15px Georgia,serif;text-shadow:0 0 8px var(--region)}.living-world-region.is-locked{filter:grayscale(.7);opacity:.62}
.living-world-board{position:absolute;z-index:2;left:18.2%;top:13%;width:58.5%;height:78.7%;min-width:0;background:transparent}.living-world-pins{position:absolute;inset:0;overflow:visible}
.living-world-pin,.living-world-pin:hover,.living-world-pin:focus,.living-world-pin:active{position:absolute;left:var(--x);top:var(--y);z-index:2;display:grid;justify-items:center;gap:0;padding:0;border:0!important;background:transparent!important;background-color:transparent!important;color:#f4e6bc;transform:translate(-50%,-50%);filter:drop-shadow(0 4px 4px #000);outline:0;cursor:pointer}.living-world-pin i{display:block;width:76px;height:92px;border:0;border-radius:0;background-color:transparent!important;background-repeat:no-repeat;box-shadow:none;transform:none!important}.living-world-pin span{margin-top:-13px;padding:2px 7px;border:0;background:#090908e8;box-shadow:0 1px 3px #000;color:#f1e2ac;font:700 12px Georgia,serif;text-shadow:1px 1px #000;white-space:nowrap}.living-world-pin.is-selected i{box-shadow:none;animation:living-world-v10-pulse 1.35s ease-in-out infinite}.living-world-pin.is-locked{filter:grayscale(1) drop-shadow(0 3px 3px #000);opacity:.55}@keyframes living-world-v10-pulse{50%{filter:brightness(1.3) drop-shadow(0 0 10px var(--pin));transform:scale(1.07)!important}}
.living-world-card{position:absolute;z-index:3;left:78%;top:17.5%;width:17.3%;height:67.5%;display:flex;flex-direction:column;align-items:stretch;margin:0;padding:5.8% 1.45% 4.8%;border:0;background:transparent;box-shadow:none;overflow:hidden;text-align:center}.living-world-card::before,.living-world-card::after{display:none}.living-world-card>small{color:#d9bd70;font:700 11px Georgia,serif;letter-spacing:1.4px;text-align:left}.living-world-card h3{margin:7px 0 8px;padding-bottom:8px;border-bottom:1px solid #786133;color:#9edaff;font:700 clamp(16px,1.45vw,25px)/1.08 Georgia,serif;text-shadow:1px 1px #000}.living-world-card h3 em{display:block;margin-top:4px;color:#c3cdd0;font:italic 11px Georgia,serif}.living-world-card p{margin:0 0 7px;padding:6px 0;border-top:1px solid #6e592e;border-bottom:1px solid #6e592e}.living-world-card p b{color:#ecd17e;font:700 clamp(13px,1.1vw,18px) Georgia,serif}.living-world-selected-mob{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:7px;margin-bottom:6px;padding:5px;border:1px solid #806730;background:linear-gradient(120deg,#111615f2,#060808f2);text-align:left}.living-world-selected-mob>span{display:block;width:54px;height:54px;background-color:transparent!important;background-repeat:no-repeat}.living-world-selected-mob strong,.living-world-selected-mob small,.living-world-selected-mob em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.living-world-selected-mob strong{color:#f1d98f;font:700 11px Georgia,serif}.living-world-selected-mob small{margin-top:3px;color:#a9cbd0;font:11px Arial,sans-serif}.living-world-selected-mob em{margin-top:3px;color:#9fd35e;font:normal 10px Arial,sans-serif}.living-world-mob-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:4px;min-height:0;max-height:31%;padding:3px;overflow-x:hidden;overflow-y:auto;border-top:1px solid #4c3e23;border-bottom:1px solid #4c3e23;scrollbar-width:thin;scrollbar-color:#9a8245 #090b0b}.living-world-mob-option,.living-world-mob-option:hover,.living-world-mob-option:focus,.living-world-mob-option:active{display:grid;grid-template-columns:38px minmax(0,1fr);grid-template-rows:1fr 1fr;align-items:center;min-width:0;min-height:46px;padding:3px;border:1px solid #4d4a39;background:#080b0bee!important;background-color:#080b0b!important;color:#dbc98f;text-align:left;outline:0;cursor:pointer}.living-world-mob-option.is-selected{border-color:#d7b04b;background:linear-gradient(100deg,#19170f,#080a0a)!important;box-shadow:inset 0 0 8px #bc8f2f33}.living-world-mob-option>span{grid-row:1/3;display:block;width:36px;height:38px;background-color:transparent!important;background-repeat:no-repeat}.living-world-mob-option b,.living-world-mob-option small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.living-world-mob-option b{align-self:end;color:#e9d69e;font:700 11px Georgia,serif}.living-world-mob-option small{align-self:start;margin-top:2px;color:#8fb4bb;font:10px Arial,sans-serif}.living-world-mob-option:disabled{filter:grayscale(.8);opacity:.55}.living-world-card-foot{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;margin-top:auto;padding-top:8px;border-top:1px solid #65512b}.living-world-card-foot span{display:flex;align-items:center;gap:7px;color:#b9e75e;font:700 clamp(11px,1vw,16px) Georgia,serif;text-shadow:0 0 7px #6fa91e}.living-world-card-foot span::before{content:'EXP';display:grid;place-items:center;width:36px;height:36px;border:1px solid #94ba34;border-radius:50%;background:radial-gradient(circle,#475715,#161d08 66%,#090b07);box-shadow:0 0 13px #a9e64266,inset 0 0 8px #000;color:#ecff9b;font:700 12px Georgia,serif}.living-world-card-foot button{grid-column:1/-1;padding:9px 7px;border:2px solid #d8ad4b;background:linear-gradient(#8d6924,#432b08 54%,#241604)!important;box-shadow:inset 0 0 0 2px #2a1a05,0 3px 7px #000;color:#ffefb6;font:700 clamp(13px,1.2vw,19px) Georgia,serif;text-shadow:1px 1px #000}.living-world-card-foot button:hover{filter:brightness(1.2)}
@media(max-width:1000px){.living-world-title{top:4.4%;font-size:18px}.living-world-close{width:30px;height:30px;font-size:20px}.living-world-region{margin:1px 3px;padding:1px 4px}.living-world-region i{width:39px;height:39px}.living-world-region b{font-size:11px}.living-world-region small{font-size:10px}.living-world-region em{font-size:11px}.living-world-pin i{width:54px;height:66px}.living-world-pin span{font-size:11px}.living-world-card{padding-top:5.5%;padding-left:1.15%;padding-right:1.15%}.living-world-card>small{font-size:10px}.living-world-card h3{font-size:14px}.living-world-selected-mob{grid-template-columns:38px minmax(0,1fr)}.living-world-selected-mob>span{width:38px;height:38px}.living-world-mob-picker{grid-template-columns:1fr}.living-world-mob-option{grid-template-columns:30px minmax(0,1fr);min-height:35px}.living-world-mob-option>span{width:28px;height:29px}.living-world-card-foot span::before{width:30px;height:30px;font-size:11px}}

/* Calibragem pela arte da moldura (living-world-shell-v2.png, 1672x941). As
   caixas abaixo saem das linhas douradas medidas no próprio arquivo: painel
   das regiões 70..296 x 134..837, mapa 303..1300 x 120..878, cartão 1310..1606
   x 183..811, placa do título 380..1291 x 35..108. */
.living-world-title{left:22.7%;top:3.7%;width:54.5%;height:7.8%;display:grid;place-items:center;font-size:clamp(20px,2.1vw,36px)}
/* A arte tem nove células iguais na coluna da esquerda: a primeira é o rótulo
   e as oito seguintes são as regiões. Antes o rótulo tinha altura fixa e as
   linhas caíam entre duas células, o que deixava tudo desencontrado. */
.living-world-regions{left:4.2%;top:14.24%;width:13.5%;height:74.7%;grid-template-rows:repeat(9,1fr)}
.living-world-regions>small{justify-content:center;padding:0;text-align:center}
/* Medalha encostada na borda esquerda e nome logo depois: com todas do mesmo
   tamanho, os nomes comecam todos na mesma coluna. O recuo negativo desconta a
   margem transparente do atlas, senao o disco parece afastado da borda. */
.living-world-region{justify-content:flex-start;gap:9px;height:100%;margin:0;padding:0 4px 0 0}
/* O atlas das medalhas tem margem transparente em volta de cada disco, então
   a caixa passa da altura da linha: o excedente é vazio e o disco cresce até
   quase encostar nas divisórias. A escala vem da própria linha, não do vw. */
.living-world-region i{flex:0 0 auto;width:auto;height:118%;margin-left:-7px;aspect-ratio:1}
.living-world-region span{flex:1 1 auto;min-width:0;text-align:left}
.living-world-region b{font-size:clamp(11px,1.05vw,17px)}
.living-world-region small{font-size:clamp(9px,.78vw,13px)}
/* O losango do acento sai do fluxo para não empurrar o conjunto para a esquerda. */
.living-world-region em{position:absolute;right:5px;top:50%;margin:0;transform:translateY(-50%)}
.living-world-board{left:18.12%;top:12.75%;width:59.63%;height:80.55%}
/* O nome fica fora do fluxo: assim a âncora do alfinete é o ícone, e ele cai
   exatamente sobre o centro da região em vez de ficar acima dele. */
.living-world-pin{display:block;width:clamp(52px,4.9vw,79px);height:clamp(60px,5.7vw,92px)}
.living-world-pin i{display:block;width:100%;height:100%;background-size:contain;background-position:center}
.living-world-pin span{position:absolute;left:50%;top:100%;margin:-6px 0 0;transform:translateX(-50%)}
.living-world-card{left:78.35%;top:19.45%;width:17.7%;height:66.74%;padding:3.4% 1.5% 3%}
.living-world-card>small{font-size:clamp(8px,.62vw,11px);text-align:center}
.living-world-card h3{margin:6px 0 7px;padding-bottom:7px;font-size:clamp(17px,1.6vw,28px)}
.living-world-card h3 em{font-size:clamp(10px,.82vw,14px)}
.living-world-card p{margin:0 0 8px;padding:7px 0}
.living-world-card p b{font-size:clamp(14px,1.25vw,21px)}
/* Sem a faixa de EXP sobra altura: o monstro escolhido e a lista crescem para
   ocupá-la, em vez de espremer tudo no topo do cartão. */
.living-world-selected-mob{grid-template-columns:clamp(54px,5vw,80px) minmax(0,1fr);gap:10px;margin-bottom:8px;padding:7px}
.living-world-selected-mob>span{width:clamp(54px,5vw,80px);height:clamp(54px,5vw,80px)}
.living-world-selected-mob strong{font-size:clamp(11px,1vw,16px)}
.living-world-selected-mob small{font-size:clamp(9px,.8vw,13px)}
.living-world-selected-mob em{font-size:clamp(8px,.72vw,12px)}
.living-world-mob-picker{flex:1 1 auto;max-height:none;gap:6px;padding:5px}
.living-world-mob-option,.living-world-mob-option:hover,.living-world-mob-option:focus,.living-world-mob-option:active{grid-template-columns:clamp(34px,3.1vw,50px) minmax(0,1fr);min-height:clamp(44px,4vw,62px);padding:4px;gap:0 6px}
.living-world-mob-option>span{width:clamp(32px,3vw,48px);height:clamp(32px,3vw,48px)}
.living-world-mob-option b{font-size:clamp(9px,.82vw,13px)}
.living-world-mob-option small{font-size:clamp(8px,.72vw,12px)}
/* A faixa "EXP alta" saiu; o botão ocupa a linha inteira do rodapé. */
.living-world-card-foot{grid-template-columns:1fr;gap:7px;padding-top:9px}
.living-world-card-foot span{justify-content:center;color:#e9b45c;font-size:clamp(10px,.85vw,14px)}
.living-world-card-foot span::before{display:none}
.living-world-card-foot button{padding:11px 8px;font-size:clamp(14px,1.3vw,21px)}

/* Mapa Global em tela cheia: ele deixou de ser uma janela de NPC e virou o
   próprio menu de viagem, então ocupa a tela toda em vez de flutuar no meio. */
#hub-section-container[data-section="living_world"]{position:fixed;left:0!important;top:0!important;width:100vw!important;height:100vh!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;transform:none!important;background:#050606!important;box-shadow:none!important}
#hub-section-container[data-section="living_world"] .hub-sub{height:100%!important;max-height:none!important;padding:0!important;overflow:hidden}
/* Sem o level na linha, o nome ocupa a altura toda da célula. */
.living-world-region span{display:flex;flex-direction:column;justify-content:center;min-height:100%}
.living-world-region b{font-size:clamp(12px,1.15vw,19px)}
/* A região onde o herói está fica marcada; as demais só acendem no hover. */
.living-world-region.is-selected{border-color:#7be7ff}
/* Alfinete: o nome desce, ganha respiro e um fundo na cor da própria região,
   para ler por cima de qualquer terreno. */
.living-world-pin span{top:100%;margin:6px 0 0;padding:3px 10px;border:1px solid color-mix(in srgb,var(--pin) 70%,#0a0f12);border-radius:3px;background:linear-gradient(#0a0f12ee,color-mix(in srgb,var(--pin) 26%,#070b0dee));color:#fff8e2;font:700 clamp(11px,1.02vw,17px) Georgia,serif;letter-spacing:.4px;box-shadow:0 0 10px color-mix(in srgb,var(--pin) 45%,transparent),0 2px 6px #000c;text-shadow:0 1px 2px #000,0 0 6px #000}
.living-world-pin.is-selected span{border-color:var(--pin);box-shadow:0 0 15px color-mix(in srgb,var(--pin) 70%,transparent),0 2px 6px #000c}
.living-world-pin i{filter:drop-shadow(0 0 9px color-mix(in srgb,var(--pin) 60%,transparent))}

/* Atlas v3 dos alfinetes: cada um foi recentrado e recortado justo na célula
   (scripts/pack-sheet-grid.js --centrar). No v2 o desenho ficava deslocado
   dentro de uma célula bem maior, e como a célula inteira é o botão, sobrava
   um retângulo transparente enorme ao lado do alfinete — era ele que aparecia
   ao clicar. Agora a caixa segue a proporção do próprio desenho. */
.living-world-pin{width:clamp(36px,3.3vw,56px);height:auto;aspect-ratio:280/430}
.living-world-pin i{width:100%;height:100%}
.living-world-pin span{margin-top:11px}

/* A cor da região acende só quando o mouse passa. Antes a linha da cidade
   atual ficava acesa o tempo todo, e o fundo por trás da medalha mudava junto:
   como o disco tem cantos transparentes, parecia que a textura dele trocava —
   e a de Lorencia não mudava justamente por estar sempre acesa. */
.living-world-region,.living-world-region:focus,.living-world-region:active,.living-world-region.is-selected{border-color:transparent!important;background:transparent!important;box-shadow:none!important}
.living-world-region:hover{border-color:var(--region)!important;background:linear-gradient(90deg,#12171690,#080b0b70 72%)!important;box-shadow:0 0 9px color-mix(in srgb,var(--region) 40%,transparent)!important}
/* A moldura de cada célula já vem desenhada na arte: a linha e o losango do
   acento ficam por dentro dela, sem encostar nas divisórias. */
.living-world-region{margin:0 8px;padding:0 3px 0 0;border-radius:2px}
.living-world-region i{margin-left:-3px}
.living-world-region em{right:8px}
/* Alfinete um pouco acima do centro da região: assim ele fica sobre a cidade
   em vez de parecer pendurado pela ponta. */
.living-world-pin{transform:translate(-50%,-50%) translateY(-26%)}

/* A moldura de cada célula está desenhada no PNG entre x=66 e x=287 (de 1672).
   A linha da região passa a ocupar exatamente esse retângulo, então a borda
   colorida do hover cai em cima do traço original em vez de aparecer deslocada
   para dentro. */
.living-world-regions{left:3.95%;width:13.22%}
.living-world-region{margin:0;padding:0 2px 0 0}
/* O losango fica no meio do espaço que sobra entre o nome e a borda: margem
   automática dos dois lados divide a folga em partes iguais. */
.living-world-region span{flex:0 1 auto}
.living-world-region em{position:static;margin:0 auto;transform:none}
/* Selecionar não muda mais nada na linha: a cor é só do hover. */
.living-world-region.is-selected,.living-world-region:focus-visible{border-color:transparent!important;background:transparent!important;box-shadow:none!important}
.living-world-region:hover{border-color:var(--region)!important}
/* O pulso do alfinete escolhido mexia no `transform`, e o quadro-chave sem as
   translações jogava o alfinete de volta para baixo a cada ciclo. Agora ele
   pulsa só no brilho, e a posição fica intocada. */
.living-world-pin.is-selected i{animation:living-world-brilho-pin 1.35s ease-in-out infinite}
@keyframes living-world-brilho-pin{50%{filter:brightness(1.32) drop-shadow(0 0 13px var(--pin))}}
/* O mapa é a tela toda: fica por cima da barra de baixo do HUD (z-index 9999). */
#hub-section-container[data-section="living_world"]{z-index:10050!important}

/* Companheiros de party no mapa: a folha de caminhada da classe rodando em
   miniatura, na região onde a pessoa está. O atlas é 4×4, então o passo é uma
   animação em `steps(4)` sobre a posição horizontal do fundo. */
.living-world-party-layer{position:absolute;inset:0;z-index:3;pointer-events:none}
/* Companheiros de party: a imagem vem no atributo style do elemento (url()
   dentro de custom property resolve pela folha de estilo, e o caminho
   quebrava). Posição e quadro são controlados pelo LivingWorldParty. */
.living-world-party-mate{position:absolute;left:var(--x,50%);top:var(--y,50%);width:clamp(24px,2.3vw,38px);height:clamp(24px,2.3vw,38px);background-size:400% 400%;background-repeat:no-repeat;transform:translate(-50%,-50%) scaleX(var(--virar,1));filter:drop-shadow(0 2px 3px #000) drop-shadow(0 0 6px #2ad4ffaa);transition:left .12s linear,top .12s linear}
/* O nick fica acima da cabeça e não vira junto quando o herói olha para a
   esquerda: o contra-espelhamento devolve o texto à leitura normal. */
.living-world-party-mate b{position:absolute;left:50%;bottom:100%;margin-bottom:2px;padding:1px 5px;border:1px solid #2f6d7e;border-radius:2px;background:#050b0dd9;color:#bfe9ff;font:700 clamp(8px,.68vw,11px) Georgia,serif;white-space:nowrap;text-shadow:0 1px 2px #000;transform:translateX(-50%) scaleX(var(--virar,1))}

/* A linha é um item de grade e, por padrão, não encolhe abaixo do conteúdo:
   ela vazava 16px para fora do painel e cada losango parava num lugar. Com
   `min-width:0` a linha respeita a moldura e o nome corta quando precisa. */
.living-world-region{min-width:0}
.living-world-region span{flex:1 1 auto;min-width:0;overflow:hidden}
.living-world-region b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Losango fixo na direita: assim todos ficam na mesma coluna. */
.living-world-region em{flex:0 0 auto;margin:0 9px 0 6px}
/* O bloco base do painel também casa `:hover` e vence a regra de posição do
   alfinete por especificidade — era por isso que ele caía ao passar o mouse.
   Repetimos o deslocamento em todos os estados. */
.living-world-pin,.living-world-pin:hover,.living-world-pin:focus,.living-world-pin:active{transform:translate(-50%,-50%) translateY(-26%)}
/* O X sai de cima da arte e vai para o canto superior esquerdo da moldura. */
.living-world-close{left:2.2%;right:auto;top:3.3%}

/* Passar o mouse não redesenha a moldura já presente na arte. Qualquer fundo
   aplicado na linha aparece através dos cantos transparentes da medalha, e
   uma borda colorida retangular descaracteriza a célula. O hover ilumina só
   as extremidades internas, usando a cor própria da região. */
.living-world-region:hover,.living-world-region:focus,.living-world-region:active{background:transparent!important;background-image:none!important;box-shadow:none!important;filter:none!important}
.living-world-region:hover{border-color:transparent!important;box-shadow:inset 3px 0 10px color-mix(in srgb,var(--region) 56%,transparent),inset -3px 0 10px color-mix(in srgb,var(--region) 56%,transparent)!important}
/* A medalha tem um filtro de saturação e contraste no estado normal.
   Zerar o filtro no hover MUDAVA o disco — era essa a troca de aspecto que
   sobrou. Agora o mesmo valor é fixado em todos os estados, então a arte não
   reage a nada: só a borda da linha acende.  */
.living-world-region i,.living-world-region:hover i,.living-world-region:focus i,.living-world-region:active i,.living-world-region.is-selected i{filter:saturate(.95) contrast(1.08)!important;opacity:1!important;transform:none!important}
.living-world-region,.living-world-region:hover,.living-world-region:focus,.living-world-region:active{outline:0!important}

/* X no canto superior direito, rente à quina da moldura. */
.living-world-close{left:auto;right:.9%;top:1.2%}

/* Aviso no rodapé do cartão enquanto nenhum monstro foi escolhido. */
.living-world-pick-hint { color: #e0b25f !important; font: 700 11px Georgia, serif; }

/* ---- Requisito de viagem na lista de regiões ---- */
/* Cada região mostra o que a viagem cobra antes do clique: level, Zen e, no
   caso de Icarus, a asa. O que aparece bloqueado aqui é exatamente o que a
   função getTravelRequirement recusa. */
.living-world-region small {
    display: block; margin-top: 1px;
    color: #9fb2ae; font: 11px/1.2 Arial, sans-serif;
}
.living-world-region.is-locked { opacity: .55; }
.living-world-region.is-locked small { color: #d59a8e; }
.living-world-region.is-locked i { filter: grayscale(.85); }
.living-world-region.is-here { border-color: #7edbea; }
.living-world-region.is-here small { color: #8fe0c0; }

/* ---- Você no mapa-múndi ---- */
/* O próprio aventureiro usa o mesmo boneco dos companheiros, com o brilho e a
   plaquinha em dourado para não se confundir com a party no meio do grupo. */
.living-world-party-mate.is-self {
    filter: drop-shadow(0 2px 3px #000) drop-shadow(0 0 7px #ffd36acc);
    z-index: 3;
}
.living-world-party-mate.is-self b {
    border-color: #9a7b32;
    background: #120e05e6;
    color: #ffe6a6;
}
.living-world-travel-cost { color: #9fd7ff !important; font: 700 11px Georgia, serif; }

/* ===== Mercador: janela clássica independente ===== */
#hub-section-container.merchant-window-active{width:min(1260px,calc(100vw - 28px));height:min(760px,calc(100vh - 24px))!important;max-height:none!important;top:12px;transform:translateX(-50%);padding:0!important;overflow:hidden;border:0!important;background:#080807!important;box-shadow:0 20px 70px #000e!important}
#hub-section-container.merchant-window-active>div:first-child{display:none!important}
#hub-section-container.merchant-window-active .hub-sub{height:100%!important;max-height:none!important;overflow:hidden;padding:0!important}
.merchant-shop,.merchant-shell{width:100%;height:100%}.merchant-shell{position:relative;display:flex;flex-direction:column;box-sizing:border-box;padding:20px 9.2% 4.8%;overflow:hidden;background:#090908 url('../assets/img/ui/merchant-window-forged-v1.png') center/100% 100% no-repeat;color:#e8ddbd;font-family:Georgia,serif}.merchant-head{position:relative;display:flex;justify-content:center;align-items:center;min-height:72px}.merchant-head h2{margin:0;color:#e5bd62;font:700 clamp(23px,2.7vw,45px)/1 Georgia,serif;letter-spacing:1px;text-shadow:0 3px 2px #000,0 0 12px #a77b2a77}.merchant-close{position:absolute;right:0;top:1px;width:43px;height:43px;border:1px solid #a97e32;background:linear-gradient(145deg,#2c2213,#090806);box-shadow:inset 0 0 0 3px #171106;color:#e9bd57;font:700 30px/36px Georgia,serif;cursor:pointer}.merchant-close:hover{color:#fff3ba;border-color:#f0c866;filter:brightness(1.25)}.merchant-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:0 5.2% 15px}.merchant-mode-tabs button{min-height:68px;border:1px solid #736039;background:linear-gradient(145deg,#2a2b29,#0e0f0e 65%);box-shadow:inset 0 0 0 2px #090909,inset 0 0 17px #000;color:#aaa28f;font:700 clamp(18px,2.3vw,34px) Georgia,serif;letter-spacing:1px;cursor:pointer}.merchant-mode-tabs button:hover{border-color:#c29c4a;color:#f5e4aa}.merchant-mode-tabs button.is-active{border-color:#e6b34a;background:linear-gradient(145deg,#9b691c,#362207 66%);box-shadow:inset 0 0 0 2px #3b2406,inset 0 0 22px #e79a1b55,0 0 12px #c68a2840;color:#fff0b3}.merchant-body{display:grid;grid-template-columns:174px minmax(300px,1.16fr) minmax(340px,.96fr);min-height:0;flex:1;gap:11px}.merchant-categories{display:grid;align-content:start;gap:5px;padding:10px;background:linear-gradient(90deg,#13100d,#070808);border:1px solid #403725;box-shadow:inset 0 0 14px #000}.merchant-categories button{display:flex;align-items:center;gap:10px;min-height:46px;padding:6px 10px;border:1px solid #3c3426;background:linear-gradient(90deg,#181715,#090a09);color:#c8b98c;text-align:left;font:700 13px Georgia,serif;cursor:pointer}.merchant-categories i{display:grid;place-items:center;width:23px;height:23px;color:#e1bb66;font:normal 21px Georgia,serif}.merchant-categories button:hover,.merchant-categories button.is-active{border-color:#b69043;background:linear-gradient(90deg,#5a211a,#21160d);color:#ffe6a1}.merchant-categories button.is-active i{filter:drop-shadow(0 0 6px #e2a53a)}.merchant-catalog,.merchant-detail{min-width:0;border:1px solid #4d4028;background:linear-gradient(145deg,#14130fdd,#070807e8);box-shadow:inset 0 0 18px #000}.merchant-catalog{display:flex;flex-direction:column;overflow:hidden}.merchant-catalog>header{display:grid;grid-template-columns:1fr auto;padding:10px 16px;border-bottom:1px solid #594a2f;background:linear-gradient(#201c14,#100f0c);color:#e4bd63;font:700 14px Georgia,serif}.merchant-list{display:grid;align-content:start;gap:5px;overflow:auto;padding:8px}.merchant-list-item,.merchant-sell-item{display:grid;grid-template-columns:43px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:61px;padding:8px;border:1px solid #302d24;background:linear-gradient(90deg,#11120f,#16140e);color:#d9d1bc;text-align:left;cursor:pointer}.merchant-list-item:hover,.merchant-list-item.is-selected{border-color:#d1a648;background:linear-gradient(90deg,#39250d,#19140c);box-shadow:inset 0 0 12px #c8882526}.merchant-list-item .shop-sale-icon,.merchant-sell-item .shop-sale-icon{width:40px;height:40px}.merchant-list-item b,.merchant-list-item small,.merchant-sell-item b,.merchant-sell-item small{display:block}.merchant-list-item b,.merchant-sell-item b{overflow:hidden;color:#f0d187;font:700 14px Georgia,serif;text-overflow:ellipsis;white-space:nowrap}.merchant-list-item small,.merchant-sell-item small{display:-webkit-box;overflow:hidden;margin-top:3px;color:#a9a99c;font:11px/1.2 Arial,sans-serif;-webkit-line-clamp:2;-webkit-box-orient:vertical}.merchant-list-item em,.merchant-sell-item em{color:#f0cc6c;font:700 13px Georgia,serif;font-style:normal;white-space:nowrap}.merchant-detail{display:flex;flex-direction:column;min-height:0}.merchant-item-preview{display:grid;grid-template-columns:160px minmax(0,1fr);gap:12px;align-items:center;min-height:0;padding:15px;border-bottom:1px solid #50442c;background:radial-gradient(ellipse at 28% 48%,#6a391822,transparent 45%),#0d0e0c}.merchant-item-preview>.shop-sale-icon{width:142px;height:142px;margin:auto;filter:drop-shadow(0 0 11px #cb852555) drop-shadow(0 4px 5px #000)}.merchant-item-preview h3{margin:0;color:#d98df0;font:700 clamp(17px,2vw,28px) Georgia,serif;text-shadow:0 2px #000}.merchant-item-preview p{min-height:44px;margin:9px 0;color:#c4bba6;font:11px/1.38 Arial,sans-serif}.merchant-item-preview dl{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0}.merchant-item-preview dl div{padding-top:5px;border-top:1px solid #55472e}.merchant-item-preview dt{color:#aa9d80;font:11px Arial,sans-serif}.merchant-item-preview dd{margin:2px 0 0;color:#ead8a5;font:700 12px Georgia,serif}.merchant-checkout{display:grid;justify-items:center;gap:9px;margin-top:auto;padding:13px 15px 15px;background:linear-gradient(#15120d,#090907)}.merchant-checkout>label,.merchant-total span{color:#dcb96b;font:700 16px Georgia,serif}.merchant-quantity{display:grid;grid-template-columns:70px 1fr 70px;width:min(100%,340px);gap:8px}.merchant-quantity button,.merchant-quantity b{min-height:51px;border:1px solid #69532c;background:linear-gradient(#252017,#0c0c0a);color:#f0cf7d;font:700 34px/47px Georgia,serif;text-align:center}.merchant-quantity button{cursor:pointer}.merchant-quantity button:hover:not(:disabled){border-color:#e4b457;background:linear-gradient(#604417,#171006)}.merchant-quantity button:disabled{opacity:.42;cursor:not-allowed}.merchant-total{display:grid;justify-items:center;gap:3px;width:min(100%,340px);padding:8px;border-top:1px solid #5a482b;border-bottom:1px solid #5a482b}.merchant-total strong{color:#f1d486;font:700 31px Georgia,serif;text-shadow:0 2px #000}.merchant-confirm{width:min(100%,420px);min-height:64px;border:1px solid #b58c47;background:linear-gradient(145deg,#3e392f,#15130f 55%,#3b2911);box-shadow:inset 0 0 0 3px #19140d,inset 0 0 13px #000;color:#edcf82;font:700 clamp(20px,2.3vw,34px) Georgia,serif;text-shadow:0 2px #000;cursor:pointer}.merchant-confirm i{margin-left:13px;color:#e7ae3e;font-style:normal}.merchant-confirm:hover:not(:disabled){filter:brightness(1.23);border-color:#f4cb75}.merchant-confirm:disabled{opacity:.42;cursor:not-allowed}.merchant-empty{margin:auto;padding:24px;color:#b6aa91;text-align:center;font:13px Arial,sans-serif}.merchant-sell-item{grid-template-columns:43px minmax(0,1fr) auto auto;cursor:default}.merchant-sell-item button{padding:7px 10px;border:1px solid #896d35;background:#3c2b11;color:#f5db94;font:700 11px Georgia,serif;cursor:pointer}.merchant-sell-item button:hover{filter:brightness(1.25)}.merchant-sell-info{align-items:center;justify-content:center;gap:14px;padding:28px;text-align:center}.merchant-sell-info h3{margin:0;color:#e0bd68;font:700 26px Georgia,serif}.merchant-sell-info p{margin:0;color:#b9b29f;font:12px/1.45 Arial,sans-serif}.merchant-sell-info .merchant-confirm{margin-top:10px}
@media(max-width:760px){#hub-section-container.merchant-window-active{width:calc(100vw - 12px);height:calc(100vh - 12px)!important;top:6px}.merchant-shell{padding:10px 16px;background-size:auto 100%}.merchant-head{min-height:47px}.merchant-head h2{font-size:22px}.merchant-close{width:34px;height:34px;font-size:25px;line-height:27px}.merchant-mode-tabs{gap:7px;padding:0 0 8px}.merchant-mode-tabs button{min-height:45px;font-size:18px}.merchant-body{grid-template-columns:1fr;overflow:auto}.merchant-categories{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:4px}.merchant-categories button{justify-content:center;min-height:38px;padding:4px}.merchant-categories button span{display:none}.merchant-categories i{font-size:18px}.merchant-catalog{min-height:245px}.merchant-detail{min-height:auto}.merchant-item-preview{grid-template-columns:90px minmax(0,1fr);padding:8px}.merchant-item-preview>.shop-sale-icon{width:75px;height:75px}.merchant-item-preview p{min-height:0;margin:4px 0}.merchant-checkout{grid-template-columns:1fr 1fr;padding:8px}.merchant-checkout>label,.merchant-quantity,.merchant-total,.merchant-confirm{grid-column:1/-1}.merchant-quantity{width:100%;grid-template-columns:54px 1fr 54px}.merchant-quantity button,.merchant-quantity b{min-height:39px;font-size:25px;line-height:35px}.merchant-confirm{min-height:48px;font-size:20px}.merchant-sell-item{grid-template-columns:38px minmax(0,1fr) auto}.merchant-sell-item button{grid-column:2/-1}.merchant-sell-info{padding:15px}.merchant-sell-info .merchant-confirm{width:100%}}

/* Ajuste de proporção: catálogo e detalhe recebem área própria, sem comprimir
   os ícones. As categorias passam a usar recortes dos sprites do jogo. */
.merchant-shell{padding:16px 9.2% 5.1%;background-image:url('../assets/img/ui/merchant-window-forged-v2.png')}.merchant-head{min-height:58px}.merchant-head h2{font-size:clamp(25px,2.6vw,41px)}.merchant-close{right:-2px;top:0;width:48px;height:48px;border:2px solid #b78b3d;border-radius:3px;background:radial-gradient(circle at 50% 37%,#4e3a16,#171108 58%,#070605 62%);box-shadow:0 0 0 2px #080705,inset 0 0 0 3px #30220b,inset 0 0 14px #000;color:transparent;font-size:0}.merchant-close::before{content:'✕';display:block;color:#f0c85f;font:700 22px/42px Georgia,serif;text-shadow:0 2px 2px #000,0 0 7px #e0a93a}.merchant-close:hover::before{color:#fff1b1}.merchant-mode-tabs{padding:0 4.3% 11px}.merchant-mode-tabs button{min-height:59px}.merchant-body{grid-template-columns:138px minmax(315px,1.08fr) minmax(345px,1fr);gap:9px}.merchant-categories{gap:6px;padding:8px}.merchant-categories button{min-height:49px;padding:5px 7px;gap:8px}.merchant-categories .merchant-category-icon{flex:0 0 29px;width:29px;height:29px;border:1px solid #796238;background-color:#0b0b09;background-repeat:no-repeat;background-size:300% 200%;box-shadow:inset 0 0 6px #000,0 1px 2px #000;color:transparent!important;font-size:0!important}.merchant-category-icon.icon-sets{background-image:url('../assets/img/items/bk-weapons-shields-v1.png');background-position:100% 100%}.merchant-category-icon.icon-weapons{background-image:url('../assets/img/items/bk-weapons-shields-v1.png');background-position:50% 0}.merchant-category-icon.icon-shields{background-image:url('../assets/img/items/bk-weapons-shields-v1.png');background-position:0 100%}.merchant-category-icon.icon-wings{background-image:url('../assets/img/ui/travel-tier1-wings-sheet.png');background-size:300% 100%;background-position:0 50%}.merchant-category-icon.icon-jewels{background-image:url('../assets/img/items/jewel-icons.png');background-position:50% 0}.merchant-category-icon.icon-accessories{background-image:url('../assets/img/items/bk-weapons-shields-v1.png');background-position:50% 100%}.merchant-category-icon.icon-potions{background-image:url('../assets/img/items/potion-icons.png');background-size:200% 100%;background-position:0 50%}.merchant-category-icon.icon-events{background-image:url('../assets/img/items/jewel-icons.png');background-position:100% 100%}.merchant-categories button.is-active .merchant-category-icon{border-color:#f0c35b;box-shadow:0 0 8px #d59a2c88,inset 0 0 6px #000}.merchant-catalog>header{padding:9px 13px}.merchant-list{padding:7px}.merchant-list-item{min-height:57px;padding:7px}.merchant-item-preview{grid-template-columns:140px minmax(0,1fr);padding:12px}.merchant-item-preview>.shop-sale-icon{width:120px;height:120px}.merchant-checkout{padding:10px 13px}.merchant-quantity{width:min(100%,310px)}.merchant-confirm{min-height:55px}

/* A arte de base termina no topo com uma emenda natural da textura. Esta
   faixa contínua cobre a emenda e mantém a leitura de moldura única. */
.merchant-shell::before{content:'';position:absolute;z-index:0;left:7.2%;right:7.2%;top:5px;height:42px;border-top:2px solid #a77b31;border-bottom:1px solid #5d4825;background:linear-gradient(180deg,#211b12 0%,#0c0b09 38%,#211b12 100%);box-shadow:0 1px 0 #020201,inset 0 1px #c29a4d55,inset 0 -1px #000}

/* Campo digitável: mantém a moldura do seletor e permite informar lotes. */
.merchant-quantity-input{width:100%;min-height:51px;box-sizing:border-box;border:1px solid #69532c;background:linear-gradient(#252017,#0c0c0a);color:#f0cf7d;font:700 34px/47px Georgia,serif;text-align:center;outline:none;-moz-appearance:textfield}.merchant-quantity-input::-webkit-inner-spin-button,.merchant-quantity-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.merchant-quantity-input:focus{border-color:#e4b457;box-shadow:inset 0 0 10px #a8722844}

/* Categorias de loja: os três tipos novos recebem recortes reais de item. */
.merchant-category-icon.icon-life{background-image:url('../assets/img/items/potion-tiers-v3-transparent.png');background-size:400% 200%;background-position:0 0}.merchant-category-icon.icon-mana{background-image:url('../assets/img/items/potion-tiers-v3-transparent.png');background-size:400% 200%;background-position:0 100%}.merchant-category-icon.icon-pets{background-image:url('../assets/img/items/accessories-pets-icons.png');background-size:400% 200%;background-position:0 0}
.merchant-shell>*{position:relative;z-index:1}

/* Item protegido pelo cadeado: no lugar do botão de vender, o estado. */
.merchant-sell-item.is-locked { opacity: .72; border-color: #6b5a2c; }
.merchant-locked {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 9px;
    border: 1px solid #c9a24a;
    border-radius: 3px;
    background: rgba(58, 44, 13, .55);
    color: #f0d78a;
    font: 700 11px Georgia, serif;
    white-space: nowrap;
}
