/* Sidebar icons use the same clean visual language as the top systems. */
.client-toolbar button {
  border-color: #53616a;
  background: linear-gradient(145deg, #273138, #141b20);
  transition: border-color .14s ease, background .14s ease, transform .14s ease;
}

.client-toolbar button:hover {
  border-color: #83939d;
  background: linear-gradient(145deg, #344149, #1b252b);
  transform: translateX(-1px);
}

.client-toolbar button:active { transform: translateX(0); }

.side-glyph {
  position: relative;
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  box-sizing: border-box;
  color: #dce7ec;
  font-style: normal;
  line-height: 1;
}

.side-glyph-bag {
  width: 25px;
  height: 21px;
  margin-top: 5px;
  border: 2px solid #79c9ee;
  border-radius: 4px 4px 7px 7px;
  background: #163a4d;
  box-shadow: 0 0 6px #54bde866;
}
.side-glyph-bag::before { content:""; position:absolute; left:6px; top:-8px; width:9px; height:8px; border:2px solid #79c9ee; border-bottom:0; border-radius:5px 5px 0 0; }
.side-glyph-bag::after { content:""; width:7px; height:7px; border:2px solid #bcecff; border-radius:50%; }

.side-glyph-pokemon { width:26px; height:26px; border:2px solid #f07d72; border-radius:50%; background:linear-gradient(#b93e43 0 45%,#20272c 46% 55%,#f0eee6 56%); color:#fff; font:900 10px/1 Arial,sans-serif; text-shadow:0 1px #000; box-shadow:0 0 6px #e95d6266; }

.side-glyph-map { width:27px; height:25px; border:2px solid #6fd5aa; border-radius:3px; background:linear-gradient(90deg,#174637 0 32%,#d3bd55 33% 37%,#215a47 38% 65%,#d3bd55 66% 70%,#174637 71%); transform:skewY(-5deg); box-shadow:0 0 6px #52c99b55; }
.side-glyph-map em { width:7px; height:7px; border:2px solid #f1d86c; border-radius:50% 50% 50% 0; transform:rotate(-45deg) skewY(5deg); }

.side-glyph-helper { color:#9e89ff; font:900 29px/1 Georgia,serif; text-shadow:0 0 7px #8268ff; }

.side-glyph-analyzer { width:28px; height:25px; border-left:2px solid #71d6ef; border-bottom:2px solid #71d6ef; }
.side-glyph-analyzer em { width:22px; height:12px; border-top:3px solid #71d6ef; transform:skewY(-25deg); filter:drop-shadow(0 0 3px #4bc7e8); }

.side-glyph-health { width:26px; height:26px; border-radius:8px; background:#c94151; color:white; font:900 25px/25px Arial,sans-serif; box-shadow:0 0 7px #e44f6266; }

.side-glyph-shop { width:27px; height:22px; margin-top:5px; border:2px solid #e1bd5c; border-radius:2px; background:#4a3917; box-shadow:0 0 6px #d7ad4666; }
.side-glyph-shop::before { content:""; position:absolute; left:-3px; top:-9px; width:29px; height:8px; border-radius:4px 4px 2px 2px; background:repeating-linear-gradient(90deg,#e6c660 0 5px,#9b6827 5px 10px); }
.side-glyph-shop em { width:7px; height:10px; margin-top:8px; border:1px solid #e8cf79; }

.side-glyph-market { width:28px; height:25px; border:2px solid #efad58; border-radius:5px; background:#49321d; color:#ffd17e; font:900 21px/1 Arial,sans-serif; text-shadow:0 0 5px #e6943b; }

.side-glyph-npcs { width:27px; height:20px; border-radius:10px; background:#63cca0; color:#15362a; font:900 17px/10px Arial,sans-serif; letter-spacing:1px; box-shadow:0 0 6px #4bc08d66; }
.side-glyph-npcs::after { content:""; position:absolute; left:5px; bottom:-5px; border:5px solid transparent; border-top-color:#63cca0; transform:rotate(20deg); }

.side-glyph-depot { width:26px; height:23px; margin-top:4px; border:2px solid #b590e8; background:linear-gradient(135deg,#473762,#2d2440); box-shadow:0 0 6px #a476df66; }
.side-glyph-depot::before,.side-glyph-depot::after { content:""; position:absolute; background:#b590e8; }
.side-glyph-depot::before { left:11px; top:0; width:2px; height:100%; }
.side-glyph-depot::after { left:0; top:8px; width:100%; height:2px; }

.side-glyph-quest { display:flex; flex-direction:column; justify-content:center; gap:3px; width:25px; height:27px; padding:4px 4px 4px 8px; border:2px solid #e8d279; border-radius:3px; background:#4b401b; box-shadow:0 0 6px #d8be5666; }
.side-glyph-quest em { display:block; width:11px; height:2px; background:#f2df91; }
.side-glyph-quest em::before { content:"✓"; position:absolute; left:1px; color:#72d9a2; font:900 7px Arial,sans-serif; }