:root{
  --tm-bg:#05070d; --tm-ink:#dbe6ff; --tm-dim:#7f8db3; --tm-line:rgba(122,162,255,.18);
  --tm-panel:rgba(10,14,26,.72); --tm-c2:#ff4d5e; --tm-atk:#ffb020; --tm-tgt:#38e1c2;
  --tm-mono:'Consolas','SF Mono','Roboto Mono',monospace;
  --tm-sans:'Segoe UI',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden;background:var(--tm-bg);color:var(--tm-ink);font-family:var(--tm-sans)}
#globe{position:fixed;inset:0;width:100vw;height:100vh;display:block;cursor:grab;touch-action:none}
#globe:active{cursor:grabbing}

.tm-back{position:fixed;top:16px;left:18px;z-index:5;color:var(--tm-dim);text-decoration:none;font:500 13px/1 var(--tm-mono);
  background:var(--tm-panel);border:1px solid var(--tm-line);padding:7px 11px;border-radius:8px;backdrop-filter:blur(6px)}
.tm-back:hover{color:var(--tm-ink);border-color:rgba(122,162,255,.4)}

.tm-head{position:fixed;top:56px;left:18px;z-index:4;max-width:min(420px,44vw);pointer-events:none}
.tm-head h1{font-size:1.5rem;font-weight:700;letter-spacing:.4px;text-shadow:0 0 18px rgba(56,225,194,.35)}
.tm-sub{margin-top:8px;font-size:.82rem;line-height:1.5;color:var(--tm-dim)}
.tm-updated{margin-top:8px;font:600 11px/1 var(--tm-mono);color:var(--tm-tgt);text-transform:uppercase;letter-spacing:1px}

.tm-stats{position:fixed;top:16px;right:18px;z-index:4;display:flex;gap:10px}
.tm-stat{background:var(--tm-panel);border:1px solid var(--tm-line);border-radius:10px;padding:9px 14px;text-align:center;min-width:70px;backdrop-filter:blur(6px)}
.tm-stat b{display:block;font:700 1.4rem/1 var(--tm-mono)}
.tm-stat span{font-size:.62rem;text-transform:uppercase;letter-spacing:1px;color:var(--tm-dim)}
.tm-stat.tm-c2 b{color:var(--tm-c2)}
.tm-stat.tm-atk b{color:var(--tm-atk)}

.tm-feed{position:fixed;top:96px;right:18px;z-index:4;width:min(310px,42vw);display:flex;flex-direction:column;gap:5px;pointer-events:none}
.tm-feed-row{background:var(--tm-panel);border:1px solid var(--tm-line);border-left:2px solid var(--tm-c2);border-radius:6px;
  padding:6px 10px;font:500 11.5px/1.35 var(--tm-mono);color:var(--tm-ink);backdrop-filter:blur(6px);
  display:flex;align-items:center;gap:8px;animation:tm-in .35s ease}
.tm-feed-row.atk{border-left-color:var(--tm-atk)}
.tm-feed-row .k{color:var(--tm-dim)}
.tm-feed-row .r{margin-left:auto;color:var(--tm-tgt)}
@keyframes tm-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

.tm-legend{position:fixed;left:18px;bottom:16px;z-index:4;max-width:min(430px,52vw);background:var(--tm-panel);
  border:1px solid var(--tm-line);border-radius:10px;padding:12px 14px;backdrop-filter:blur(6px)}
.tm-leg-row{display:flex;align-items:center;gap:8px;font-size:.78rem;margin-bottom:5px;color:var(--tm-ink)}
.tm-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 8px currentColor}
.tm-dot-c2{background:var(--tm-c2);color:var(--tm-c2)}
.tm-dot-atk{background:var(--tm-atk);color:var(--tm-atk)}
.tm-dot-tgt{background:var(--tm-tgt);color:var(--tm-tgt)}
.tm-attr{margin-top:8px;font-size:.68rem;line-height:1.5;color:var(--tm-dim)}
.tm-attr b{color:var(--tm-dim);font-weight:600}

.tm-panel{position:fixed;right:18px;bottom:16px;z-index:5;width:min(300px,80vw);background:var(--tm-panel);
  border:1px solid rgba(122,162,255,.32);border-radius:12px;padding:14px 16px;backdrop-filter:blur(8px);
  box-shadow:0 8px 40px rgba(0,0,0,.5)}
.tm-panel-x{position:absolute;top:8px;right:10px;background:none;border:none;color:var(--tm-dim);font-size:1.2rem;cursor:pointer;line-height:1}
.tm-panel-x:hover{color:var(--tm-ink)}
.tm-panel-kind{font:700 1.05rem/1.2 var(--tm-sans);margin-bottom:10px;padding-right:18px}
.tm-panel-tbl{width:100%;border-collapse:collapse;font:500 12px/1.4 var(--tm-mono)}
.tm-panel-tbl td{padding:4px 0;vertical-align:top}
.tm-panel-tbl td:first-child{color:var(--tm-dim);text-transform:uppercase;font-size:10px;letter-spacing:.5px;width:82px;white-space:nowrap}
.tm-panel-tbl td:last-child{color:var(--tm-ink);word-break:break-all;text-align:right}

@media (max-width:720px){
  .tm-head{max-width:60vw;top:52px}
  .tm-head h1{font-size:1.15rem}
  .tm-sub{display:none}
  .tm-feed{display:none}
  .tm-stat{min-width:56px;padding:7px 9px}
  .tm-legend{max-width:70vw}
  .tm-attr{font-size:.62rem}
}