:root{--kolam-font-sans: "Space Grotesk", sans-serif;--kolam-font-mono: "Chicago", "Geneva", "Monaco", "Courier New", monospace;--kolam-color-background: #f4f6f1;--kolam-color-surface: #ffffff;--kolam-color-text: #000000;--kolam-color-border: #1f2422;--kolam-color-muted: #69736f;--kolam-color-accent: #0f766e;--kolam-color-soft-border: #d5dbd2;--kolam-color-panel: rgba(255, 255, 255, .92);--kolam-color-hover: #e7eee9;--kolam-color-selected-bg: #000000;--kolam-color-selected-text: #ffffff;--kolam-canvas-background: #f9faf7;--kolam-canvas-shadow: rgba(15, 23, 21, .06);--kolam-overlay-bg: rgba(15, 23, 21, .48);--kolam-transition-fast: .1s ease;--kolam-outline-width: 2px;--kolam-outline-color: #0f766e;--kolam-outline-offset: 2px}.kolam-editor-container--dark{--kolam-color-background: #0b0f0e;--kolam-color-surface: #121817;--kolam-color-text: #f5f2e9;--kolam-color-border: #cfd8d2;--kolam-color-muted: #97a19b;--kolam-color-accent: #5eead4;--kolam-color-soft-border: #2a3531;--kolam-color-panel: rgba(18, 24, 23, .94);--kolam-color-hover: #1d2825;--kolam-color-selected-bg: #f5f2e9;--kolam-color-selected-text: #101513;--kolam-canvas-background: #101513;--kolam-canvas-shadow: rgba(0, 0, 0, .42);--kolam-overlay-bg: rgba(0, 0, 0, .62);--kolam-outline-color: #5eead4}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;min-height:100%}body{margin:0;width:100vw;min-width:320px;overflow:hidden;font-family:var(--kolam-font-sans);background:var(--kolam-color-background);color:var(--kolam-color-text)}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;color:inherit}.App{min-height:100vh;min-height:100dvh;background:var(--kolam-color-background);color:var(--kolam-color-text)}:where(.control-panel,.editor-tool-column,.menu-bar,.pattern-ribbon,.pattern-gallery,.compact-editing-toolbar,.shortcuts-panel,.pattern-selection-indicator,.menu-dropdown,.pattern-strip-container){background:var(--kolam-color-surface);color:var(--kolam-color-text);border:1px solid var(--kolam-color-soft-border);border-radius:0;box-shadow:none}.shortcuts-overlay{background:var(--kolam-overlay-bg)}:where(.toolbar-button,.control-button,.file-upload-button,.tab-button,.help-button){font:inherit;font-weight:600;text-transform:uppercase;letter-spacing:.08em;border:1px solid var(--kolam-color-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);cursor:pointer;transition:background var(--kolam-transition-fast),color var(--kolam-transition-fast),outline var(--kolam-transition-fast);box-shadow:none}:where(.toolbar-button,.control-button,.file-upload-button,.tab-button,.help-button):disabled{cursor:not-allowed}:where(.toolbar-button,.control-button,.file-upload-button,.tab-button,.help-button):focus-visible{outline:var(--kolam-outline-width) solid var(--kolam-outline-color);outline-offset:var(--kolam-outline-offset)}:where(.pattern-item,.tool-item){cursor:pointer;color:var(--kolam-color-text);border-radius:0;transition:background var(--kolam-transition-fast),color var(--kolam-transition-fast),outline var(--kolam-transition-fast)}:where(.pattern-item:hover,.tool-item:hover){background:var(--kolam-color-hover)}:where(.pattern-item.selected,.tool-item.selected){background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);outline:var(--kolam-outline-width) solid var(--kolam-outline-color);outline-offset:-2px}kbd{font-family:var(--kolam-font-mono)}.kolam-editor-container{width:100vw;height:100vh;height:100dvh;padding:0;box-sizing:border-box;display:flex;flex-direction:column;align-items:stretch;overflow:hidden;gap:0;background:var(--kolam-color-background)}.editor-stage{position:relative;width:100%;display:grid;grid-template-columns:82px minmax(0,1fr) minmax(224px,262px);column-gap:2px;row-gap:0;align-items:stretch;flex:1 1 auto;min-height:0;padding:0;box-sizing:border-box}.editor-main{display:flex;flex-direction:column;gap:0;min-height:0;height:100%;min-width:0;overflow:hidden}.editor-topbar{width:100%;display:flex;position:relative;z-index:1800;padding:0;box-sizing:border-box}.menu-bar{display:flex;flex-direction:column;gap:0;width:100%;min-width:0;border-color:var(--kolam-color-soft-border);background:var(--kolam-color-panel);overflow:visible}.menu-row{display:flex;align-items:stretch;gap:2px;width:100%;min-width:0;padding:2px;overflow:visible}.menu-row--primary{border-bottom:none}.menu-root{position:relative;z-index:1810;display:flex;flex:0 0 auto}.menu-placeholder{visibility:hidden}.menu-trigger{font:inherit;font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:6px 10px;border-radius:0;border:none;background:transparent;color:var(--kolam-color-text);cursor:pointer;transition:background .1s ease,color .1s ease;flex:0 0 auto;min-width:0;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.15;white-space:nowrap;box-sizing:border-box}.menu-trigger:hover,.menu-trigger.open{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.menu-toolbar{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;padding:0;height:100%}.menu-toolbar-group{display:flex;align-items:center;gap:2px}.menu-toolbar-group--help{margin-left:auto}.menu-toolbar-separator{width:1px;height:clamp(32px,3vw,44px);background:var(--kolam-color-border, #000000);margin:0 clamp(8px,1.8vw,20px)}.toolbar-sidebar{position:relative;z-index:12;display:flex;flex-direction:column;align-items:center;gap:2px;height:100%;min-height:0;border:1px solid var(--kolam-color-soft-border);border-radius:0;padding:2px;box-sizing:border-box;min-width:0;width:100%;max-width:none;background:var(--kolam-color-panel);overflow:hidden}.pattern-gallery-bar{position:absolute;top:0;left:84px;z-index:8;width:112px;max-height:100%;border:1px solid var(--kolam-color-soft-border);border-radius:0;padding:0;overflow:hidden;background:var(--kolam-color-panel);display:flex;flex-direction:column;box-shadow:0 10px 22px #0f17151f;opacity:0;pointer-events:none;transform:translate(-28px);transition:opacity .14s ease,transform .14s ease,visibility 0s linear .14s;visibility:hidden}.pattern-gallery-bar--open{opacity:1;pointer-events:auto;transform:translate(0);transition-delay:0s;visibility:visible}.stamp-palette-header{flex:0 0 auto;display:flex;justify-content:flex-end;border-bottom:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-panel)}.stamp-palette-collapse{width:28px;height:24px;display:inline-flex;align-items:center;justify-content:center;border:none;border-left:1px solid var(--kolam-color-soft-border);border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer}.stamp-palette-collapse:hover,.stamp-palette-collapse:focus-visible{background:var(--kolam-color-hover)}.stamp-palette-content{flex:1 1 auto;min-height:0}.inspector-panel{min-width:0;height:100%;overflow-y:auto;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-panel);color:var(--kolam-color-text)}.inspector-mobile-tabs{display:none}.inspector-section{display:flex;flex-direction:column;gap:9px;padding:12px 12px 13px;border-bottom:1px solid var(--kolam-color-soft-border)}.inspector-section:last-child{border-bottom:none}.inspector-section h2{margin:0;font-size:.68rem;font-weight:800;letter-spacing:.08em;line-height:1;text-transform:uppercase}.inspector-preview-section{padding:4px}.inspector-preview-frame{width:100%;height:158px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-canvas-background);overflow:hidden}.inspector-preview-canvas{display:block;width:100%;height:100%}.inspector-control,.inspector-check{display:grid;grid-template-columns:minmax(70px,1fr) minmax(98px,auto);gap:8px;align-items:center;font-size:.76rem}.inspector-control span,.inspector-check span{min-width:0}.inspector-control input[type=range]{width:100%;accent-color:var(--kolam-color-text)}.inspector-check input[type=checkbox]{justify-self:end;width:18px;height:18px;accent-color:var(--kolam-color-text)}.inspector-stepper{display:grid;grid-template-columns:minmax(42px,1fr) 28px 28px;justify-self:end;width:min(100%,116px);border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface)}.inspector-stepper input,.inspector-stepper button{min-width:0;height:30px;border:none;border-radius:0;background:transparent;color:var(--kolam-color-text);font:inherit}.inspector-stepper input{width:100%;padding:0 6px;text-align:center;appearance:textfield;-moz-appearance:textfield}.inspector-stepper input::-webkit-outer-spin-button,.inspector-stepper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.inspector-stepper button{display:inline-flex;align-items:center;justify-content:center;border-left:1px solid var(--kolam-color-soft-border);cursor:pointer;font-size:1rem;line-height:1}.inspector-stepper button:hover,.inspector-stepper button:focus-visible{background:var(--kolam-color-hover)}.inspector-segmented{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.inspector-segmented button{min-width:0;height:34px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.inspector-segmented button:hover,.inspector-segmented button:focus-visible{background:var(--kolam-color-hover);border-color:var(--kolam-color-soft-border)}.inspector-segmented button.selected{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.inspector-segmented--appearance{grid-template-columns:repeat(2,1fr)}.inspector-segmented--orientation{grid-template-columns:repeat(2,1fr);justify-self:end;width:min(100%,148px)}.inspector-control--line-style{align-items:center}.inspector-line-style-dropdown{position:relative;justify-self:end;width:min(100%,148px)}.inspector-line-style-trigger,.inspector-line-style-menu button{min-width:0;width:100%;min-height:38px;display:grid;gap:8px;align-items:center;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.68rem;font-weight:800;letter-spacing:.05em;line-height:1;padding:4px 8px;text-transform:uppercase}.inspector-line-style-trigger{grid-template-columns:minmax(0,1fr) 8px}.inspector-line-style-trigger:after{content:"";width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor}.inspector-line-style-menu{position:absolute;top:calc(100% + 3px);right:0;z-index:40;width:184px;display:grid;gap:3px;padding:4px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface)}.inspector-line-style-menu button{grid-template-columns:minmax(0,1fr);min-height:42px;border-color:transparent;text-align:initial}.inspector-line-style-trigger:hover,.inspector-line-style-trigger:focus-visible,.inspector-line-style-menu button:hover,.inspector-line-style-menu button:focus-visible{background:var(--kolam-color-hover)}.inspector-line-style-menu button.selected{background:var(--kolam-color-hover);box-shadow:inset 0 0 0 1px var(--kolam-color-accent);color:var(--kolam-color-text)}.line-style-preview{width:100%;height:28px;display:block;border:0;background:transparent;overflow:visible}.toolbar-divider{width:78px;max-width:78px;height:1px;background:var(--kolam-color-soft-border);opacity:.6;margin:0}.toolbar-sidebar-section{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%}.toolbar-sidebar-section--single{justify-content:center}.sidebar-icon-button{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);font-size:1.35rem;cursor:pointer;transition:background var(--kolam-transition-fast),color var(--kolam-transition-fast),border-color var(--kolam-transition-fast)}.sidebar-icon-button:hover:not(:disabled),.sidebar-icon-button:focus-visible{background:var(--kolam-color-hover);color:var(--kolam-color-text);border-color:var(--kolam-color-soft-border)}.sidebar-icon-button:disabled{opacity:.35;cursor:not-allowed}.sidebar-action-icon{width:22px;height:22px}.sidebar-icon-button span{line-height:1}.editor-statusbar{flex:0 0 auto;min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 8px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-panel);color:var(--kolam-color-text);font-size:.68rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase}.statusbar-group{display:flex;align-items:center;min-width:0}.statusbar-group--state{gap:clamp(10px,2.4vw,28px);overflow:hidden}.statusbar-item{flex:0 0 auto;white-space:nowrap}.statusbar-zoom{gap:0;flex:0 0 auto;margin-left:auto;border-left:1px solid var(--kolam-color-soft-border);border-right:1px solid var(--kolam-color-soft-border)}.statusbar-icon-button,.statusbar-zoom-value{width:32px;height:28px;display:inline-flex;align-items:center;justify-content:center;border:none;border-left:1px solid var(--kolam-color-soft-border);border-radius:0;background:transparent;color:var(--kolam-color-text);font:inherit}.statusbar-icon-button:first-child{border-left:none}.statusbar-icon-button{cursor:pointer}.statusbar-icon-button:hover:not(:disabled),.statusbar-icon-button:focus-visible{background:var(--kolam-color-hover)}.statusbar-icon-button:disabled{opacity:.35;cursor:not-allowed}.statusbar-zoom-value{width:58px;font-variant-numeric:tabular-nums}.pattern-gallery-bar .pattern-gallery-wrapper{padding-bottom:0}.pattern-gallery-bar .stamp-palette-content,.pattern-gallery-bar .pattern-gallery,.pattern-gallery-bar .pattern-sidebar-scroll{height:100%}.pattern-gallery-bar .pattern-grid--stack{gap:2px;padding:3px;justify-content:start}@media (min-width: 721px){.menu-root--canvas{display:none}.toolbar-sidebar{align-items:stretch}.toolbar-sidebar .tool-palette--vertical{align-items:stretch;gap:2px}.toolbar-sidebar .tool-stack,.toolbar-sidebar .toolbar-sidebar-section{display:grid;grid-template-columns:repeat(2,38px);gap:2px;justify-content:center}.toolbar-sidebar .toolbar-sidebar-section--single{grid-template-columns:38px}}.menu-toolbar-item{position:relative;display:flex}.menu-toolbar-button{font:inherit;font-size:clamp(.7rem,calc(.74rem + .15vw),.9rem);font-weight:600;letter-spacing:.08em;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;width:clamp(32px,2.8vw,42px);height:clamp(32px,2.8vw,42px);border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;transition:background .1s ease,color .1s ease,border-color .1s ease}.menu-toolbar-button:hover:not(:disabled),.menu-toolbar-button.open{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.menu-toolbar-button:disabled{opacity:.4;cursor:not-allowed}.menu-toolbar-icon{line-height:1}.menu-dropdown--toolbar{margin-top:4px}.menu-dropdown{position:absolute;top:calc(100% + 3px);left:0;min-width:220px;padding:6px;display:flex;flex-direction:column;gap:4px;z-index:1820;border-color:var(--kolam-color-soft-border);background:var(--kolam-color-surface)}.menu-toolbar-group--help .menu-toolbar-item .menu-dropdown--toolbar{left:auto;right:0}.menu-group-label{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--kolam-color-text);margin-bottom:4px}.menu-item{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:var(--kolam-color-text);padding:7px 8px;border-bottom:1px solid var(--kolam-color-soft-border);border-radius:0}.menu-item:last-child,.menu-item.menu-version-selector{border-bottom:none}.menu-item:hover{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.menu-item:hover input,.menu-item:hover button,.menu-item:hover select,.menu-item:hover textarea{background:transparent;color:inherit;border-color:currentColor}.menu-item.menu-action{cursor:pointer;border:none;background:none}.menu-item.menu-action:disabled{cursor:not-allowed;opacity:.5}.menu-item.menu-action:disabled:hover{background:none;color:inherit}.menu-version-selector{flex-direction:column;align-items:stretch;gap:6px}.menu-version-grid{display:grid;grid-template-columns:repeat(3,minmax(48px,1fr));gap:4px;width:100%}.menu-version-button{border:1px solid var(--kolam-color-border);background:var(--kolam-color-surface);color:var(--kolam-color-text);font-size:.65rem;font-weight:600;letter-spacing:.06em;padding:2px 6px;border-radius:0;cursor:pointer;transition:background .1s ease;width:100%;text-align:center}.menu-version-button:hover{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.menu-version-button.active{background:var(--kolam-color-accent);color:#fff}.menu-item input,.menu-item button,.menu-item label{font:inherit}.menu-item input[type=number]{width:72px;padding:4px 6px;border-radius:0;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface);color:inherit}.menu-item input[type=range]{flex:1;accent-color:var(--kolam-color-border)}.menu-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--kolam-color-border)}.menu-item button{border:1px solid var(--kolam-color-border);background:var(--kolam-color-surface);border-radius:0;padding:4px 8px;cursor:pointer;color:inherit}.menu-item .inspector-line-style-trigger{border-color:var(--kolam-color-soft-border)}.menu-item .inspector-line-style-menu button{border-color:transparent}.special-dialog-backdrop{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--kolam-overlay-bg);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.canvas-menu-dialog-backdrop{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;padding:16px;background:var(--kolam-overlay-bg);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.canvas-menu-dialog{width:min(360px,100%);border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);padding:14px;display:flex;flex-direction:column;gap:12px;box-shadow:0 24px 80px #0f171538}.canvas-menu-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--kolam-color-soft-border);padding-bottom:8px}.canvas-menu-dialog h2{margin:0;font-size:.86rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.canvas-menu-dialog-close{width:28px;height:28px;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);cursor:pointer;font-size:.78rem;font-weight:700;line-height:1}.canvas-menu-dialog-close:hover,.canvas-menu-dialog-close:focus-visible{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.canvas-menu-dialog-body{display:grid;gap:8px}.menu-control{align-items:center}.menu-control--number,.menu-control--segmented,.menu-control--line-style,.menu-control--check{display:grid;grid-template-columns:minmax(82px,1fr) minmax(0,auto)}.menu-stepper{display:grid;grid-template-columns:28px minmax(42px,1fr) 28px;justify-self:end;width:min(100%,116px);border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface);overflow:hidden}.menu-stepper input,.menu-stepper button{min-width:0;height:30px;border:none;border-radius:0;background:transparent;color:var(--kolam-color-text);font:inherit}.menu-stepper input{width:100%;border-left:1px solid var(--kolam-color-soft-border);border-right:1px solid var(--kolam-color-soft-border);padding:0 6px;text-align:center;appearance:textfield;-moz-appearance:textfield;font-weight:700}.menu-stepper input::-webkit-outer-spin-button,.menu-stepper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.menu-stepper button{display:inline-flex;align-items:center;justify-content:center;padding:0;cursor:pointer;line-height:0}.menu-stepper button:hover,.menu-stepper button:focus-visible{background:var(--kolam-color-hover)}.menu-segmented{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);justify-self:end;width:min(100%,188px);border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface)}.menu-segmented button{min-width:0;height:30px;border:none;border-left:1px solid var(--kolam-color-soft-border);border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.58rem;font-weight:800;letter-spacing:.035em;line-height:1;padding:0 5px;text-transform:uppercase;white-space:nowrap}.menu-segmented button:first-child{border-left:none}.menu-segmented button:hover,.menu-segmented button:focus-visible{background:var(--kolam-color-hover)}.menu-segmented button.selected{background:var(--kolam-color-accent);color:#fff}.kolam-editor-container--dark .menu-segmented button.selected{color:#101513}.special-dialog{width:min(340px,100%);border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);padding:14px;display:flex;flex-direction:column;gap:12px;box-shadow:0 24px 80px #0f171538}.special-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--kolam-color-soft-border);padding-bottom:8px}.special-dialog h2{margin:0;font-size:.86rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.special-dialog-close{width:28px;height:28px;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);cursor:pointer;font-size:.78rem;font-weight:700;line-height:1}.special-dialog-field{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.special-dialog-field input,.special-dialog-field select{width:96px;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);padding:5px 6px;font:inherit;text-align:right}.special-dialog-field select{text-align:left;text-transform:uppercase}.special-dialog-field--slider{align-items:stretch;flex-direction:column;gap:6px}.special-dialog-field--slider input[type=range]{width:100%;border:0;background:transparent;accent-color:var(--kolam-color-border);padding:0}.special-dialog-range-labels{display:flex;justify-content:space-between;color:var(--kolam-color-muted);font-size:.64rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase}.special-dialog-meta{color:var(--kolam-color-muted);font-size:.68rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.export-progress{display:grid;gap:7px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-background);padding:9px}.export-progress-header{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--kolam-color-text);font-size:.68rem;font-weight:700;letter-spacing:.045em;line-height:1.2;text-transform:uppercase}.export-progress-track{height:7px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface);overflow:hidden}.export-progress-fill{height:100%;background:var(--kolam-color-accent);transition:width .16s ease}.export-progress-error{color:var(--kolam-color-text);font-size:.66rem;font-weight:600;letter-spacing:0;line-height:1.32;text-transform:none}.export-progress--error .export-progress-fill{background:#b7493f}.special-dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:2px}.special-dialog-button{min-height:32px;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.special-dialog-button:hover,.special-dialog-close:hover,.special-dialog-button--primary{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.special-dialog-button:disabled,.special-dialog-close:disabled,.special-dialog-field select:disabled,.special-dialog-field input:disabled{cursor:default;opacity:.55}.special-dialog-button:disabled:hover,.special-dialog-close:disabled:hover{background:var(--kolam-color-surface);color:var(--kolam-color-text)}.settings-dialog-backdrop{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--kolam-overlay-bg);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.settings-dialog{width:min(450px,100%);border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);padding:14px;display:flex;flex-direction:column;gap:12px;box-shadow:0 24px 80px #0f171538}.settings-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--kolam-color-soft-border);padding-bottom:8px}.settings-dialog h2,.settings-section h3{margin:0;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.settings-dialog h2{font-size:.8rem}.settings-section h3{color:var(--kolam-color-text);font-size:.62rem;letter-spacing:.09em}.settings-dialog-close{width:28px;height:28px;border:1px solid var(--kolam-color-soft-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);cursor:pointer;font-size:.78rem;font-weight:700;line-height:1}.settings-dialog-close:hover,.settings-dialog-close:focus-visible{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.settings-dialog-body{display:flex;flex-direction:column;gap:0}.settings-section{background:transparent}.settings-section+.settings-section{margin-top:9px;padding-top:10px;border-top:1px solid var(--kolam-color-soft-border)}.settings-section-header{display:flex;align-items:center;padding:0 0 1px}.settings-section-controls{display:flex;flex-direction:column;padding:0}.settings-control{display:grid;grid-template-columns:minmax(0,1fr) 198px;grid-template-areas:"title control" "help .";align-items:center;column-gap:12px;row-gap:1px;padding:7px 0;position:relative}.settings-control:first-child{padding-top:3px}.settings-control+.settings-control:before{content:"";position:absolute;top:0;left:10px;right:10px;height:1px;background:var(--kolam-color-soft-border)}.settings-control-title{grid-area:title;font-size:.64rem;font-weight:800;letter-spacing:.05em;line-height:1.1;text-transform:uppercase}.settings-control-help{grid-area:help;color:var(--kolam-color-muted);font-size:.65rem;font-weight:400;letter-spacing:0;line-height:1.32;max-width:100%;text-transform:none}.settings-segmented{grid-area:control;display:grid;grid-template-columns:repeat(2,99px);justify-self:start;width:max-content;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-surface)}.settings-segmented button{min-width:0;min-height:26px;border:none;border-left:1px solid var(--kolam-color-soft-border);border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.54rem;font-weight:800;letter-spacing:.035em;line-height:1;padding:0 5px;text-transform:uppercase;white-space:nowrap}.settings-segmented button:first-child{border-left:none}.settings-segmented button:hover,.settings-segmented button:focus-visible{background:var(--kolam-color-hover)}.settings-segmented button.selected{background:var(--kolam-color-accent);color:#fff}.kolam-editor-container--dark .settings-segmented button.selected{color:#101513}.settings-segmented--three{grid-template-columns:repeat(3,66px)}.pattern-ribbon{border-left:none;border-right:none;padding:0;position:relative;z-index:5;flex-shrink:0}.pattern-ribbon-footer{margin-top:16px}.canvas-stage{position:relative;flex:1;min-height:0;width:100%;display:flex;justify-content:center;align-items:center;border:none;border-radius:0;padding:0;background:transparent;overflow:hidden}.grid-canvas-container{flex:1;height:100%;width:100%;display:block;overflow:auto;border:none;padding:0;max-height:100%;max-width:100%;overscroll-behavior:contain}.grid-canvas-scroll-inner{width:max-content;height:max-content;min-width:100%;min-height:100%;display:flex;align-items:center;justify-content:center}.grid-canvas-stack{position:relative;flex:0 0 auto}.selection-overlay-plane{position:absolute;z-index:3;pointer-events:none;transform-origin:center}.selection-marquee{position:absolute;box-sizing:border-box;color:var(--kolam-color-accent);min-width:3px;min-height:3px;filter:drop-shadow(0 0 1px var(--kolam-color-surface))}.selection-marquee__svg{position:absolute;inset:1px;width:calc(100% - 2px);height:calc(100% - 2px);overflow:visible;pointer-events:none}.selection-marquee__outline{fill:none;stroke:currentColor;stroke-dasharray:13px 10px;stroke-dashoffset:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-width:2.2px;vector-effect:non-scaling-stroke;animation:selection-march .95s linear infinite}.selection-marquee--draft{color:var(--kolam-color-muted);opacity:.8}.selection-marquee--draft .selection-marquee__outline{animation:none}.selection-marquee--moving{background-color:color-mix(in srgb,var(--kolam-color-panel) 18%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--kolam-color-panel) 62%,transparent),0 8px 20px #0f17151f}@keyframes selection-march{to{stroke-dashoffset:-23px}}.selection-action-bar{position:absolute;left:50%;bottom:10px;z-index:25;display:flex;align-items:center;justify-content:center;gap:2px;padding:3px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-panel);box-shadow:0 10px 28px #0f171529;transform:translate(-50%)}.selection-action-bar button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:64px;height:32px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.6rem;font-weight:800;letter-spacing:.04em;line-height:1;padding:0 8px;text-transform:uppercase;white-space:nowrap}.selection-action-bar button:hover:not(:disabled),.selection-action-bar button:focus-visible{background:var(--kolam-color-hover);border-color:var(--kolam-color-soft-border)}.selection-action-bar button:disabled{cursor:not-allowed;opacity:.38}.grid-canvas-stack canvas{position:absolute;inset:0;width:100%;height:100%}.grid-dot-canvas,.gesture-preview-canvas,.grid-canvas{display:block;border-radius:0;border:none;background-color:transparent;box-shadow:none;transition:none}.gesture-preview-canvas,.grid-dot-canvas{pointer-events:none}.grid-canvas{touch-action:none;-ms-touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.pattern-selection-indicator{position:fixed;top:24px;left:50%;transform:translate(-50%);background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);padding:.6rem 1.2rem;border-radius:0;border:1px solid var(--kolam-color-border);box-shadow:0 12px 36px #0f17152e;font-size:.85rem;font-weight:600;z-index:2500;text-align:center;letter-spacing:.08em}.pattern-selection-indicator small{display:block;font-size:.65rem;opacity:.8}.menu-dropdown .menu-item:hover{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text)}.menu-dropdown .menu-item:hover input,.menu-dropdown .menu-item:hover button,.menu-dropdown .menu-item:hover select,.menu-dropdown .menu-item:hover textarea,.menu-dropdown .menu-item:hover label{background:transparent;color:inherit;border-color:currentColor}.menu-dropdown .menu-item:hover input::placeholder,.menu-dropdown .menu-item:hover textarea::placeholder{color:#fffc}@media (max-width: 720px){.menu-item input[type=number]{width:unset}.kolam-editor-container{padding:0;gap:0}.editor-topbar{order:1;flex:0 0 auto}.editor-stage{order:2;display:flex;flex:1 1 auto;flex-direction:column;min-height:0;width:100%;position:relative}.toolbar-sidebar{order:2;z-index:1700}.pattern-gallery-bar{position:absolute;top:42px;left:0;right:0;z-index:1500;width:100%;max-height:84px;flex:none;border-left:none;border-right:none;box-shadow:none;transform:translateY(-8px)}.pattern-gallery-bar--open{transform:translateY(0)}.stamp-palette-header{display:none}.pattern-gallery-bar .pattern-sidebar-scroll{width:100%;height:auto;overflow:hidden}.pattern-gallery-bar .pattern-grid--stack{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-auto-rows:39px;gap:1px;padding:2px;justify-content:stretch;align-content:start}.pattern-gallery-bar .pattern-grid .pattern-item{width:100%;max-width:none;min-width:0;height:39px;gap:1px;padding:2px 1px 3px}.pattern-gallery-bar .pattern-item canvas{width:21px;height:21px}.pattern-gallery-bar .pattern-label{font-size:.48rem;line-height:1}.editor-main{order:4;flex:1 1 auto;gap:0;height:auto}.toolbar-sidebar{flex-direction:row;align-items:center;justify-content:stretch;width:100%;height:auto;min-height:42px;padding:2px;overflow:visible;border-left:none;border-right:none}.toolbar-sidebar>.toolbar-divider,.toolbar-sidebar>.toolbar-sidebar-section--single{display:none}.toolbar-sidebar .tool-palette{width:auto;min-width:0;flex:1 1 auto}.toolbar-sidebar .tool-palette--vertical{display:grid;grid-template-columns:minmax(0,4fr) 38px;align-items:stretch;gap:2px}.toolbar-sidebar .tool-stack{display:grid;width:auto;min-width:0;gap:2px}.toolbar-sidebar .tool-stack:first-child{grid-template-columns:repeat(4,minmax(0,1fr))}.toolbar-sidebar .tool-item--shape{display:none}.toolbar-sidebar .mobile-shape-tool{display:block;width:100%}.toolbar-sidebar .tool-stack--actions{padding-top:0;margin-top:0;padding-left:3px;margin-left:0;border-top:none;border-left:1px solid var(--kolam-color-soft-border);grid-template-columns:minmax(0,1fr)}.toolbar-sidebar .tool-action-icon-button{display:none}.toolbar-sidebar .tool-item,.toolbar-sidebar .sidebar-icon-button{width:100%;height:36px;min-width:0}.toolbar-sidebar>.toolbar-sidebar-section:not(.toolbar-sidebar-section--single){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:0 0 72px;width:72px;gap:2px}.toolbar-divider{width:1px;height:34px;margin:0 1px}.menu-row{flex-wrap:wrap;gap:3px;padding:2px}.menu-root{position:relative}.menu-trigger{font-size:.62rem;padding:6px}.menu-trigger,.menu-item,.menu-item button,.canvas-menu-dialog button,.settings-dialog button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.menu-dropdown{top:calc(100% + 2px);min-width:min(218px,calc(100vw - 10px));max-width:calc(100vw - 10px)}.menu-root--help .menu-dropdown{left:auto;right:0}.inspector-panel{display:none}.canvas-stage{padding:0}.selection-action-bar{bottom:6px;max-width:calc(100vw - 12px);overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.selection-action-bar::-webkit-scrollbar{display:none}.selection-action-bar button{min-width:58px;height:30px;gap:4px;font-size:.54rem;padding:0 6px}.canvas-menu-dialog-backdrop{display:flex;align-items:flex-end;padding:8px}.canvas-menu-dialog{width:100%;max-height:min(70vh,380px);overflow:visible;padding:11px 12px 12px;gap:9px}.canvas-menu-dialog-body{gap:5px}.canvas-menu-dialog .menu-item{gap:8px;font-size:.66rem;padding:5px 0}.canvas-menu-dialog .menu-control--number,.canvas-menu-dialog .menu-control--segmented,.canvas-menu-dialog .menu-control--line-style,.canvas-menu-dialog .menu-control--check{grid-template-columns:minmax(74px,1fr) minmax(0,176px);column-gap:8px}.canvas-menu-dialog .menu-stepper{grid-template-columns:29px 42px 29px;width:100px}.canvas-menu-dialog .menu-stepper input,.canvas-menu-dialog .menu-stepper button{height:30px;font-size:.68rem}.canvas-menu-dialog .menu-segmented{width:100%}.canvas-menu-dialog .menu-segmented button{height:30px;font-size:.58rem;padding:0 4px}.canvas-menu-dialog .inspector-line-style-dropdown{width:100%}.canvas-menu-dialog .inspector-line-style-trigger,.canvas-menu-dialog .inspector-line-style-menu button{min-height:31px;padding:2px 7px}.canvas-menu-dialog .inspector-line-style-trigger{grid-template-columns:minmax(0,1fr) 8px}.canvas-menu-dialog .inspector-line-style-menu{top:auto;bottom:calc(100% + 3px);right:0;width:176px}.canvas-menu-dialog .line-style-preview{height:22px}.canvas-menu-dialog .menu-control--check input{width:18px;height:18px}.menu-dropdown .menu-item:active,.canvas-menu-dialog .menu-item:active,.settings-control:active{background:transparent;color:var(--kolam-color-text)}.menu-stepper button:active,.menu-segmented button:active:not(.selected),.settings-segmented button:active:not(.selected){background:var(--kolam-color-hover);color:var(--kolam-color-text)}@media (hover: none){.menu-trigger:hover:not(.open),.menu-dropdown .menu-item:hover,.canvas-menu-dialog .menu-item:hover{background:transparent;color:var(--kolam-color-text)}}.editor-statusbar{order:6;min-height:32px;flex-wrap:nowrap;justify-content:flex-start;gap:6px;padding:2px 5px calc(2px + env(safe-area-inset-bottom,0px));font-size:.58rem;border-top:1px solid var(--kolam-color-soft-border)}.statusbar-group--state{flex:1 1 auto;gap:8px;min-width:0;overflow:auto hidden;scrollbar-width:none}.statusbar-group--state::-webkit-scrollbar{display:none}.statusbar-zoom{margin-left:auto}.statusbar-icon-button,.statusbar-zoom-value{width:28px;height:26px}.statusbar-zoom-value{width:48px}}@media (max-width: 460px){.menu-dropdown{position:absolute;top:calc(100% + 2px);left:0;right:auto;min-width:0;width:min(218px,calc(100vw - 10px))}.menu-root--help .menu-dropdown{left:auto;right:0}.special-dialog-backdrop,.settings-dialog-backdrop{align-items:flex-end;padding:8px}.special-dialog,.settings-dialog{width:100%}.settings-dialog{max-height:min(78vh,540px);overflow-y:auto;padding:11px 12px 12px;gap:9px}.settings-dialog-header{padding-bottom:8px}.settings-dialog h2{font-size:.8rem}.settings-dialog-close{width:30px;height:30px}.settings-dialog-body{gap:0}.settings-section+.settings-section{margin-top:10px;padding-top:10px}.settings-section-header{padding-bottom:4px}.settings-section h3{color:var(--kolam-color-muted);font-size:.66rem}.settings-control{align-items:flex-start;display:grid;grid-template-columns:1fr;grid-template-areas:"title" "help" "control";gap:3px;padding:8px 0}.settings-control:first-child{padding-top:1px}.settings-control+.settings-control:before{left:0;right:0}.settings-control-title{font-size:.72rem;line-height:1}.settings-control-help{font-size:.72rem;line-height:1.25}.settings-segmented{width:100%;justify-self:stretch;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:3px}.settings-segmented--three{grid-template-columns:repeat(3,minmax(0,1fr))}.settings-segmented button{min-height:34px;font-size:.66rem;padding:0 4px}}.control-panel{padding:1rem;display:flex;flex-direction:column;gap:1rem}.control-panel-title{margin:0;font-size:1rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--kolam-color-text)}.control-panel-content{display:flex;flex-direction:column;gap:.75rem}.tab-header{display:flex;gap:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--kolam-color-border)}.tab-button{font-size:.85rem;padding:.4rem .75rem;transition:background var(--kolam-transition-fast),color var(--kolam-transition-fast)}.tab-button.active,.tab-button:hover{background:var(--kolam-color-border);color:#fff}.input-group,.checkbox-group,.slider-group,.button-group{display:flex;flex-direction:column;gap:.25rem}.input-group label,.checkbox-group label,.slider-group label{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--kolam-color-text)}.number-input,.slider,.checkbox,.control-button,.file-upload-button{font:inherit}.number-input{padding:.35rem .5rem;border:1px solid var(--kolam-color-border);border-radius:0;background:var(--kolam-color-surface);color:var(--kolam-color-text);width:100%}.checkbox{width:16px;height:16px;accent-color:var(--kolam-color-border)}.slider{accent-color:var(--kolam-color-border)}.control-button,.file-upload-button{padding:.5rem;font-size:.75rem}.control-button:hover,.file-upload-button:hover{background:var(--kolam-color-border);color:#fff}.help-button{width:32px;height:32px;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:background var(--kolam-transition-fast),color var(--kolam-transition-fast)}.help-button:hover{background:var(--kolam-color-border);color:#fff}.shortcuts-overlay{position:fixed;inset:0;z-index:2600;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}.shortcuts-panel{padding:1.5rem;width:min(520px,100%);max-height:80vh;overflow-y:auto;display:flex;flex-direction:column;gap:1rem}.shortcuts-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--kolam-color-border);padding-bottom:.75rem}.shortcuts-header h3{margin:0;font-size:1.1rem;letter-spacing:.08em;text-transform:uppercase}.close-button{border:none;background:none;font-size:1.5rem;cursor:pointer;color:var(--kolam-color-text)}.close-button:hover{color:#555}.shortcuts-content{display:flex;flex-direction:column;gap:1rem}.shortcut-category h4{margin:0 0 .5rem;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase}.shortcut-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.5rem 1rem}.shortcut-item{display:flex;align-items:center;gap:.5rem;font-size:.78rem}.shortcut-key{border:1px solid var(--kolam-color-border);border-radius:0;padding:.15rem .4rem;font-size:.72rem;background:var(--kolam-color-surface)}.shortcut-description{color:var(--kolam-color-text)}@media (max-width: 720px){.shortcuts-overlay{align-items:flex-end;padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px))}.shortcuts-panel{max-height:min(78vh,560px);padding:1rem}}.compact-editing-toolbar{padding:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.toolbar-button{display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:44px;padding:.55rem .4rem;font-size:.7rem;line-height:1.2;text-align:center;white-space:normal}.toolbar-button:hover:not(:disabled){background:#f4f4f4;color:var(--kolam-color-text)}.toolbar-button:disabled{background:#f5f5f5;color:var(--kolam-color-muted);border-color:#b0b0b0;cursor:not-allowed}.pattern-item{display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 3px 5px;border:none;background:transparent;box-shadow:none;box-sizing:border-box;overflow:hidden;border:1px solid transparent;border-radius:0;min-width:48px;transition:background var(--kolam-transition-fast),border-color var(--kolam-transition-fast),color var(--kolam-transition-fast)}.pattern-item canvas{width:28px;height:28px;border-radius:0;background:transparent;box-shadow:none}.pattern-item:hover,.pattern-item:focus-visible{background:var(--kolam-color-hover);border-color:var(--kolam-color-soft-border, #d5dbd2)}.pattern-item.selected{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.pattern-item.selected canvas{filter:invert(1)}.kolam-editor-container--dark .pattern-item canvas{filter:invert(1)}.kolam-editor-container--dark .pattern-item.selected canvas{filter:none}.pattern-item.selected:hover,.pattern-item.selected:focus-visible{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.pattern-label{display:block;font-size:.6rem;font-weight:600;color:currentColor;text-transform:uppercase;letter-spacing:.04em;line-height:1.05}.tool-palette{display:flex;gap:2px;width:100%}.tool-palette--vertical{flex-direction:column;align-items:center}.tool-stack{display:flex;flex-direction:column;gap:2px;align-items:center}.tool-stack--actions{padding-top:3px;margin-top:1px;border-top:1px solid var(--kolam-color-soft-border)}.tool-item{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;transition:background var(--kolam-transition-fast),border-color var(--kolam-transition-fast),color var(--kolam-transition-fast)}.tool-item:hover,.tool-item:focus-visible{background:var(--kolam-color-hover);border-color:var(--kolam-color-soft-border)}.tool-item.selected{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.tool-item.selected:hover,.tool-item.selected:focus-visible{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.tool-item:disabled{opacity:.4;cursor:not-allowed}.mobile-shape-tool{display:none;position:relative;min-width:0}.mobile-shape-trigger{width:100%}.mobile-shape-menu{position:absolute;top:calc(100% + 3px);right:0;z-index:80;display:grid;grid-template-columns:repeat(3,38px);gap:2px;padding:3px;border:1px solid var(--kolam-color-soft-border);background:var(--kolam-color-panel);box-shadow:0 8px 20px #00000029}.mobile-shape-menu-button{width:38px;height:36px;display:inline-grid;grid-template-rows:1fr auto;align-items:center;justify-items:center;gap:1px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;font:inherit;font-size:.52rem;font-weight:800;letter-spacing:.04em;line-height:1}.mobile-shape-menu-button:hover,.mobile-shape-menu-button:focus-visible{background:var(--kolam-color-hover);border-color:var(--kolam-color-soft-border)}.mobile-shape-menu-button.selected{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.tool-icon{width:22px;height:22px}.tool-icon--motif{display:block;width:24px;height:24px;background:currentColor;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}.tool-item--draw:after{content:"";position:absolute;right:3px;bottom:3px;width:0;height:0;border-bottom:7px solid currentColor;border-left:7px solid transparent;opacity:.5;pointer-events:none}.tool-action-icon-button{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--kolam-color-text);cursor:pointer;transition:background var(--kolam-transition-fast),color var(--kolam-transition-fast),border-color var(--kolam-transition-fast)}.tool-action-icon-button:hover:not(:disabled),.tool-action-icon-button:focus-visible{background:var(--kolam-color-hover);border-color:var(--kolam-color-soft-border)}.tool-action-icon-button:disabled{opacity:.4;cursor:not-allowed}.tool-action-icon-button:not(:disabled):active,.tool-action-icon-button:not(:disabled).active{background:var(--kolam-color-selected-bg);color:var(--kolam-color-selected-text);border-color:var(--kolam-color-selected-bg)}.tool-action-icon{width:22px;height:22px}.pattern-strip-container{display:flex;align-items:stretch;gap:0;width:100%;overflow:hidden}.pattern-strip-tile-wrapper{display:flex;align-items:center;justify-content:center;position:relative}@media (max-width: 900px){.pattern-item{padding:4px 3px 5px;border-radius:0;min-width:0}}@media (max-width: 720px){.pattern-item{padding:4px 2px}.pattern-item canvas{width:24px;height:24px}.pattern-label{font-size:.5rem;letter-spacing:.045em}}.pattern-gallery{width:100%}.pattern-gallery--vertical{height:100%}.pattern-gallery--horizontal{width:100%}.pattern-sidebar-scroll{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;padding-right:0}.pattern-sidebar .pattern-sidebar-scroll{flex:1}.pattern-gallery-wrapper{width:100%;overflow:hidden}.pattern-grid{width:100%;box-sizing:border-box}.pattern-grid--stack{display:flex;flex-flow:row wrap;gap:6px;padding:8px 6px;justify-content:center;align-content:start}.pattern-grid--wrap{display:flex;gap:1px;padding:3px;justify-items:start;overflow-x:auto;scrollbar-width:thin}@media (min-width: 900px){.pattern-grid--wrap{gap:2px}}.pattern-grid .pattern-item{flex:0 0 auto;max-width:50px}