/* Vexoria — telas dos sistemas novos (Claude, 20/10): evolução, talentos, gemas, pesca, correio, login e clima. */

/* ---------- botão flutuante de evolução ---------- */
#evo-button{position:absolute;left:50%;bottom:calc(var(--dock-height,76px) + var(--dock-bottom,12px) + 64px);transform:translateX(-50%);z-index:30;pointer-events:auto;display:flex;align-items:center;gap:8px;padding:8px 16px;font:14px Pix,monospace;color:#1a1126;background:linear-gradient(#fff3c4,#f7d77a 45%,#d69a34);border:2px solid #1a1126;box-shadow:0 0 0 2px #f7d77a,0 0 24px #f7d77acc;cursor:pointer;animation:evo-pulse 1.1s ease-in-out infinite}
#evo-button.hidden{display:none}
#evo-button span{font-size:18px}#evo-button kbd{font:11px Pix;background:#1a1126;color:#f7d77a;padding:1px 4px}
@keyframes evo-pulse{0%,100%{box-shadow:0 0 0 2px #f7d77a,0 0 12px #f7d77a88;transform:translateX(-50%) scale(1)}50%{box-shadow:0 0 0 2px #fff,0 0 34px #ffe28a;transform:translateX(-50%) scale(1.06)}}

/* ---------- cerimônia de evolução ---------- */
#evo-ceremony{position:fixed;inset:0;z-index:120;pointer-events:auto;display:grid;place-items:center;overflow:auto;background:radial-gradient(ellipse at 50% 45%,#3a2a12 0,#16101e 55%,#07040b 100%);color:#efe6d6}
#evo-ceremony.hidden{display:none}
#evo-ceremony.opening .evo-stage{animation:evo-in .9s cubic-bezier(.2,.8,.2,1)}
#evo-ceremony.flash:after{content:"";position:fixed;inset:0;background:#fff;animation:evo-flash .9s ease-out forwards;pointer-events:none}
#evo-ceremony.charging .evo-me canvas{animation:evo-charge .25s linear infinite}
@keyframes evo-in{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
@keyframes evo-flash{0%{opacity:1}100%{opacity:0}}
@keyframes evo-charge{0%,100%{filter:brightness(1.4)}50%{filter:brightness(2.2)}}
.evo-particles{position:fixed;inset:0;pointer-events:none}
.evo-rays{position:fixed;left:50%;top:45%;width:140vmax;height:140vmax;margin:-70vmax 0 0 -70vmax;pointer-events:none;opacity:.16;background:repeating-conic-gradient(from 0deg,#ffe28a 0deg 4deg,transparent 4deg 18deg);border-radius:50%;animation:evo-spin 60s linear infinite;will-change:transform}
@keyframes evo-spin{to{transform:rotate(360deg)}}
.evo-stage{position:relative;width:min(1080px,96vw);padding:18px 0 24px}
.evo-stage header{text-align:center;margin-bottom:14px}
.evo-stage header small{font:13px Pix,monospace;color:#d6a54a;letter-spacing:2px}
.evo-stage header h2{font:40px Pix,monospace;color:#fff3c4;margin:6px 0;text-shadow:0 0 18px #f7d77a,3px 3px 0 #1a1126;letter-spacing:2px}
.evo-stage header p{font:14px Txt,sans-serif;color:#d9cbe6;margin:0}.evo-stage header p b{color:#ffb4b4}
.evo-row{display:grid;grid-template-columns:1fr 200px 1fr;gap:16px;align-items:start}
.evo-me{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:70px}
.evo-me canvas{width:168px;height:196px;image-rendering:pixelated;animation:evo-float 2.4s ease-in-out infinite;border-radius:50%;background:radial-gradient(circle,#ffe28a55 0,transparent 65%)}
.evo-me span{font:16px Pix,monospace;color:#f7d77a}
@keyframes evo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.evo-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:12px 14px 14px;background:linear-gradient(#24182ff2,#130d1af2);border:2px solid var(--evo);box-shadow:0 0 0 2px #0d0914,0 0 28px color-mix(in srgb,var(--evo) 40%,transparent);transition:transform .2s,box-shadow .2s}
.evo-card:hover,.evo-card.chosen{transform:translateY(-4px);box-shadow:0 0 0 2px #0d0914,0 0 44px var(--evo)}
.evo-pic{display:grid;place-items:center;height:150px;background:radial-gradient(ellipse at 50% 70%,color-mix(in srgb,var(--evo) 35%,#1a1126) 0,#0d0914 70%);border:1px solid #3a2b4d}
.evo-pic canvas{width:126px;height:147px;image-rendering:pixelated}
.evo-card h3{font:22px Pix,monospace;color:var(--evo);margin:2px 0 0;text-shadow:2px 2px 0 #0d0914}
.evo-role{font:12px Pix,monospace;color:#c9b8dd;margin:0;letter-spacing:1px}
.evo-desc{font:13px/1.45 Txt,sans-serif;color:#e3dcef;margin:0}
.evo-bonus{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none}
.evo-bonus li{font:11px Txt,sans-serif;font-weight:bold;color:#1a1126;background:var(--evo);padding:2px 6px}
.evo-skills{display:grid;gap:6px}
.evo-skill{display:grid;grid-template-columns:34px 1fr;gap:8px;align-items:center;position:relative;padding:6px;background:#0d0914aa;border:1px solid #3a2b4d}
.evo-skill img{width:32px;height:32px;image-rendering:pixelated}
.evo-skill kbd{position:absolute;left:2px;top:2px;font:10px Pix;color:#f7d77a;background:#0d0914;padding:0 3px}
.evo-skill b{display:block;font:13px Pix,monospace;color:#f4e7c6}
.evo-skill small{display:block;font:11px Txt,sans-serif;color:#b8a8cc}
.evo-skill em{display:block;font:italic 11px Txt,sans-serif;color:#d9cbe6;margin-top:2px}
.evo-choose{margin-top:4px;padding:10px;font:14px Pix,monospace;color:#1a1126;background:var(--evo);border:2px solid #0d0914;box-shadow:inset 0 2px #ffffff88;cursor:pointer}
.evo-choose:hover{filter:brightness(1.15)}
.evo-confirm{margin:16px auto 0;width:fit-content;display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center;padding:12px 16px;background:#0d0914ee;border:2px solid var(--evo);box-shadow:0 0 30px var(--evo)}
.evo-confirm p{margin:0;font:14px Txt,sans-serif}.evo-confirm b{color:var(--evo)}
.evo-yes{padding:10px 16px;font:15px Pix,monospace;color:#1a1126;background:var(--evo);border:2px solid #0d0914;cursor:pointer}
.evo-no,.evo-later{padding:8px 14px;font:13px Pix,monospace;color:#d9cbe6;background:#24182f;border:1px solid #584274;cursor:pointer}
.evo-stage footer{text-align:center;margin-top:16px}
.evo-done{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 0;text-align:center}
.evo-done small{font:14px Pix,monospace;color:#d6a54a;letter-spacing:3px}
.evo-done h2{font:52px Pix,monospace;color:var(--evo);margin:0;text-shadow:0 0 26px var(--evo),4px 4px 0 #0d0914;animation:evo-in .6s ease-out}
.evo-done canvas{width:196px;height:228px;image-rendering:pixelated;filter:drop-shadow(0 0 24px var(--evo))}
.evo-done p{font:14px Txt,sans-serif;color:#e3dcef}
@media(max-width:860px){.evo-row{grid-template-columns:1fr}.evo-me{order:-1;padding-top:0}.evo-stage header h2{font-size:28px}}

/* ---------- painel do personagem: evolução, talentos e gemas ---------- */
@keyframes evo-glow{0%,100%{box-shadow:0 0 6px #f7d77a}50%{box-shadow:0 0 18px #fff3c4}}
@media(max-width:820px){#character-menu .cp-tree{grid-template-columns:1fr}}

/* ---------- pesca ---------- */
#gather-bar.fishing{border-color:#45c6e8}#gather-bar.fishing i{background:linear-gradient(#b8f1ff,#45c6e8)}
#gather-bar.fishing.bite{border-color:#f7d77a;animation:bite .18s linear infinite}#gather-bar.fishing.bite span{color:#f7d77a}
#gather-bar.fishing.bite i{background:linear-gradient(#fff3c4,#f7a34a)}
@keyframes bite{50%{transform:translateX(-50%) scale(1.08)}}

/* ---------- correio ---------- */
.mail-window .game-window{width:min(720px,96vw)}
.mail-dot{position:absolute;right:-4px;top:-4px;min-width:14px;height:14px;padding:0 3px;box-sizing:border-box;font:10px/14px Pix,monospace;font-style:normal;color:#fff;background:#e0283f;border-radius:7px;text-align:center}
.mail-dot.hidden{display:none}
.mail-tabs{display:flex;gap:4px;margin-bottom:10px}
.mail-tabs button.on{color:#f7d77a}
.mail-inbox{display:grid;grid-template-columns:230px minmax(0,1fr);gap:10px;min-height:260px}
.mail-list{display:flex;flex-direction:column;gap:3px;max-height:360px;overflow:auto}
.mail-list button{display:grid;grid-template-columns:1fr auto;text-align:left;padding:7px 8px;gap:2px 6px;font:12px Txt,sans-serif}
.mail-list button b{font:13px Pix,monospace}.mail-list button small{grid-column:1/-1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#b8a8cc}
.mail-list button span{font-size:11px;color:#8e7fa6;grid-row:1;grid-column:2}
.mail-list button.on{outline:2px solid #f7d77a}.mail-list button.unread b:after{content:" ●";color:#e0283f}
.mail-read{display:flex;flex-direction:column;gap:8px;padding:10px;background:#150f1e;border:1px solid #3a2b4d}
.mail-read header{display:flex;justify-content:space-between;align-items:baseline}.mail-read header b{font:14px Pix,monospace;color:#f4e7c6}.mail-read header small{color:#8e7fa6}
.mail-read p{font:13px/1.5 Txt,sans-serif;margin:0;white-space:pre-wrap}
.mail-items{display:flex;flex-wrap:wrap;gap:6px}.mail-items span{display:flex;align-items:center;gap:5px;padding:4px 8px;font:12px Txt,sans-serif;border:1px solid var(--r,#584274);background:#0d0914}
.mail-items img{width:16px;height:16px;image-rendering:pixelated}.mail-bones{color:#f7d77a}
.mail-read footer{display:flex;gap:6px;margin-top:auto}
.mail-empty{font:13px Txt,sans-serif;color:#b8a8cc;padding:20px}
.mail-write{display:flex;flex-direction:column;gap:8px}
.mail-write label{display:flex;flex-direction:column;gap:3px;font:12px Pix,monospace;color:#d5b783}
.mail-write input,.mail-write textarea{font:14px Txt,sans-serif;color:#efe6d6;background:#0d0914;border:1px solid #584274;padding:6px 8px;resize:vertical}
.mail-oss input{width:120px}
.mail-attach b{font:12px Pix,monospace;color:#d5b783}
.mail-bag{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px;max-height:150px;overflow:auto;padding:4px;background:#0d0914}
.mail-bag button{position:relative;width:34px;height:34px;padding:0;display:grid;place-items:center;background:#1d1529;border:1px solid var(--r,#584274)}
.mail-bag button.on{outline:2px solid #f7d77a;background:#3a2b4d}
.mail-bag img{width:16px;height:16px;image-rendering:pixelated;transform:scale(1.5)}
.mail-bag i{position:absolute;right:1px;bottom:0;font:10px Pix;font-style:normal;color:#fff;text-shadow:1px 1px #000}
.mail-cost{font:12px Txt,sans-serif;color:#d4bb8b;margin:0}.mail-note{font:11px Txt,sans-serif;color:#8e7fa6;margin:0}
@media(max-width:640px){.mail-inbox{grid-template-columns:1fr}}

/* ---------- calendário de login: agora em client/daily-login.css ---------- */

/* ---------- clima: ícone ao lado do relógio ---------- */
#weather-chip{position:absolute;left:4px;top:4px;z-index:3;font:14px Pix,monospace;color:#e3dcef;text-shadow:1px 1px 0 #1a1126;pointer-events:auto}
#weather-chip.wx-chuva{color:#8fb8ff}#weather-chip.wx-neblina{color:#c4bccf}#weather-chip.wx-tempestade{color:#f7d77a}#weather-chip.wx-limpo{color:#ffe28a}

/* ===== Eventos no mapa aberto (Claude, 20/10) — client/src/world-events.js ===== */
#wevent-tracker{position:absolute;right:12px;top:380px;width:250px;z-index:12;padding:10px 12px 9px;background:linear-gradient(180deg,#1d1429f2,#130d1cf2);
  border:2px solid var(--wc,#f7a34a);box-shadow:0 0 0 2px #0b0712,0 0 18px color-mix(in srgb,var(--wc,#f7a34a) 35%,transparent);color:#e9dcef;font:13px Txt;pointer-events:auto}
#wevent-tracker.hidden{display:none}
#wevent-tracker .wh{display:flex;align-items:center;gap:7px}
#wevent-tracker .gl{font-size:17px;color:var(--wc);text-shadow:0 0 8px var(--wc)}
#wevent-tracker .wh b{flex:1;font:16px Pix;color:#ffe9b0;letter-spacing:.5px}
#wevent-tracker .time{font:16px Pix;color:#fff;background:#0b0712;padding:1px 6px;border:1px solid #3d2c56}
#wevent-tracker .time.low{color:#ff6b6b;animation:wevBlink .6s steps(2) infinite}
#wevent-tracker em{font-style:normal;font-weight:700}#wevent-tracker em.ok{color:#8fe0a0}#wevent-tracker em.bad{color:#ff6b6b}
#wevent-tracker .wbar{height:8px;margin:7px 0 4px;background:#0b0712;border:1px solid #3d2c56}
#wevent-tracker .wbar i{display:block;height:100%;background:linear-gradient(90deg,color-mix(in srgb,var(--wc) 70%,#000),var(--wc));transition:width .3s}
#wevent-tracker .wl{color:#d9c8df}
#wevent-tracker .wg{margin-top:5px;font-size:12px;color:#ffd76a}#wevent-tracker .wg.off{color:#7d6f8c;text-decoration:line-through}
#wevent-tracker .wd{margin-top:4px;font-size:12px;color:#9fd1ff}
@keyframes wevBlink{50%{opacity:.4}}
#hud:has(#inv:not(.hidden),#character-menu:not(.hidden)) #wevent-tracker{display:none}
.wevent-edge{position:absolute;z-index:40;width:0;height:0;pointer-events:none}.wevent-edge.hidden{display:none}
.wevent-edge i{position:absolute;left:-11px;top:-11px;width:22px;height:22px;transform:rotate(var(--a));
  background:var(--wc);clip-path:polygon(100% 50%,0 0,28% 50%,0 100%);filter:drop-shadow(0 0 6px var(--wc));animation:wevPulse .8s ease-in-out infinite}
.wevent-edge b{position:absolute;left:50%;top:14px;transform:translateX(-50%);white-space:nowrap;font:13px Txt;font-weight:700;color:#fff;text-shadow:0 1px 0 #000,0 0 6px #000}
@keyframes wevPulse{50%{transform:rotate(var(--a)) scale(1.25)}}
#wevent-reward{position:absolute;left:50%;top:22%;transform:translateX(-50%);z-index:45;min-width:300px;max-width:380px;padding:14px 18px 10px;text-align:center;
  background:linear-gradient(180deg,#24182f,#140d1c);border:2px solid #ffa24a;box-shadow:0 0 0 2px #0b0712,0 0 40px #ffa24a55;color:#eee;font:14px Txt;animation:wevIn .45s cubic-bezier(.2,1.6,.4,1)}
#wevent-reward.gold{border-color:#ffd76a;box-shadow:0 0 0 2px #0b0712,0 0 50px #ffd76a77}
#wevent-reward.hidden{display:none}
#wevent-reward small{color:#ffd76a;letter-spacing:2px;font-weight:700}
#wevent-reward h3{margin:4px 0 2px;font:32px Pix;color:#ffe9b0}
#wevent-reward p{margin:0 0 8px;color:#c9b8d6}
#wevent-reward .wr{display:flex;justify-content:center;gap:16px;font-weight:700;color:#8fe0a0;margin-bottom:8px}
#wevent-reward ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
#wevent-reward li{display:flex;align-items:center;gap:8px;padding:4px 8px;background:#0b0712aa;border-left:3px solid var(--r);color:var(--r);text-align:left}
#wevent-reward li img{width:24px;height:24px;image-rendering:pixelated}
#wevent-reward .mail{color:#9fd1ff;margin-top:6px}
#wevent-reward em{display:block;margin-top:8px;font-size:11px;color:#7d6f8c;font-style:normal}
@keyframes wevIn{from{transform:translateX(-50%) scale(.6);opacity:0}}
/* mini jogo da pesca (Claude, 21/10): ponteiro vai e volta, toque na faixa verde */
#fish-game{pointer-events:auto;position:absolute;left:50%;bottom:calc(var(--dock-height,70px) + var(--dock-bottom,12px) + 64px);transform:translateX(-50%);width:300px;padding:6px 10px 8px;background:#140d1cee;border:2px solid #45c6e8;box-shadow:0 0 0 2px #1a1126,0 6px 18px #0008;text-align:center;font:13px Pix,monospace;color:#e3dcef;z-index:30;touch-action:none;user-select:none;cursor:pointer}
#fish-game.hidden{display:none}
#fish-game .fg-title{display:block;margin-bottom:5px;color:#b8f1ff;letter-spacing:.5px}
#fish-game .fg-track{position:relative;height:18px;background:linear-gradient(#0f1a26,#1c2b3d);border:2px solid #0b0712;box-shadow:inset 0 0 0 1px #2e4a66;overflow:hidden}
#fish-game .fg-zone{position:absolute;top:0;bottom:0;left:40%;width:25%;background:linear-gradient(#93e0a0,#3f9a52);box-shadow:inset 0 0 0 1px #c8ffd0;display:none}
#fish-game .fg-zone em{position:absolute;top:0;bottom:0;background:linear-gradient(#fff3c4,#f7c45a);opacity:.85}
#fish-game .fg-needle{position:absolute;top:-2px;bottom:-2px;left:0;width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 0 1px #1a1126,0 0 6px #fff;display:none}
#fish-game .fg-time{height:3px;margin-top:4px;background:#0b0712}#fish-game .fg-time i{display:block;height:100%;width:100%;background:#45c6e8}
#fish-game .fg-btn{margin-top:6px;width:100%;padding:6px 0;font:14px Pix,monospace;color:#1a1126;background:linear-gradient(#b8f1ff,#45c6e8);border:2px solid #1a1126;cursor:pointer}
#fish-game .fg-btn kbd{font:11px Pix,monospace;padding:0 3px;border:1px solid #1a112688;margin-left:4px}
#fish-game .fg-btn:disabled{cursor:default;opacity:.75}#fish-game .fg-btn:disabled kbd{display:none}
#fish-game.wait .fg-track{opacity:.45}#fish-game.wait .fg-btn{background:#3d2c56;color:#c4bccf}
#fish-game.wait .fg-title::after{content:'';display:inline-block;width:1.4em;text-align:left;animation:fgdots 1.2s steps(4) infinite}
@keyframes fgdots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
#fish-game.bite .fg-zone,#fish-game.bite .fg-needle{display:block}
#fish-game.bite{border-color:#f7d77a}#fish-game.bite .fg-title{color:#f7d77a}
#fish-game.bite.tier-raro{border-color:#6ea8ff}#fish-game.bite.tier-raro .fg-title{color:#9cc8ff}
#fish-game.bite.tier-epico{border-color:#b98cff;animation:bite .18s linear infinite}#fish-game.bite.tier-epico .fg-title{color:#d9b8ff}
#fish-game.done.ok{border-color:#93e0a0}#fish-game.done.ok .fg-title{color:#93e0a0}
#fish-game.done.fail{border-color:#ff6b6b;animation:fgshake .3s}#fish-game.done.fail .fg-title{color:#ff8a8a}
#fish-game.done .fg-zone,#fish-game.done .fg-needle{display:block}
@keyframes fgshake{0%,100%{transform:translateX(-50%)}25%{transform:translateX(calc(-50% - 5px))}75%{transform:translateX(calc(-50% + 5px))}}
/* celular: compacto e baixo (abaixo do personagem, acima dos botões Conversa/Pescar) */
html.touch-device #fish-game{width:min(62vw,300px);bottom:62px;padding:4px 8px 6px}
html.touch-device #fish-game .fg-title{margin-bottom:3px}
html.touch-device #fish-game .fg-track{height:20px}html.touch-device #fish-game .fg-btn{margin-top:4px;padding:6px 0;font-size:14px}
html.touch-device #fish-game .fg-btn kbd{display:none}
/* setinha de missão (21/10): missão seguida no rastreador e botão no diário */
#quest-tracker .q-followed b{color:#f7d77a}#quest-tracker .q-arrow{font-style:normal;color:#f7d77a;margin-right:4px;font-size:.9em}
.journal-follow{display:inline-block;margin:0 0 0 8px;padding:3px 10px;vertical-align:middle;font:12px Pix,monospace;color:#1a1126;background:linear-gradient(#f7d77a,#c99a3a);border:2px solid #1a1126;cursor:pointer;text-align:center}
.journal-follow.on{color:#f7d77a;background:#2e2142;border-color:#f7d77a}
/* dicas de primeira vez (21/10): anel dourado no alvo + balão (não bloqueia o toque no alvo) */
#tip-spot{position:fixed;z-index:9000;pointer-events:none;border:3px solid #f7d77a;border-radius:6px;box-shadow:0 0 0 9999px #0a061273,0 0 14px #f7d77acc,inset 0 0 10px #f7d77a66;animation:tipspot 1s ease-in-out infinite;transition:left .15s,top .15s,width .15s,height .15s}
#tip-spot.hidden,#tip-bubble.hidden{display:none}
@keyframes tipspot{50%{border-color:#fff3c4;box-shadow:0 0 0 9999px #0a061273,0 0 22px #f7d77a,inset 0 0 14px #f7d77a99}}
#tip-bubble{position:fixed;z-index:9001;width:min(300px,calc(100vw - 16px));padding:8px 10px 9px;background:#1a1126f2;border:2px solid #f7d77a;box-shadow:0 0 0 2px #1a1126,0 8px 22px #000a;color:#e3dcef;font:13px/1.35 Lato,system-ui,sans-serif;pointer-events:auto}
#tip-bubble .tb-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
#tip-bubble .tb-head b{font:13px Pix,monospace;color:#f7d77a}#tip-bubble .tb-head small{color:#8e86a3;font:11px Pix,monospace}
#tip-bubble p{margin:0 0 7px}#tip-bubble p b{color:#fff3c4}
#tip-bubble .tb-btns{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
#tip-bubble button{font:12px Pix,monospace;padding:4px 9px;border:2px solid #1a1126;background:#3d2c56;color:#e3dcef;cursor:pointer}
#tip-bubble .tb-ok{background:linear-gradient(#f7d77a,#c99a3a);color:#1a1126}
#tip-bubble .tb-off{margin-left:auto;background:none;border-color:transparent;color:#8e86a3;text-decoration:underline;padding:4px 2px}
html.touch-device #tip-bubble{font-size:12px;width:min(270px,calc(100vw - 16px))}