.font-card{display:flex;flex-direction:column;gap:.375rem;padding:.5rem;background:#fff;border:2px solid #e5e7eb;border-radius:6px;cursor:pointer;transition:all .2s ease;min-height:85px}.font-card:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a;transform:translateY(-1px)}.font-card:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.font-card--selected{border-color:#3b82f6;background:#eff6ff;box-shadow:0 2px 8px #3b82f633}.font-card--inactive{opacity:.6;cursor:not-allowed}.font-card--inactive:hover{border-color:#e5e7eb;box-shadow:none;transform:none}.font-card__preview{position:relative;display:flex;align-items:center;justify-content:center;height:50px;background:#f9fafb;border-radius:4px;padding:.375rem;overflow:hidden}.font-card__preview-image{max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.font-card__badge{position:absolute;top:4px;right:4px;padding:2px 6px;background:#fbbf24;color:#78350f;font-size:10px;font-weight:600;border-radius:3px;text-transform:uppercase;letter-spacing:.025em}.font-card__name{font-size:12px;font-weight:500;color:#1f2937;line-height:1.3;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.font-card--selected .font-card__name{color:#1e40af;font-weight:600}@media (max-width: 640px){.font-card{min-height:75px;padding:.375rem}.font-card__preview{height:40px;padding:.25rem}.font-card__name{font-size:10px}}.font-picker{width:100%;max-width:100%}.font-picker__container{max-height:60vh;overflow-y:auto;overflow-x:hidden;padding:.5rem}.font-picker__size-group{margin-bottom:1.5rem}.font-picker__size-group:last-child{margin-bottom:0}.font-picker__size-heading{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#6b7280;margin:0 0 .75rem;padding:0 .25rem}.font-picker__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.75rem}.font-picker__container::-webkit-scrollbar{width:8px}.font-picker__container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.font-picker__container::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.font-picker__container::-webkit-scrollbar-thumb:hover{background:#94a3b8}.font-picker--loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;gap:1rem}.font-picker__spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.font-picker__status{font-size:14px;color:#6b7280;margin:0}.font-picker--error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;gap:1rem}.font-picker__error-icon{font-size:48px}.font-picker__error-message{font-size:14px;color:#dc2626;margin:0;text-align:center}.font-picker__retry-button{padding:.5rem 1rem;background:#3b82f6;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s}.font-picker__retry-button:hover{background:#2563eb}.font-picker__retry-button:active{background:#1d4ed8}.font-picker--empty{display:flex;align-items:center;justify-content:center;padding:3rem 1rem}.font-picker__empty-message{font-size:14px;color:#6b7280;margin:0;text-align:center}@media (max-width: 640px){.font-picker__container{max-height:50vh;padding:.25rem}.font-picker__grid{grid-template-columns:repeat(3,1fr);gap:.5rem}.font-picker__size-heading{padding:0;font-size:11px}}@media (min-width: 641px) and (max-width: 1024px){.font-picker__grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 1025px){.font-picker__container{max-height:70vh}.font-picker__grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}}.editor-shell{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;overflow:hidden;background:var(--color-neutral-50, #f9fafb)}.editor-shell__header{flex-shrink:0;background:#fff;border-bottom:1px solid var(--color-neutral-200, #e5e7eb);padding:.75rem 1rem;z-index:10}.editor-shell__main{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}.editor-shell__canvas-region{display:flex;flex-direction:column;flex:1;overflow:hidden;background:#fff;min-height:0}.editor-shell__canvas-toolbar{flex-shrink:0;padding:.5rem 1rem;background:#fff;border-bottom:1px solid var(--color-neutral-200, #e5e7eb)}.editor-shell__canvas{flex:1;overflow:auto;padding:.25rem;display:flex;align-items:center;justify-content:center;min-height:0;max-width:100%;overflow-x:auto}.editor-shell__canvas>div{width:100%;max-width:100%;display:flex;flex-direction:column;align-items:center}.editor-shell__canvas canvas{max-width:100%!important;height:auto!important}.editor-shell__tool-container{flex-shrink:0;background:#fff;border-top:2px solid var(--color-neutral-200, #e5e7eb);overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:50vh;padding:1rem}@media (min-width: 768px){.editor-shell__header{padding:1.25rem 1.5rem}.editor-shell__canvas-toolbar{padding:.75rem 1rem}.editor-shell__canvas{padding:.75rem}.editor-shell__tool-container{padding:1.25rem 1.5rem;max-height:45vh}}@media (min-width: 1024px){.editor-shell__main{flex-direction:row}.editor-shell__canvas-region{flex:1;min-width:0}.editor-shell__tool-container{flex-shrink:0;width:360px;max-width:400px;max-height:none;border-top:none;border-left:2px solid var(--color-neutral-200, #e5e7eb);padding:1.5rem}.editor-shell__header{padding:.75rem 1.5rem}.editor-shell__canvas-toolbar{padding:.5rem 1rem}.editor-shell__canvas{padding:.25rem}}@media (max-width: 359px){.editor-shell__header,.editor-shell__canvas-toolbar,.editor-shell__canvas{padding:.5rem}.editor-shell__tool-container{padding:.75rem;max-height:55vh}}@media (max-height: 600px) and (orientation: landscape){.editor-shell__tool-container{max-height:40vh}.editor-shell__canvas{padding:.75rem}}.editor-shell,.editor-shell__main,.editor-shell__canvas-region,.editor-shell__canvas,.editor-shell__tool-container{box-sizing:border-box;max-width:100%}.editor-shell__canvas>*{max-width:100%}@media print{.editor-shell__header,.editor-shell__canvas-toolbar,.editor-shell__tool-container{display:none}.editor-shell__canvas{overflow:visible;padding:0}.editor-shell,.editor-shell__main,.editor-shell__canvas-region{height:auto;overflow:visible}}.editor-shell__header *:focus-visible,.editor-shell__canvas-toolbar *:focus-visible,.editor-shell__tool-container *:focus-visible{outline:3px solid var(--color-primary, #2563eb);outline-offset:2px}@supports (padding: max(0px)){.editor-shell__header{padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}.editor-shell__tool-container{padding-bottom:max(1rem,env(safe-area-inset-bottom));padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}@media (min-width: 1024px){.editor-shell__tool-container{padding-bottom:1.5rem}}}@media (max-width: 767px){.canvas-toolbar-btn-text,.canvas-toolbar-desktop-only{display:none}}@media (min-width: 768px){.canvas-toolbar-btn-text{display:inline}.canvas-toolbar-desktop-only{display:flex}.desktop-only{display:block}}@media (max-width: 767px){.desktop-only{display:none}}.mobile-sticky-controls{position:fixed;bottom:0;left:0;right:0;z-index:1000;display:none}@media (max-width: 767px){.mobile-sticky-controls{display:block}.editor-shell__canvas-region{overflow:hidden}.editor-shell__canvas{overflow:hidden;padding:.25rem}.editor-shell__tool-container{display:none!important}}.mobile-controls-panel{background:#fff;border-top:2px solid #e5e7eb;box-shadow:0 -4px 6px -1px #0000001a;transition:max-height .3s ease-in-out;max-height:0;overflow:hidden}.mobile-controls-panel.expanded{max-height:70vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.mobile-controls-tabs{display:flex;gap:.25rem;padding:.5rem;background:#f9fafb;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:10}.mobile-control-tab{flex:1;padding:.75rem .5rem;background:#fff;border:2px solid transparent;border-radius:6px;font-size:.875rem;font-weight:600;color:#374151;cursor:pointer;transition:all .2s ease-in-out;min-height:44px;display:flex;align-items:center;justify-content:center;gap:.25rem}.mobile-control-tab:active{transform:scale(.98)}.mobile-control-tab.active{background:#2563eb;color:#fff;border-color:#2563eb}.mobile-control-close{width:44px;height:44px;background:#fee2e2;color:#991b1b;border:2px solid #ef4444;border-radius:6px;font-size:1.25rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease-in-out}.mobile-control-close:active{transform:scale(.98);background:#fecaca}.mobile-controls-content{padding:1rem;background:#fff}.mobile-sticky-footer{padding:.75rem 1rem;background:#fff;border-top:1px solid #e5e7eb}.mobile-sticky-footer .btn{width:100%;min-height:52px;justify-content:center;display:flex;align-items:center;gap:.5rem}@media (min-width: 768px){.mobile-sticky-controls{display:none}}@media (max-width: 1023px){.editor-shell__tool-container{transition:max-height .3s cubic-bezier(.4,0,.2,1),opacity .25s ease-in-out,transform .3s cubic-bezier(.4,0,.2,1);will-change:max-height,transform}.editor-shell__tool-container--collapsed{max-height:60px!important;opacity:.95}.editor-shell__tool-container--partial{max-height:50vh}.editor-shell__tool-container--expanded{max-height:70vh}.editor-shell__tool-container--animating{transition:max-height .35s cubic-bezier(.4,0,.2,1),opacity .3s ease-in-out}}@media (min-width: 1024px){.editor-shell__tool-container{transition:width .3s cubic-bezier(.4,0,.2,1),opacity .25s ease-in-out,transform .3s cubic-bezier(.4,0,.2,1);will-change:width,transform}.editor-shell__tool-container--collapsed{width:60px!important;overflow:hidden}.editor-shell__tool-container--expanded{width:360px}.editor-shell__tool-container--animating{transition:width .35s cubic-bezier(.4,0,.2,1),opacity .3s ease-in-out}}.editor-shell__tool-container--animating *{pointer-events:none}.editor-shell__tool-container:not(.editor-shell__tool-container--animating) *{pointer-events:auto}.tool-tabs__panel-container{transition:opacity .2s ease-in-out}.tool-tabs__panel-container--entering{animation:panelFadeIn .25s ease-out}@keyframes panelFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.tool-tabs__tab{transition:all .2s cubic-bezier(.4,0,.2,1);position:relative}.tool-tabs__tab--active:before{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:var(--color-primary, #2563eb);animation:tabIndicator .25s cubic-bezier(.4,0,.2,1)}@media (min-width: 1024px){.tool-tabs--vertical .tool-tabs__tab--active:before{bottom:auto;top:0;left:auto;right:-2px;width:3px;height:100%}}@keyframes tabIndicator{0%{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}.editor-shell button:focus-visible,.editor-shell a:focus-visible,.editor-shell input:focus-visible,.editor-shell textarea:focus-visible,.editor-shell select:focus-visible,.tool-tabs__tab:focus-visible{outline:3px solid var(--color-primary, #2563eb);outline-offset:2px;box-shadow:0 0 0 5px #2563eb1a;transition:box-shadow .15s ease-in-out}.tool-panel__section:focus-within{background:#2563eb05;border-radius:6px;transition:background .15s ease-in-out}.editor-shell :focus:not(:focus-visible){outline:none;box-shadow:none}.btn-primary:focus-visible,.tool-tabs__tab--active:focus-visible{outline-width:4px;box-shadow:0 0 0 6px #2563eb26}@media (max-width: 1023px){.editor-shell__header button,.editor-shell__header a{min-height:44px;min-width:44px;padding:.75rem;display:inline-flex;align-items:center;justify-content:center}.editor-shell__canvas-toolbar button,.editor-shell__canvas-toolbar select{min-height:44px;padding:.625rem 1rem}.tool-tabs__tab{min-height:48px;min-width:48px;padding:.875rem 1.25rem}.tool-panel__select,.tool-panel__textarea,.tool-panel button{min-height:48px}.tool-panel__checkbox{min-height:44px;padding:.5rem;margin:-.5rem}.tool-panel__checkbox input[type=checkbox],.tool-panel__checkbox input[type=radio]{min-width:24px;min-height:24px}}.editor-shell button,.tool-tabs__tab,.tool-panel__select,.tool-panel__color-swatch{transition:background-color .15s ease-in-out,border-color .15s ease-in-out,color .15s ease-in-out,box-shadow .15s ease-in-out,transform .1s ease-out}@media (hover: none) and (pointer: coarse){.tool-tabs__tab:active,.editor-shell button:active{transform:scale(.97)}.tool-tabs__tab:after,.editor-shell button:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:currentColor;opacity:0;transition:opacity .15s ease-out;pointer-events:none}.tool-tabs__tab:active:after,.editor-shell button:active:after{opacity:.1}}@media (hover: hover) and (pointer: fine){.tool-tabs__tab:hover,.editor-shell button:hover{transform:translateY(-1px);box-shadow:0 2px 4px #00000014}.tool-tabs__tab--active:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001f}}.editor-shell__drawer-handle{width:40px;height:4px;background:var(--color-neutral-400, #9ca3af);border-radius:2px;margin:0 auto .75rem;transition:background .15s ease-in-out,width .2s cubic-bezier(.4,0,.2,1);cursor:grab}.editor-shell__drawer-handle:hover{background:var(--color-neutral-500, #6b7280);width:60px}.editor-shell__drawer-handle:active{cursor:grabbing;background:var(--color-primary, #2563eb)}.tool-panel__section--active{border-left:3px solid var(--color-primary, #2563eb);padding-left:calc(1rem - 3px);background:#2563eb08;animation:sectionActivate .2s ease-out}@keyframes sectionActivate{0%{border-left-color:transparent;background:transparent}to{border-left-color:var(--color-primary, #2563eb);background:#2563eb08}}@media (prefers-contrast: high){.tool-tabs__tab{border-width:2px}.tool-tabs__tab--active{border-width:3px;font-weight:700}.tool-tabs__tab:focus-visible{outline-width:4px}.editor-shell button:focus-visible,.editor-shell input:focus-visible,.editor-shell textarea:focus-visible{outline-width:4px;box-shadow:0 0 0 6px #0003}}@media (prefers-reduced-motion: reduce){.editor-shell__tool-container,.tool-tabs__panel-container,.tool-tabs__tab,.editor-shell button,.tool-panel__select,.tool-panel__color-swatch{transition:none;animation:none}.tool-tabs__tab--active:before{animation:none}.editor-shell button:hover,.tool-tabs__tab:hover{transform:none}.editor-shell button:focus-visible,.tool-tabs__tab:focus-visible{transition:outline .1s ease-in-out}}@media (prefers-color-scheme: dark){.editor-shell__drawer-handle{background:var(--color-neutral-600, #4b5563)}.editor-shell__drawer-handle:hover{background:var(--color-neutral-500, #6b7280)}}.editor-shell__tool-container,.tool-tabs__panel-container,.tool-tabs__tab--active:before{transform:translateZ(0);backface-visibility:hidden}.editor-shell__tool-container--animating{contain:layout style paint}.tool-tabs__bar,.tool-tabs__panel-container{-webkit-overflow-scrolling:touch;scroll-behavior:smooth}@media print{.editor-shell__tool-container,.tool-tabs__panel-container,.tool-tabs__tab,.editor-shell button{transition:none!important;animation:none!important;transform:none!important}.editor-shell__drawer-handle,.tool-tabs__tab--active:before{display:none}}.tool-tabs{display:flex;flex-direction:column;height:100%;width:100%;background:#fff}.tool-tabs__bar{display:flex;flex-shrink:0;background:var(--color-neutral-50, #f9fafb);border-bottom:2px solid var(--color-neutral-200, #e5e7eb);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.tool-tabs--horizontal .tool-tabs__bar{flex-direction:row;gap:.25rem;padding:.5rem}.tool-tabs--vertical{flex-direction:row}.tool-tabs--vertical .tool-tabs__bar{flex-direction:column;width:80px;border-bottom:none;border-right:2px solid var(--color-neutral-200, #e5e7eb);padding:.75rem .5rem;gap:.5rem}.tool-tabs__tab{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1rem;border:2px solid transparent;border-radius:6px;background:transparent;color:var(--color-neutral-700, #374151);font-size:.875rem;font-weight:600;cursor:pointer;transition:all var(--transition-base, .2s ease-in-out);white-space:nowrap;min-height:44px}.tool-tabs__tab:hover:not(:disabled){background:var(--color-neutral-100, #f3f4f6);color:var(--color-neutral-900, #111827)}.tool-tabs__tab:focus-visible{outline:3px solid var(--color-primary, #2563eb);outline-offset:2px}.tool-tabs__tab--active{background:#fff;color:var(--color-primary, #2563eb);border-color:var(--color-primary, #2563eb);box-shadow:var(--shadow-sm, 0 1px 2px 0 rgb(0 0 0 / .05))}.tool-tabs__tab--active:hover{background:#fff;color:var(--color-primary, #2563eb)}.tool-tabs__tab--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.tool-tabs__tab-icon{display:flex;align-items:center;font-size:1.25rem}.tool-tabs__tab-label{font-size:.875rem}.tool-tabs--vertical .tool-tabs__tab{flex-direction:column;padding:.75rem .5rem;gap:.25rem;width:100%}.tool-tabs--vertical .tool-tabs__tab-icon{font-size:1.5rem}.tool-tabs--vertical .tool-tabs__tab-label{font-size:.625rem;text-align:center}.tool-tabs__panel-container{flex:1;overflow-y:auto;overflow-x:hidden;padding:1rem;min-height:0}.tool-tabs--vertical .tool-tabs__panel-container{padding:1.5rem}.tool-tabs__empty-state{display:flex;align-items:center;justify-content:center;height:100%;padding:2rem;text-align:center;color:var(--color-neutral-500, #6b7280);font-size:.875rem}.tool-panel{display:flex;flex-direction:column;gap:1.5rem}.tool-panel__section{display:flex;flex-direction:column;gap:.5rem}.tool-panel__heading{font-size:1rem;font-weight:600;color:var(--color-neutral-900, #111827);margin:0 0 .5rem}.tool-panel__label{display:block;font-size:.875rem;font-weight:600;color:var(--color-neutral-700, #374151);margin-bottom:.25rem}.tool-panel__hint{font-size:.75rem;color:var(--color-neutral-600, #4b5563);margin-top:.25rem}.tool-panel__info{padding:1rem;background:var(--color-info-bg, #eff6ff);border:1px solid var(--color-info-border, #bfdbfe);border-radius:6px;font-size:.8125rem;color:var(--color-info-text, #1e40af)}.tool-panel__info-text{margin:0 0 .5rem}.tool-panel__info-list{margin:.5rem 0 0;padding-left:1.25rem;line-height:1.6}.tool-panel__empty-state{padding:2rem 1rem;text-align:center;color:var(--color-neutral-500, #6b7280);background:var(--color-neutral-50, #f9fafb);border:2px dashed var(--color-neutral-300, #d1d5db);border-radius:6px}.tool-panel__textarea{width:100%;padding:.75rem;font-family:var(--font-family-mono, "Courier New", monospace);font-size:.875rem;color:var(--color-neutral-900, #111827);background:#fff;border:2px solid var(--color-neutral-300, #d1d5db);border-radius:6px;resize:vertical;min-height:100px;transition:border-color var(--transition-base, .2s ease-in-out)}.tool-panel__textarea:focus{outline:none;border-color:var(--color-primary, #2563eb)}.tool-panel__select{width:100%;padding:.75rem;font-size:.875rem;color:var(--color-neutral-900, #111827);background:#fff;border:2px solid var(--color-neutral-300, #d1d5db);border-radius:6px;cursor:pointer;transition:border-color var(--transition-base, .2s ease-in-out)}.tool-panel__select:focus{outline:none;border-color:var(--color-primary, #2563eb)}.tool-panel__checkbox{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.875rem;-webkit-user-select:none;user-select:none}.tool-panel__checkbox input[type=checkbox]{width:1.25rem;height:1.25rem;cursor:pointer}.tool-panel__color-preview{display:flex;flex-direction:column;gap:.5rem}.tool-panel__color-swatch{width:100%;height:60px;border:2px solid var(--color-neutral-300, #d1d5db);border-radius:6px;cursor:pointer;transition:box-shadow var(--transition-base, .2s ease-in-out)}.tool-panel__color-swatch:hover{box-shadow:var(--shadow-md, 0 1px 3px 0 rgb(0 0 0 / .1))}@media (max-width: 767px){.tool-tabs__tab{min-height:44px;min-width:44px;padding:.75rem 1rem}.tool-tabs__panel-container{padding:1rem}.tool-panel__textarea,.tool-panel__select{min-height:44px}}@media (min-width: 768px){.tool-tabs__bar{padding:.75rem;gap:.5rem}.tool-tabs__tab{padding:.875rem 1.25rem}.tool-tabs__panel-container{padding:1.25rem}.tool-panel{gap:2rem}}@media (min-width: 1024px){.tool-tabs--horizontal.tool-tabs--auto-vertical{flex-direction:row}.tool-tabs--horizontal.tool-tabs--auto-vertical .tool-tabs__bar{flex-direction:column;width:80px;border-bottom:none;border-right:2px solid var(--color-neutral-200, #e5e7eb);padding:.75rem .5rem}.tool-tabs--horizontal.tool-tabs--auto-vertical .tool-tabs__tab{flex-direction:column;padding:.75rem .5rem;gap:.25rem}.tool-tabs--horizontal.tool-tabs--auto-vertical .tool-tabs__tab-icon{font-size:1.5rem}.tool-tabs--horizontal.tool-tabs--auto-vertical .tool-tabs__tab-label{font-size:.625rem;text-align:center}}@media (prefers-contrast: high){.tool-tabs__tab--active{border-width:3px}.tool-panel__textarea:focus,.tool-panel__select:focus{border-width:3px}}@media (prefers-reduced-motion: reduce){.tool-tabs__tab,.tool-panel__textarea,.tool-panel__select,.tool-panel__color-swatch{transition:none}}@media print{.tool-tabs__bar{display:none}.tool-tabs__panel-container{overflow:visible;padding:0}}.border-picker{width:100%;padding:.5rem 0}.border-picker__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.75rem;padding:.5rem 0}.border-picker__card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;border:2px solid #e5e7eb;border-radius:8px;background:#fff;cursor:pointer;transition:all .2s ease;min-height:100px}.border-picker__card:hover{border-color:#93c5fd;background:#f0f9ff;transform:translateY(-2px);box-shadow:0 2px 8px #0000001a}.border-picker__card:focus{outline:2px solid #2563eb;outline-offset:2px}.border-picker__card--selected{border-color:#2563eb;background:#eff6ff;box-shadow:0 2px 8px #2563eb33}.border-picker__card--selected:hover{border-color:#1d4ed8;background:#dbeafe}.border-picker__preview{width:48px;height:48px;border-radius:4px;background:#f9fafb;display:flex;align-items:center;justify-content:center;border:1px solid #d1d5db;overflow:hidden}.border-picker__preview--none{background:linear-gradient(135deg,transparent 30%,#e5e7eb 30%,#e5e7eb 50%,transparent 50%,transparent 80%,#e5e7eb 80%);background-size:8px 8px}.border-picker__no-border-icon{font-size:24px;color:#6b7280;font-weight:700}.border-preview{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.border-preview__icon{font-size:28px;color:#374151}.border-preview__initial{font-size:24px;font-weight:600;color:#6b7280}.border-picker__label{font-size:11px;font-weight:500;color:#374151;text-align:center;line-height:1.3;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.border-picker__card--selected .border-picker__label{color:#1e40af;font-weight:600}.border-picker__category{font-size:9px;text-transform:uppercase;color:#9ca3af;letter-spacing:.5px}.border-picker__loading,.border-picker__error,.border-picker__empty{padding:2rem;text-align:center;color:#6b7280;font-size:13px}.border-picker__error{color:#dc2626}@media (max-width: 768px){.border-picker__grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:.5rem}.border-picker__card{padding:.5rem;min-height:85px}.border-picker__preview{width:40px;height:40px}.border-preview__icon{font-size:22px}.border-preview__initial{font-size:20px}}.motif-picker{padding:1rem;width:100%}.motif-picker__loading,.motif-picker__error,.motif-picker__empty{padding:2rem;text-align:center;color:#6b7280;font-size:.875rem}.motif-picker__error{color:#dc2626}.motif-picker__categories{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}.motif-picker__category-btn{padding:.5rem 1rem;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#374151;font-size:.875rem;cursor:pointer;transition:all .15s ease}.motif-picker__category-btn:hover{background:#f3f4f6;border-color:#9ca3af}.motif-picker__category-btn--active{background:#2563eb;color:#fff;border-color:#2563eb;font-weight:600}.motif-picker__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:1rem;padding:.5rem 0}@media (max-width: 640px){.motif-picker__grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.75rem}}.motif-picker__card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;border:2px solid #e5e7eb;border-radius:8px;background:#fff;cursor:pointer;transition:all .15s ease;min-height:120px}.motif-picker__card:hover{border-color:#2563eb;box-shadow:0 4px 6px -1px #0000001a;transform:translateY(-2px)}.motif-picker__card:active{transform:translateY(0)}.motif-picker__preview{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border:1px solid #e5e7eb;border-radius:4px;background:#f9fafb;position:relative;overflow:hidden}.motif-preview{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.motif-preview__icon{font-size:2rem;color:#374151}.motif-preview__initial{font-size:1.5rem;font-weight:600;color:#6b7280}.motif-preview__grid{display:grid;gap:1px;background:#e5e7eb}.motif-preview__cell{background:#374151}.motif-preview__cell--empty{background:transparent}.motif-picker__label{font-size:.875rem;font-weight:500;color:#374151;text-align:center;line-height:1.2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.motif-picker__difficulty{font-size:.75rem;padding:.125rem .5rem;border-radius:12px;background:#f3f4f6;color:#6b7280;text-transform:capitalize}.motif-picker__difficulty--beginner{background:#d1fae5;color:#065f46}.motif-picker__difficulty--intermediate{background:#fef3c7;color:#92400e}.motif-picker__difficulty--advanced{background:#fee2e2;color:#991b1b}.welcome-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justif y-content: center;z-index:9999;padding:1rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.welcome-modal{background:#fff;border-radius:12px;max-width:560px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;position:relative;padding:2rem;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.welcome-modal-close{position:absolute;top:1rem;right:1rem;background:transparent;border:none;color:#6b7280;cursor:pointer;padding:.5rem;border-radius:6px;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.welcome-modal-close:hover{background-color:#f3f4f6;color:#374151}.welcome-progress{display:flex;gap:.5rem;justify-content:center;margin-bottom:2rem}.welcome-progress-dot{width:8px;height:8px;border-radius:50%;background-color:#e5e7eb;transition:all .2s ease}.welcome-progress-dot.active{background-color:#2563eb;width:24px;border-radius:4px}.welcome-progress-dot.completed{background-color:#10b981}.welcome-step{text-align:center}.welcome-step-icon{font-size:3rem;margin-bottom:1rem;line-height:1}.welcome-step-title{font-size:1.5rem;font-weight:700;color:#111827;margin:0 0 .5rem}.welcome-step-description{font-size:1rem;color:#6b7280;margin:0 0 1.5rem}.welcome-step-body{text-align:left;color:#374151;font-size:.9375rem;line-height:1.6}.welcome-step-content p{margin:0}.welcome-modal-footer{display:flex;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:1.5rem;border-top:1px solid #e5e7eb}@media (max-width: 640px){.welcome-modal{padding:1.5rem;max-height:85vh}.welcome-step-title{font-size:1.25rem}.welcome-step-description{font-size:.9375rem}.welcome-step-body{font-size:.875rem}.welcome-modal-footer{flex-direction:column;gap:.75rem;align-items:stretch}.welcome-modal-footer>div{width:100%}.welcome-modal-footer button{width:100%}}:root{--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-light: #3b82f6;--color-primary-dark: #1e40af;--color-secondary: #10b981;--color-secondary-hover: #059669;--color-secondary-light: #34d399;--color-secondary-dark: #047857;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-success: #10b981;--color-success-bg: #dcfce7;--color-success-border: #86efac;--color-success-text: #166534;--color-warning: #f59e0b;--color-warning-bg: #fef3c7;--color-warning-border: #fbbf24;--color-warning-text: #92400e;--color-error: #dc2626;--color-error-bg: #fee2e2;--color-error-border: #fca5a5;--color-error-text: #991b1b;--color-info: #3b82f6;--color-info-bg: #eff6ff;--color-info-border: #bfdbfe;--color-info-text: #1e40af;--font-family-base: "Atkinson Hyperlegible", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;--font-family-mono: "Courier New", Courier, monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: .75rem;--spacing-lg: 1rem;--spacing-xl: 1.5rem;--spacing-2xl: 2rem;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 1px 3px 0 rgb(0 0 0 / .1);--shadow-lg: 0 4px 6px -1px rgb(0 0 0 / .1);--transition-fast: .15s ease-in-out;--transition-base: .2s ease-in-out;--transition-slow: .3s ease-in-out}body{font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-neutral-900);background:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-neutral-900);margin:0}h1{font-size:var(--font-size-2xl)}h2{font-size:var(--font-size-xl)}h3{font-size:var(--font-size-lg)}h4{font-size:var(--font-size-base)}h5{font-size:var(--font-size-sm)}h6{font-size:var(--font-size-xs)}p{margin:0 0 var(--spacing-lg) 0;line-height:var(--line-height-normal)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.text-primary{color:var(--color-primary)}.text-secondary{color:var(--color-secondary)}.text-muted{color:var(--color-neutral-600)}.text-error{color:var(--color-error)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);line-height:1;border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{cursor:not-allowed;opacity:.6;pointer-events:none}.btn-primary{color:#fff;background:var(--color-primary);border-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-secondary{color:#fff;background:var(--color-secondary);border-color:var(--color-secondary)}.btn-secondary:hover:not(:disabled){background:var(--color-secondary-hover);border-color:var(--color-secondary-hover)}.btn-outline{color:var(--color-primary);background:#fff;border-color:var(--color-primary)}.btn-outline:hover:not(:disabled){color:#fff;background:var(--color-primary)}.btn-ghost{color:var(--color-neutral-700);background:transparent;border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--color-neutral-100)}.btn-sm{padding:.5rem 1rem;font-size:var(--font-size-sm)}.btn-lg{padding:1rem 2rem;font-size:var(--font-size-lg)}.btn-full{width:100%}.form-label{display:block;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);color:var(--color-neutral-900);margin-bottom:var(--spacing-sm)}.form-input,.form-textarea,.form-select{width:100%;padding:.75rem;font-family:var(--font-family-base);font-size:var(--font-size-base);color:var(--color-neutral-900);background:#fff;border:2px solid var(--color-neutral-300);border-radius:var(--radius-md);transition:border-color var(--transition-base)}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--color-primary)}.form-input:disabled,.form-textarea:disabled,.form-select:disabled{background:var(--color-neutral-50);cursor:not-allowed;opacity:.6}.form-textarea{min-height:100px;resize:vertical;font-family:var(--font-family-mono)}.form-select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:1.5em;padding-right:2.5rem}.form-group{margin-bottom:var(--spacing-xl)}.form-hint{font-size:var(--font-size-sm);color:var(--color-neutral-600);margin-top:var(--spacing-sm)}.form-error{font-size:var(--font-size-sm);color:var(--color-error);margin-top:var(--spacing-sm)}input[type=checkbox],input[type=radio]{width:1.25rem;height:1.25rem;cursor:pointer;margin-right:var(--spacing-sm)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-hover);text-decoration:underline}.mode-toggle{display:flex;gap:.5rem}.mode-toggle-segmented{display:inline-flex;background-color:#f3f4f6;border-radius:24px;padding:4px;gap:0;flex-shrink:0;border:1px solid #e5e7eb}.mode-toggle-btn{flex:1;padding:.625rem 1.25rem;min-width:90px;min-height:44px;background-color:transparent;color:#374151;border:none;border-radius:20px;font-size:.9375rem;font-weight:500;cursor:pointer;transition:all .15s ease-in-out;display:flex;align-items:center;justify-content:center}.mode-toggle-btn.active{background-color:#2563eb;color:#fff}.mode-toggle-btn:hover:not(.active){background-color:#f0f4ff}.mode-toggle-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.mode-toggle-label-short{display:none}@media (max-width: 600px){.mode-toggle-segmented{width:100%}.mode-toggle-btn{padding:.75rem 1rem;font-size:.9375rem;min-height:48px}.mode-toggle-label{display:none}.mode-toggle-label-short{display:inline}}@media (max-width: 375px){.mode-toggle-btn{min-width:70px;padding:.75rem;font-size:.875rem}}@media (max-width: 600px){:root{--font-size-base: .9375rem}.btn{padding:.8rem 1.25rem;min-height:44px}.form-input,.form-textarea,.form-select{padding:.8rem;min-height:44px;font-size:var(--font-size-base)}}.hidden{display:none!important}.mt-0{margin-top:0}.mt-1{margin-top:var(--spacing-sm)}.mt-2{margin-top:var(--spacing-md)}.mt-3{margin-top:var(--spacing-lg)}.mt-4{margin-top:var(--spacing-xl)}.mb-0{margin-bottom:0}.mb-1{margin-bottom:var(--spacing-sm)}.mb-2{margin-bottom:var(--spacing-md)}.mb-3{margin-bottom:var(--spacing-lg)}.mb-4{margin-bottom:var(--spacing-xl)}.p-0{padding:0}.p-1{padding:var(--spacing-sm)}.p-2{padding:var(--spacing-md)}.p-3{padding:var(--spacing-lg)}.p-4{padding:var(--spacing-xl)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:var(--spacing-sm)}.gap-2{gap:var(--spacing-md)}.gap-3{gap:var(--spacing-lg)}.gap-4{gap:var(--spacing-xl)}.w-full{width:100%}.h-full{height:100%}.panel{background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:1.25rem;box-shadow:0 1px 3px #0000001a;margin-bottom:1rem}.panel-header{font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#374151;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid #e5e7eb}.info-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;padding:1rem;margin-bottom:1rem}.info-card-blue{background:#eff6ff;border-color:#bfdbfe}.info-card-yellow{background:#fef3c7;border-color:#fbbf24}.info-card-green{background:#dcfce7;border-color:#86efac}.info-card-red{background:#fee2e2;border-color:#fca5a5}.info-card-title{font-size:.875rem;font-weight:600;color:#111827;margin:0 0 .5rem}.info-card-body{font-size:.8125rem;line-height:1.5;color:#4b5563;margin:0}.section-group{margin-bottom:1.5rem}.section-heading{font-size:.875rem;font-weight:600;color:#111827;margin:0 0 .75rem}.control-group{display:flex;flex-direction:column;gap:.75rem}.control-row{display:flex;align-items:center;gap:.75rem}.control-row-space-between{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.layout-two-column{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.layout-main-sidebar{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:1rem}.layout-sidebar-right,.layout-main-content{min-width:0}.advanced-sidebar{background:#f9fafb;border-left:1px solid #e5e7eb;padding:1rem;overflow-y:auto}.input-panel{background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:1.5rem;margin-bottom:1.5rem}.preview-panel{background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:1rem;min-height:300px;display:flex;flex-direction:column}.preview-panel-header{font-size:1rem;font-weight:600;color:#111827;margin:0 0 1rem;padding-bottom:.75rem;border-bottom:1px solid #e5e7eb}.settings-panel{background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:1.25rem;margin-bottom:1rem}.shortcuts-panel{background:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;padding:1rem;margin-top:1rem}.shortcuts-panel h4{margin:0 0 .75rem;font-size:.8125rem;font-weight:600;color:#374151}.shortcuts-panel ul{margin:0;padding-left:1.5rem;font-size:.75rem;line-height:1.6;color:#4b5563}.shortcuts-panel strong{color:#111827;font-weight:600}@media (max-width: 600px){.panel{padding:1rem;border-radius:6px}.layout-two-column{grid-template-columns:1fr;gap:1.5rem}.layout-main-sidebar{grid-template-columns:1fr}.input-panel,.preview-panel,.settings-panel{padding:1rem}.advanced-sidebar{border-left:none;border-top:1px solid #e5e7eb}}.canvas-container{background:#f3f4f6;border-radius:8px;padding:1rem}.panel-divider{height:1px;background:#e5e7eb;margin:1rem 0;border:none}.status-panel{padding:.75rem;border-radius:6px;font-size:.875rem;margin-bottom:1rem;border:1px solid}.status-panel-success{background:#dcfce7;border-color:#86efac;color:#166534}.status-panel-warning{background:#fef3c7;border-color:#fbbf24;color:#92400e}.status-panel-error{background:#fee2e2;border-color:#fca5a5;color:#991b1b}.status-panel-info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}.empty-state{text-align:center;padding:2rem 1rem;color:#6b7280;font-size:.875rem}.empty-state-icon{font-size:2rem;margin-bottom:.5rem;opacity:.5}body{overflow-x:hidden;width:100%}*{box-sizing:border-box}@media (max-width: 900px){.layout-main-sidebar{grid-template-columns:1fr!important}.advanced-sidebar{border-left:none;border-top:1px solid var(--color-neutral-200);max-height:400px;overflow-y:auto}.panel{padding:1rem}}@media (max-width: 768px){.canvas-toolbar--advanced{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:.5rem!important;padding:.75rem!important}.canvas-toolbar__row{display:contents}.canvas-toolbar-btn-text{display:inline!important}.canvas-toolbar-btn{flex-direction:column!important;min-width:44px!important;min-height:52px!important;padding:.5rem .375rem!important;font-size:11px!important;gap:.25rem!important;text-align:center}.canvas-toolbar-btn--canvas{min-width:44px!important;min-height:52px!important}.canvas-toolbar-desktop-only{display:none!important}.canvas-toolbar-btn-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}@media (max-width: 600px) and (min-width: 376px){.canvas-toolbar-btn{font-size:10px!important}}@media (max-width: 600px){.canvas-toolbar{position:relative;z-index:10;width:100%}.canvas-container,.editor-shell__canvas{clear:both;margin-top:.5rem}body>div:first-child{padding:.5rem!important}.layout-two-column{grid-template-columns:1fr!important;gap:1.5rem!important}.layout-main-sidebar{grid-template-columns:1fr!important;gap:1rem}.btn{min-height:44px;padding:.8rem 1.25rem;font-size:1rem}.btn-sm{min-height:44px;padding:.6rem 1rem;font-size:.9375rem}.mode-toggle-btn{min-height:44px;padding:.8rem 1.5rem;font-size:1rem}.form-input,.form-textarea,.form-select{min-height:44px;padding:.8rem;font-size:1rem}input[type=checkbox],input[type=radio]{min-width:44px;min-height:44px}header{margin-bottom:1.5rem!important}header h1{font-size:1.5rem}header .flex{flex-direction:column;align-items:flex-start;gap:1rem}.mode-toggle{width:100%;justify-content:space-between}.panel,.input-panel,.preview-panel,.settings-panel{padding:1rem;border-radius:6px;margin-bottom:1rem}.info-card{padding:.875rem;margin-bottom:1rem}.status-panel{padding:.75rem;font-size:.875rem}.mobile-controls-tabs{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:.5rem;margin-bottom:1rem}.mobile-controls-tab-btn{padding:.75rem .5rem;font-size:.875rem;border:2px solid #ddd;background:#fff;border-radius:6px;cursor:pointer;transition:all .2s ease;font-weight:500}.mobile-controls-tab-btn.active{border-color:#2563eb;background:#2563eb;color:#fff}.mobile-controls-tab-btn:active{transform:scale(.98)}.mobile-controls-content{max-height:calc(100vh - 400px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:.5rem 0;margin-bottom:1rem}.preview-panel{overflow-x:auto;-webkit-overflow-scrolling:touch}.preview-panel-header{font-size:.9375rem;padding-bottom:.5rem;margin-bottom:.75rem}.shortcuts-panel{padding:.875rem}.shortcuts-panel h4{font-size:.8125rem;margin-bottom:.5rem}.shortcuts-panel ul{font-size:.6875rem;padding-left:1.25rem}.mobile-notice{display:block!important;padding:.75rem;margin-bottom:1rem;background:var(--color-info-bg);border:1px solid var(--color-info-border);border-radius:6px;color:var(--color-info-text);font-size:.875rem;text-align:center}@media (min-width: 601px){.mobile-notice{display:none!important}}.mobile-pattern-summary{display:block!important;padding:0 .75rem}@media (min-width: 769px){.mobile-pattern-summary{display:none!important}}.mobile-sticky-footer{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:2px solid var(--color-neutral-200);padding:.75rem 1rem;box-shadow:0 -2px 8px #0000001a;z-index:100;display:flex;gap:.5rem}.mobile-sticky-footer-active{padding-bottom:140px!important}.mobile-sticky-footer-active .editor-shell__canvas{max-height:calc(100vh - 200px)}@media (min-width: 768px){.mobile-sticky-footer{display:none!important}.mobile-sticky-footer-active{padding-bottom:0!important}.mobile-sticky-footer-active .editor-shell__canvas{max-height:none}}.mobile-sticky-footer .btn{flex:1;margin:0}.hide-on-mobile{display:none!important}.advanced-sidebar{background:#fff;border-top:2px solid var(--color-neutral-200);padding:1rem;max-height:none}.sidebar-section{border-bottom:1px solid var(--color-neutral-200);padding:.75rem 0}.sidebar-section:last-child{border-bottom:none}.sidebar-section-header{cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:.875rem;padding:.5rem 0;-webkit-user-select:none;user-select:none}.sidebar-section-content.collapsed{display:none}.canvas-container{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:.25rem}footer{margin-top:2rem!important;padding-top:1.5rem!important;font-size:.8125rem!important}footer p{margin:.25rem 0}}@media (max-width: 375px){body>div:first-child{padding:.75rem!important}header h1{font-size:1.25rem}.mode-toggle-btn,.btn{padding:.7rem 1rem;font-size:.9375rem}.panel,.input-panel,.preview-panel{padding:.875rem}.info-card{padding:.75rem}.mobile-sticky-footer{padding:.625rem .75rem}.canvas-toolbar{gap:.125rem!important;padding:.375rem!important}.canvas-toolbar-btn{padding:.375rem .5rem!important;font-size:.75rem!important;min-height:32px}.canvas-toolbar-label{display:none}.canvas-toolbar-btn-text{display:none!important}.canvas-toolbar svg{width:14px!important;height:14px!important}.canvas-toolbar>div{gap:.1rem!important}}@media (max-height: 600px) and (orientation: landscape){.panel,.input-panel,.preview-panel,.info-card{margin-bottom:.75rem}header{margin-bottom:1rem!important}footer{margin-top:1.5rem!important;padding-top:1rem!important}.mobile-sticky-footer{padding:.5rem .75rem}.mobile-sticky-footer-active{padding-bottom:60px!important}}@media print{.mobile-sticky-footer{display:none!important}.mobile-sticky-footer-active{padding-bottom:0!important}.layout-two-column{grid-template-columns:1fr 1fr!important}.mode-toggle{display:none!important}.panel,.input-panel,.preview-panel{page-break-inside:avoid}}@media (hover: none) and (pointer: coarse){button,a,.mode-toggle-btn{-webkit-tap-highlight-color:rgba(37,99,235,.1)}.control-group,.control-row{gap:1rem}.preview-panel,.canvas-container,.advanced-sidebar{border:1px solid var(--color-neutral-300)}}@media (max-width: 600px){*:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}}@supports (padding: max(0px)){.mobile-sticky-footer{padding-bottom:max(.75rem,env(safe-area-inset-bottom));padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}body>div:first-child{padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.sr-only-focusable:focus{position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal}*:focus-visible{outline:2px solid #2563eb;outline-offset:2px;border-radius:4px}*:focus:not(:focus-visible){outline:none}button:focus-visible{outline:2px solid #2563eb;outline-offset:2px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #2563eb;outline-offset:2px;border-color:#2563eb}a:focus-visible{outline:2px solid #2563eb;outline-offset:2px;text-decoration:underline}@media (prefers-contrast: high){*:focus-visible{outline-width:3px;outline-offset:3px}button,input,select,textarea{border-width:2px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.skip-to-content{position:absolute;top:-40px;left:0;background:#2563eb;color:#fff;padding:8px 16px;text-decoration:none;font-weight:600;z-index:10000;border-radius:0 0 4px}.skip-to-content:focus{top:0}.keyboard-nav-visible{outline:2px dashed #2563eb!important;outline-offset:4px!important}[aria-live=polite],[aria-live=assertive]{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.focus-trap-active{position:relative}[disabled],[aria-disabled=true]{cursor:not-allowed;opacity:.6;pointer-events:none}.error-message{color:#dc2626;font-size:.875rem;margin-top:.25rem}input:invalid,input[aria-invalid=true]{border-color:#dc2626}.success-message{color:#059669;font-size:.875rem;margin-top:.25rem}.required:after{content:" *";color:#dc2626;font-weight:700}.tooltip{position:relative}.tooltip[aria-describedby]{cursor:help}.focus-within:focus-within{outline:2px solid #2563eb;outline-offset:2px}@media print{.no-print{display:none!important}a[href]:after{content:" (" attr(href) ")";font-size:.8em;font-weight:400}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}}@media (prefers-contrast: high){body{background:#fff;color:#000}button,input,select,textarea{border:2px solid black}}[aria-busy=true]{cursor:wait}.dialog-backdrop{background:#00000080;position:fixed;top:0;left:0;right:0;bottom:0;z-index:999}p{line-height:1.5;letter-spacing:.12em}button,a,input[type=checkbox],input[type=radio]{min-width:44px;min-height:44px}p a,span a{min-width:auto;min-height:auto}.color-swatch,[class*=color-swatch],[class*=ColorSwatch],button[aria-label*=color],button[aria-label*=Color]{min-width:44px!important;min-height:44px!important;margin:2px!important}button[aria-label*=Increase],button[aria-label*=Decrease],button[aria-label*=increment],button[aria-label*=decrement],.increment-button,.decrement-button{min-width:44px!important;min-height:44px!important;padding:12px!important}.toggle,.switch,[role=switch],input[type=checkbox],input[type=radio]{min-width:44px!important;min-height:44px!important}.mode-toggle,[aria-label*=mode],[aria-label*=Mode]{min-width:44px!important;min-height:44px!important;padding:12px 16px!important}button:not(:has(>span:not(.sr-only))):not(:has(>div)),button[aria-label]:empty{min-width:44px!important;min-height:44px!important;padding:12px!important}button+button,a+a{margin-left:4px}.toolbar button,[role=toolbar] button{min-width:44px!important;min-height:44px!important;margin:0 2px!important}.tooltip-container{position:relative;display:inline-flex;align-items:center}.tooltip-content{position:absolute;z-index:1000;padding:.5rem .75rem;font-size:.875rem;line-height:1.4;color:#fff;background:#000000e6;border-radius:6px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s ease-in-out;box-shadow:0 4px 6px -1px #0003,0 2px 4px -2px #0003}.tooltip-content.tooltip-visible{opacity:1}.tooltip-content.tooltip-top{bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip-content.tooltip-top:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:rgba(0,0,0,.9) transparent transparent transparent}.tooltip-content.tooltip-bottom{top:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip-content.tooltip-bottom:after{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:transparent transparent rgba(0,0,0,.9) transparent}.tooltip-content.tooltip-left{right:calc(100% + 8px);top:50%;transform:translateY(-50%)}.tooltip-content.tooltip-left:after{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);border-width:6px;border-style:solid;border-color:transparent transparent transparent rgba(0,0,0,.9)}.tooltip-content.tooltip-right{left:calc(100% + 8px);top:50%;transform:translateY(-50%)}.tooltip-content.tooltip-right:after{content:"";position:absolute;right:100%;top:50%;transform:translateY(-50%);border-width:6px;border-style:solid;border-color:transparent rgba(0,0,0,.9) transparent transparent}@media (max-width: 600px){.tooltip-content{font-size:.8125rem;padding:.4rem .625rem;max-width:200px;white-space:normal}.tooltip-content.tooltip-top{bottom:auto;top:calc(100% + 8px)}.tooltip-content.tooltip-top:after{top:auto;bottom:100%;border-color:transparent transparent rgba(0,0,0,.9) transparent}}@media (prefers-contrast: high){.tooltip-content{background:#000;border:1px solid #ffffff}}@media (prefers-reduced-motion: reduce){.tooltip-content{transition:none}}.tooltip-container svg{margin-left:.25rem;vertical-align:middle}.btn svg{margin-right:.5rem;vertical-align:middle}.btn-icon-only svg{margin-right:0}.info-icon{color:var(--color-primary);cursor:help;opacity:.7;transition:opacity .2s ease}.info-icon:hover,.info-icon:focus{opacity:1}.help-text-with-icon{display:inline-flex;align-items:center;gap:.375rem;font-size:.875rem;color:var(--color-neutral-600)}.help-text-with-icon svg{flex-shrink:0}