/* Shared "Back to Console" button — consistent glassy modern pill across
   every OPTARIS page. Apply class="console-back" to an <a href="index.html">.
   Uses !important so it overrides each page's legacy back-link styling. */
.console-back {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 36px !important;
  padding: 0 16px 0 13px !important;
  border-radius: 999px !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  text-transform: none !important;
  text-decoration: none !important;
  color: #ffc869 !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(245, 166, 35, 0.28) !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 8px 24px -14px rgba(0, 0, 0, 0.6) !important;
  transition: transform .2s cubic-bezier(.2,.8,.2,1), background .2s, border-color .2s, color .2s !important;
  cursor: pointer;
}
.console-back svg { width: 15px; height: 12px; transition: transform .2s ease; }
.console-back:hover {
  transform: translateY(-1px);
  color: #ffd27a !important;
  border-color: rgba(245, 166, 35, 0.55) !important;
  background: rgba(245, 166, 35, 0.10) !important;
}
.console-back:hover svg { transform: translateX(-3px); }