/* FX Calculator — scoped dark styles */
    #fx-calculator { font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }
    #fx-calculator h2 { margin:0 0 0.5rem 0; font-size:1.3rem; font-weight:600; }
    #fx-calculator p.lead { margin:0 0 1rem 0; font-size:0.95rem; }

    .fx-grid { display:grid; grid-template-columns: 1fr; gap:0.75rem; }
    @media(min-width:800px){ .fx-grid { grid-template-columns: 1fr 1fr; } }

    .field { display:flex; flex-direction:column; gap:0.35rem; }
    .field label { font-weight:600; font-size:0.9rem; }
    .field input[type="number"],
    .field input[type="text"],
    .field input[type="date"],
    .field select,
    .field textarea { 
      padding:0.6rem 0.75rem; 
      border-radius:8px; 
      border:1px solid #333; 
      background:#0b0b0b; /* dark field background */
      color: white;
      font-size:0.95rem; 
      box-shadow: none;
    }
    .field input::placeholder,
    .field textarea::placeholder { color:#7d7d7d; }

    .small { font-size:0.85rem; color:#bdbdbd; margin-top:0.25rem; }

    .btn { 
      display:inline-block; 
      padding:0.7rem 1rem; 
      border-radius:8px; 
      border:1px solid #1f6feb; 
      background:#111; 
      color:white;
      cursor:pointer; 
      font-weight:700;
    }
    .btn.ghost { border-color:#444; opacity:0.95; }
    .btn[disabled] { opacity:0.6; cursor:not-allowed; }

    .panel { padding:0.9rem; border-radius:10px; border:1px solid #222; }
    .row { display:flex; gap:0.6rem; align-items:center; flex-wrap:wrap; }

    .results { margin-top:0.75rem;  font-size:0.95rem; line-height:1.45; }
    .error { color:#ff8b8b; font-weight:700; }
    .warning { color:#ffd98a; font-weight:700; }
    .rate-source { font-size:0.8rem; color:#a8a8a8; margin-top:0.5rem; }

    .input-invalid { outline: 2px solid rgba(255,80,80,0.12); border-color:#5a1f1f; }
    .input-valid { outline: 2px solid rgba(76,175,80,0.06); }

    .section-title { margin-top:1rem; margin-bottom:0.5rem; font-weight:700;  }
    /* small helpers */
    .muted { color:#bdbdbd; font-size:0.88rem; }
    textarea { min-height:90px; }