.coso-component { width:100%; }
.coso-locker { position:relative; isolation:isolate; width:100%; aspect-ratio:1084 / 1451; overflow:hidden; background-color:#fff; background-image:url("assets/locker/locker-background.webp"); background-position:center; background-repeat:no-repeat; background-size:100% 100%; }
.coso-overlay,.coso-fixed-foreground { position:absolute; inset:0; display:block; width:100%; height:100%; pointer-events:none; }
.coso-overlay { z-index:1; }
.coso-fixed-foreground { z-index:2; }
.coso-entry { position:absolute; display:block; opacity:1; max-width:none; pointer-events:none; user-select:none; }
.coso-component[data-state="loading"] .coso-entry { opacity:0; }
.coso-controls { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:16px; font:14px/1.4 system-ui,sans-serif; }
.coso-controls button { border:1px solid #d9c9e7; border-radius:100px; padding:11px 18px; min-height:44px; background:#fff; color:#3a2449; font:inherit; font-weight:600; cursor:pointer; }
.coso-controls button:hover { background:#eee2fd; }
.coso-controls button:focus-visible,.coso-step:focus-visible { outline:3px solid #ff6c1a; outline-offset:3px; }
.coso-controls button:disabled { opacity:.55; cursor:default; }
.coso-status { font:13px/1.5 system-ui,sans-serif; color:#6a537c; margin:12px 0 0; text-align:center; min-height:20px; }
.coso-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(prefers-reduced-motion:reduce) { .coso-entry { opacity:1; } }