@font-face{font-family:Fira Sans;font-style:normal;font-weight:400;font-display:swap;src:url(./fira-sans-400-B4NCpCez.woff2)format("woff2")}@font-face{font-family:Fira Sans;font-style:normal;font-weight:600;font-display:swap;src:url(./fira-sans-600-CyYTDGaN.woff2)format("woff2")}:root{--bg:#ffe8ed;--panel:#fff;--line:#e7dce1;--text:#000;--dim:#5c4f55;--accent:#bc526a;--check-a:#ffe8ed;--check-b:#ffd0da;--font:"Fira Sans", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-size:16px}*{box-sizing:border-box;margin:0;padding:0}html{font-synthesis:none;height:100%}html,body.workshop,body.workshop #app{height:100%;overflow:hidden}body.workshop{background:var(--bg);color:var(--text);font-family:var(--font);height:100dvh;line-height:1.5}.workshop-page{flex-direction:column;gap:10px;max-width:400px;height:100%;margin:0 auto;padding:16px;display:flex}.workshop-head{flex-direction:column;flex:none;align-items:center;gap:8px;display:flex}.tagline{text-align:center;color:var(--dim);flex-direction:column;align-items:center;font-size:1.0625rem;font-weight:400;line-height:1.45;display:flex}.site-link{color:var(--accent);font-size:1.25rem;font-weight:600;line-height:1.45;text-decoration:none}.site-link:hover{text-decoration:underline}.logo-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:8px;min-height:0;padding:12px;display:flex}.logo-preview{aspect-ratio:1;background-color:var(--check-a);background-image:conic-gradient(var(--check-a) 25%, var(--check-b) 0 50%, var(--check-a) 0 75%, var(--check-b) 0);background-size:20% 20%;border-radius:50%;width:min(100%,100dvh - 26rem);margin-inline:auto;position:relative;overflow:hidden}.dropzone,.preview{position:absolute;inset:0}.dropzone{color:var(--dim);z-index:3;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:14%;display:flex}.dropzone.dragging{border-color:var(--accent);color:var(--text)}.file-btn{border:1px solid var(--accent);color:var(--accent);cursor:pointer;border-radius:6px;padding:8px 14px;font-size:.82rem;font-weight:600}.file-btn:hover{background:var(--accent);color:var(--bg)}.preview canvas{cursor:grab;touch-action:none;width:100%;height:100%;display:block}.preview canvas:active{cursor:grabbing}.ring-guide{z-index:4;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.hidden{display:none!important}.slider{width:100%;color:var(--dim);align-items:center;gap:10px;font-size:.8rem;display:flex}.slider input{accent-color:var(--accent);flex:1}.ratio-read{font-variant-numeric:tabular-nums;text-align:right;min-width:3.2em}.dl-row{flex-direction:row;gap:8px;width:100%;display:flex}.logo-card button{background:var(--bg);border:1px solid var(--accent);color:var(--accent);font-family:var(--font);cursor:pointer;border-radius:6px;width:100%;padding:7px 10px;font-size:.78rem;font-weight:600}.logo-card button:hover:not(:disabled){background:var(--accent);color:var(--bg)}.logo-card button:disabled{opacity:.4;cursor:not-allowed}.suffix-block{flex-direction:column;gap:8px;width:100%;display:flex}.suffix-field,.suffix-out{flex-direction:column;gap:4px;width:100%;display:flex}.suffix-label{color:var(--dim);letter-spacing:.02em;font-size:.72rem;font-weight:600}.suffix-field input[type=text],.suffix-result{background:var(--bg);border:1px solid var(--line);width:100%;min-width:0;color:var(--text);font-family:var(--font);border-radius:6px;padding:8px 12px;font-size:.9rem;line-height:1.35}.suffix-field input[type=text]:focus{border-color:var(--accent);outline:none}.suffix-result-row{align-items:stretch;gap:8px;width:100%;display:flex}.suffix-result{white-space:nowrap;text-overflow:ellipsis;flex:1;margin:0;overflow:hidden}.suffix-result-row button{flex:none;width:auto}.suffix-hint{color:var(--dim);font-size:.72rem;line-height:1.35}.socials{flex:none;justify-content:center;align-items:center;gap:18px;display:flex}.social{color:var(--accent);width:22px;height:22px;display:inline-flex}.social svg{width:100%;height:100%;display:block}.social:hover{color:var(--text)}.twemoji{vertical-align:-.2em;width:1.15em;height:1.15em;margin:0 .02em;display:inline}