/* Match the public site's charcoal and muted blue without changing warning colors. */
@media screen {
  :root {--shadow:0 2px 8px #21323c06;--shadow-lift:0 6px 20px #21323c0c}
  .btn.btn-amber {background:#426875;color:#fff;box-shadow:none}
  .btn.btn-amber:hover {background:#34545f}
  .btn,.case-row {transition:background-color .15s,border-color .15s,box-shadow .15s}
  .btn:hover,.case-row:hover,.btn:active {transform:none}
  .btn {min-height:46px}
  .btn:disabled {opacity:.55;cursor:not-allowed}
  .field label,#appView .field label,#view-new .model-qty-field label {font-size:14px;letter-spacing:0;text-transform:none;font-weight:650;color:#34545f}
  .field input,.field select,.field textarea,#view-new .field input,#view-new .field select,#view-new .field textarea,#view-new .model-qty-field input {font-family:var(--font-b);font-size:16px;border-color:#b4c6cd;background:#fff;min-height:48px;height:auto;line-height:1.5}
  .field input[type=checkbox],.field input[type=radio] {min-height:20px}
  .field input::placeholder,.field textarea::placeholder {color:#687b82;opacity:1}
  .field {margin-bottom:20px}
  .card {border-color:#d5dfe2;box-shadow:var(--shadow)}
  #view-new .order-step {--step-color:#426875;--step-soft:#edf3f5;background:#f3f7f8;border-color:#d5dfe2}
  #view-new .drop {border-color:#9db3bd;background:#f3f7f8}
  #view-new .drop:hover {border-color:#426875;background:#edf3f5}
  #view-new .upload-icon {background:#e4eef1;color:#426875;border-color:#d5dfe2}
  #view-new #ncSubmit {background:#426875;color:white;box-shadow:none}
  #view-new #ncSubmit:hover {background:#34545f}
  #view-new .field input:focus,#view-new .field select:focus,#view-new .field textarea:focus {border-color:#426875;outline:3px solid #426875;outline-offset:3px}
  .topbar h2 {font-weight:650;letter-spacing:-.035em}
  .section-h h3 {font-size:14px;letter-spacing:.02em}
  .section-h {gap:14px;flex-wrap:wrap}
  .ordering-context {border-left-color:#426875;box-shadow:none}
  .case-tag {background:#edf3f5;color:#34545f;letter-spacing:.02em}
  .case-name {font-size:17px}
  .case-app {font-size:14px}
  .case-row {box-shadow:none}
  .case-row:hover {border-color:#9db3bd;box-shadow:var(--shadow)}
  .nav-btn {min-height:44px}
  .rail .nav-btn.on {background:#34545f;color:#fff}
  .list-toolbar input,.list-toolbar select {min-height:46px;max-width:100%;font-size:16px}
  .login-card {box-shadow:0 20px 60px #10202735;border-radius:20px}
  .login-actions button,.btn-link,.password-toggle {min-height:44px}
  .monthly-billing {font-family:var(--font-b);line-height:1.6}
  .monthly-billing h2 {font-size:28px;letter-spacing:-.035em}
  .monthly-billing p,.monthly-billing label {font-size:15px}
  .monthly-billing small {font-size:13px}
  .monthly-billing button {font-family:inherit;min-height:46px}
  .monthly-billing .billing-invoice {padding:20px;border-radius:14px;gap:16px}
  .monthly-billing .billing-invoice>span:last-child {text-align:right;margin-left:auto}
  .monthly-billing .billing-invoice>span:last-child>b {font-size:21px;font-variant-numeric:tabular-nums}
  .monthly-billing .billing-dialog {padding:26px;scrollbar-gutter:stable}
  .monthly-billing .billing-actions {justify-content:flex-start}
  .monthly-billing .billing-actions p {flex-basis:100%}
  button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[role=button]:focus-visible {outline:3px solid #426875;outline-offset:3px}
  .rail button:focus-visible {outline-color:#b7d0d8}
  @media(max-width:600px) {
    .card {padding:20px 16px}
    .login-card {padding:30px 24px}
    .topbar h2 {font-size:27px}
    .ordering-context {flex-wrap:wrap}
    .ordering-context .oc-lock {white-space:normal}
    .list-toolbar {gap:8px}
    .list-toolbar select {flex:1 1 150px}
    .monthly-billing .billing-dialog {padding:18px}
    .monthly-billing .billing-invoice {flex-wrap:wrap;padding:16px}
    .monthly-billing .billing-invoice>span:first-child {flex-basis:100%;overflow-wrap:anywhere}
    .monthly-billing .billing-invoice>span:last-child {text-align:left;margin-left:0}
    .monthly-billing .billing-actions>button {flex:1 1 140px}
  }
  @media(prefers-reduced-motion:reduce) {.btn,.case-row {transition:none!important}}
}