/* TLC Always Moving - dark mode look shared by every page (the deep violet used on the quote calculator):
   a near-black violet page, raised violet panels with soft borders, fields set into the panels.
   Only applies when <html data-theme="dark">; light mode is untouched. */
html:root[data-theme="dark"]{
  --line: #4b3b70;
  --field-line: #4b3b70;
  --card-line: #35294f;
  --app-bg: #120c1d;
  --card-shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 10px 28px -14px rgba(0, 0, 0, 0.7);
  --focus-ring: 0 0 0 3px rgba(167, 139, 250, 0.28);
}
html[data-theme="dark"] body{ background-color: var(--app-bg); background-image: none; }
html[data-theme="dark"] :is(.card, .panel, .bk-panel, .list-panel, .detail-panel, .detail-box, .result-card, .center-card, .left-panel, .dialog){
  border-color: var(--card-line) !important;
  border-radius: 12px;
  box-shadow: var(--card-shadow);
}
html[data-theme="dark"] :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus{
  outline: none;
  border-color: var(--amber);
  box-shadow: var(--focus-ring);
}