.tag-preview{border-radius:12px;flex:1;justify-content:center;align-items:center;padding:32px;transition:background .3s;display:flex;position:relative;overflow:hidden}.tag-preview[data-backdrop=light]{background-color:#f7f7f8;background-image:linear-gradient(#0000000a 1px,#0000 1px),linear-gradient(90deg,#0000000a 1px,#0000 1px);background-size:24px 24px}.tag-preview[data-backdrop=dark]{background-color:#1f2128;background-image:linear-gradient(#ffffff0a 1px,#0000 1px),linear-gradient(90deg,#ffffff0a 1px,#0000 1px);background-size:24px 24px}.tag-preview__tag{--tag-border-radius:24px;--font-family-vehicle:"VehicleFont", sans-serif;border-radius:var(--tag-border-radius);font-family:var(--font-family-vehicle);justify-content:center;align-items:center;width:fit-content;min-width:156px;padding:24px 18px;font-size:3.75rem;font-weight:600;line-height:1;display:flex}.bg-mode-toggle{flex-direction:column;gap:6px;display:flex}.bg-mode-toggle__label{color:var(--app-text);font-size:.85rem;font-weight:500}.bg-mode-toggle__buttons{border:1px solid var(--app-border-subtle);border-radius:6px;gap:0;width:fit-content;display:flex;overflow:hidden}.bg-mode-toggle__btn{background:var(--app-card-background);color:var(--app-text);cursor:pointer;border:none;padding:6px 14px;font-size:.85rem;transition:background .15s}.bg-mode-toggle__btn:not(:last-child){border-right:1px solid var(--app-border-subtle)}.bg-mode-toggle__btn--active{color:#fff;background:#3b82f6}.color-picker{flex-direction:column;gap:6px;display:flex}.color-picker__label{color:var(--app-text);font-size:.85rem;font-weight:500}.color-picker__body{flex-direction:column;gap:8px;display:flex}.color-picker .react-colorful{max-width:200px;width:100%!important}.color-picker__input-row{background:var(--app-card-background);border:1px solid var(--app-border-subtle);border-radius:4px;align-items:center;gap:2px;padding:0 6px;display:flex}.color-picker__prefix{color:var(--app-text);font-size:.85rem}.color-picker__hex-input{color:var(--app-text);background:0 0;border:none;outline:none;flex:1;padding:6px 2px;font-family:monospace;font-size:.85rem}.color-picker__pipette-btn{color:var(--app-text);cursor:pointer;background:0 0;border:none;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;padding:4px;transition:background .15s;display:flex}.color-picker__pipette-btn:hover{background:var(--app-border-subtle)}.gradient-control{flex-direction:column;gap:12px;display:flex}.gradient-control__label{color:var(--app-text);font-size:.9rem;font-weight:600}.gradient-control__sub-label{color:var(--app-text);margin-bottom:4px;font-size:.8rem;font-weight:500;display:block}.gradient-control__angle-row{align-items:center;gap:6px;display:flex}.gradient-control__slider{flex:1;max-width:160px}.gradient-control__angle-input{border:1px solid var(--app-border-subtle);background:var(--app-card-background);width:56px;color:var(--app-text);text-align:center;border-radius:4px;padding:4px 6px;font-size:.85rem}.gradient-control__unit{color:var(--app-text);font-size:.85rem}.gradient-control__stops{flex-direction:column;gap:10px;display:flex}.gradient-control__stop{background:var(--app-dialog-background);border:1px solid var(--app-border-subtle);border-radius:6px;flex-direction:column;gap:8px;padding:10px;display:flex}.gradient-control__stop-header{justify-content:space-between;align-items:center;display:flex}.gradient-control__stop-index{color:var(--app-text);font-size:.8rem;font-weight:600}.gradient-control__stop-actions{gap:4px;display:flex}.gradient-control__icon-btn{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);cursor:pointer;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:background .15s;display:flex}.gradient-control__icon-btn:hover{background:var(--app-border-subtle)}.gradient-control__icon-btn--danger{color:#e53935}.gradient-control__stop-pos{flex-direction:column;gap:4px;display:flex}.gradient-control__pos-label{color:var(--app-text);opacity:.7;font-size:.75rem}.gradient-control__pos-row{align-items:center;gap:6px;display:flex}.gradient-control__pos-input{border:1px solid var(--app-border-subtle);background:var(--app-card-background);width:52px;color:var(--app-text);text-align:center;border-radius:4px;padding:4px 6px;font-size:.85rem}.gradient-control__add-btn{border:1px dashed var(--app-border-subtle);color:var(--app-text);cursor:pointer;background:0 0;border-radius:6px;align-items:center;gap:6px;width:fit-content;padding:6px 14px;font-size:.85rem;transition:background .15s;display:inline-flex}.gradient-control__add-btn:hover{background:var(--app-dialog-background)}.border-control{flex-direction:column;gap:10px;display:flex}.border-control__label{color:var(--app-text);font-size:.9rem;font-weight:600}.border-control__toggle{color:var(--app-text);cursor:pointer;align-items:center;gap:8px;font-size:.85rem;display:flex}.border-control__sub-label{color:var(--app-text);margin-bottom:4px;font-size:.8rem;font-weight:500;display:block}.border-control__segmented{border:1px solid var(--app-border-subtle);border-radius:6px;gap:0;width:fit-content;display:flex;overflow:hidden}.border-control__seg-btn{background:var(--app-card-background);color:var(--app-text);cursor:pointer;border:none;padding:5px 16px;font-size:.85rem;transition:background .15s}.border-control__seg-btn:not(:last-child){border-right:1px solid var(--app-border-subtle)}.border-control__seg-btn--active{color:#fff;background:#3b82f6}.border-control__width input[type=range]{width:100%;max-width:200px}.identifier-control{flex-direction:column;gap:12px;display:flex}.identifier-control__field{flex-direction:column;gap:4px;display:flex}.identifier-control__label{color:var(--app-text);font-size:.85rem;font-weight:500}.identifier-control__input{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);border-radius:6px;outline:none;padding:7px 10px;font-size:.9rem}.identifier-control__input:focus{border-color:#3b82f6}.css-output{flex-direction:column;gap:8px;display:flex}.css-output__header{justify-content:space-between;align-items:center;display:flex}.css-output__title{color:var(--app-text);font-size:.9rem;font-weight:600}.css-output__copy-btn{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);cursor:pointer;border-radius:4px;align-items:center;gap:4px;padding:4px 10px;font-size:.8rem;transition:background .15s;display:inline-flex}.css-output__copy-btn:hover{background:var(--app-border-subtle)}.css-output__copy-btn--copied{color:#22c55e;border-color:#22c55e}.css-output__code{background:var(--app-dialog-background);border:1px solid var(--app-border-subtle);color:var(--app-text);white-space:pre;border-radius:6px;flex:1;margin:0;padding:12px;font-family:Cascadia Code,Fira Code,JetBrains Mono,monospace;font-size:.85rem;overflow-x:auto}.json-output{flex-direction:column;gap:8px;display:flex}.json-output__header{justify-content:space-between;align-items:center;display:flex}.json-output__title{color:var(--app-text);font-size:.9rem;font-weight:600}.json-output__copy-btn{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);cursor:pointer;border-radius:4px;align-items:center;gap:4px;padding:4px 10px;font-size:.8rem;transition:background .15s;display:inline-flex}.json-output__copy-btn:hover{background:var(--app-border-subtle)}.json-output__copy-btn--copied{color:#22c55e;border-color:#22c55e}.json-output__code{background:var(--app-dialog-background);border:1px solid var(--app-border-subtle);color:var(--app-text);white-space:pre;border-radius:6px;flex:1;margin:0;padding:12px;font-family:Cascadia Code,Fira Code,JetBrains Mono,monospace;font-size:.85rem;overflow-x:auto}.eyedropper-canvas{border:1px solid var(--app-border-subtle);background:var(--app-background);border-radius:6px;position:absolute;inset:0;overflow:hidden}.eyedropper-canvas--crosshair{cursor:crosshair}.eyedropper-canvas--grab{cursor:grab}.eyedropper-canvas--grabbing{cursor:grabbing}.eyedropper-canvas__canvas{will-change:transform;display:block;position:absolute;top:0;left:0}.eyedropper-canvas__preview{pointer-events:none;z-index:10000;border:2px solid #fff;border-radius:50%;width:24px;height:24px;position:fixed;box-shadow:0 0 4px #00000059,inset 0 0 0 1px #00000026}.eyedropper-canvas__preview-label{white-space:nowrap;color:var(--app-text);background:var(--app-card-background);border:1px solid var(--app-border-subtle);pointer-events:none;border-radius:4px;padding:2px 6px;font-family:monospace;font-size:.75rem;position:absolute;top:50%;left:28px;transform:translateY(-50%)}dialog.image-picker-dialog:not([open]){display:none}dialog.image-picker-dialog[open]{background:var(--app-card-background);border:1px solid var(--app-border-subtle);width:90vw;max-width:900px;height:70vh;max-height:85vh;color:var(--app-text);border-radius:12px;flex-direction:column;gap:16px;padding:24px;display:flex;box-shadow:0 8px 32px #00000040}dialog.image-picker-dialog[open]::backdrop{background:#0009}.image-picker-dialog__title{color:var(--app-text);margin:0;font-size:1.15rem;font-weight:600}.image-picker-dialog__upload-area{border:2px dashed var(--app-border-subtle);background:var(--app-background);border-radius:8px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;padding:48px 24px;display:flex}.image-picker-dialog__upload-text{color:var(--app-text);text-align:center;margin:0;font-size:.95rem}.image-picker-dialog__upload-btn{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:10px 20px;font-size:.9rem;transition:background .15s;display:flex}.image-picker-dialog__upload-btn:hover{background:var(--app-border-subtle)}.image-picker-dialog__file-input{display:none}.image-picker-dialog__image-area{flex-direction:column;flex:1;gap:12px;min-height:0;display:flex}.image-picker-dialog__toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.image-picker-dialog__zoom-control{align-items:center;gap:8px;display:flex}.image-picker-dialog__zoom-label{color:var(--app-text);white-space:nowrap;font-size:.85rem}.image-picker-dialog__zoom-slider{accent-color:#3b82f6;width:120px}.image-picker-dialog__image-actions{gap:8px;display:flex}.image-picker-dialog__action-btn{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:.8rem;transition:background .15s;display:flex}.image-picker-dialog__action-btn:hover{background:var(--app-border-subtle)}.image-picker-dialog__action-btn--danger:hover{background:#fecaca;border-color:#ef4444}.image-picker-dialog__canvas-wrapper{border-radius:6px;flex:1;min-height:200px;position:relative;overflow:hidden}.app{flex-direction:column;gap:28px;max-width:1100px;margin:0 auto;padding:24px 20px 40px;display:flex}.app__title{color:var(--app-text);text-align:center;margin:0;font-size:1.5rem;font-weight:700}.app__top{gap:24px;display:flex}.app__preview-area{flex-direction:column;flex:1;gap:12px;display:flex}.app__preview-header{justify-content:space-between;align-items:center;display:flex}.app__section-heading{color:var(--app-text);font-size:1rem;font-weight:600}.app__backdrop-toggle{border:1px solid var(--app-border-subtle);background:var(--app-card-background);color:var(--app-text);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:background .15s;display:flex}.app__backdrop-toggle:hover{background:var(--app-border-subtle)}.app__controls{background:var(--app-card-background);border:1px solid var(--app-border-subtle);border-radius:12px;flex-direction:column;flex:1;gap:18px;max-height:540px;padding:20px;display:flex;overflow-y:auto}.app__bottom{gap:24px;display:flex}.app__bottom>*{flex:1;min-width:0}@media (width<=768px){.app__top,.app__bottom{flex-direction:column}.app__controls{max-height:none}}@font-face{font-family:VehicleFont;src:url(/fonts/new-century-school-book.woff2)format("woff2");font-weight:400 700;font-style:normal;font-display:swap}:root{--app-background:#f7f7f8;--app-card-background:#fff;--app-dialog-background:#eceef1;--app-text:#1a1a1a;--app-border-subtle:#ddd}@media (prefers-color-scheme:dark){:root{--app-background:#181818;--app-card-background:#1f2128;--app-dialog-background:#17171c;--app-text:#f0f0f0;--app-border-subtle:#444}}*,:before,:after{box-sizing:border-box}html{color:var(--app-text);background:var(--app-background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px}body{margin:0;padding:0}