body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background:#f5f8fb; }
  .fade-in { animation: fadeIn .25s ease; }
  @keyframes fadeIn { from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:translateY(0)} }
  .hidden { display:none !important; }
  .nav-item { display:flex; align-items:center; gap:.65rem; padding:.65rem .85rem; border-radius:.75rem; font-weight:600; font-size:.85rem; color:#475569; transition:all .15s ease; cursor:pointer; }
  .nav-item:hover { background:#e0f2fe; color:#0369a1; }
  .nav-item.active { background:linear-gradient(135deg, #0ea5e9, #0284c7); color:#fff; box-shadow:0 4px 12px rgba(14,165,233,.25); }
  .card { background:#fff; border:1px solid #e2e8f0; border-radius:1rem; padding:1.25rem; }
  .btn-primary { background:#0ea5e9; color:#fff; font-weight:700; padding:.65rem 1.1rem; border-radius:.75rem; transition:.15s; cursor:pointer; }
  .btn-primary:hover { background:#0284c7; }
  .btn-primary:disabled { opacity:.5; cursor:not-allowed; }
  .btn-danger { background:#dc2626; color:#fff; font-weight:700; padding:.65rem 1.1rem; border-radius:.75rem; cursor:pointer; }
  .btn-danger:hover { background:#ef4444; }
  input, select, textarea { outline:none; }
  .field-label { display:block; font-size:.68rem; font-weight:700; color:#64748b; text-transform:uppercase; letter-spacing:.02em; margin-bottom:.25rem; }
  .field-input { width:100%; border:1px solid #e2e8f0; background:#f8fafc; border-radius:.7rem; padding:.6rem .85rem; font-size:.875rem; font-weight:500; }
  .field-input:focus { background:#fff; border-color:#0ea5e9; box-shadow:0 0 0 3px rgba(14,165,233,.12); }
  .badge { display:inline-block; padding:.2rem .6rem; border-radius:999px; font-size:.65rem; font-weight:700; }
  .wizard-shell { background:linear-gradient(135deg,#f8fbff 0%,#eef8ff 35%,#f5f7ff 100%); border:1px solid #dbeafe; }
  .wizard-stepper { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:.5rem; }
  .wizard-step { border:1px solid #dbeafe; background:white; border-radius:.85rem; padding:.65rem .7rem; text-align:left; }
  .wizard-step.active { background:linear-gradient(135deg,#0ea5e9,#0369a1); border-color:#0369a1; color:white; box-shadow:0 8px 18px rgba(14,165,233,.22); }
  .wizard-step .step-index { display:inline-flex; width:1.5rem; height:1.5rem; align-items:center; justify-content:center; border-radius:999px; font-size:.72rem; font-weight:800; }
  .wizard-step:not(.active) .step-index { background:#e0f2fe; color:#0369a1; }
  .wizard-step.active .step-index { background:rgba(255,255,255,.18); color:white; }
  .wizard-card { background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); border:1px solid #dfeaf7; border-radius:1rem; }
  .hero-glow { background:radial-gradient(circle at top left, rgba(14,165,233,.16), transparent 45%), radial-gradient(circle at bottom right, rgba(14,165,233,.14), transparent 35%); }
  .usage-pie { width:128px; height:128px; border-radius:50%; background:conic-gradient(#0ea5e9 0 25%, #8b5cf6 25% 50%, #10b981 50% 75%, #f59e0b 75% 100%); }

  /* Thermal Receipt Print Styling */
  @media print {
    body.printing-thermal-receipt {
      background: #ffffff !important;
      margin: 0 !important;
      padding: 0 !important;
    }
    body.printing-thermal-receipt > *:not(#thermal-receipt-printable) {
      display: none !important;
      visibility: hidden !important;
    }
    body.printing-thermal-receipt #thermal-receipt-printable,
    body.printing-thermal-receipt #thermal-receipt-printable.hidden {
      display: block !important;
      visibility: visible !important;
      position: static !important;
      width: 78mm !important;
      max-width: 78mm !important;
      margin: 0 auto !important;
      padding: 6px !important;
      font-family: 'Courier New', Courier, monospace !important;
      color: #000000 !important;
      background: #ffffff !important;
      font-size: 11px !important;
      line-height: 1.35 !important;
    }
    body.printing-thermal-receipt #thermal-receipt-printable * {
      color: #000000 !important;
      visibility: visible !important;
    }

    /* User Guide Manual Print Styling */
    body.printing-manual {
      background: #ffffff !important;
      margin: 0 !important;
      padding: 0 !important;
    }
    body.printing-manual > *:not(#user-guide-modal) {
      display: none !important;
      visibility: hidden !important;
    }
    body.printing-manual #user-guide-modal {
      display: block !important;
      position: static !important;
      background: #ffffff !important;
      padding: 0 !important;
      inset: auto !important;
    }
    body.printing-manual #user-guide-modal .no-print {
      display: none !important;
    }
    body.printing-manual #user-guide-content,
    body.printing-manual #user-guide-content * {
      visibility: visible !important;
    }
    body.printing-manual #user-guide-content {
      display: block !important;
      position: static !important;
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
      padding: 10mm !important;
      background: #ffffff !important;
      color: #0f172a !important;
    }
  }

  @media (max-width: 767px) {
    .card { border-radius:.75rem; padding:1rem; }
    #view-container { padding-bottom:5.5rem; }
    .grid.grid-cols-2, .grid.grid-cols-3 { grid-template-columns:1fr; }
    .mobile-scroll-table { margin-left:-1rem; margin-right:-1rem; padding:0 1rem; }
    .document-builder-grid { grid-template-columns:1fr !important; }
    .document-builder-grid .template-control { flex-direction:column; align-items:stretch; }
    .document-builder-grid .template-control button { min-height:42px; }
    .line-item-grid { grid-template-columns:1fr 1fr 44px !important; }
    .line-item-grid .line-description { grid-column:span 2; }
    .line-item-grid .line-qty { grid-column:span 1; }
    .line-item-grid .line-price { grid-column:span 1; }
  }