/* EFKey keyboard simulator */
.efk-sim{--fieldBg:#FFFFFF;--fieldText:#000;--fieldPh:#8E8E93;--screen:#F2F2F7;background:var(--screen);border-radius:26px 26px 38px 38px;padding:10px 0 0;overflow:visible;position:relative;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.efk-sim.efk-dark{--fieldBg:#1C1C1E;--fieldText:#fff;--fieldPh:#8E8E93;--screen:#000}
.efk-field{margin:0 10px 10px;min-height:40px;border-radius:20px;background:var(--fieldBg);color:var(--fieldText);font:17px/1.3 -apple-system,BlinkMacSystemFont,"SF Pro Text",Helvetica,Arial,sans-serif;padding:9px 16px;display:flex;align-items:center;flex-wrap:wrap;white-space:pre-wrap;word-break:break-word;box-shadow:0 0 0 .5px rgba(0,0,0,.08)}
.efk-caret{display:inline-block;width:2px;height:21px;background:#0A84FF;margin-left:1px;animation:efkBlink 1s steps(1) infinite;vertical-align:middle}
@keyframes efkBlink{50%{opacity:0}}
.efk-ph{color:var(--fieldPh);margin-left:2px}
.efk-kb{--bar:var(--text);position:relative;background:var(--tray);border-radius:26px 26px 38px 38px;padding-top:2px;overflow:visible;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",Helvetica,Arial,sans-serif;transition:background .3s}
.efk-kb *{box-sizing:border-box}
.efk-kb button{font-family:inherit}
.efk-emoji{display:flex;justify-content:space-between;padding:6px 10px 0}
.efk-e{appearance:none;border:0;background:none;font-size:24px;line-height:1;padding:4px 2px;cursor:pointer;touch-action:manipulation}
.efk-bar{height:44px;display:flex;align-items:center;padding:0 10px}
.efk-nobar{height:8px}
.efk-sugs{flex:1;display:flex;align-items:center;min-width:0}
.efk-s{appearance:none;border:0;background:none;color:var(--bar);flex:1 1 0;min-width:0;font:inherit;font-size:17px;padding:8px 2px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;touch-action:manipulation;border-radius:8px}
.efk-s-main{font-weight:600}
.efk-sep{width:1px;height:22px;background:currentColor;opacity:.2;flex:none}
.efk-tools{flex:1;display:flex;justify-content:space-around;align-items:center}
.efk-t{appearance:none;border:0;background:none;color:var(--bar);padding:6px 10px;cursor:pointer;font:inherit}
.efk-t b{font-size:14px;font-weight:700;letter-spacing:.02em}
.efk-t svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.efk-ef{appearance:none;border:0;background:none;color:var(--bar);opacity:.75;font:800 18px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.02em;padding:8px 6px;cursor:pointer}
.efk-left .efk-ef{order:-1}
.efk-rows{display:grid;gap:var(--rg);padding:var(--rg) var(--side) 0}
.efk-row{display:flex;gap:var(--gap);min-width:0}
.efk-pad,.efk-gap{flex:none;min-width:0}
.efk-gap{width:calc(var(--gap) * 1.2)}
.efk-k{appearance:none;border:0;margin:0;padding:0;min-width:0;height:var(--kh);border-radius:var(--rad);background:var(--key);color:var(--text);box-shadow:var(--kshadow);font-weight:var(--kw);font-size:var(--lf);line-height:1;font-style:normal;display:grid;place-items:center;position:relative;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background .12s,transform .08s}
.efk-k span{pointer-events:none;line-height:1;transform:translateY(-1px)}
.efk-k.efk-f{background:var(--fkey);font-size:calc(var(--lf) * .72)}
.efk-k.efk-sm{font-size:17px}
.efk-k.efk-num{font-size:calc(var(--lf) * .92)}
.efk-k.efk-emk{font-size:22px;background:transparent;box-shadow:none}
.efk-k.efk-ret{background:var(--enter);color:var(--enterText)}
.efk-k.down{background:var(--press)}
.efk-k svg{width:calc(var(--lf) * .92);height:calc(var(--lf) * .92);max-width:26px;max-height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}
.efk-k svg .fill{fill:currentColor;stroke:currentColor}
.efk-k svg.caps .fill{fill:currentColor}
.efk-h{position:absolute;top:2px;right:3px;font-weight:var(--hw);font-size:var(--hs);line-height:1;font-style:normal;font-style:normal;color:var(--hint);pointer-events:none;transition:opacity .35s}
.efk-idle .efk-h{opacity:0}
.efk-space .efk-lng{position:absolute;left:7px;bottom:5px;font-weight:600;font-size:10px;line-height:1;font-style:normal;font-style:normal;color:var(--hint);letter-spacing:.02em}
.efk-space svg{position:absolute;right:8px;top:50%;width:13px;height:13px;margin-top:-6.5px;color:var(--hint);stroke-width:1.4}
.efk-space svg .fill{fill:currentColor}
.efk-sys{display:flex;justify-content:space-between;align-items:center;padding:6px 22px 14px;color:var(--sys);background:var(--sysBg);border-radius:0 0 38px 38px;margin-top:var(--rg)}
.efk-sys svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.efk-sys span:last-child svg{width:24px;height:24px}
.efk-bubble{position:absolute;z-index:20;pointer-events:none;opacity:0;border-radius:12px;background:var(--key);color:var(--text);font-weight:400 calc(var(--lf) *;font-size:1.45);line-height:1;font-style:normal;display:flex;justify-content:center;padding-top:10px;box-shadow:0 2px 8px rgba(0,0,0,.28),0 0 0 .5px rgba(0,0,0,.08)}
.efk-glassy .efk-bubble{background:#3a4a50}
.efk-bubble.on{opacity:1}
.efk-acc{position:absolute;z-index:21;display:flex;gap:2px;padding:4px;border-radius:12px;background:var(--key);box-shadow:0 4px 16px rgba(0,0,0,.3),0 0 0 .5px rgba(0,0,0,.08);white-space:nowrap}
.efk-glassy .efk-acc{background:#3a4a50}
.efk-acc span{min-width:32px;height:44px;display:grid;place-items:center;font-size:22px;border-radius:8px;color:var(--text)}
.efk-acc span.on{background:#0A84FF;color:#fff}
@media (prefers-reduced-motion:reduce){.efk-caret{animation:none}.efk-k,.efk-kb{transition:none}}

/* keep letters and corner hints apart on narrow phone keys */
.efk-kb{container-type:inline-size}
.efk-l span{transform:translateY(2px)}
.efk-k.efk-l{font-size:min(var(--lf), 6.6cqw)}
.efk-h{font-size:min(var(--hs), 2.55cqw)}
.efk-hw .efk-l span{transform:translateY(1px)}
.efk-sysb{appearance:none;border:0;background:none;color:inherit;padding:0;cursor:pointer;display:grid}
.efk-sysb svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.5}
.efk-sysb svg .fill{fill:currentColor}

/* no iOS globe/mic strip: only what EFKey draws */
.efk-rows{padding-bottom:calc(var(--rg) + 4px)}
.efk-ph.efk-note{font-size:14px;line-height:1.35;color:var(--fieldText);opacity:.85}
/* no phone-screen backdrop: the field and keyboard sit on the page itself */
.efk-sim{background:transparent!important;box-shadow:none!important}
.efk-sim .efk-field{box-shadow:0 0 0 1px color-mix(in srgb,var(--fieldText) 12%,transparent)}

/* instant feedback: no easing on press, no double-tap zoom delay */
.efk-kb .efk-k{transition:none!important}
.efk-kb{touch-action:manipulation}
.efk-bubble{transition:none}
