@font-face{font-family:ObjemoLobster;src:url("keychain-fonts/Lobster.41f5c875663f.woff2") format('woff2');font-display:swap}
@font-face{font-family:ObjemoPacifico;src:url("keychain-fonts/Pacifico.23d0d6f9c505.woff2") format('woff2');font-display:swap}
.ock-options{padding:22px;border:1px solid #d6dfdc;border-radius:18px;background:linear-gradient(135deg,#f7f9f8,#fff);margin:16px 0}
.ock-options h2{font-size:1.5rem;line-height:1.25;margin:8px 0 20px}.ock-options small,.ock-hint{font-size:.82rem;color:#53635e;line-height:1.5}.ock-options .field{margin-bottom:18px}
.ock-fonts{border:0;padding:0;margin:0 0 18px}.ock-fonts legend{font-weight:650;margin-bottom:10px}.ock-fonts>div{display:flex;gap:10px;flex-wrap:wrap}.ock-fonts label{display:flex;align-items:center;gap:9px;padding:12px 18px;border:1px solid #bdcbc6;border-radius:12px;background:#fff;cursor:pointer;font-size:1.3rem;min-height:50px}.ock-fonts label:has(input[value=lobster]){font-family:ObjemoLobster,serif}.ock-fonts label:has(input[value=pacifico]){font-family:ObjemoPacifico,serif}.ock-fonts label:has(input:checked){outline:2px solid #275d50;outline-offset:1px}.ock-fonts input{accent-color:#275d50}
.ock-preview-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:4px 0 10px}.ock-preview-heading strong{font-size:1rem}.ock-preview-heading span{font-size:.8rem;color:#53635e;overflow-wrap:anywhere}
.ock-preview{--ock-base:#fff;--ock-text:#e91e85;display:grid;place-items:center;min-height:210px;padding:18px 10px;background:radial-gradient(ellipse at 50% 25%,#626663,#3c403d);border:1px solid #3d4540;border-radius:16px;overflow:hidden;box-shadow:inset 0 1px 0 #ffffff1a}
.ock-preview svg{display:block;width:100%;height:200px;filter:drop-shadow(0 3px 2px #0005)}.ock-preview [hidden],.ock-options [hidden]{display:none!important}
.ock-base{fill:var(--ock-base);stroke:#0002;stroke-width:.1}.ock-letters{fill:var(--ock-text);stroke:#0002;stroke-width:.06}
.ock-preview-empty{color:#fff;font-size:.9rem;text-align:center;padding:24px;max-width:28ch}.ock-preview[aria-busy=true] .ock-preview-empty{opacity:.8}
.ock-preview-meta{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:10px;color:#53635e;font-size:.78rem}.ock-preview-meta span:first-child{font-variant-numeric:tabular-nums;font-weight:650}
.ock-preview-status{font-size:.82rem;color:#7b3232;line-height:1.5;margin:8px 0 0}.ock-preview-status:empty{display:none}.ock-preview-retry{margin-top:8px;padding:7px 13px;border:1px solid #66786f;border-radius:8px;background:#fff;color:#25483a;cursor:pointer;font-size:.82rem}.ock-hint{margin:12px 0 0}
@media(max-width:600px){.ock-options{padding:16px}.ock-fonts label{padding:10px 14px}.ock-options h2{font-size:1.3rem}.ock-preview{min-height:190px;padding:12px 6px}.ock-preview svg{height:180px}}
