/* FX580VN v2.2 color-correct */
:root{
  --fx-body-bg:#0b0b0f;
  --fx-border:#1f2330;
  --fx-key-bg:#000000;   /* functional keys bg */
  --fx-key-text:#ffffff; /* functional keys text */
  --fx-num-bg:#ffffff;   /* numeric keys bg */
  --fx-num-text:#000000; /* numeric keys text */
  --fx-del-bg:#b91c1c;
  --fx-ac-bg:#1e3a8a;
  --fx-screen-bg:#ffffff;
  --fx-screen-text:#111827;
  --fx-shadow:0 10px 20px rgba(0,0,0,.35);
}
.fx580vn-wrapper{display:grid;place-items:center;margin:22px 0;}
.fx580vn{background:var(--fx-body-bg);color:#fff;border:1px solid var(--fx-border);border-radius:16px;padding:14px;width:100%;max-width:360px;box-shadow:var(--fx-shadow);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;}
.fx580vn-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.fx580vn-brand{letter-spacing:1px;font-weight:700;}
.fx580vn-controls{display:flex;gap:8px;}
.fx-btn-mini{font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid var(--fx-border);background:#000;color:#fff;cursor:pointer;}
.fx580vn-screen{background:var(--fx-screen-bg);color:var(--fx-screen-text);border:1px solid #cfd4dc;border-radius:12px;padding:10px 12px;margin-bottom:12px;min-height:96px;display:grid;grid-template-rows:auto auto;gap:6px;}
.fx580vn-screen .top{color:#374151;text-align:right;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:16px;white-space:nowrap;overflow-x:auto;}
.fx580vn-screen .bot{color:var(--fx-screen-text);text-align:right;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:28px;font-weight:700;}
.fx-keys{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.fx-key{padding:12px 8px;border-radius:12px;text-align:center;cursor:pointer;user-select:none;font-weight:700;border:1px solid #fff;transition:filter .12s, transform .02s;}
.fx-key.func{background:var(--fx-key-bg);color:var(--fx-key-text);border-color:#ffffff;}
.fx-key.num{background:var(--fx-num-bg);color:var(--fx-num-text);border-color:#cccccc;}
.fx-key.del{background:var(--fx-del-bg);color:#fff;border-color:#ef4444;}
.fx-key.ac{background:var(--fx-ac-bg);color:#fff;border-color:#3b82f6;}
.fx-key.tiny{font-size:12px;font-weight:600;}
.fx-key:active,.fx-key.active{filter:brightness(1.15);transform:translateY(1px);}
