body {
      font-family: 'Inter', sans-serif;
    }
    /* Custom Scrollbar */
    ::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    ::-webkit-scrollbar-track {
      background: #f1f1f1;
      border-radius: 4px;
    }
    ::-webkit-scrollbar-thumb {
      background: #cbd5e1;
      border-radius: 4px;
    }
    ::-webkit-scrollbar-thumb:hover {
      background: #94a3b8;
    }
    @media print {
      #printable-invoice {
        display: block !important;
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        padding: 0;
        color: #111;
        background: white;
        font: 12pt/1.4 Arial, sans-serif;
        visibility: visible;
      }
      body > *:not(#printable-invoice) { display: none !important; }
      #printable-invoice * { visibility: visible; }
      .receipt { max-width: 720px; margin: 0 auto; padding: 24px; }
      .receipt-header { text-align: center; margin-bottom: 24px; }
      .receipt-header h1 { margin: 0 0 6px; font-size: 20pt; }
      .receipt-header p { margin: 3px 0; }
      .receipt table { width: 100%; border-collapse: collapse; }
      .receipt th, .receipt td { padding: 8px 4px; border-bottom: 1px solid #bbb; text-align: left; }
      .receipt th:last-child, .receipt td:last-child { text-align: right; }
      .receipt-total { display: flex; justify-content: space-between; margin-top: 18px; padding-top: 12px; border-top: 2px solid #111; font-size: 16pt; }
      .receipt-payment, .receipt-note, .receipt-thanks { text-align: center; margin-top: 18px; }
      .receipt-note { font-size: 9pt; }
      @page { margin: 12mm; }
    }

    /* Ajustes de pantallas pequeñas: evita desbordamientos y conserva controles táctiles. */
    *, *::before, *::after { box-sizing: border-box; }
    html { -webkit-text-size-adjust: 100%; }
    body { min-width: 320px; overflow-x: hidden; }
    img { max-width: 100%; }
    button, input, select, textarea { font: inherit; }
    button { touch-action: manipulation; }
    main { min-width: 0; }
    .overflow-x-auto { -webkit-overflow-scrolling: touch; }

    /* Panel del administrador */
    .admin-welcome {
      background: radial-gradient(ellipse at 92% 0%, rgba(245, 158, 11, .28), transparent 38%),
        linear-gradient(125deg, #064e3b 0%, #065f46 58%, #0f766e 100%);
    }
    .admin-section-select { color: #fff; background-color: rgba(255, 255, 255, .1); }
    .admin-section-select option { color: #0f172a; background: #fff; }
    .admin-pane > section, .admin-pane > .grid > div,
    #admin-pane-dashboard > section { scroll-margin-top: 1rem; }
    #role-admin .admin-pane > section,
    #role-admin .admin-pane > .grid > div,
    #role-admin .admin-pane > .grid > div > div {
      transition: box-shadow .18s ease, transform .18s ease;
    }
    #role-admin .overflow-x-auto { border: 1px solid #eef2f7; border-radius: .8rem; }
    #role-admin table thead th { white-space: nowrap; }
    #role-admin table thead button { min-height: 2.25rem; }

    @media (max-width: 767px) {
      header { position: sticky; top: 0; }
      header .max-w-7xl > .flex {
        height: auto;
        min-height: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .65rem;
        padding-top: .65rem;
        padding-bottom: .65rem;
      }
      header .max-w-7xl > .flex > :first-child { min-width: 0; }
      #header-resto-name { max-width: 58vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      header .max-w-7xl > .flex > .bg-emerald-900 {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
        justify-content: flex-start;
        scrollbar-width: thin;
      }
      .role-nav-btn { flex: 0 0 auto; min-height: 40px; }
      header .max-w-7xl > .flex > :last-child { justify-self: end; }
      #app-container main { padding: .75rem; }
      #role-admin { gap: 1rem; }
      .admin-welcome { border-radius: 1.25rem; padding: 1.15rem; }
      #admin-section-menu { min-height: 46px; }
      #products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
      #products-grid > * { min-width: 0; }
      #cart-items, #billing-orders-list { max-height: min(55vh, 420px); }
      #toast-container { left: .75rem; right: .75rem; bottom: .75rem; }
      #toast-container > * { max-width: 100%; }
      .overflow-x-auto table { min-width: 560px; }
      input, select, textarea { max-width: 100%; }
    }

    @media (max-width: 480px) {
      #login-screen { align-items: flex-start; padding: .75rem; }
      #login-screen > div { border-radius: 1.25rem; }
      #login-screen > div > div { padding: 1.25rem; }
      #login-resto-title { font-size: 1.35rem; overflow-wrap: anywhere; }
      #products-grid { grid-template-columns: minmax(0, 1fr); }
      #role-admin .grid.grid-cols-2 { grid-template-columns: minmax(0, 1fr); }
      #role-pedido .cat-btn { padding: .55rem .75rem; font-size: .75rem; }
      #app-container main { padding: .6rem; }
      .rounded-2xl { scroll-margin-top: 1rem; }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    }