/* e-OCI Wallet — Emergency Card (medical-ID style) */
#emergencyScreen{ position:fixed; inset:0; z-index:9270; display:none; flex-direction:column;
  background:var(--app-bg,#060F22); font-family:"Space Grotesk",system-ui,sans-serif; color:var(--txt,#EAF0FA); }
body.emg-open #emergencyScreen{ display:flex; }
body.emg-open .app{ filter:blur(3px); pointer-events:none; }

.emg-top{ display:flex; align-items:center; gap:10px; padding:calc(env(safe-area-inset-top) + 16px) 16px 12px; }
.emg-top .emg-back{ display:flex; align-items:center; gap:7px; font-size:15px; font-weight:500; padding:9px 13px 9px 10px; border-radius:12px;
  background:var(--surface,rgba(255,255,255,.06)); border:1px solid var(--line,rgba(255,255,255,.1)); }
.emg-top .emg-title{ flex:1; font-size:18px; font-weight:600; }
.emg-top .emg-edit{ padding:9px 15px; border-radius:12px; font-size:14px; font-weight:600; background:var(--surface); border:1px solid var(--line); color:var(--txt); }
.emg-body{ flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; }

/* view */
.emg-hero{ background:linear-gradient(135deg,#E5484D,#a71f24); padding:28px 22px 24px; text-align:center; }
.emg-hero .cross{ width:46px; height:46px; margin:0 auto 10px; display:grid; place-items:center; border-radius:12px; background:rgba(255,255,255,.18); }
.emg-hero .cross svg{ width:26px; height:26px; color:#fff; }
.emg-hero .kick{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.9); }
.emg-hero h2{ font-size:26px; font-weight:700; margin:9px 0 5px; color:#fff; letter-spacing:-.3px; }
.emg-hero .oci{ font-size:13px; color:rgba(255,255,255,.92); }
.emg-blood{ display:flex; align-items:center; justify-content:center; gap:14px; padding:18px; border-bottom:1px solid var(--line); }
.emg-blood .bg{ font-size:34px; font-weight:700; color:#F16A6E; line-height:1; }
.emg-blood .lbl{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted,#7C8BA5); }
.emg-sec{ padding:16px 22px; border-bottom:1px solid var(--line); }
.emg-sec h3{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--saffron-soft,#FFB865); margin:0 0 8px; }
.emg-sec p{ margin:0; font-size:15px; line-height:1.55; color:var(--head,#B9C7E0); white-space:pre-line; }
.emg-contact{ display:flex; align-items:center; gap:14px; padding:14px 22px; border-bottom:1px solid var(--line); text-decoration:none; color:var(--txt); }
.emg-contact .ic{ width:46px; height:46px; border-radius:50%; flex:0 0 auto; display:grid; place-items:center;
  background:rgba(19,136,8,.16); border:1px solid rgba(120,220,110,.4); color:#8fdc86; }
.emg-contact .meta{ flex:1; min-width:0; } .emg-contact .meta b{ display:block; font-size:16px; } .emg-contact .meta span{ font-size:12.5px; color:var(--muted); }
.emg-contact .call{ color:#8fdc86; font-size:13px; font-weight:600; }
.emg-foot{ padding:22px; text-align:center; font-size:12px; color:var(--muted); line-height:1.5; }

/* editor */
.emg-form{ padding:16px 22px 44px; }
.emg-field{ margin-bottom:14px; }
.emg-field label{ display:block; font-size:12px; color:var(--head); margin:0 0 7px 3px; }
.emg-field input,.emg-field textarea{ width:100%; padding:13px 14px; border-radius:13px; font-size:16px; color:var(--txt);
  background:var(--surface); border:1px solid var(--line); font-family:inherit; }
.emg-field input:focus,.emg-field textarea:focus{ outline:none; border-color:var(--saffron); }
.emg-field textarea{ min-height:66px; resize:vertical; }
.emg-ce .row{ display:flex; gap:8px; margin-bottom:8px; } .emg-ce .row input{ flex:1; }
.emg-ce .rm{ width:44px; border-radius:12px; background:var(--surface); border:1px solid var(--line); color:var(--danger-soft,#F16A6E); flex:0 0 auto; }
.emg-add{ font-size:13.5px; color:var(--saffron-soft); background:none; border:none; cursor:pointer; padding:6px 2px; font-weight:600; }
.emg-btn{ width:100%; padding:14px; border-radius:14px; font-size:15.5px; font-weight:600; color:#241200; border:none; margin-top:8px;
  background:linear-gradient(135deg,var(--saffron-soft),var(--saffron)); }
.emg-btn.ghost{ background:var(--surface); color:var(--txt); border:1px solid var(--line); margin-top:8px; }
.emg-err{ min-height:16px; font-size:13px; color:var(--danger-soft,#F16A6E); text-align:center; margin-top:8px; }
.emg-empty{ text-align:center; padding:56px 24px; color:var(--muted); }
.emg-empty svg{ width:56px; height:56px; opacity:.4; margin-bottom:14px; }
