/* ===================== 8BKARTUN — VOXEL WORLD (dashboard) ===================== */
:root{
  --bg:#0c0814;--panel:#181029;--panel-2:#1f1636;--ink:#f2ecff;--ink-soft:#b3a4d6;
  --purple:#a855f7;--purple-2:#c084fc;--neon:#39ff14;--neon-2:#00ffa3;--pink:#ff3d9a;
  --line:rgba(168,85,247,.32);--tiny:'Press Start 2P',monospace;--mono:'Space Mono',monospace;--pixel:'Jersey 25',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{background:var(--bg);color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased}
#world{position:fixed;inset:0;width:100vw;height:100vh;display:block;image-rendering:pixelated;
  background:radial-gradient(1200px 800px at 50% -10%,rgba(168,85,247,.18),transparent 60%),linear-gradient(180deg,#120b22,#0a0714)}
.overlay{position:fixed;z-index:5}
button{font-family:var(--tiny);cursor:pointer}

/* ---- TOP BAR ---- */
.w-top{top:0;left:0;right:0;display:flex;align-items:center;gap:16px;padding:14px 16px}
.w-home{font-family:var(--tiny);font-size:13px;color:var(--ink);text-decoration:none;border:2px solid var(--line);
  background:rgba(12,8,20,.7);padding:9px 14px;backdrop-filter:blur(4px);display:inline-flex;align-items:center;gap:9px}
.w-logo{width:22px;height:22px;flex:none}
.w-home:hover{border-color:var(--neon);color:var(--neon)}
.w-petcard{display:flex;align-items:center;gap:12px;border:2px solid var(--line);background:rgba(12,8,20,.72);
  padding:10px 14px;backdrop-filter:blur(4px)}
#petMini{width:58px;height:58px;image-rendering:pixelated;border:2px solid var(--line);background:#0e0a1c}
.w-petname{font-family:var(--pixel);font-size:24px;line-height:1;color:var(--neon);text-shadow:0 0 10px rgba(57,255,20,.4)}
.w-petmeta{font-size:11px;color:var(--ink-soft);font-weight:700;margin:3px 0 6px}
.w-bar{width:190px;height:9px;border:2px solid var(--line);background:#0e0a1c;position:relative;overflow:hidden}
.w-bar span{position:absolute;inset:0;width:0;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 10px var(--neon);transition:width .4s}
.w-stats{display:flex;gap:14px;margin-top:6px;font-size:11px;font-weight:700;color:var(--ink-soft)}
.w-stats b{color:var(--pink)}

/* ---- MISSION TRACKER ---- */
.w-mission{left:16px;bottom:16px;width:300px;border:2px solid var(--line);background:rgba(12,8,20,.78);
  padding:16px;backdrop-filter:blur(4px)}
.wm-head{font-family:var(--tiny);font-size:10px;color:var(--neon);letter-spacing:1px;margin-bottom:10px}
.wm-title{font-family:var(--pixel);font-size:26px;line-height:1;color:var(--ink)}
.wm-desc{font-size:12px;color:var(--ink-soft);font-weight:700;margin:8px 0;line-height:1.5}
.wm-hint{font-size:12px;font-weight:700;color:var(--pink);min-height:18px}
.wm-hint b{color:var(--neon)}
.wm-progress{margin-top:8px;padding-top:10px;border-top:2px dashed var(--line);font-size:11px;font-weight:700;color:var(--ink-soft)}
.wm-progress b{color:var(--neon);font-family:var(--tiny);font-size:11px}

/* ---- CHAT ---- */
.w-chat{right:16px;top:16px;bottom:16px;width:330px;display:flex;flex-direction:column;
  border:2px solid var(--line);background:rgba(12,8,20,.82);backdrop-filter:blur(5px)}
.wc-head{font-family:var(--tiny);font-size:11px;padding:14px;border-bottom:2px solid var(--line);display:flex;align-items:center;gap:8px;color:var(--ink)}
.wc-head b{color:var(--neon)}
.wc-dot{width:9px;height:9px;border-radius:50%;background:var(--neon);box-shadow:0 0 10px var(--neon)}
.wc-badge{margin-left:auto;font-size:9px;color:var(--pink);border:2px solid var(--line);padding:4px 7px}
.wc-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.wc-log::-webkit-scrollbar{width:8px}.wc-log::-webkit-scrollbar-thumb{background:var(--line)}
.msg{max-width:86%;padding:9px 12px;font-size:13px;font-weight:700;line-height:1.45;border:2px solid var(--line)}
.msg.pet{align-self:flex-start;background:rgba(57,255,20,.07);color:var(--ink)}
.msg.pet b{color:var(--neon)}
.msg.me{align-self:flex-end;background:rgba(255,61,154,.10);border-color:rgba(255,61,154,.4);color:var(--ink)}
.msg.sys{align-self:center;font-family:var(--tiny);font-size:9px;color:var(--purple-2);border:0;background:none;text-align:center}
.wc-input{display:flex;border-top:2px solid var(--line)}
.wc-input input{flex:1;background:transparent;border:0;outline:0;color:var(--ink);font-family:var(--mono);font-weight:700;font-size:13px;padding:13px}
.wc-input input::placeholder{color:#6f648c}
.wc-input button{background:var(--neon);color:#08110a;border:0;padding:0 16px;font-size:10px}
.wc-input button:hover{box-shadow:0 0 16px rgba(57,255,20,.6)}

/* ---- HINT + MINIMAP ---- */
.w-hint{left:50%;transform:translateX(-50%);bottom:18px;font-size:11px;font-weight:700;color:var(--ink-soft);
  border:2px solid var(--line);background:rgba(12,8,20,.7);padding:9px 14px;backdrop-filter:blur(4px);white-space:nowrap}
.w-minimap{right:16px;bottom:16px;border:2px solid var(--line);background:rgba(12,8,20,.8);image-rendering:pixelated}

/* ---- speech bubble (world-space) ---- */
.w-bubble{position:fixed;z-index:6;transform:translate(-50%,-100%);pointer-events:none;
  font-size:12px;font-weight:700;color:#08110a;background:var(--neon);border:2px solid #0a3d0a;
  padding:7px 11px;max-width:230px;display:none;box-shadow:0 0 18px rgba(57,255,20,.5)}
.w-bubble::after{content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);
  border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--neon)}

/* ---- interact prompt ---- */
.w-prompt{left:50%;transform:translateX(-50%);bottom:64px;display:none;z-index:6;
  font-family:var(--tiny);font-size:12px;color:#08110a;background:var(--neon);padding:11px 16px;
  border:2px solid #0a3d0a;box-shadow:0 0 22px rgba(57,255,20,.5)}

/* ---- PET BATTLE ---- */
.battle{position:fixed;inset:0;z-index:20;display:none;align-items:center;justify-content:center;
  background:radial-gradient(800px 600px at 50% 30%,rgba(168,85,247,.25),rgba(8,5,14,.92))}
.battle-box{width:min(640px,94vw);border:2px solid var(--neon);background:linear-gradient(180deg,#16102a,#0c0816);
  box-shadow:0 0 50px rgba(57,255,20,.3);padding:22px}
.b-head{font-family:var(--tiny);font-size:15px;color:var(--neon);text-align:center;margin-bottom:18px;text-shadow:0 0 14px rgba(57,255,20,.5)}
.b-arena{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}
.b-side{text-align:center}
.b-side canvas{width:130px;height:130px;image-rendering:pixelated;border:2px solid var(--line);background:#0e0a1c}
.b-name{font-family:var(--pixel);font-size:22px;margin-top:8px;color:var(--ink)}
.b-hpbar{height:12px;border:2px solid var(--line);background:#0e0a1c;position:relative;overflow:hidden;margin:8px 0 4px}
.b-hpbar span{position:absolute;inset:0;width:100%;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 10px var(--neon);transition:width .3s}
.b-hpbar.foe span{background:linear-gradient(90deg,var(--pink),#ff8ac0)}
.b-hptxt{font-size:11px;font-weight:700;color:var(--ink-soft)}.b-hptxt b{color:var(--ink)}
.b-vs{font-family:var(--tiny);font-size:18px;color:var(--pink);text-shadow:0 0 12px rgba(255,61,154,.6)}
.b-log{height:88px;overflow-y:auto;border:2px solid var(--line);background:rgba(0,0,0,.3);margin:18px 0;padding:10px;
  font-size:12px;font-weight:700;color:var(--ink-soft);line-height:1.6}
.b-log::-webkit-scrollbar{width:7px}.b-log::-webkit-scrollbar-thumb{background:var(--line)}
.b-actions{display:flex;gap:12px;justify-content:center}
.b-actions button{flex:1;max-width:170px;font-family:var(--tiny);font-size:11px;padding:14px;border:2px solid var(--neon);
  background:transparent;color:var(--neon);cursor:pointer;transition:all .12s}
.b-actions button:hover:not(:disabled){background:var(--neon);color:#08110a;box-shadow:0 0 16px rgba(57,255,20,.5)}
.b-actions button:disabled{opacity:.35;cursor:not-allowed}
.b-actions button[data-move="special"]{border-color:var(--pink);color:var(--pink)}
.b-actions button[data-move="special"]:hover:not(:disabled){background:var(--pink);color:#08110a}
.b-actions button[data-move="guard"]{border-color:var(--purple-2);color:var(--purple-2)}
.b-close{display:none;width:100%;margin-top:14px;font-family:var(--tiny);font-size:12px;padding:14px;
  background:var(--neon);color:#08110a;border:0;cursor:pointer}

/* ---- toast (level up etc) ---- */
.w-toast{position:fixed;left:50%;top:96px;transform:translateX(-50%);z-index:7;font-family:var(--tiny);font-size:12px;
  color:#08110a;background:var(--neon);padding:12px 18px;border:2px solid #0a3d0a;display:none;box-shadow:0 0 24px rgba(57,255,20,.6)}

@media(max-width:880px){
  .w-chat{width:250px}.w-mission{width:230px}
  .w-petcard .w-bar{width:130px}
}
@media(max-width:600px){
  .w-chat{display:none}.w-minimap{display:none}.w-hint{font-size:10px;white-space:normal;width:200px;text-align:center}
}
