@font-face{font-family:Yope Inter;src:url(/assets/yope/inter.woff2)format("woff2");font-style:normal;font-weight:400 900;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;--surface:#050505;--raised:#141414;--ink:#f8f8f5;--muted:#f8f8f575;--line:#f8f8f51f;--line-strong:#f8f8f538;--brand:#cdfe08;font-family:Yope Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#app{background:var(--surface);width:100%;min-height:100%;color:var(--ink);margin:0;overflow:hidden}body{min-height:100dvh}button,input{font:inherit}.topbar{z-index:3;pointer-events:none;justify-content:space-between;align-items:center;height:72px;padding:0 clamp(16px,3vw,40px);display:flex;position:fixed;inset:0 0 auto}.brand{color:inherit;pointer-events:auto;align-items:center;gap:10px;text-decoration:none;display:flex}.brand img{width:72px;height:auto}.brand span{color:var(--brand);letter-spacing:.13em;font-size:10px;font-weight:850}.actions{pointer-events:auto;gap:8px;display:flex}.button{min-height:40px;color:var(--ink);white-space:nowrap;cursor:pointer;border:1px solid #0000;border-radius:14px;justify-content:center;align-items:center;padding:0 16px;font-size:13px;font-weight:650;line-height:1;transition:transform .16s cubic-bezier(.16,1,.3,1),background .16s,border-color .16s;display:inline-flex}.button:active{transform:translateY(1px)scale(.98)}.button:focus-visible,.variant:focus-visible,.brand:focus-visible{outline:2px solid var(--brand);outline-offset:3px}.button:disabled{cursor:wait;opacity:.55}.button-primary{background:var(--brand);color:#090909}.button-primary:hover:not(:disabled){background:#d7ff38}.button-secondary{border-color:var(--line);background:#f8f8f50f}.button-secondary:hover{border-color:var(--line-strong);background:#f8f8f51a}.button input{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.stage{touch-action:none;background:radial-gradient(circle at 50% 46%, #ffffff0f, transparent 35%), var(--surface);cursor:grab;min-height:100dvh;position:fixed;inset:0;overflow:hidden}.stage.is-grabbing{cursor:grabbing}.stage:after{content:"";pointer-events:none;border:1px solid #0000;border-radius:20px;transition:border-color .16s;position:absolute;inset:14px}.stage.is-dropping:after{border-color:var(--brand)}#sticker-canvas{filter:drop-shadow(0 44px 42px #0000006b);width:100%;height:100%;display:block}.loading,.drop-hint{z-index:2;border:1px solid var(--line);color:var(--muted);opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#141414d6;border-radius:14px;padding:10px 14px;font-size:12px;transition:opacity .16s,transform .16s;position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-42%)}.loading.is-visible,.stage.is-dropping .drop-hint{opacity:1;transform:translate(-50%,-50%)}.status{z-index:3;max-width:28vw;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;pointer-events:none;margin:0;font-size:11px;position:fixed;inset:auto auto 24px clamp(16px,3vw,40px);overflow:hidden}.variants{z-index:3;border:1px solid var(--line);-webkit-backdrop-filter:blur(26px)saturate(130%);backdrop-filter:blur(26px)saturate(130%);scrollbar-width:none;background:#141414c7;border-radius:20px;gap:6px;max-width:calc(100vw - 24px);padding:6px;display:flex;position:fixed;inset:auto 50% 18px auto;overflow-x:auto;transform:translate(50%);box-shadow:inset 0 1px #ffffff14,0 12px 36px #00000061}.variants::-webkit-scrollbar{display:none}.variant{cursor:pointer;background:#f8f8f50d;border:1px solid #0000;border-radius:14px;flex:0 0 54px;place-items:center;width:54px;height:54px;padding:6px;transition:transform .18s cubic-bezier(.16,1,.3,1),background .16s,border-color .16s;display:grid;overflow:hidden}.variant:hover{background:#f8f8f51a;transform:translateY(-2px)}.variant:active{transform:translateY(0)scale(.96)}.variant[aria-pressed=true]{border-color:var(--brand);background:#f8f8f521}.variant[data-id=wordmark-ink]{background:#eeeeea}.variant[data-id=wordmark-ink]:hover,.variant[data-id=wordmark-ink][aria-pressed=true]{background:#fff}.variant img{object-fit:contain;width:100%;height:100%;display:block}@media (width<=700px){.topbar{height:64px;padding-inline:14px}.brand img{width:66px}.button{min-height:38px;padding-inline:13px}.status{display:none}.variant{flex-basis:50px;width:50px;height:50px}}@media (prefers-reduced-motion:reduce){.button,.variant,.loading,.drop-hint,.stage:after{transition:none}}
