[hidden] { display: none !important; }

:root {
  --ink: #173153;
  --muted: #6f8199;
  --line: #dbe7f5;
  --paper: #f3f7fc;
  --white: #ffffff;
  --green: #3978d4;
  --green-dark: #2459a7;
  --green-soft: #e8f2ff;
  --accent: #d9ebff;
  --shadow: 0 18px 55px rgba(45, 101, 173, 0.14);
}

body { background: #f3f7fc; }
.login-view {
  background: radial-gradient(circle at 15% 15%, #dcecff 0, transparent 28%), linear-gradient(135deg, #edf5ff, #f8fbff 60%, #e5f0fd);
}
.login-view::before {
  background-image: linear-gradient(rgba(57, 120, 212, 0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(57, 120, 212, 0.045) 1px, transparent 1px);
}
.login-card { box-shadow: 0 30px 90px rgba(45, 101, 173, 0.17); }
.brand-mark { box-shadow: 0 9px 20px rgba(57, 120, 212, 0.22); }
.primary { box-shadow: 0 7px 16px rgba(57, 120, 212, 0.2); }
.sidebar {
  z-index: 50;
  color: #173153;
  background: #e8f2ff;
  border-right: 1px solid #d4e4f7;
}
.logo-row span { color: #6f8199; }
.nav-item { color: #55708f; }
.nav-item:hover { background: rgba(255, 255, 255, 0.6); color: #2459a7; }
.nav-item.active { color: #2459a7; box-shadow: 0 8px 24px rgba(45, 101, 173, 0.1); }
.nav-icon { background: rgba(57, 120, 212, 0.08); }
.sidebar-foot { color: #6f8199; }
.security-note i,
.status-dot { background: #4f8df0; box-shadow: 0 0 0 4px #dcecff; }
.sidebar-foot .status-dot { box-shadow: 0 0 0 4px #d5e8ff; }
.topbar { background: #fbfdff; z-index: 40; }
.modal { z-index: 100; }
.query-card,
.result-card { border-color: #dbe7f5; }
.result-card { position: relative; z-index: 0; isolation: isolate; }
.table-wrap { position: relative; contain: paint; overscroll-behavior: contain; }
.picker-trigger { background: #f9fbff; border-color: #d6e3f2; }
.picker-trigger:hover { border-color: #7ea7dc; }
.option:hover,
.option.active { background: #e8f2ff; color: #2459a7; }
.option { color: #38516f; }
.modal-backdrop { background: rgba(19, 43, 75, 0.56); }
.toast { background: #214f8f; }
.price-hero { background: linear-gradient(110deg, #e7f2ff, #f7fbff); }
.matrix th { background: #edf4fc; z-index: 2; }
.matrix th:first-child { background: #deebfa; color: #2459a7; z-index: 3; }
.matrix td:first-child { background: #f5f9fe; color: #4f6682; z-index: 1; }

.picker-body { grid-template-columns: 56px 1fr 1fr 1.45fr 1.2fr; }
.picker-panel.single .picker-body { grid-template-columns: 56px 1fr 1fr 1.5fr; }
.picker-panel.single .selection-pane,
.picker-panel.single > footer { display: none; }
.draft-item small { display: block; color: #71807c; margin-top: 3px; }
.letter-rail { padding: 12px 7px; background: #f5f9fe; }
.letter-rail button {
  width: 34px;
  min-height: 24px;
  margin: 1px 0;
  border-radius: 7px;
  color: #58779d;
  font-size: 11px;
  font-weight: 700;
}
.letter-rail button:hover,
.letter-rail button.active { background: #dcecff; color: #2459a7; }
.letter-rail button:disabled { color: #b8c6d6; cursor: default; }
.brand-letter { color: #3978d4; }
.brand-scroll-spacer { width: 1px; min-height: 0; pointer-events: none; }
.nav-item { gap: 0; }
.empty-result h4 { margin-top: 0; }
.no-price-result { min-height: 260px; display: grid; place-items: center; }
.no-price-message { width: 100%; padding: 56px 24px; text-align: center; }
.no-price-message h4 { margin: 0; color: #38516f; font-size: 17px; font-weight: 700; }
@media(max-width:800px) { .nav-item span:last-child { display: inline; } }