.toast-region{z-index:50;pointer-events:none;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{border-radius:var(--radius);background:var(--text);color:var(--panel);box-shadow:var(--shadow);pointer-events:auto;align-items:center;gap:16px;max-width:calc(100vw - 32px);padding:10px 16px;animation:.15s ease-out toast-in;display:flex}.toast__action{color:var(--accent);font:inherit;cursor:pointer;filter:brightness(1.4);background:0 0;border:0;font-weight:700}.toast__action:focus-visible{outline:2px solid var(--accent)}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}.dialog{border:1px solid var(--border);background:var(--panel);color:var(--text);box-shadow:var(--shadow);border-radius:10px;width:min(420px,100vw - 32px);padding:0}.dialog::backdrop{background:#00000059}.dialog--drawer{border-width:0 0 0 1px;border-radius:0;width:min(360px,100vw);height:100%;max-height:100%;margin:0 0 0 auto}.dialog__inner{padding:16px}.dialog__header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.dialog__title{margin:0;font-size:16px}.dialog__actions{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.field{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.field input[type=text],.field select{border:1px solid var(--border);background:var(--surface);height:32px;color:var(--text);font:inherit;border-radius:4px;padding:0 8px}.export__formats{flex-direction:column;gap:6px;margin-top:6px;display:flex}.export__format{border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;align-items:center;gap:8px;padding:8px 10px;display:flex}.export__format:has(input:checked){border-color:var(--accent)}.export__format input{accent-color:var(--accent)}.export__hint{color:var(--muted)}.export__name{align-items:center;gap:4px;display:flex}.export__name input{flex:1;min-width:0}.designs__save{width:100%;margin-bottom:16px}.designs__empty{color:var(--muted)}.designs__list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.designs__item{border-bottom:1px solid var(--border);gap:12px;padding-bottom:12px;display:flex}.designs__item canvas{border-radius:4px;flex:none}.designs__meta{flex-direction:column;gap:2px;min-width:0;display:flex}.designs__name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.designs__rename{border:1px solid var(--accent);background:var(--surface);height:26px;color:var(--text);font:inherit;border-radius:4px}.designs__date{color:var(--muted);font-size:12px}.designs__actions{flex-wrap:wrap;gap:2px;margin-left:-10px;display:flex}.designs__actions .btn{height:28px;color:var(--accent)}.canvas-view{background:var(--surface);flex:auto;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.canvas-view__canvas{outline:1px solid var(--border);touch-action:none;cursor:grab;display:block}.canvas-view__canvas:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.canvas-view__canvas:active{cursor:grabbing}.control{border:0;min-width:0;margin:0 0 12px;padding:0}.control__row{justify-content:space-between;align-items:center;gap:var(--space);min-height:28px;display:flex}.control__label{color:var(--text);padding:0}.control__number{border:1px solid var(--border);background:var(--surface);width:72px;height:26px;color:var(--text);font:inherit;text-align:right;font-variant-numeric:tabular-nums;border-radius:4px;padding:0 6px}.control__number:focus-visible,.color-field__input:focus-visible,.toggle:focus-visible,.palette__remove:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.segmented__option:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:1px}.control__range{width:100%;accent-color:var(--accent);margin:4px 0 0}.segmented__options{border:1px solid var(--border);border-radius:var(--radius);margin-top:4px;display:flex;overflow:hidden}.segmented__option{cursor:pointer;min-height:30px;color:var(--muted);flex:1;justify-content:center;align-items:center;display:flex;position:relative}.segmented__option+.segmented__option{border-left:1px solid var(--border)}.segmented__option input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.segmented__option:has(input:checked){background:var(--accent);color:var(--on-accent);font-weight:600}.color-field__input{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:4px;width:36px;height:26px;padding:2px}.toggle{appearance:none;background:var(--border);cursor:pointer;border-radius:10px;width:34px;height:20px;margin:0;transition:background .15s;position:relative}.toggle:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .15s;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px #0000004d}.toggle:checked{background:var(--accent)}.toggle:checked:after{transform:translate(14px)}.palette{flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px;display:flex}.palette__item{position:relative}.palette__remove{border:1px solid var(--border);background:var(--panel);width:16px;height:16px;color:var(--muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;top:-6px;right:-6px}.palette__remove:disabled{display:none}.subgroup{border-left:2px solid var(--border);margin:4px 0 12px 8px;padding-left:10px}@media (width<=899.98px){.control__row,.segmented__option{min-height:44px}.color-field__input{width:44px;height:36px}.palette__remove{width:22px;height:22px}}.gallery{grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px;display:grid}.gallery__item{border-radius:var(--radius);background:var(--surface);cursor:pointer;border:2px solid #0000;justify-content:center;align-items:center;padding:2px;display:flex}.gallery__item canvas{border-radius:3px;display:block}.gallery__item:hover{border-color:var(--border)}.gallery__item[aria-pressed=true]{border-color:var(--accent)}.gallery__item:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.panel{background:var(--panel);padding:calc(var(--space) * 1.5);flex:none;overflow-y:auto}.panel--left{border-right:1px solid var(--border);width:200px}.panel--right{border-left:1px solid var(--border);width:280px}.section+.section{margin-top:calc(var(--space) * 2.5)}.section__title{margin:0 0 var(--space);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:11px;font-weight:600}.placeholder{color:var(--muted);font-style:italic}.topbar{justify-content:space-between;align-items:center;gap:calc(var(--space) * 2);height:48px;padding:0 calc(var(--space) * 1.5);background:var(--panel);border-bottom:1px solid var(--border);flex:none;display:flex}.topbar__brand{align-items:center;gap:var(--space);min-width:0;display:flex}.topbar__name{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.topbar__actions{align-items:center;gap:2px;display:flex}.topbar__sep{width:1px;height:24px;margin:0 var(--space);background:var(--border)}.btn{border-radius:var(--radius);min-width:32px;height:32px;color:var(--text);font:inherit;cursor:pointer;background:0 0;border:1px solid #0000;justify-content:center;align-items:center;gap:6px;padding:0 10px;display:inline-flex}.btn--icon{width:32px;padding:0}.btn:hover:not(:disabled){background:var(--hover)}.btn:focus-visible,.menu__item:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.btn:disabled{color:var(--muted);opacity:.5;cursor:default}.btn--primary{background:var(--accent);color:var(--on-accent)}.btn--primary:hover:not(:disabled){background:var(--accent);filter:brightness(1.08)}.menu{position:relative}.menu__list{z-index:20;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);min-width:180px;box-shadow:var(--shadow);padding:4px;position:absolute;top:calc(100% + 4px);right:0}.menu__item{align-items:center;gap:var(--space);width:100%;min-height:44px;color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:4px;padding:0 12px;display:flex}.menu__item:hover{background:var(--hover)}@media (width<=899.98px){.btn{min-width:44px;height:44px}.btn--icon{width:44px}}.name-editor__button{min-width:0;max-width:40vw;color:var(--text);font:inherit;cursor:text;background:0 0;border:1px solid #0000;border-radius:4px;align-items:center;gap:6px;padding:4px 6px;display:inline-flex}.name-editor__button svg{color:var(--muted);flex:none}.name-editor__button:hover{border-color:var(--border)}.name-editor__button:focus-visible{outline:2px solid var(--accent)}.name-editor__input{border:1px solid var(--accent);background:var(--surface);width:min(280px,40vw);height:30px;color:var(--text);font:inherit;border-radius:4px;padding:0 6px;font-size:14px;font-weight:600}.app{flex-direction:column;height:100%;display:flex}.app__body{flex:auto;min-height:0;display:flex}.app__main{flex:auto;min-width:0;display:flex;position:relative}.hint{color:var(--muted);white-space:nowrap;pointer-events:none;margin:0;font-size:12px;position:absolute;bottom:2px;left:50%;transform:translate(-50%)}.app__body--mobile{flex-direction:column;overflow-y:auto}.app__main--mobile{aspect-ratio:1;flex:none;width:100%;max-height:60vh}.sheet{background:var(--panel);border-top:1px solid var(--border);flex-direction:column;flex:1 0 auto;display:flex}.tabs{z-index:5;background:var(--panel);border-bottom:1px solid var(--border);display:flex;position:sticky;top:0}.tabs__tab{min-height:44px;color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;flex:1;font-weight:600}.tabs__tab[aria-selected=true]{color:var(--text);border-bottom-color:var(--accent)}.tabs__tab:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.sheet__body{padding:calc(var(--space) * 1.5) calc(var(--space) * 2)}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--surface:#faf8f5;--panel:#fff;--text:#1d1f23;--muted:#6b7078;--accent:#0f6e6e;--border:#e3dfd8;--hover:#0000000d;--on-accent:#fff;--shadow:0 8px 24px #00000024;--space:8px;--radius:6px;--font:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--surface:#16181c;--panel:#1e2126;--text:#e8e6e1;--muted:#9aa0a8;--accent:#4fc3c0;--border:#2c3037;--hover:#ffffff12;--on-accent:#0b1f1f;--shadow:0 8px 24px #00000080}}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--surface);color:var(--text);font:13px/1.4 var(--font)}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}