/* Trading Palace: user-supplied crowned skull, charcoal and antique gold. */
:root {
  --bg: #121414;
  --surface: #1b1e1d;
  --raised: #232722;
  --line: #363a32;
  --text: #eeeade;
  --muted: #aaa99f;
  --gold: #c5aa68;
  --red: #b18c50;
}
.sidebar { background: #171918; }
.brand { gap: 12px; padding: 0; font-size: 20px; letter-spacing: 2px; color: #dfc98f; }
.brand-bottom { font-size: 25px; letter-spacing: 3.6px; }
.brand-seal {
  display: block;
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 50%;
  border: 1px solid #8a7345;
  background: #24241d;
  box-shadow: 0 0 0 4px #c5aa6809;
}
.brand-seal img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.14); }
.mobile-brand { display: none; }
.side-rule { color: #ab9870; }
nav a:hover { background: #252820; }
nav a[aria-current=page] { background: linear-gradient(100deg, #373022, #26271f); border-color: #514832; color: #eee1be; }
nav a[aria-current=page] svg { color: var(--gold); }
.nav-count { background: #4b3e27; border-color: #705d37; color: #ead6a5; }
.community { color: #c0bdaf; }
.small-brand, footer span { color: #99988d; }
.side-user img, .top-avatar img { border-color: #756441; }
.topbar, footer { border-color: #2d312b; }
.breadcrumb span { color: #777b70; }
.breadcrumb strong { color: #dbd9cc; }
.preview-pill { background: #28261d; border-color: #50472e; }
.demo-note { background: #21221b; border-color: #363627; color: #b7b5a5; }
.demo-note strong { color: #d8d0b5; }
.stat.gold { background: linear-gradient(105deg, #2b2a20, #20231d); border-color: #504a32; }
.stat-label { color: #c4c3b7; }
.stat-detail { color: #aaa99f; }
.tab[aria-pressed=true] { background: #353124; border-color: #5b5033; color: #ebdbaf; }
.tab span { color: #baa77d; }
.search svg, .search input::placeholder { color: #999e91; }
.search input { background: #151816; border-color: #414638; }
th { background: #171b18; color: #aaa99f; }
td { border-color: #30362d; }
tbody tr:hover { background: #232820; }
.item-icon, .game-item-emoji { background: #242820; border-color: #414a36; }
.item-icon.gold-icon { background: #29271e; border-color: #514830; }
.game-item-art { background: transparent; border-color: transparent; }
.game-item-art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.detail-item-art { width: 112px; height: 112px; margin: 17px 0 11px; }
.item-title { color: var(--text); }
.order-id, .qty-sub, .deadline small, .table-foot { color: #aaa99f; }
.deadline { color: #ccc9bb; }
.badge.completed { color: #b9bbb0; background: #2a2e27; border-color: #444a3d; }
.detail-button { border-color: #474e3e; color: #bfc2b4; }
.detail-button:hover { background: #423c28; border-color: #867244; }
.lower-note { color: #aaa99f; }
.lower-note svg { color: var(--gold); }
.lower-note strong { color: #d9d1b5; }
footer { color: #b29c70; }
.progress { background: #33352a; }
.progress span { background: linear-gradient(90deg, #857044, #c5aa68); }
.action-link { border-color: #7a683f; background: #393322; color: #ddc48b; }
.profile-art { border-color: #5d573e; }
.profile-art figcaption { background: linear-gradient(transparent, #131713 60%); }
.gear-card:hover { border-color: #9a8452; }
.gear-art { border-color: #5d573e; background: #27281e; }
.gear-card p { color: #b9baad; }
.portrait-card { border-color: #4b4e3d; }
.active-portrait { background: #22271ee8; color: #e2d0a1; }
dialog { background: #1e231e; border-color: #655b3b; }
dialog::backdrop { background: #080b08cc; }
.close-dialog { background: #2b3227; border-color: #4c5744; }
.detail-note { color: #cfc8af; background: #2d2c1f; border-color: #4e492e; }
@media (max-width: 1150px) {
  .brand { font-size: 18px; gap: 10px; }
  .brand-bottom { font-size: 23px; letter-spacing: 3px; }
  .brand-seal { width: 44px; height: 44px; }
}
@media (max-width: 760px) {
  .sidebar { background: #171c17f5; border-color: #414a35; }
  nav a[aria-current=page] { background: #303023; }
  .breadcrumb { display: none; }
  .mobile-brand { display: flex; align-items: center; gap: 10px; font: 17px var(--serif); color: #dfc98f; }
  .mobile-brand .brand-seal { width: 38px; height: 38px; }
  tr { border-color: #30362d; }
}
@media (max-width: 380px) {
  .preview-pill { display: none; }
}
