.ek-icon-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:flex-end;background:rgba(0,0,0,.6);font-family:var(--display,system-ui,sans-serif)}
.ek-icon-sheet{--ic-bg:#F8F8F6;--ic-fg:#080B0F;--ic-sub:#626A70;--ic-line:#D9DDDD;--ic-panel:#ECEEED;background:var(--ic-bg);color:var(--ic-fg);border-radius:28px 28px 0 0;width:100%;max-height:calc(100% - 54px);display:flex;flex-direction:column;box-shadow:0 -12px 48px #0002;overflow:hidden;animation:ek-icon-enter .25s ease-out}
.ek-icon-sheet[data-theme=dark]{--ic-bg:#111418;--ic-fg:#F8F8F6;--ic-sub:#AEB6BC;--ic-line:#41484E;--ic-panel:#1C2228}
.ek-icon-handle{height:5px;width:36px;border-radius:4px;background:var(--ic-line);margin:10px auto 3px;flex:none}
.ek-icon-header{display:flex;gap:8px;align-items:center;padding:4px 16px 4px 22px;flex:none}
.ek-icon-header h2{font:700 25px/1.15 var(--display,system-ui,sans-serif);letter-spacing:-.6px;margin:0;flex:1}
.ek-icon-close{width:44px;height:44px;flex:none;border:0;border-radius:50%;background:transparent;color:var(--ic-fg);display:grid;place-items:center;cursor:pointer}
.ek-icon-close svg{width:22px;height:22px}
.ek-icon-body{overflow:auto;overscroll-behavior:contain;padding:0 22px 8px;scrollbar-width:thin;min-height:0}
.ek-icon-intro{margin:0 0 16px;font-size:14px;line-height:1.4;color:var(--ic-sub)}
.ek-icon-preview{display:flex;align-items:center;gap:16px;padding:14px;background:var(--ic-panel);border-radius:18px;margin-bottom:20px}
.ek-icon-preview img{width:76px;height:76px;border-radius:18px;box-shadow:0 0 0 1px #80808025;flex:none}
.ek-icon-preview strong{display:block;font-size:19px;font-weight:650;margin-bottom:5px}
.ek-icon-preview p{margin:0;color:var(--ic-sub);font-size:13px;line-height:1.4}
.ek-icon-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px 9px}
.ek-icon-option{font:500 12px/1.3 var(--display,system-ui,sans-serif);display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;border:0;background:none;color:var(--ic-sub);padding:3px;min-height:88px;cursor:pointer;min-width:0}
.ek-icon-option img{width:100%;max-width:68px;aspect-ratio:1;border-radius:17px;box-shadow:0 0 0 1px #80808030}
.ek-icon-option[aria-checked=true]{color:var(--ic-fg);font-weight:700}
.ek-icon-option[aria-checked=true] img{outline:2px solid var(--ic-fg);outline-offset:3px}
.ek-icon-tick{display:none;position:absolute;top:-4px;right:-1px;width:22px;height:22px;border-radius:50%;background:var(--ic-fg);color:var(--ic-bg);border:2px solid var(--ic-bg);place-items:center}
.ek-icon-option[aria-checked=true] .ek-icon-tick{display:grid}
.ek-icon-tick svg{width:12px;height:12px;stroke-width:2.5}
.ek-icon-footer{padding:12px 22px max(28px,env(safe-area-inset-bottom));flex:none;border-top:1px solid var(--ic-line)}
.ek-icon-apply{width:100%;min-height:50px;border:0;border-radius:14px;background:var(--ic-fg);color:var(--ic-bg);font:650 16px var(--display,system-ui,sans-serif);cursor:pointer;padding:12px}
.ek-icon-apply:disabled{background:var(--ic-panel);color:var(--ic-sub);cursor:default}
.ek-icon-error{color:var(--ic-fg);font-size:13px;line-height:1.4;margin:0 0 10px}
.ek-icon-overlay :focus-visible{outline:3px solid var(--ic-fg);outline-offset:4px}
.ek-icon-option:focus-visible{outline:none}
.ek-icon-option:focus-visible img{outline:3px solid var(--ic-fg);outline-offset:4px}
@keyframes ek-icon-enter{from{transform:translateY(36px);opacity:0}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.ek-icon-sheet{animation:none}}