:root{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#263d40;background:#f7f6f2;font-synthesis:none;font-size:14px;font-weight:400;--ink:#263d40;--muted:#67706b;--line:#e2e3da;--accent:#c24d33;--mint:#3e7567}*{box-sizing:border-box}body{margin:0}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit}button,a,textarea{outline-offset:4px}button:focus-visible,a:focus-visible,canvas:focus-visible,textarea:focus-visible{outline:3px solid #3d7a72;outline-offset:3px}button{border:0;background:none}button:disabled{cursor:default;opacity:.4}button:not(:disabled),a{touch-action:manipulation}button:not(:disabled):active{transform:translateY(1px)}a{color:inherit;text-decoration:none}::selection{color:#fff;background:#45796c}*{scrollbar-width:thin;scrollbar-color:#b9bdb0 #f7f6f2}html{scroll-behavior:smooth;scroll-padding-top:24px}button,textarea{caret-color:#c24d33}h1,h2,h3,p{margin:0}.icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle}.site-header{max-width:1536px;margin:auto;min-height:94px;padding:0 5%;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:60px}.brand{display:flex;align-items:center;gap:12px;font-size:29px;font-weight:750;letter-spacing:-1.2px}.brand-mark{width:39px;height:44px}.brand-run{font-weight:420}.brand-dot{color:var(--accent)}nav{display:flex;align-items:center;gap:34px;font-size:13px;font-weight:550;height:94px}nav>a,nav>button{height:100%;display:flex;gap:7px;align-items:center;position:relative;padding:0}nav>a:hover,nav>button:hover{color:var(--accent)}.nav-current:after{content:"";height:2px;background:var(--ink);position:absolute;bottom:-1px;left:0;right:0}.nav-count{font-size:10px;padding:1px 5px;border-radius:5px;background:#e9eae2}.nav-about .icon{width:16px;height:16px;color:var(--muted)}.header-note{margin-left:auto;display:flex;gap:8px;align-items:center;font-size:11px;color:var(--muted)}.little-dot{width:6px;height:6px;background:#6f9580;border-radius:50%}main{max-width:1536px;margin:auto;padding:0 5%}.intro{display:flex;align-items:center;justify-content:space-between;padding:43px 0 33px;gap:20px}h1{font-size:clamp(30px,3.1vw,43px);line-height:1.2;font-weight:550;letter-spacing:-1.3px;text-wrap:balance}h1 em{font-family:Georgia,Times New Roman,serif;font-weight:400;color:#4c7466;letter-spacing:-1.3px}.intro p{font-size:13px;color:var(--muted);margin-top:12px;line-height:1.6}.button{height:46px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid #d7dacf;border-radius:8px;background:#fffefa;padding:0 18px;font-size:12px;font-weight:600;white-space:nowrap;transition:background .16s ease-out,box-shadow .16s ease-out}.button:not(:disabled):hover{background:#efefe7;box-shadow:0 3px 9px #243b400b}.button .icon{width:18px;height:18px}.share-button{height:44px;flex-shrink:0}.workbench{display:grid;grid-template-columns:minmax(0,1fr) 276px;gap:22px;align-items:stretch}.table-panel{min-width:0;background:#edece5;border-radius:15px;overflow:hidden;border:1px solid #dedfd5}.stage-heading{height:65px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:10px;border-bottom:1px solid #dfdfd5;background:#f0f0e9}.layout-title-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}.layout-title-wrap h2{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}.status-dot{width:7px;height:7px;border-radius:50%;background:#658c72;flex-shrink:0}.status-dot.in-motion{background:var(--accent)}#layout-status{color:#71796f;font-size:10px;border-left:1px solid #d3d7c9;padding-left:10px;white-space:nowrap}.view-actions{display:flex;align-items:center;gap:3px;flex-shrink:0}.icon-button{width:36px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px}.icon-button .icon{width:17px;height:17px}.icon-button:not(:disabled):hover{background:#dedfd4}.divider{height:18px;width:1px;background:#d4d7ca;margin:0 4px}.stage{height:457px;position:relative;background:radial-gradient(ellipse at 52% 45%,#f1f0e9,#e7e7dd);overflow:hidden}#table{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}#table:focus-visible{outline-offset:-6px}.tool-tray{position:absolute;left:15px;top:23px;display:flex;flex-direction:column;gap:4px;padding:6px;background:#fbfaf4;border-radius:11px;box-shadow:0 4px 15px #493c2110}.tool-button{width:46px;min-height:49px;display:flex;align-items:center;justify-content:center;gap:4px;flex-direction:column;border-radius:7px;color:#6b7165;position:relative}.tool-button .icon{width:19px;height:19px}.tool-button span{font-size:9px;line-height:1}.tool-button:hover{background:#eeeee4}.tool-button.active{background:#e3eade;color:#355e4d}.tool-button.active:before{content:"";width:3px;height:17px;border-radius:3px;background:#527e64;position:absolute;left:-6px}.canvas-note{position:absolute;right:24px;top:25px;color:#777d70;font-family:Georgia,serif;font-style:italic;font-size:13px;pointer-events:none}.zoom-controls{display:flex;align-items:center;position:absolute;right:17px;bottom:18px;background:#faf9f1;border-radius:7px;box-shadow:0 2px 9px #453b1910;padding:2px}.zoom-controls .icon-button{width:32px;height:34px}.zoom-controls>button:nth-child(2){font-size:10px;width:42px;min-height:34px;color:#667260;font-variant-numeric:tabular-nums}.stage-footer{min-height:49px;padding:10px 19px;background:#f0f0e9;border-top:1px solid #dfdfd5;display:flex;align-items:center;justify-content:space-between;gap:18px}.stage-footer p{display:flex;align-items:center;gap:8px;max-width:70%;line-height:1.5;font-size:10px;color:#5e6c60}.stage-footer p .icon{width:14px;height:14px}.saved-label{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:9px;color:#74806d}.saved-label .icon{width:12px;height:12px}.scene-empty{position:absolute;left:25%;right:15%;top:38%;text-align:center;pointer-events:none}.scene-empty strong{display:block;font-family:Georgia,serif;font-size:28px;font-style:italic;font-weight:400}.scene-empty span{display:block;margin-top:10px;font-size:12px;color:#5d614c}.canvas-fallback{position:absolute;inset:100px 80px;background:#fbfaf4;border-radius:12px;padding:30px;line-height:1.7}.control-panel{background:#fdfcf8;border:1px solid #e0e2d8;border-radius:15px;padding:24px 23px 18px;display:flex;flex-direction:column}.panel-intro{position:relative}.panel-spark{position:absolute;top:1px;right:0;color:#a9873a}.panel-spark .icon{width:24px;height:24px}.panel-intro h2{font-size:23px;font-weight:500;line-height:1.25;letter-spacing:-.65px}.panel-intro p{font-size:11px;color:var(--muted);line-height:1.7;margin-top:11px}.pieces-line{display:flex;justify-content:space-between;align-items:center;margin-top:22px;padding:17px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:11px}.pieces-line>span{color:#667363}.pieces-line strong{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}.pieces-line strong>span+span{font-size:10px;font-weight:400;color:var(--muted)}.color-section{margin-top:20px}.control-label{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;gap:10px}.control-label>span+span{font-size:10px;font-weight:400;color:var(--muted)}.control-label .icon{width:14px;height:14px;color:#8d957d}.swatches{display:flex;justify-content:space-between;margin-top:9px;gap:1px}.swatch{width:35px;height:39px;border-radius:50%;display:grid;place-items:center;padding:5px;position:relative}.swatch span{display:block;background:var(--swatch);width:24px;height:24px;border-radius:50%;box-shadow:inset 0 -2px 3px #00000012}.swatch.selected:before{content:"";position:absolute;inset:2px -1px;border:1px solid #3f6355;border-radius:50%}.rainbow span{background:conic-gradient(#df7256 0 72deg,#e3b54c 72deg 144deg,#f2e5c6 144deg 216deg,#65a99a 216deg 288deg,#52849d 288deg)}.control-help{font-size:9px;color:#777d70;margin-top:8px;line-height:1.5}.playback-section{margin-top:23px}.speed-options{display:flex;background:#eeeee6;border-radius:7px;padding:3px;gap:2px;margin-top:10px}.speed-options button{border-radius:5px;min-width:0;flex:1;min-height:46px;font-size:13px;font-weight:550;color:#66705f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.speed-options button span{font-size:9px;font-weight:400}.speed-options .selected{background:#fffef8;box-shadow:0 1px 4px #3d473515;color:#29483f}.speed-options button:not(.selected):hover{background:#e2e6d9}.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-top:18px;gap:12px;font-size:11px}.toggle-row>span{display:flex;align-items:center;gap:8px}.toggle-row .icon{width:16px;height:16px;color:#74806c}.switch{width:38px;min-height:28px;display:flex;align-items:center;position:relative;padding:0 3px}.switch:before{content:"";position:absolute;inset:4px 0;background:#dedfd4;border-radius:20px}.switch>span{z-index:1;height:14px;width:14px;border-radius:50%;background:#fffdf5;box-shadow:0 1px 3px #31432b22;transform:translate(0);transition:transform .18s ease-out}.switch.on:before{background:#6e927b}.switch.on>span{transform:translate(18px)}.run-controls{margin-top:auto;padding-top:25px}.primary{background:var(--accent);border-color:var(--accent);color:#fffaf1;box-shadow:0 3px 7px #9b3d2514}.primary:not(:disabled):hover{background:#a9402a;box-shadow:0 4px 10px #9b3d2520}.run-controls>.primary{width:100%;height:48px;font-size:13px}.primary .icon{width:17px;height:17px}#run-btn .icon path{fill:currentColor;stroke-width:1}.secondary-controls{display:flex;justify-content:space-between;gap:10px;padding-top:8px}.secondary-controls button{min-height:34px;font-size:10px;display:flex;align-items:center;gap:6px;padding:0 2px}.secondary-controls .icon{width:13px;height:13px}.secondary-controls button:not(:disabled):hover{color:var(--accent)}.run-progress{height:3px;background:#eeeee4;border-radius:3px;overflow:hidden;margin-top:4px}.run-progress>div{height:100%;width:0;background:#83a38a}.run-caption{font-size:9px;text-align:center;color:#717b6a;line-height:1.6;margin-top:10px;min-height:15px}.showcases{padding-top:32px;scroll-margin-top:26px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:16px}.section-heading h2{font-size:19px;font-weight:550;letter-spacing:-.4px}.section-heading p{font-size:11px;color:var(--muted);margin-top:6px}.text-button{display:flex;align-items:center;gap:6px;min-height:44px;font-size:11px}.text-button .icon{width:16px;height:16px}.text-button:hover{color:var(--accent)}.layout-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.layout-card{border:1px solid #dfe1d7;padding:0;text-align:left;border-radius:11px;overflow:hidden;background:#fcfbf6;transition:border-color .2s ease-out}.layout-card:hover{border-color:#91a38c}.layout-card.chosen{border-color:#8fa189}.layout-preview{position:relative;height:127px;background:#ebe9dc;overflow:hidden}.layout-card:nth-child(2) .layout-preview{background:#e9ebe1}.layout-card:nth-child(3) .layout-preview{background:#eae6db}.layout-card:nth-child(4) .layout-preview{background:#e5e9e3}.mini-layout{width:100%;height:146%;position:absolute;top:-25%;left:8%;transform:rotate(-12deg)}.sample-tag{position:absolute;left:12px;top:11px;font-size:7px;letter-spacing:.8px;color:#5c6858;background:#f8f7efcf;border-radius:3px;padding:4px 5px}.sample-arrow{position:absolute;bottom:10px;right:10px;width:25px;height:25px;background:#f9f8f1;border-radius:50%;display:grid;place-items:center}.sample-arrow .icon{width:13px;height:13px}.sample-copy{padding:13px 14px 15px;display:flex;flex-direction:column;gap:6px}.sample-copy strong{font-size:12px;font-weight:600}.sample-copy>span{font-size:10px;color:var(--muted)}.site-footer{max-width:1536px;margin:31px auto 0;padding:21px 5% 26px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:#7b8274;font-size:10px}.footer-domino{color:#4d6758}.site-footer button{display:flex;align-items:center;gap:10px;min-height:36px;font-size:10px}.site-footer .icon{height:13px;width:13px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:#2b4941;color:#fffdf1;font-size:12px;padding:14px 22px;border-radius:10px;box-shadow:0 6px 25px #1c30252a;max-width:calc(100% - 32px);width:max-content;z-index:10;line-height:1.6;text-align:center}dialog{border:0;border-radius:17px;padding:29px;width:520px;max-width:calc(100% - 28px);max-height:85dvh;color:var(--ink);background:#fcfbf5;box-shadow:0 20px 70px #1f302638}dialog::backdrop{background:#273d3799}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.dialog-heading h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-.5px;font-size:25px}.close-dialog{flex-shrink:0}.dialog-description{font-size:12px;line-height:1.8;color:var(--muted);margin:17px 0 22px}.field-label{font-size:12px;font-weight:600;display:block;margin-bottom:8px}textarea{border:1px solid #d4d9ca;border-radius:7px;background:#f4f4eb;width:100%;resize:vertical;padding:12px;color:#435545;font-size:12px;line-height:1.6}textarea::placeholder{color:#727c68}#share-code{font-family:ui-monospace,monospace;font-size:10px;word-break:break-all}#share-dialog .primary{width:100%;margin-top:12px}.import-section{margin-top:25px;padding-top:22px;border-top:1px solid var(--line)}.import-section .button{margin-top:10px}.field-error{font-size:11px;line-height:1.6;color:#b1452d;margin-top:8px}.dialog-note{font-size:10px;color:var(--muted);margin-top:17px}.help-list{margin-top:16px}.help-list p{font-size:12px;line-height:1.8;color:#657062;margin-top:15px}.help-list strong{color:var(--ink)}.keyboard-help{background:#eeefe5;padding:18px;border-radius:9px;margin-top:22px}.keyboard-help h3,.about-three h3{font-size:12px;font-weight:650;margin-bottom:13px}.keyboard-help p{font-size:10px;color:#52624e;line-height:2.7}.keyboard-help p>span{display:block}kbd{display:inline-block;border:1px solid #d3d8c8;padding:0 5px;line-height:20px;border-radius:4px;background:#fbfbf3;font-family:inherit;margin:0 2px;font-size:9px}.about-three{border-top:1px solid var(--line);margin-top:24px;padding-top:21px}.about-three p{font-size:11px;color:var(--muted);line-height:1.8;margin-top:5px}[hidden]{display:none!important}@media(min-width:1500px){.stage{height:510px}.control-panel{padding-top:30px;padding-bottom:22px}.panel-intro h2{font-size:26px}.pieces-line{margin-top:30px}.color-section{margin-top:25px}.playback-section{margin-top:28px}}@media(max-width:1100px){.site-header{gap:35px;padding-left:4%;padding-right:4%}main{padding:0 4%}.header-note{display:none}.workbench{grid-template-columns:minmax(0,1fr) 244px;gap:16px}.control-panel{padding-left:18px;padding-right:18px}.stage-heading{padding:0 15px}#layout-status{display:none}.stage{height:460px}.stage-footer{padding:10px 14px}.saved-label{font-size:8px}.swatch{width:31px}.swatch span{width:22px;height:22px}.swatch.selected:before{inset:4px 0}.panel-intro h2{font-size:22px}.canvas-note{font-size:12px;right:17px}.layout-gallery{gap:12px}.sample-copy{padding-left:11px;padding-right:11px}.sample-copy>span{font-size:9px}}@media(max-width:780px){.site-header{height:78px;min-height:78px;gap:25px;justify-content:space-between}.brand{font-size:26px;gap:8px}.brand-mark{width:32px;height:37px}nav{height:78px;gap:24px;font-size:12px}.intro{padding:30px 0 25px}h1{font-size:32px;letter-spacing:-1px}.intro p{font-size:11px;max-width:270px}.workbench{grid-template-columns:minmax(0,1fr);gap:17px}.stage{height:440px}.stage-heading{height:58px;padding:0 18px}.saved-label{font-size:9px}.stage-footer p{font-size:10px}.control-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;padding:22px}.panel-intro{display:none}.pieces-line{grid-column:1;margin:0;border-top:0;padding:0 0 15px}.color-section{grid-column:1;margin-top:15px;grid-row:2/4}.playback-section{grid-column:2;grid-row:1/3;margin:0}.toggle-row{grid-column:2;grid-row:3;margin-top:13px}.toggle-row:has(#sound-btn){grid-column:1;grid-row:4;margin-top:13px}.run-controls{grid-column:1/-1;grid-row:5;margin-top:17px;padding-top:17px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:0 23px;align-items:center}.run-controls>.primary{grid-column:2;grid-row:1/3}.secondary-controls{grid-column:1;grid-row:1;padding:0}.run-caption{grid-column:1;grid-row:3;text-align:left;margin-top:3px}.run-progress{grid-column:1;grid-row:2;margin-top:4px}.swatches{justify-content:flex-start;gap:4px}.swatch{width:35px}.swatch.selected:before{inset:2px 0}.showcases{padding-top:29px}.layout-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.layout-preview{height:140px}.sample-copy>span{font-size:10px}.site-footer{margin-top:28px}.scene-empty{top:42%}}@media(max-width:480px){.site-header{padding:0 20px;height:75px;min-height:75px;gap:12px}.brand{font-size:24px;letter-spacing:-.9px;gap:7px}.brand-mark{width:30px}nav{height:75px;gap:19px}nav>.nav-current{display:none}.nav-about{font-size:0;gap:0}.nav-about .icon{width:21px;height:21px}.nav-count{font-size:9px}main{padding:0 17px}.intro{padding:28px 1px 23px;display:grid;grid-template-columns:1fr auto;align-items:start;gap:7px}h1{font-size:29px;line-height:1.1;letter-spacing:-.9px;max-width:250px}h1 em{display:block;margin-top:4px;letter-spacing:-1px}.intro p{font-size:11px;line-height:1.7;margin-top:12px;max-width:235px}.share-button{width:42px;height:42px;padding:0;margin-top:5px}.share-button span{display:none}.share-button .icon{width:18px;height:18px}.workbench{gap:15px}.table-panel{border-radius:12px}.stage-heading{height:55px;padding:0 11px;gap:5px}.layout-title-wrap{gap:7px}.layout-title-wrap h2{font-size:11px;max-width:166px}.view-actions{gap:0}.view-actions .icon-button{width:29px;height:40px}.view-actions .icon{width:15px;height:15px}.divider{margin:0 2px}.stage{height:363px}.tool-tray{left:9px;top:15px;padding:4px;gap:1px;border-radius:9px}.tool-button{width:38px;min-height:44px;gap:3px}.tool-button .icon{width:17px;height:17px}.tool-button span{font-size:8px}.tool-button.active:before{left:-4px;width:2px}.canvas-note{top:17px;right:12px;font-size:10px;max-width:160px;text-align:right}.zoom-controls{bottom:12px;right:12px}.zoom-controls .icon-button{width:29px;min-height:34px}.stage-footer{padding:11px 12px;gap:9px;min-height:57px;align-items:flex-start}.stage-footer p{font-size:9px;max-width:68%;gap:6px}.stage-footer p .icon{width:13px;height:13px}.saved-label{font-size:0;gap:0;padding-top:1px}.saved-label:after{content:"Autosaved";font-size:8px}.saved-label .icon{width:11px;height:11px;margin-right:3px}.control-panel{padding:20px 18px 15px;border-radius:12px;gap:0 19px}.pieces-line{font-size:10px;gap:6px;padding-bottom:13px;white-space:nowrap}.pieces-line strong{font-size:15px}.pieces-line strong>span+span{font-size:9px}.control-label{font-size:10px}.control-label>span+span{font-size:8px}.color-section{margin-top:13px}.swatches{gap:0;justify-content:space-between;margin-top:7px}.swatch{width:25px;height:35px;padding:3px}.swatch span{width:19px;height:19px}.swatch.selected:before{inset:5px -2px}.control-help{font-size:8px;line-height:1.7;margin-top:5px}.speed-options{margin-top:9px;gap:0;padding:2px}.speed-options button{min-height:43px;font-size:12px}.speed-options button span{font-size:8px}.toggle-row{font-size:10px;gap:6px;margin-top:14px}.toggle-row>span{gap:5px}.toggle-row .icon{width:13px;height:13px}.switch{width:32px;flex-shrink:0}.switch.on>span{transform:translate(12px)}.toggle-row:has(#sound-btn){margin-top:10px}.run-controls{gap:0 16px;margin-top:16px;padding-top:16px;grid-template-columns:1fr 1.12fr}.run-controls>.primary{font-size:12px;height:47px;grid-row:1/4}.secondary-controls{gap:8px;justify-content:space-between}.secondary-controls button{font-size:9px;gap:4px}.secondary-controls .icon{width:12px;height:12px}.run-caption{font-size:8px;line-height:1.5;grid-column:1/-1;grid-row:4;text-align:center;margin-top:9px}.section-heading{margin-bottom:15px}.section-heading h2{font-size:18px}.section-heading p{font-size:10px}.text-button{font-size:10px;gap:4px}.layout-gallery{gap:13px}.layout-preview{height:105px}.sample-tag{font-size:6px;left:8px;top:8px;letter-spacing:.5px}.sample-copy{padding:12px 10px;gap:5px}.sample-copy strong{font-size:11px}.sample-copy>span{font-size:8px;line-height:1.5}.sample-arrow{width:21px;height:21px;bottom:7px;right:7px}.site-footer{padding:17px 20px 20px;gap:20px;font-size:8px;align-items:flex-start}.site-footer>span{max-width:200px;line-height:1.8}.site-footer button{font-size:9px;white-space:nowrap;gap:5px;min-height:30px}.scene-empty{left:22%;right:10%;top:40%}.scene-empty strong{font-size:23px}.scene-empty span{font-size:10px;line-height:1.6}.toast{bottom:16px;font-size:11px;padding:12px 17px}dialog{padding:22px 20px;border-radius:13px}.dialog-heading h2{font-size:23px}.canvas-fallback{inset:70px 25px 80px 65px;font-size:11px;padding:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.mini-layout{transform:none}}.table-panel{display:flex;flex-direction:column}.stage{flex:1;min-height:457px}#table{position:absolute;inset:0}.stage-heading,.stage-footer{flex-shrink:0}.mobile-run{display:none}.swatches{min-height:44px}.swatch{height:44px}.swatch.selected:before{inset:5px -1px}.swatch span{width:24px;height:24px}.zoom-controls .icon-button,.zoom-controls>button:nth-child(2){min-height:40px}.view-actions .icon-button{min-width:40px;min-height:44px}.switch{min-height:44px}.switch:before{inset:12px 0}.toggle-row{margin-top:6px}.nav-about,.tool-button{min-width:44px}.sample-copy>span,.control-help,.run-caption{color:#636e5d}.saved-label{color:#62705a}@media(min-width:1500px){.stage{min-height:510px}}@media(max-width:780px){.stage{height:440px;min-height:440px;flex:none}.swatch{width:35px;height:44px}.toggle-row{margin-top:4px}.toggle-row:has(#sound-btn){margin-top:4px}.control-panel{gap:0 28px}}@media(max-width:480px){.stage{height:330px;min-height:330px}.tool-tray{top:12px;left:12px;right:12px;display:flex;flex-direction:row;justify-content:space-between;padding:4px;gap:0}.tool-button{min-width:44px;min-height:46px;width:44px}.tool-button.active:before{height:2px;width:17px;left:14px;top:-4px}.canvas-note{display:none}.view-actions .icon-button{min-width:37px;width:37px}.view-actions .divider{margin:0}.layout-title-wrap h2{max-width:165px}.mobile-run{display:flex;position:absolute;left:12px;bottom:12px;height:42px;font-size:10px;padding:0 12px;gap:6px}.mobile-run .icon{width:13px;height:13px}.zoom-controls .icon-button,.zoom-controls>button:nth-child(2){min-height:38px}.swatch{height:44px;width:25px;min-width:25px}.swatch span{width:19px;height:19px}.swatch.selected:before{inset:9px -2px}.control-panel{gap:0 19px}.toggle-row{margin-top:0}.toggle-row:has(#sound-btn){margin-top:0}.switch{min-height:44px}.switch:before{inset:12px 0}.site-header nav{gap:12px}.site-header nav>a{min-height:44px}.layout-title-wrap{gap:6px}.stage-heading{padding-left:10px;padding-right:6px}.stage-footer{min-height:54px}}@media(max-width:480px){.color-section{grid-column:1/-1;grid-row:3;margin-top:18px}.pieces-line{grid-row:1/3;align-self:center;border-bottom:0;padding:0;flex-direction:column;align-items:flex-start;gap:8px}.pieces-line strong{font-size:19px}.pieces-line strong>span+span{font-size:11px}.playback-section{grid-column:2;grid-row:1/3}.swatches{gap:4px;justify-content:space-between;margin-top:5px}.swatch{width:44px;min-width:44px}.swatch span{width:25px;height:25px}.swatch.selected:before{inset:5px}.control-help{font-size:9px;margin-top:3px}.toggle-row{grid-column:2;grid-row:4;margin-top:8px}.toggle-row:has(#sound-btn){grid-column:1;grid-row:4;margin-top:8px}.run-controls{grid-row:5}.saved-label.unavailable:after{content:"Storage off"}}#layout-status{color:#606c5d}.canvas-note{color:#626c5d}.site-footer{color:#67705f}.switch{width:44px;min-width:44px}.switch:before{right:6px}.secondary-controls button,.site-footer button{min-height:44px}.speed-options button{min-height:46px}@media(max-width:480px){.view-actions .icon-button{width:44px;min-width:44px}.layout-title-wrap h2{max-width:144px}.zoom-controls .icon-button,.zoom-controls>button:nth-child(2){width:40px;min-width:40px;min-height:44px}.mobile-run{height:44px}.speed-options button{min-height:44px}.switch:before{right:12px}}