:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;--bg:oklch(100% 0 0);--surface:oklch(97.3% .008 130);--surface-strong:oklch(94% .018 130);--surface-selected:oklch(91% .05 130);--ink:oklch(21% .025 132);--ink-soft:oklch(43% .035 132);--ink-faint:oklch(52% .028 132);--border:oklch(86.5% .02 130);--border-strong:oklch(70% .05 130);--primary:oklch(55% .142 130);--primary-hover:oklch(47% .125 130);--primary-soft:oklch(92.5% .052 130);--on-primary:oklch(100% 0 0);--accent:oklch(56% .16 35);--success:oklch(49% .13 145);--warning:oklch(64% .15 70);--danger:oklch(52% .19 25);--on-danger:oklch(100% 0 0);--canvas-bg:oklch(95.5% .012 130);--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--control-height:42px;--header-height:64px;--mobile-nav-height:58px;--shadow-popover:0 8px 24px oklch(18% .03 130/.16);--shadow-dialog:0 24px 72px oklch(18% .03 130/.25);--ease-out:cubic-bezier(.22, 1, .36, 1);font-family:Segoe UI Variable,PingFang SC,Microsoft YaHei,system-ui,sans-serif}html[data-theme=quiet]{--surface:oklch(97.2% .006 240);--surface-strong:oklch(93.5% .012 240);--surface-selected:oklch(91% .035 235);--ink:oklch(20% .025 245);--ink-soft:oklch(43% .03 245);--ink-faint:oklch(51% .025 245);--border:oklch(85% .016 240);--border-strong:oklch(69% .04 240);--primary:oklch(49% .105 235);--primary-hover:oklch(41% .09 235);--primary-soft:oklch(92% .035 235);--accent:oklch(56% .13 170);--canvas-bg:oklch(95% .01 240);--radius-sm:4px;--radius-md:7px;--radius-lg:12px}html[data-theme=pixel]{--surface:oklch(97.4% .012 110);--surface-strong:oklch(92% .04 110);--surface-selected:oklch(89% .075 125);--ink:oklch(20% .03 120);--ink-soft:oklch(42% .04 120);--ink-faint:oklch(50% .04 120);--border:oklch(81% .04 120);--border-strong:oklch(55% .1 125);--primary:oklch(53% .15 125);--primary-hover:oklch(45% .13 125);--primary-soft:oklch(91% .07 125);--accent:oklch(62% .19 25);--canvas-bg:oklch(94% .02 110);--radius-sm:2px;--radius-md:3px;--radius-lg:5px}*{box-sizing:border-box}html{background:var(--bg);min-width:320px}body{background:var(--bg);min-width:320px;min-height:100dvh;color:var(--ink);margin:0}button,input,select,textarea{font:inherit}button,select,input[type=checkbox]{cursor:pointer}button{color:inherit}button:disabled,select:disabled,input:disabled{cursor:not-allowed;opacity:.48}img,canvas{max-width:100%;display:block}h1,h2,h3,p{margin-top:0}h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}:focus-visible{outline-offset:2px;outline:3px solid oklch(72% .14 130/.72)}.sr-only{clip:rect(0, 0, 0, 0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}.skip-link{z-index:60;border-radius:var(--radius-sm);background:var(--ink);color:var(--bg);transition:transform .16s var(--ease-out);padding:10px 14px;position:fixed;top:8px;left:8px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}.primary-button,.secondary-button,.icon-button,.text-button{min-height:var(--control-height);border-radius:var(--radius-sm);transition:background-color .16s var(--ease-out), border-color .16s var(--ease-out), transform .16s var(--ease-out);justify-content:center;align-items:center;gap:8px;font-weight:650;display:inline-flex}.secondary-button{min-height:var(--control-height);border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);color:var(--ink);justify-content:center;align-items:center;gap:8px;padding:0 16px;font-weight:650;display:inline-flex}.secondary-button:hover{border-color:var(--primary);background:var(--primary-soft)}.secondary-button.large{min-height:46px}.primary-button{background:var(--primary);color:var(--on-primary);border:0;padding:0 17px}.primary-button:hover:not(:disabled){background:var(--primary-hover)}.primary-button:active:not(:disabled){transform:translateY(1px)}.primary-button.large{min-height:48px;padding-inline:22px}.text-button{color:var(--primary-hover);background:0 0;border:0;padding:0 12px}.text-button:hover{background:var(--primary-soft)}.topbar{z-index:20;height:var(--header-height);background:var(--bg);border-bottom:1px solid var(--border);align-items:center;gap:20px;padding:0 18px;display:flex;position:relative}.brand{min-width:188px;color:inherit;align-items:center;gap:10px;text-decoration:none;display:inline-flex}.brand>span:last-child{line-height:1.15;display:grid}.brand strong{letter-spacing:.03em;font-size:1.08rem}.brand small{color:var(--ink-soft);margin-top:4px;font-size:.7rem}.brand-mark{grid-template-columns:repeat(3,1fr);gap:2px;width:32px;height:32px;display:grid}.brand-mark i{background:var(--primary);border-radius:50%}.brand-mark i:nth-child(2),.brand-mark i:nth-child(4),.brand-mark i:nth-child(9){background:var(--accent)}html[data-theme=pixel] .brand-mark i{border-radius:1px}.project-name{flex:1;max-width:460px}.project-name input{border-radius:var(--radius-sm);width:100%;height:38px;color:var(--ink);background:0 0;border:1px solid #0000;padding:0 10px;font-weight:620}.project-name input:hover,.project-name input:focus{border-color:var(--border);background:var(--surface)}.topbar-actions{align-items:center;gap:7px;margin-left:auto;display:flex}.account-button{min-height:var(--control-height);border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);max-width:170px;color:var(--ink);align-items:center;gap:7px;padding:0 12px;font-weight:650;text-decoration:none;display:inline-flex}.account-button:hover{border-color:var(--primary);background:var(--primary-soft)}.account-button span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.offline-badge{border-radius:var(--radius-sm);background:var(--primary-soft);max-width:210px;color:var(--primary-hover);text-align:center;padding:7px 10px;font-size:.72rem;font-weight:700;line-height:1.25}.cloud-dialog{border-radius:var(--radius-lg);background:var(--bg);width:min(820px,100vw - 32px);max-height:min(820px,100dvh - 32px);color:var(--ink);box-shadow:var(--shadow-dialog);border:0;padding:0}.cloud-dialog::backdrop{background:oklch(16% .025 132/.58)}.cloud-shell{max-height:min(820px,100dvh - 32px);overflow-y:auto}.cloud-shell>header{z-index:1;border-bottom:1px solid var(--border);background:var(--bg);justify-content:space-between;align-items:flex-start;gap:18px;padding:20px 22px;display:flex;position:sticky;top:0}.cloud-shell>header>div,.cloud-section-heading,.account-row,.cloud-project-actions{align-items:center;gap:12px;display:flex}.cloud-shell h2,.cloud-shell h3,.cloud-shell p{margin:0}.cloud-shell h2{font-size:1.2rem}.cloud-shell h3{font-size:1rem}.cloud-shell header p,.cloud-section-heading p,.cloud-project-copy small,.account-row small,.check-setting small{color:var(--ink-soft);margin-top:3px;font-size:.78rem;display:block}.cloud-title-icon,.account-avatar{background:var(--primary-soft);width:38px;height:38px;color:var(--primary-hover);border-radius:50%;flex:none;justify-content:center;align-items:center;font-weight:750;display:inline-flex}.account-row{border-bottom:1px solid var(--border);background:var(--surface);padding:14px 22px}.account-row>span:nth-child(2){flex:1;min-width:0}.account-row strong,.account-row small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.secondary-button.compact{min-height:38px;padding-inline:12px;text-decoration:none}.cloud-message{border-radius:var(--radius-sm);background:var(--primary-soft);color:var(--primary-hover);margin:16px 22px 0;padding:10px 12px;font-size:.84rem;font-weight:650}.cloud-message.is-error{color:var(--danger);background:oklch(94% .04 25)}.cloud-section{border-bottom:1px solid var(--border);padding:22px}.cloud-section:last-child{border-bottom:0}.cloud-section-heading{justify-content:space-between;align-items:flex-start;margin-bottom:14px}.cloud-section-heading h3{align-items:center;gap:7px;display:flex}.cloud-project-list{border-top:1px solid var(--border);margin:0;padding:0;list-style:none}.cloud-project-list li{border-bottom:1px solid var(--border);align-items:center;gap:16px;min-height:64px;padding:10px 8px;display:flex}.cloud-project-list li.is-current{background:var(--primary-soft)}.cloud-project-copy{flex:1;min-width:0}.cloud-project-copy>strong{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.cloud-project-copy form{align-items:center;gap:6px;display:flex}.cloud-project-copy input{border:1px solid var(--border-strong);border-radius:var(--radius-sm);flex:1;min-width:0;height:38px;padding:0 10px}.cloud-project-actions{gap:4px}.cloud-project-actions .icon-button{background:0 0;border:0;min-height:38px;padding:0 10px}.cloud-project-actions .icon-button:hover{background:var(--surface-strong)}.cloud-project-actions .danger{color:var(--danger)}.cloud-empty{min-height:150px;color:var(--ink-soft);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:7px;padding:24px;display:flex}.cloud-empty strong{color:var(--ink)}.cloud-empty span{max-width:48ch;font-size:.84rem}.cloud-project-skeleton{gap:10px;padding-block:6px;display:grid}.cloud-project-skeleton i{border-radius:var(--radius-sm);background:var(--surface-strong);height:54px;animation:1.2s ease-in-out infinite alternate cloud-pulse}@keyframes cloud-pulse{to{opacity:.52}}.cloud-settings-grid{grid-template-columns:1fr 1fr;gap:14px 18px;display:grid}.cloud-settings-grid>label:not(.check-setting){gap:6px;font-size:.82rem;font-weight:650;display:grid}.cloud-settings-grid input:not([type=checkbox]),.cloud-settings-grid select{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);width:100%;height:42px;color:var(--ink);padding:0 10px}.check-setting{grid-column:1/-1;align-items:flex-start;gap:10px;min-height:52px;padding:10px 0;display:flex}.check-setting input{width:20px;height:20px;margin-top:2px}.cloud-settings-actions{justify-content:flex-end;margin-top:16px;display:flex}@media (width<=720px){.cloud-dialog{border-radius:0;width:100vw;max-width:none;height:100dvh;max-height:none}.cloud-shell{max-height:100dvh}.cloud-shell>header,.cloud-section,.account-row{padding-inline:16px}.cloud-section-heading{flex-direction:column;align-items:stretch}.cloud-section-heading .primary-button{width:100%}.cloud-project-list li{flex-direction:column;align-items:stretch;gap:8px}.cloud-project-actions{justify-content:flex-end}.cloud-project-actions .icon-button:first-child{margin-right:auto}.cloud-settings-grid{grid-template-columns:1fr}.check-setting{grid-column:auto}.account-row .secondary-button{padding-inline:10px}}@media (prefers-reduced-motion:reduce){.cloud-project-skeleton i{animation:none}}html[data-app-surface=offline-app],html[data-app-surface=offline-app] body,html[data-app-surface=offline-app] #root{overscroll-behavior:none;background:var(--canvas-bg);width:100%;height:100%;overflow:hidden}html[data-app-surface=offline-app] body{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}html[data-app-surface=offline-app] input,html[data-app-surface=offline-app] textarea,html[data-app-surface=offline-app] [contenteditable=true]{-webkit-user-select:text;user-select:text}.is-offline-app{background:var(--canvas-bg);flex-direction:column;width:100%;height:100dvh;min-height:0;display:flex;overflow:hidden}.offline-appbar{z-index:30;min-height:calc(58px + var(--safe-area-inset-top,env(safe-area-inset-top)));padding:var(--safe-area-inset-top,env(safe-area-inset-top)) max(8px, var(--safe-area-inset-right,env(safe-area-inset-right))) 0 max(14px, var(--safe-area-inset-left,env(safe-area-inset-left)));border-bottom:1px solid var(--border);background:var(--bg);flex:none;justify-content:space-between;align-items:center;gap:10px;display:flex;position:relative}.offline-appbar-title{gap:2px;min-width:0;display:grid}.offline-appbar-title strong,.offline-appbar-title input,.offline-appbar-title span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.offline-appbar-title strong{font-size:.94rem;line-height:1.25}.offline-appbar-title input{border-radius:var(--radius-sm);width:min(46vw,260px);height:28px;color:var(--ink);background:0 0;border:0;padding:0 3px;font-size:.94rem;font-weight:700}.offline-appbar-title input:focus{background:var(--surface)}.offline-appbar-title span{color:var(--ink-soft);font-size:.68rem}.offline-appbar-title span.is-error{color:var(--danger);font-weight:650}.offline-appbar-actions,.offline-primary-tools,.offline-tool-group{align-items:center;display:flex}.offline-appbar-actions{flex:none;gap:4px}.offline-appbar-actions button,.offline-tool-group button,.offline-tool-sheet button,.offline-zoom-row button{border-radius:var(--radius-sm);background:0 0;border:0;min-width:44px;min-height:44px}.offline-export-action{color:var(--on-primary);justify-content:center;align-items:center;gap:6px;padding-inline:11px;font-weight:680;display:inline-flex;background:var(--primary)!important}.offline-menu-trigger:active,.offline-tool-group button:active,.offline-tool-sheet button:active{background:var(--surface-strong)}.offline-menu-backdrop,.offline-sheet-backdrop{z-index:37;background:oklch(12% .02 130/.36);border:0;border-radius:0;width:100%;height:100%;padding:0;position:fixed;inset:0}.offline-app-menu{z-index:38;top:calc(66px + var(--safe-area-inset-top,env(safe-area-inset-top)));right:max(8px, var(--safe-area-inset-right,env(safe-area-inset-right)));border-radius:var(--radius-md);background:var(--bg);width:min(230px,100vw - 16px);box-shadow:var(--shadow-popover);max-height:calc(100dvh - 78px - var(--safe-area-inset-top,env(safe-area-inset-top)));gap:2px;padding:6px;display:grid;position:fixed;overflow-y:auto}.offline-app-menu button{border-radius:var(--radius-sm);text-align:left;background:0 0;border:0;align-items:center;gap:11px;min-height:48px;padding:0 12px;display:flex}.offline-app-menu button:active{background:var(--surface-strong)}.offline-theme-picker{border:0;border-top:1px solid var(--border);min-inline-size:0;margin:4px 0 0;padding:10px 6px 4px}.offline-theme-picker legend{color:var(--ink-soft);padding:0 6px;font-size:.68rem}.offline-theme-picker>div{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;display:grid}.offline-theme-picker button{text-align:center;justify-content:center;min-width:0;min-height:42px;padding:4px;font-size:.67rem}.offline-theme-picker button.is-active{background:var(--primary-soft);color:var(--primary-hover);font-weight:680}.is-offline-app .workspace{flex:1;height:auto;min-height:0;display:block;position:relative;overflow:hidden}.is-offline-app.has-workspace:not(.is-assembly-mode) .workspace{padding-bottom:calc(62px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom)))}.is-offline-app.is-assembly-mode .workspace{padding-bottom:0}.is-offline-app .workspace>.panel-slot,.is-offline-app .workspace>.canvas-workspace{border:0;width:100%;height:100%}.is-offline-app .workspace>.is-mobile-hidden{display:none}.is-offline-app .panel-slot{background:var(--bg);overflow:hidden}.is-offline-app .side-panel{touch-action:pan-y;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:var(--bg);height:100%;min-height:0;scroll-padding-bottom:28px;overflow-y:auto}.is-offline-app .generation-controls{display:contents}.is-offline-app .source-panel,.is-offline-app .material-panel{min-height:100%;padding-bottom:28px}.is-offline-app .canvas-workspace{background:var(--canvas-bg);flex-direction:column;display:flex}.is-offline-app .pattern-stage{flex:1;min-height:0;padding:6px}.is-offline-app .canvas-status{right:max(8px, var(--safe-area-inset-right,env(safe-area-inset-right)));max-width:calc(100% - 16px);bottom:7px}.is-offline-app .mobile-nav{z-index:25;height:calc(62px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom)));padding:5px max(8px, var(--safe-area-inset-right,env(safe-area-inset-right))) var(--safe-area-inset-bottom,env(safe-area-inset-bottom)) max(8px, var(--safe-area-inset-left,env(safe-area-inset-left)));border-top:1px solid var(--border);background:var(--bg);grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;display:grid;position:fixed;bottom:0;left:0;right:0}.is-offline-app .mobile-nav button{border-radius:var(--radius-sm);min-width:0;min-height:50px;color:var(--ink-soft);background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:.68rem;display:flex}.is-offline-app .mobile-nav button.is-active{background:var(--primary-soft);color:var(--primary-hover);font-weight:700}.offline-touch-toolbar{border-bottom:1px solid var(--border);background:var(--bg);flex:none}.offline-primary-tools{min-height:52px;padding:4px max(6px, var(--safe-area-inset-right,env(safe-area-inset-right))) 4px max(6px, var(--safe-area-inset-left,env(safe-area-inset-left)));justify-content:space-between;gap:6px}.offline-tool-group{gap:2px}.offline-tool-group button{color:var(--ink-soft);place-items:center;display:grid}.offline-tool-group button.is-active{background:var(--primary-soft);color:var(--primary-hover)}.compact-assembly-progress{min-height:56px;padding:5px max(8px, var(--safe-area-inset-right,env(safe-area-inset-right))) 5px max(8px, var(--safe-area-inset-left,env(safe-area-inset-left)));border-top:1px solid var(--border);background:var(--surface);grid-template-columns:minmax(120px,1fr) minmax(72px,.8fr) auto;align-items:center;gap:8px;display:grid}.compact-assembly-progress>div{gap:1px;min-width:0;font-size:.72rem;display:grid}.compact-assembly-progress>div strong,.compact-assembly-progress>div span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.compact-assembly-progress>div span{color:var(--ink-soft);font-size:.66rem}.compact-assembly-progress progress{width:100%;height:8px;accent-color:var(--primary)}.compact-assembly-progress button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);min-width:44px;min-height:44px;color:var(--ink-soft);justify-content:center;align-items:center;gap:5px;display:inline-flex}.offline-color-strip{min-height:54px;padding:6px max(8px, var(--safe-area-inset-right,env(safe-area-inset-right))) 6px max(8px, var(--safe-area-inset-left,env(safe-area-inset-left)));gap:8px;display:flex}.offline-color-strip>div{gap:7px}.offline-color-strip>div button{width:44px;height:44px}.offline-color-strip>div .offline-all-colors-toggle{border:1px solid var(--border);width:auto;min-width:52px;color:var(--ink-soft);justify-content:center;align-items:center;gap:3px;font-size:.65rem;display:inline-flex}.offline-active-color{min-width:42px;color:var(--ink-soft);flex:none;place-items:center;gap:1px;font-size:.62rem;display:grid}.offline-active-color i{--swatch:var(--primary);background:var(--swatch);border-radius:50%;width:20px;height:20px;box-shadow:inset 0 0 0 1px oklch(0% 0 0/.2)}.offline-tool-sheet{z-index:38;overscroll-behavior:contain;border-radius:var(--radius-lg) var(--radius-lg) 0 0;max-height:min(76dvh,620px);padding-bottom:max(12px, var(--safe-area-inset-bottom,env(safe-area-inset-bottom)));background:var(--bg);position:fixed;bottom:0;left:0;right:0;overflow-y:auto}.offline-tool-sheet>header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;min-height:64px;padding:10px 12px 8px 18px;display:flex}.offline-tool-sheet>header>div{gap:2px;display:grid}.offline-tool-sheet>header span{color:var(--ink-soft);font-size:.7rem}.offline-sheet-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:12px;display:grid}.offline-sheet-actions button{background:var(--surface);text-align:left;align-items:center;gap:9px;min-height:52px;padding:0 12px;display:flex}.offline-sheet-actions button.is-active{background:var(--primary-soft);color:var(--primary-hover);font-weight:670}.offline-all-colors{color:var(--ink-soft);gap:6px;margin:0 12px 10px;font-size:.7rem;font-weight:650;display:grid}.offline-all-colors select{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);width:100%;min-height:48px;color:var(--ink);padding:0 12px;font-size:.82rem}.offline-zoom-row{border-top:1px solid var(--border);grid-template-columns:48px 58px 48px minmax(0,1fr);align-items:center;gap:5px;min-height:58px;margin:0 12px;padding-top:8px;display:grid}.offline-zoom-row output{text-align:center;font-variant-numeric:tabular-nums;font-size:.78rem;font-weight:680}.offline-zoom-row button:last-child{background:var(--surface);justify-content:center;align-items:center;gap:7px;display:flex}.is-offline-app.is-welcome{background:var(--bg)}.is-offline-app .is-offline-welcome{min-height:0;padding:24px max(18px, var(--safe-area-inset-right,env(safe-area-inset-right))) max(24px, var(--safe-area-inset-bottom,env(safe-area-inset-bottom))) max(18px, var(--safe-area-inset-left,env(safe-area-inset-left)));flex-direction:column;flex:1;justify-content:center;gap:20px;display:flex;overflow-y:auto}.is-offline-app .is-offline-welcome .welcome-copy{display:block}.is-offline-app .is-offline-welcome .welcome-beads,.is-offline-app .is-offline-welcome .welcome-assurances{display:none}.is-offline-app .is-offline-welcome h1{letter-spacing:-.025em;max-width:none;margin-bottom:8px;font-size:1.75rem}.is-offline-app .is-offline-welcome .welcome-kicker{color:var(--primary-hover);margin-bottom:5px;font-size:.72rem;font-weight:680}.is-offline-app .is-offline-welcome .welcome-lede{max-width:42ch;margin:0;font-size:.9rem}.is-offline-app .is-offline-welcome .upload-zone{text-align:left;background:0 0;border:0;border-radius:0;width:100%;min-height:0;padding:0;display:block}.is-offline-app .is-offline-welcome .upload-icon,.is-offline-app .is-offline-welcome .upload-zone>h2,.is-offline-app .is-offline-welcome .upload-zone>p{display:none}.is-offline-app .is-offline-welcome .upload-actions{gap:10px;display:grid}.is-offline-app .is-offline-welcome .upload-actions button{width:100%;min-height:52px}.is-offline-app .is-offline-welcome .restore-button{width:100%;min-height:48px;margin-top:10px}html[data-app-surface=offline-app] .export-dialog{width:100vw;max-width:none;max-height:calc(92dvh - var(--safe-area-inset-top,env(safe-area-inset-top)));border-radius:var(--radius-lg) var(--radius-lg) 0 0;margin:auto 0 0}html[data-app-surface=offline-app] .export-dialog .dialog-shell{max-height:calc(92dvh - var(--safe-area-inset-top,env(safe-area-inset-top)));padding-bottom:var(--safe-area-inset-bottom,env(safe-area-inset-bottom))}.is-offline-app.is-assembly-mode .offline-appbar{display:none}.is-offline-app.is-assembly-mode .offline-primary-tools{min-height:calc(52px + var(--safe-area-inset-top,env(safe-area-inset-top)));padding-top:calc(4px + var(--safe-area-inset-top,env(safe-area-inset-top)))}@media (width<=380px){.compact-assembly-progress{grid-template-columns:minmax(0,1fr) 64px 44px}.compact-assembly-progress button span,.offline-export-action span{display:none}.offline-export-action{width:44px;padding:0}.offline-appbar-title strong{font-size:.88rem}.offline-tool-group{gap:0}}@media (orientation:landscape) and (height<=520px){.is-offline-app.mobile-panel-canvas:not(.is-welcome) .offline-appbar{display:none}.is-offline-app.mobile-panel-canvas .offline-primary-tools{min-height:calc(44px + var(--safe-area-inset-top,env(safe-area-inset-top)));padding-top:var(--safe-area-inset-top,env(safe-area-inset-top));padding-bottom:0}.is-offline-app .offline-primary-tools button,.is-offline-app .mobile-nav button{min-height:44px}.is-offline-app .compact-assembly-progress{min-height:48px;padding-block:2px}.is-offline-app .offline-color-strip{min-height:44px;padding-block:0}.is-offline-app .offline-color-strip>div button{width:44px;height:44px}.is-offline-app .mobile-nav{height:calc(48px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom)));padding-top:2px;padding-bottom:var(--safe-area-inset-bottom,env(safe-area-inset-bottom))}.is-offline-app.has-workspace:not(.is-assembly-mode) .workspace{padding-bottom:calc(48px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom)))}.is-offline-app .pattern-stage{min-height:120px;padding:3px}.is-offline-app .is-offline-welcome{justify-content:flex-start;padding-block:16px}.offline-tool-sheet{max-height:92dvh}}.icon-button,.theme-select{border:1px solid var(--border);background:var(--bg);height:40px;color:var(--ink-soft)}.icon-button{padding:0 11px}.icon-button:hover:not(:disabled),.theme-select:hover{border-color:var(--border-strong);background:var(--surface);color:var(--ink)}.theme-select{border-radius:var(--radius-sm);align-items:center;gap:5px;padding:0 4px 0 10px;display:flex;position:relative}.theme-select select{height:100%;color:inherit;background:0 0;border:0;padding:0 24px 0 3px}.theme-select select:focus{outline:0}.welcome-stage{min-height:calc(100dvh - var(--header-height));grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);align-content:center;gap:clamp(36px,7vw,100px);max-width:1180px;margin:0 auto;padding:clamp(48px,7vw,92px) 28px;display:grid}.welcome-copy{grid-template-columns:116px 1fr;align-self:center;align-items:start;gap:28px;display:grid}.welcome-beads{grid-template-columns:repeat(7,1fr);gap:4px;padding-top:4px;display:grid}.welcome-beads i{aspect-ratio:1;border-radius:50%;box-shadow:inset 0 0 0 3px oklch(100% 0 0/.38)}html[data-theme=pixel] .welcome-beads i{border-radius:1px;box-shadow:inset 0 0 0 2px oklch(100% 0 0/.34)}.welcome-kicker{color:var(--primary-hover);margin-bottom:14px;font-size:.82rem;font-weight:700}.welcome-copy h1{letter-spacing:-.035em;max-width:15ch;margin-bottom:20px;font-size:clamp(2.45rem,5vw,4.7rem);line-height:1.03}.welcome-lede{max-width:38rem;color:var(--ink-soft);margin-bottom:0;font-size:1.08rem;line-height:1.8}.upload-zone{border:2px dashed var(--border-strong);border-radius:var(--radius-lg);background:var(--surface);text-align:center;min-height:430px;transition:border-color .18s var(--ease-out), background-color .18s var(--ease-out), transform .18s var(--ease-out);flex-direction:column;justify-content:center;align-self:center;align-items:center;padding:50px 38px;display:flex}.upload-zone.is-dragging{border-color:var(--primary);background:var(--primary-soft);transform:scale(1.008)}.upload-icon{background:var(--primary-soft);width:58px;height:58px;color:var(--primary-hover);border-radius:50%;place-items:center;margin-bottom:22px;display:grid}html[data-theme=pixel] .upload-icon{border-radius:2px}.upload-zone h2{margin-bottom:10px;font-size:1.45rem}.upload-zone>p{max-width:37ch;color:var(--ink-soft);margin-bottom:25px;line-height:1.65}.upload-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:7px;display:flex}.restore-button{border:0;border-bottom:1px solid var(--border-strong);color:var(--ink-soft);background:0 0;margin-top:22px;padding:5px 2px;font-size:.84rem}.restore-button:hover{color:var(--primary-hover);border-color:var(--primary)}.welcome-assurances{color:var(--ink-soft);flex-wrap:wrap;grid-column:1/-1;justify-content:center;gap:24px 40px;font-size:.86rem;display:flex}.welcome-assurances p{align-items:center;gap:8px;margin:0;display:flex}.welcome-assurances svg{color:var(--primary)}.app-shell{background:var(--bg);height:100dvh;overflow:hidden}.workspace{height:calc(100vh - var(--header-height));height:calc(100dvh - var(--header-height));background:var(--canvas-bg);grid-template-columns:minmax(272px,318px) minmax(360px,1fr) minmax(280px,330px);display:grid}.panel-slot{min-width:0;min-height:0;overflow:hidden}.panel-slot>.side-panel{width:100%;height:100%}.side-panel{overscroll-behavior:contain;background:var(--bg);scrollbar-gutter:stable;min-width:0;overflow:auto}.source-panel{border-right:1px solid var(--border)}.material-panel{border-left:1px solid var(--border)}.panel-heading{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;min-height:74px;padding:16px 18px;display:flex}.panel-heading h2{margin-bottom:4px;font-size:1rem}.panel-heading p{color:var(--ink-soft);margin:0;font-size:.76rem}.panel-heading>svg{color:var(--primary)}.processing-dot{border:2px solid var(--primary-soft);border-top-color:var(--primary);border-radius:50%;width:12px;height:12px;animation:.75s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.source-summary{background:var(--surface);border-bottom:1px solid var(--border);grid-template-columns:64px minmax(0,1fr);gap:12px;padding:16px 18px;display:grid}.source-thumb{border-radius:var(--radius-sm);background:var(--surface-strong);width:64px;height:64px;color:var(--ink-faint);place-items:center;display:grid;overflow:hidden}.source-thumb img{object-fit:cover;width:100%;height:100%}.source-summary>div:last-child{flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;display:flex}.source-summary strong,.source-summary span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.source-summary strong{font-size:.86rem}.source-summary span{color:var(--ink-soft);margin-top:3px;font-size:.72rem}.inline-action,.reset-button,.lock-button{color:var(--primary-hover);background:0 0;border:0;align-items:center;gap:5px;padding:4px 0;font-size:.76rem;display:inline-flex}.source-summary .inline-action{margin-top:5px}.control-section,.board-options,.material-options,.color-usage{border-bottom:1px solid var(--border);padding:18px}.generation-controls{border:0;min-inline-size:0;margin:0;padding:0}.generation-controls:disabled .control-section{opacity:.56}.recognized-grid-summary{border-bottom:1px solid var(--border);background:var(--primary-soft);gap:6px;padding:16px 18px;display:grid}.recognized-grid-summary>span{color:var(--primary-hover);align-items:center;gap:7px;font-size:.74rem;font-weight:700;display:flex}.recognized-grid-summary strong{font-size:1rem}.recognized-grid-summary small{color:var(--ink-soft);font-size:.7rem;line-height:1.55}.recognized-grid-summary .inline-action{justify-self:start;margin-top:2px}.restored-project-note{border-bottom:1px solid var(--border);background:var(--primary-soft);color:var(--ink-soft);margin:0;padding:14px 18px;font-size:.72rem;line-height:1.6}.control-section h3,.board-options h3,.material-options h3,.color-usage h3,.export-options h3{margin-bottom:15px;font-size:.86rem}.section-heading-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.section-heading-row h3{margin-bottom:0}.lock-button{color:var(--ink-soft)}.lock-button.is-active{color:var(--primary-hover)}.dimension-inputs{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:8px;margin-top:14px;display:grid}.dimension-inputs>span{color:var(--ink-faint);padding-bottom:11px}.dimension-inputs label,.select-field,.material-options label{color:var(--ink-soft);gap:7px;font-size:.74rem;display:grid}.dimension-inputs input,.select-field select,.material-options select{width:100%;height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--ink);padding:0 10px;font-weight:620}.dimension-inputs input:hover,.dimension-inputs input:focus,.select-field select:hover,.select-field select:focus,.material-options select:hover,.material-options select:focus{border-color:var(--border-strong)}.size-presets{grid-template-columns:repeat(4,1fr);gap:5px;margin-top:9px;display:grid}.size-presets button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);min-height:34px;color:var(--ink-soft);justify-content:center;align-items:center;gap:3px;font-size:.71rem;display:flex}.size-presets button:hover,.size-presets button.is-selected{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-hover)}.control-hint,.palette-description,.material-note{color:var(--ink-soft);margin:10px 0 0;font-size:.7rem;line-height:1.6}.palette-meta{color:var(--ink-soft);flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:9px;font-size:.68rem;line-height:1.45;display:flex}.palette-kind{border:1px solid var(--border);background:var(--bg);min-height:24px;color:var(--ink-soft);border-radius:999px;align-items:center;padding:2px 7px;font-weight:650;display:inline-flex}.palette-kind-brand{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-hover)}.palette-source{color:var(--ink-soft);margin:6px 0 0;font-size:.68rem;line-height:1.5}.palette-source a{min-height:32px;color:var(--primary-hover);text-underline-offset:2px;align-items:center;padding:0 2px;display:inline-flex}.segmented-control{border-radius:var(--radius-sm);background:var(--surface-strong);grid-template-columns:1fr 1fr;padding:3px;display:grid}.segmented-control button{border-radius:calc(var(--radius-sm) - 2px);min-height:35px;color:var(--ink-soft);background:0 0;border:0;font-size:.75rem}.segmented-control button.is-active{background:var(--bg);color:var(--ink);font-weight:650}.slider-row{gap:8px;margin-top:16px;display:grid}.slider-row>span{color:var(--ink-soft);justify-content:space-between;gap:12px;font-size:.76rem;display:flex}.slider-row output{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:650}.slider-row small{color:var(--ink-soft);font-size:.68rem;line-height:1.5}input[type=range]{width:100%;height:5px;accent-color:var(--primary);margin:3px 0}.select-field{margin-top:13px}.switch-row{justify-content:space-between;align-items:center;gap:14px;min-height:54px;margin-top:13px;display:flex}.switch-row>span{gap:3px;display:grid}.switch-row strong{font-size:.76rem}.switch-row small{color:var(--ink-soft);font-size:.68rem;line-height:1.45}.switch-row input{appearance:none;border:1px solid var(--border-strong);background:var(--surface-strong);width:40px;height:23px;transition:background-color .16s var(--ease-out), border-color .16s var(--ease-out);border-radius:999px;flex:none;position:relative}.switch-row input:after{content:"";background:var(--bg);width:15px;height:15px;transition:transform .16s var(--ease-out);border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px oklch(15% 0 0/.28)}.switch-row input:checked{border-color:var(--primary);background:var(--primary)}.switch-row input:checked:after{transform:translate(17px)}.advanced-controls{border-top:1px solid var(--border);margin-top:12px;padding-top:12px}.advanced-controls summary{color:var(--ink-soft);cursor:pointer;align-items:center;gap:7px;font-size:.76rem;font-weight:630;display:flex}.advanced-controls summary::marker{color:var(--primary)}.advanced-controls>div{padding-top:2px}.canvas-workspace{background:var(--canvas-bg);flex-direction:column;min-width:0;min-height:0;display:flex}.editor-toolbar{z-index:4;background:var(--bg);border-bottom:1px solid var(--border);flex:none;position:relative}.toolbar-row{align-items:center;gap:8px;min-height:52px;padding:7px 10px;display:flex;overflow-x:auto}.toolbar-group{border-right:1px solid var(--border);flex:none;align-items:center;gap:2px;padding-right:8px;display:flex}.toolbar-group:last-child{border-right:0;margin-left:auto;padding-right:0}.toolbar-group button{border-radius:var(--radius-sm);min-width:36px;height:36px;color:var(--ink-soft);background:0 0;border:0;justify-content:center;align-items:center;gap:6px;padding:0 8px;display:inline-flex}.toolbar-group button:hover:not(:disabled){background:var(--surface);color:var(--ink)}.toolbar-group button.is-active{background:var(--primary-soft);color:var(--primary-hover)}.toolbar-group button span{font-size:.72rem}.view-tools .five-grid-toggle{color:var(--danger)}.view-tools .five-grid-toggle.is-active{background:color-mix(in oklch, var(--danger) 12%, var(--bg));color:var(--danger)}.zoom-tools output{min-width:44px;color:var(--ink-soft);text-align:center;font-variant-numeric:tabular-nums;font-size:.7rem}.color-strip{border-top:1px solid var(--border);align-items:center;gap:12px;min-height:46px;padding:7px 12px;display:flex;overflow:hidden}.active-color-label{color:var(--ink-soft);flex:none;align-items:center;gap:6px;font-size:.68rem;display:flex}.active-color-label strong{color:var(--ink);font-size:.7rem}.assembly-mode-note{display:none}.assembly-tools button{border:1px solid var(--border)}.assembly-tools button.is-active{border-color:var(--primary)}.editor-toolbar.is-assembly-mode .history-tools,.editor-toolbar.is-assembly-mode .drawing-tools{display:none}.editor-toolbar.is-assembly-mode .assembly-mode-note{color:var(--ink-soft);flex:none;align-items:center;gap:7px;font-size:.72rem;display:flex}.editor-toolbar.is-assembly-mode .assembly-mode-note svg{color:var(--primary)}.editor-toolbar.is-assembly-mode .assembly-mode-note strong{color:var(--ink)}.focus-color-button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);min-height:30px;color:var(--ink-soft);align-items:center;gap:5px;padding:0 8px;font-size:.66rem;display:inline-flex}.focus-color-button:hover,.focus-color-button.is-active{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-hover)}.color-strip>div{flex:1;gap:5px;min-width:0;padding:3px;display:flex;overflow-x:auto}.color-more-select{flex:none}.color-more-select select{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);width:92px;height:30px;color:var(--ink-soft);padding:0 22px 0 7px;font-size:.68rem}.color-more-select select:hover,.color-more-select select:focus{border-color:var(--border-strong);color:var(--ink)}.color-strip>div button{--swatch:var(--primary);border:2px solid var(--bg);background:var(--swatch);color:#0000;width:29px;height:29px;box-shadow:0 0 0 1px var(--border);border-radius:50%;flex:none;place-items:center;padding:0;display:grid}.color-strip>div button:hover,.color-strip>div button.is-active{color:var(--ink);box-shadow:0 0 0 2px var(--ink)}.color-strip>div button span{text-shadow:0 0 2px var(--bg), 0 0 2px var(--bg), 0 0 2px var(--bg);font-family:Cascadia Mono,Consolas,monospace;font-size:.65rem;font-weight:800;line-height:1}html[data-theme=pixel] .color-strip>div button{border-radius:1px}.pattern-stage{flex:1;place-items:center;min-height:0;padding:20px;display:grid;position:relative;overflow:hidden}.pattern-stage canvas{touch-action:none}.pattern-canvas{min-height:320px}.is-offline-app .pattern-canvas{min-height:0}.canvas-status{border-radius:var(--radius-sm);background:var(--bg);color:var(--ink-soft);box-shadow:var(--shadow-popover);pointer-events:none;align-items:center;gap:7px;padding:6px 9px;font-size:.68rem;display:inline-flex;position:absolute;bottom:10px;right:12px}.status-spinner,.workspace-loading>svg{animation:.8s linear infinite spin}.workspace-loading{background:var(--canvas-bg);height:100%;min-height:0;color:var(--ink-soft);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:9px;padding:28px;display:flex}.workspace-loading strong{color:var(--ink);margin-top:7px;font-size:.92rem}.workspace-loading span{font-size:.76rem}.material-overview{background:var(--surface);border-bottom:1px solid var(--border);padding:18px}.material-overview>div{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-end;gap:14px;padding-bottom:14px;display:flex}.material-overview>div>span{color:var(--ink-soft);align-items:center;gap:6px;font-size:.78rem;display:flex}.material-overview>div>span svg{color:var(--primary)}.material-overview>div>strong{font-variant-numeric:tabular-nums;font-size:1.65rem;line-height:1}.material-overview>div small{color:var(--ink-soft);font-size:.75rem;font-weight:500}.material-overview dl{gap:9px;margin:14px 0 0;display:grid}.material-overview dl div{justify-content:space-between;gap:14px;font-size:.74rem;display:flex}.material-overview dt{color:var(--ink-soft)}.material-overview dd{text-align:right;margin:0;font-weight:620}.material-options>div{grid-template-columns:1fr 1fr;gap:8px;display:grid}.color-usage .section-heading-row>span{color:var(--ink-soft);font-size:.7rem}.board-options{border-bottom:1px solid var(--border);padding:18px}.board-options>p{color:var(--ink-soft);margin:-7px 0 14px;font-size:.7rem;line-height:1.55}.board-input-group+.board-input-group{margin-top:14px}.board-input-group>strong{color:var(--ink-soft);margin-bottom:7px;font-size:.72rem;font-weight:620;display:block}.board-count-inputs{grid-template-columns:1fr 1fr;gap:8px;display:grid}.board-count-inputs label{color:var(--ink-soft);gap:6px;font-size:.72rem;display:grid}.board-count-inputs input{width:100%;height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--ink);padding:0 10px;font-weight:620}.board-count-inputs input:hover,.board-count-inputs input:focus{border-color:var(--border-strong)}.board-count-inputs small{color:var(--ink-faint);font-size:.64rem}.board-placement{border:0;min-inline-size:0;margin:15px 0 0;padding:0}.board-placement legend{color:var(--ink-soft);margin-bottom:7px;font-size:.72rem}.board-placement>div{grid-template-columns:repeat(3,1fr);gap:4px;display:grid}.board-placement button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);min-height:40px;color:var(--ink-soft);padding:0 3px;font-size:.68rem}.board-placement button:hover{border-color:var(--border-strong);color:var(--ink)}.board-placement button.is-active{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-hover);font-weight:650}.app-shell.is-assembly-mode{height:100dvh}.app-shell.is-assembly-mode .topbar,.app-shell.is-assembly-mode .workspace>.panel-slot,.app-shell.is-assembly-mode .mobile-nav{display:none}.app-shell.is-assembly-mode .workspace{grid-template-columns:minmax(0,1fr);height:100dvh;display:grid}.app-shell.is-assembly-mode .canvas-workspace{width:100%;height:100%}.app-shell.is-assembly-mode .pattern-stage{padding:8px}.app-shell.is-assembly-mode .canvas-status{bottom:max(8px, env(safe-area-inset-bottom))}.highlight-help{border-radius:var(--radius-sm);background:var(--primary-soft);color:var(--ink-soft);align-items:center;gap:7px;margin-top:10px;padding:8px 9px;font-size:.66rem;line-height:1.45;display:flex}.highlight-help>span{flex:1;min-width:0}.highlight-help>svg{color:var(--primary-hover);flex:none}.highlight-help button{color:var(--primary-hover);background:0 0;border:0;flex:none;align-items:center;gap:4px;padding:3px;font-size:.65rem;font-weight:700;display:inline-flex}.search-field{border:1px solid var(--border);border-radius:var(--radius-sm);height:38px;color:var(--ink-soft);align-items:center;gap:7px;margin:12px 0 10px;padding:0 10px;display:flex}.search-field:focus-within{border-color:var(--primary)}.search-field input{min-width:0;color:var(--ink);background:0 0;border:0;outline:0;flex:1;font-size:.75rem}.search-field input::placeholder{color:var(--ink-soft);opacity:1}.usage-list{gap:3px;display:grid}.usage-row{border-radius:var(--radius-sm);text-align:left;background:0 0;border:0;grid-template-columns:22px 25px minmax(0,1fr) auto auto;align-items:center;gap:7px;width:100%;min-height:48px;padding:5px 6px;display:grid}.usage-row:hover,.usage-row.is-active{background:var(--surface)}.usage-row.is-active{box-shadow:inset 0 0 0 1px var(--primary)}.usage-swatch{border-radius:50%;width:22px;height:22px;box-shadow:inset 0 0 0 1px oklch(0% 0 0/.18)}html[data-theme=pixel] .usage-swatch{border-radius:1px}.usage-symbol{color:var(--ink-soft);place-items:center;font-family:Cascadia Mono,Consolas,monospace;font-size:.72rem;font-weight:750;display:grid}.usage-name,.usage-count{gap:2px;min-width:0;display:grid}.usage-name strong,.usage-count strong{text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;overflow:hidden}.usage-name small,.usage-count small{color:var(--ink-soft);font-size:.62rem}.usage-count{text-align:right;font-variant-numeric:tabular-nums}.usage-packs{border-radius:var(--radius-sm);background:var(--surface-strong);min-width:40px;color:var(--ink-soft);text-align:center;padding:4px 5px;font-size:.62rem}.no-search-result{min-height:86px;color:var(--ink-soft);justify-content:center;align-items:center;gap:7px;margin:0;font-size:.75rem;display:flex}.material-note{margin:0;padding:14px 18px 24px}.mobile-nav{display:none}.export-dialog{border-radius:var(--radius-lg);background:var(--bg);width:min(860px,100vw - 28px);max-height:min(760px,100dvh - 28px);color:var(--ink);box-shadow:var(--shadow-dialog);border:0;padding:0;overflow:visible}.export-dialog::backdrop{background:oklch(12% .02 130/.54)}.dialog-shell{border-radius:inherit;max-height:min(760px,100dvh - 28px);overflow:auto}.dialog-shell>header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:18px;padding:22px 24px;display:flex}.dialog-shell h2{margin-bottom:6px;font-size:1.25rem}.dialog-shell header p{color:var(--ink-soft);margin:0;font-size:.78rem}.dialog-close{border-radius:var(--radius-sm);background:var(--surface);border:0;place-items:center;width:38px;height:38px;display:grid}.dialog-close:hover{background:var(--surface-strong)}.export-layout{grid-template-columns:minmax(0,1.6fr) minmax(230px,.75fr);display:grid}.export-formats{gap:6px;padding:18px;display:grid}.export-formats button{border-radius:var(--radius-md);text-align:left;background:0 0;border:0;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:72px;padding:10px 13px;display:grid}.export-formats button:hover:not(:disabled){background:var(--surface)}.export-formats button>span:first-child{border-radius:var(--radius-sm);background:var(--primary-soft);width:42px;height:42px;color:var(--primary-hover);place-items:center;display:grid}.export-formats button>span:nth-child(2){gap:4px;min-width:0;display:grid}.export-formats strong{font-size:.84rem}.export-formats small{color:var(--ink-soft);font-size:.7rem}.format-action{color:var(--primary-hover);font-size:.75rem;font-weight:650}.export-options{background:var(--surface);padding:22px}.export-options .select-field{margin-top:18px}.export-options>p{color:var(--ink-soft);margin:18px 0 0;font-size:.68rem;line-height:1.6}.toast-region{z-index:50;right:max(16px, env(safe-area-inset-right));bottom:max(16px, env(safe-area-inset-bottom));pointer-events:none;gap:8px;width:min(360px,100vw - 32px);display:grid;position:fixed}.toast{border-radius:var(--radius-md);background:var(--ink);min-height:48px;color:var(--bg);box-shadow:var(--shadow-popover);pointer-events:none;animation:toast-in .22s var(--ease-out) both;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 11px 10px 13px;font-size:.78rem;display:grid}.toast-success>svg{color:oklch(78% .16 140)}.toast-error>svg{color:oklch(75% .17 25)}.toast-info>svg{color:oklch(80% .11 230)}.toast button{border-radius:var(--radius-sm);width:32px;height:32px;color:inherit;pointer-events:auto;background:0 0;border:0;place-items:center;display:grid}.toast button:hover{background:oklch(100% 0 0/.12)}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}html[data-theme=pixel] .primary-button:not(:disabled){box-shadow:2px 2px 0 var(--ink)}html[data-theme=pixel] .primary-button:active:not(:disabled){box-shadow:none;transform:translate(2px,2px)}@media (width<=1500px){.drawing-tools button span,.view-tools button span{display:none}.view-tools .model-code-toggle span,.view-tools .five-grid-toggle span,.view-tools .board-boundary-toggle span{display:inline}}@media (width<=1220px){.workspace{grid-template-columns:282px minmax(340px,1fr) 292px}.theme-select select{color:#0000;width:38px}}@media (width<=980px){:root{--header-height:58px}.brand{min-width:auto}.brand small,.topbar-secondary span,.project-name{display:none}.theme-select{justify-content:center;width:40px;padding:0}.theme-select select{opacity:0;width:100%;position:absolute;inset:0}.topbar-actions{flex:1;justify-content:flex-end;gap:5px;min-width:0}.topbar-secondary{width:40px;padding:0}.account-button{justify-content:center;width:40px;padding:0}.account-button span{display:none}.offline-badge{max-width:150px;font-size:.68rem}.workspace{height:calc(100vh - var(--header-height) - var(--mobile-nav-height));height:calc(100dvh - var(--header-height) - var(--mobile-nav-height));display:block;position:relative}.workspace>.panel-slot,.workspace>.canvas-workspace{border:0;width:100%;height:100%}.workspace>.panel-slot>.side-panel{border:0}.workspace>.is-mobile-hidden{display:none}.toolbar-row,.color-strip>div{scrollbar-width:none}.toolbar-row::-webkit-scrollbar{display:none}.color-strip>div::-webkit-scrollbar{display:none}.mobile-nav{z-index:18;height:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));padding:5px 8px env(safe-area-inset-bottom);border-top:1px solid var(--border);background:var(--bg);grid-template-columns:repeat(3,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-nav button{border-radius:var(--radius-sm);color:var(--ink-soft);background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:3px;font-size:.66rem;display:flex}.mobile-nav button.is-active{background:var(--primary-soft);color:var(--primary-hover);font-weight:650}.panel-heading,.source-summary,.control-section,.material-options,.board-options,.color-usage,.material-overview{padding-right:max(18px, env(safe-area-inset-right));padding-left:max(18px, env(safe-area-inset-left))}.source-panel,.material-panel{padding-bottom:24px}.pattern-stage{padding:12px}.canvas-status{bottom:8px}}@media (width<=760px){.topbar{gap:10px;padding:0 10px}.brand>span:last-child{display:none}.brand-mark{width:30px;height:30px}.topbar-actions{flex:1;justify-content:flex-end;width:auto;min-width:0}.topbar .primary-button{min-height:40px;padding:0 13px}.welcome-stage{flex-direction:column;gap:34px;padding:40px 18px 44px;display:flex}.welcome-copy{grid-template-columns:76px 1fr;gap:18px}.welcome-beads{gap:2px}.welcome-beads i{box-shadow:inset 0 0 0 2px oklch(100% 0 0/.38)}.welcome-copy h1{letter-spacing:-.03em;max-width:16ch;margin-bottom:14px;font-size:clamp(2rem,10vw,3rem)}.welcome-kicker{margin-bottom:8px;font-size:.74rem}.welcome-lede{font-size:.93rem;line-height:1.7}.upload-zone{width:100%;min-height:330px;padding:38px 20px}.upload-actions{flex-direction:column}.welcome-assurances{align-self:stretch;gap:10px;padding-inline:8px;display:grid}.toolbar-row{padding:6px 8px}.toolbar-group button span{display:none}.editor-toolbar.is-assembly-mode .assembly-mode-note span{text-overflow:ellipsis;white-space:nowrap;max-width:25ch;overflow:hidden}.editor-toolbar.is-assembly-mode .assembly-mode-note span,.assembly-tools button span,.view-tools .model-code-toggle span,.view-tools .five-grid-toggle span,.view-tools .board-boundary-toggle span{display:inline}.color-strip{gap:8px;padding:6px 9px}.active-color-label>svg,.active-color-label>strong{display:none}.color-strip>div button{width:28px;height:28px}.export-dialog{border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100vw;max-width:none;max-height:calc(100dvh - 12px);margin:auto 0 0}.dialog-shell{max-height:calc(100dvh - 12px)}.dialog-shell>header{padding:18px}.export-layout{flex-direction:column;display:flex}.export-formats{padding:10px}.export-formats button{grid-template-columns:38px minmax(0,1fr) auto;gap:10px;min-height:66px}.export-formats button>span:first-child{width:38px;height:38px}.export-options{padding:18px}.toast-region{bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 10px)}}@media (pointer:coarse){.toolbar-group button{min-width:44px;height:44px}.color-strip>div button{width:44px;height:44px}.color-more-select select,.focus-color-button{height:44px}.toast button{width:44px;height:44px}.board-count-inputs input,.board-placement button{min-height:44px}.app-shell.is-assembly-mode .toolbar-group button{min-width:44px;height:44px}.app-shell.is-assembly-mode .color-strip{min-height:56px;padding-top:8px;padding-bottom:8px}.app-shell.is-assembly-mode .color-strip>div button{width:44px;height:44px}.app-shell.is-assembly-mode .pattern-stage{padding:4px}}@media (width<=520px){.offline-badge{max-width:68px;padding-inline:5px;font-size:.62rem}.topbar:has(.offline-badge){gap:4px;padding-inline:4px}.topbar:has(.offline-badge) .brand{display:none}.topbar:has(.offline-badge) .topbar-actions{gap:4px}.topbar .primary-button span{display:none}.topbar .primary-button{width:40px;padding:0}}@media (width<=420px){.welcome-copy{display:block}.welcome-beads{width:64px;margin-bottom:20px}.dimension-inputs input{padding-inline:7px}.usage-row{grid-template-columns:20px 22px minmax(0,1fr) auto}.usage-packs{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}