:root {
  color-scheme: dark;
  --bg: #162e42 !important;
  --bg-soft: #0e2233 !important;
  --surface: rgba(24, 107, 139, .76) !important;
  --surface-2: rgba(30, 138, 175, .46) !important;
  --line: rgba(135, 184, 204, .42) !important;
  --line-strong: rgba(167, 212, 232, .72) !important;
  --text: #fff !important;
  --muted: rgba(255, 255, 255, .55) !important;
  --purple: #79c2de !important;
  --purple-2: #54879b !important;
  --green: #3aaa35 !important;
  --red: #cc2200 !important;
  --yellow: #fdcc04 !important;
  --gold1: #d7ffff !important;
  --gold2: #79c2de !important;
  --gold: linear-gradient(180deg, #d7ffff, #87c5dd) !important;
  --shadow: 0 4px 18px rgba(0, 0, 0, .38) !important;
  --radius: 8px !important;
  --gt-bg-dark: #162e42;
  --gt-bg-darker: #0e2233;
  --gt-border: #87b8cc;
  --gt-button: #79c2de;
  --gt-tab: #54879b;
  --gt-spotlight: #1e8aaf;
}

* { scrollbar-color: #54879b #0e2233; }

html, body {
  font-family: "Century Gothic", CenturyGothic, "Apple Gothic", Futura, "Trebuchet MS", sans-serif !important;
}

body {
  color: #fff !important;
  background: linear-gradient(180deg, #1d4460 0, #162e42 34%, #0e2233 100%) fixed !important;
  font-weight: 700;
}

body::before {
  opacity: .13 !important;
  background-image:
    radial-gradient(circle at 15% 10%, rgba(121, 194, 222, .22), transparent 28rem),
    linear-gradient(rgba(135, 184, 204, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(135, 184, 204, .035) 1px, transparent 1px) !important;
  background-size: auto, 32px 32px, 32px 32px !important;
}

body::after { display: none !important; }

.shell {
  max-width: 1148px !important;
  padding: 16px !important;
}

.glass,
.panel-card,
.wide-card,
.players-card,
.card,
.search-card,
.results-card,
.lua-library,
.lua-docs {
  background: linear-gradient(180deg, rgba(29, 68, 96, .96), rgba(14, 34, 51, .96)) !important;
  border: 3px solid rgba(135, 184, 204, .62) !important;
  border-radius: 9px !important;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, .55), inset 0 1px rgba(255, 255, 255, .08) !important;
  backdrop-filter: none !important;
}

.app-layout { grid-template-columns: 220px minmax(0, 1fr) !important; gap: 16px !important; }
.sidebar { top: 16px !important; height: calc(100vh - 32px) !important; padding: 12px 8px !important; border-radius: 10px !important; }
.sidebar-brand { padding: 6px 8px 14px !important; margin-bottom: 8px !important; border-bottom: 2px solid rgba(135,184,204,.18) !important; }
.brand-mark { background: #1e8aaf !important; border: 3px solid #87b8cc !important; border-radius: 8px !important; box-shadow: 2px 2px #000 !important; }
.brand-name, .sidebar-brand strong { color: #fff !important; background: none !important; -webkit-text-fill-color: currentColor !important; text-shadow: 0 0 14px rgba(121,194,222,.7); }
.brand-name small, .sidebar-brand span { color: rgba(255,255,255,.55) !important; }

.nav-label { color: rgba(255,255,255,.30) !important; padding: 4px 10px !important; }
.side-nav { gap: 3px !important; }
.side-nav button,
.side-nav .studio-nav-link {
  min-height: 36px;
  padding: 8px 10px !important;
  border: 2px solid transparent !important;
  border-radius: 7px !important;
  color: rgba(255,255,255,.63) !important;
  font-size: 12px !important;
  transition: filter 80ms, transform 80ms !important;
}
.side-nav button:hover,
.side-nav button.active,
.side-nav .studio-nav-link:hover {
  padding-left: 10px !important;
  color: #fff !important;
  background: #1e8aaf !important;
  border-color: #87b8cc !important;
  box-shadow: 2px 2px #000, inset 0 2px 5px rgba(0,0,0,.45) !important;
}
.sidebar-bottom { border-top: 2px solid rgba(135,184,204,.18) !important; }
.avatar { background: #54879b !important; border: 3px solid #87b8cc !important; color: #fff !important; border-radius: 50% !important; box-shadow: 2px 2px #000 !important; }

.topbar, .page-head { margin-bottom: 16px !important; }
.topbar h1, .page-head h1, h1 { font-size: 1.25rem !important; font-weight: 900 !important; }
.eyebrow { color: #79c2de !important; font-size: .65rem !important; text-shadow: none !important; }
.topbar p, .page-sub, .sub { color: rgba(255,255,255,.55) !important; }

.btn,
.nav-link,
.logout-btn,
.remote-btn,
.license-help-btn,
.lua-mini-btn,
.lua-doc-detail button {
  min-height: 32px;
  padding: 4px 10px;
  border: 0 !important;
  border-radius: 6px !important;
  background: #79c2de !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #000 !important;
}
.btn:hover, .nav-link:hover, button:hover { filter: brightness(1.18); transform: none; }
.btn:active, button:active { transform: translate(1px, 1px); box-shadow: 1px 1px #000 !important; }
.btn-danger, .danger, .logout-btn, .remote-btn { background: #cc2200 !important; }
.btn-success { background: #3aaa35 !important; }
.btn-soft { background: #54879b !important; }
.btn-primary { background: linear-gradient(180deg, #a5e3fb, #79c2de) !important; color: #fff !important; }

input, select, textarea,
.search, .lua-search, .lua-code {
  color: #fff !important;
  background: rgba(135, 184, 204, .16) !important;
  border: 3px solid #87b8cc !important;
  border-radius: 7px !important;
  box-shadow: inset 0 1px 4px rgba(0,0,0,.4) !important;
  font-family: inherit;
  font-weight: 700;
}
input:focus, select:focus, textarea:focus {
  border-color: #d7ffff !important;
  box-shadow: 0 0 0 2px rgba(121,194,222,.22), inset 0 1px 4px rgba(0,0,0,.4) !important;
}
input::placeholder, textarea::placeholder { color: rgba(255,255,255,.40) !important; }

.notice, .item-shelf, .server-status, .world-group, .player, .remote-details,
.lua-version-row, .lua-doc-detail, .totp-secret, .table-wrap {
  background: rgba(14, 34, 51, .72) !important;
  border-color: rgba(135,184,204,.30) !important;
  border-radius: 7px !important;
}
.notice { border-width: 2px !important; }
.notice-icon, .icon-tile, .world-orb { background: #1e8aaf !important; color: #fff !important; border-color: #87b8cc !important; }

.stat-grid { gap: 10px !important; margin-bottom: 10px !important; }
.stat-card, .stat { padding: 14px !important; border-radius: 8px !important; }
.stat-card span, .stat span { color: rgba(255,255,255,.55) !important; font-size: .68rem !important; }
.stat-card strong, .stat b { font-size: 1.45rem !important; }
.section-grid { gap: 10px !important; margin-bottom: 10px !important; }
.panel-card, .wide-card, .players-card, .card, .search-card, .results-card { padding: 16px !important; }
.panel-card h2, .wide-card h2, .card h2, .search-card h2, .results-card h2 { font-size: .9rem !important; }

table { font-size: 12px !important; }
th { background: rgba(84, 135, 155, .48) !important; color: rgba(255,255,255,.70) !important; }
th, td { padding: 10px 12px !important; border-bottom: 1px solid rgba(135,184,204,.16) !important; }
tbody tr:hover { background: rgba(121,194,222,.08) !important; }

.badge, .live-pill, .live-state, .presence, .world-count, .balance-pill {
  border-radius: 6px !important;
  box-shadow: none !important;
}
.live-pill, .live-state { background: rgba(58,170,53,.16) !important; border: 2px solid rgba(58,170,53,.45) !important; color: #baf4b7 !important; }

.login-wrap { min-height: calc(100vh - 32px) !important; }
.login-card { width: min(100%, 390px) !important; padding: 24px !important; border: 4px solid #87b8cc !important; border-radius: 10px !important; background: linear-gradient(180deg,#1d4460,#0e2233) !important; box-shadow: 4px 4px #000 !important; }
.login-card::after { display: none !important; }
.login-card h1 { font-size: 1.3rem !important; }
.login-card .field input { height: 40px !important; }

.lua-editor-shell, .lua-highlight { background: #0e2233 !important; border-color: rgba(135,184,204,.35) !important; }
.lua-line-numbers { background: #132637 !important; color: #5e8a9e !important; }
.lua-editor-toolbar { background: #1d4460 !important; border-color: rgba(135,184,204,.35) !important; }
.lua-token-keyword { color: #79c2de !important; }
.lua-token-function { color: #c3d6ff !important; }
.lua-token-string { color: #87d9a0 !important; }
.lua-token-number { color: #f4c87a !important; }
.lua-token-comment { color: #5e8a9e !important; }

img { image-rendering: pixelated; }

@media (max-width: 1150px) {
  .shell { max-width: 100% !important; }
}
@media (max-width: 650px) {
  .shell { padding: 10px !important; }
  .panel-card, .wide-card, .players-card, .card, .search-card, .results-card { padding: 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
