.material-demo{max-width:1500px;padding-bottom:64px}.demo-intro{justify-content:space-between;align-items:flex-end;gap:56px;padding:42px 0 34px;display:flex}.demo-intro .eyebrow{margin-bottom:12px;font-size:10px}.demo-intro h1{font-size:54px}.demo-process{gap:8px;min-width:330px;margin:0;padding:0 0 3px;list-style:none;display:grid}.demo-process li{border-bottom:1px solid var(--line);color:#554d43;grid-template-columns:30px 1fr;gap:10px;padding:8px 0;font-size:13px;display:grid}.demo-process span{letter-spacing:.1em;color:#83745f;font-size:9px}.demo-workspace{grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:42px;display:grid}.demo-stage{min-width:0}.demo-photo-upload small{color:#60574c;letter-spacing:.035em;margin-top:8px;font-size:10px;line-height:1.5;display:block}.demo-photo-bar{letter-spacing:.13em;color:#62594e;justify-content:space-between;align-items:center;gap:20px;padding:0 0 10px;font-size:9px;display:flex}.demo-picture{isolation:isolate;background:#e9e3d9;width:100%;scroll-margin-top:15px;position:relative;overflow:hidden}.demo-picture canvas,.demo-picture>img{object-fit:contain;width:100%;height:100%;display:block}.demo-picture>img{position:absolute;inset:0}.demo-loading{letter-spacing:.04em;background:#f8f6f1c7;place-items:center;font-size:14px;display:grid;position:absolute;inset:0}.demo-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:16px;display:flex}.demo-comparison{border:1px solid #c9bfae;min-height:42px;display:inline-flex}.demo-comparison button{min-height:42px;padding:9px 15px;font-size:13px}.demo-comparison button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.demo-text-button{align-items:center;gap:8px;min-height:44px;padding:0;font-size:12px;display:inline-flex}.demo-photo-caption{color:#60574c;min-height:20px;margin-top:14px;font-size:12px;line-height:1.6}.demo-feedback{color:#706556;min-height:20px;margin-top:5px;font-size:12px;line-height:1.6}.demo-error{background:#efe7dc;border-left:2px solid #915437;margin-top:12px;padding:10px 14px;font-size:13px;line-height:1.6}.demo-controls{border-top:1px solid var(--line);padding-top:17px}.demo-control-section+.demo-control-section{border-top:1px solid var(--line);margin-top:24px;padding-top:23px}.demo-control-section h2{font:400 22px/1.4 var(--display);align-items:baseline;gap:12px;display:flex}.demo-control-section h2>span{font:400 10px var(--sans);letter-spacing:.08em;color:#746653}.demo-control-hint{color:#685e50;margin-top:8px;font-size:12px;line-height:1.55}.demo-finish-section{margin:0;padding:0}.demo-palette{grid-template-columns:repeat(3,1fr);gap:15px 17px;margin-top:18px;display:grid}.demo-palette button{flex-direction:column;align-items:center;gap:7px;min-height:78px;padding:4px 0;font-size:11px;line-height:1.4;display:flex}.demo-swatch{border:1px solid #5046362e;place-items:center;width:100%;height:46px;display:grid;position:relative}.demo-palette button[aria-pressed=true] .demo-swatch{outline-offset:3px;outline:1px solid #6b5b46}.demo-palette button:hover .demo-swatch{outline-offset:3px;outline:1px solid #ad9d85}.demo-palette-note{color:#6e6457;margin-top:11px;font-size:12px;line-height:1.55}.demo-actions{border-top:1px solid var(--line);margin-top:20px;padding-top:18px}.demo-actions>p{color:#716653;font-size:11px;line-height:1.6}.demo-restore-one{text-align:left;text-underline-offset:4px;min-height:38px;padding:9px 0;font-size:11px;text-decoration:underline}.material-demo button:disabled{opacity:.42;cursor:default}.material-demo button:disabled:hover{text-decoration:none}.demo-notes{border-top:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px;padding-top:26px;display:grid}.demo-notes span{letter-spacing:.13em;color:#77664f;font-size:10px}.demo-notes p{color:#645d52;margin-top:11px;font-size:13px;line-height:1.7}@media (min-width:1700px){.demo-intro h1{font-size:62px}.demo-workspace{grid-template-columns:minmax(0,1fr) 350px;gap:54px}}@media (max-width:1100px){.demo-workspace{grid-template-columns:minmax(0,1fr) 290px;gap:28px}.demo-intro h1{font-size:45px}.demo-process{min-width:280px}.demo-palette{gap:12px}}@media (max-width:800px){.material-demo{width:calc(100% - 36px);padding-bottom:40px}.demo-intro{padding:29px 0 24px;display:block}.demo-intro h1{max-width:400px;font-size:40px}.demo-process{min-width:0;margin-top:20px}.demo-process li{padding:7px 0;font-size:12px}.demo-workspace{flex-direction:column;gap:22px;display:flex}.demo-stage,.demo-controls{width:100%}.demo-photo-upload{margin-bottom:14px}.demo-photo-upload button{min-height:66px;padding:14px 16px;font-size:14px}.demo-photo-upload small{font-size:10px}.demo-photo-bar{gap:10px;font-size:8px}.demo-picture canvas,.demo-picture>img{object-fit:contain}.demo-toolbar{gap:8px;margin-top:11px}.demo-comparison button{padding:9px 12px;font-size:12px}.demo-photo-caption{margin-top:11px;font-size:12px}.demo-feedback{margin-top:4px;font-size:11px}.demo-controls{padding-top:19px}.demo-control-section h2{font-size:27px}.demo-palette{grid-template-columns:repeat(3,1fr);gap:12px 18px}.demo-palette button{min-height:80px;font-size:11px}.demo-swatch{height:48px}.demo-notes{grid-template-columns:1fr;gap:22px;margin-top:33px;padding-top:23px}.demo-notes p{margin-top:7px}.demo-workspace.is-ai-open .demo-stage{position:static}}@media (max-width:360px){.material-demo{width:calc(100% - 28px)}.demo-intro h1{font-size:36px}.demo-palette{gap:10px 14px}.demo-swatch{height:44px}}@media (prefers-reduced-motion:reduce){.material-demo *{scroll-behavior:auto;transition:none!important}}.demo-settings{border:0;min-width:0;margin:0;padding:0}.demo-settings:disabled{opacity:.65}.demo-ai{border-top:1px solid var(--line);margin-top:22px;padding-top:23px}.demo-ai-lead{color:#60574c;margin:12px 0 18px;font-size:14px;line-height:1.6}.demo-ai>label:not(.demo-ai-consent){margin:14px 0 7px;font-size:14px;display:block}.demo-ai>input,.demo-ai>select{color:#403d39;width:100%;min-height:44px;font:400 16px/1.4 var(--sans);background:#fefdf9;border:1px solid #91816c;border-radius:0;padding:10px 12px}.demo-photo-upload{margin-bottom:18px}.demo-photo-upload button{background:var(--ink);width:100%;min-height:66px;color:var(--paper);text-align:left;justify-content:space-between;align-items:center;gap:20px;padding:15px 19px;font-size:15px;display:flex}.demo-photo-upload button span{align-items:center;gap:14px;display:flex}.demo-photo-upload button b{font:400 10px var(--sans);letter-spacing:.1em;color:#cfc4b3}.demo-photo-upload button:hover:not(:disabled){background:#625747}.demo-photo-upload small{color:#60574c;letter-spacing:.04em;margin-top:8px;font-size:10px;display:block}.demo-ai :is(input,select,button):focus-visible{outline-offset:3px;outline:2px solid #725536}.demo-ai-selection{color:#60574c;margin-top:9px;font-size:13px;line-height:1.5}.demo-email{margin-top:18px;display:block}.demo-email>span{letter-spacing:.08em;text-transform:uppercase;color:#5e5549;margin-bottom:7px;font-size:12px;display:block}.demo-email input{background:#fefdf9;border:1px solid #91816c;border-radius:0;width:100%;min-height:48px;padding:11px 13px;font-size:16px}.demo-email input::placeholder{color:#6b6357;opacity:1}.demo-email-help{color:#6d6459;margin-top:7px;font-size:11px;line-height:1.55}.demo-ai-help{color:#60574c;margin-top:9px;font-size:12px;line-height:1.6}.demo-ai-consent{align-items:flex-start;gap:11px;margin:19px 0;font-size:13px;line-height:1.65;display:flex}.demo-ai-consent input{accent-color:#64533f;flex:none;width:19px;height:19px;margin-top:2px}.demo-ai-consent a{text-underline-offset:3px;text-decoration:underline}.demo-generate{color:#faf9f6;letter-spacing:.02em;background:#403d39;width:100%;min-height:58px;padding:14px 16px;font-size:15px;line-height:1.4;display:block}.demo-generate:hover:not(:disabled){background:#625747}.demo-ai-progress{border-top:1px solid #c9bfae;margin-top:17px;padding-top:15px;position:relative}.demo-ai-progress strong{font-size:14px;font-weight:400;line-height:1.6;display:block}.demo-ai-progress p{color:#60574c;margin-top:5px;font-size:13px;line-height:1.6}.demo-ai-line{background:#75634b;width:30%;height:2px;animation:2.4s ease-in-out infinite alternate demo-working;position:absolute;top:-1px;left:0}@keyframes demo-working{to{left:70%}}.demo-ai-success,.demo-ai-unavailable{color:#60574c;border-left:2px solid #95806c;margin-top:15px;padding:7px 0 7px 13px;font-size:14px;line-height:1.65}.demo-budget-link{letter-spacing:.09em;text-transform:uppercase;border:1px solid #8f806c;justify-content:space-between;align-items:center;gap:18px;min-height:50px;margin-top:13px;padding:12px 15px;font-size:12px;display:flex}.demo-budget-link:hover{background:#e9e3d9}.demo-notes a{text-underline-offset:3px;text-decoration:underline}.demo-toolbar{flex-wrap:wrap}.demo-comparison button{font-size:13px}.demo-controls:has(.demo-ai-progress){scroll-margin-top:20px}@media (max-width:800px){.demo-ai{margin-top:20px;padding-top:23px}.demo-ai-consent{font-size:14px}.demo-email-help{font-size:12px}.demo-ai>input,.demo-ai>select{font-size:16px}.demo-ai-help{font-size:13px}.demo-generate{min-height:50px;font-size:15px}.demo-comparison{max-width:100%}.demo-comparison button{padding:9px 12px;font-size:12px}.demo-toolbar .demo-text-button{margin-left:auto}.demo-workspace.is-ai-open .demo-stage:not(.is-portrait):not(:has(.is-drawing)){position:static}.demo-photo-upload{margin-bottom:14px}.demo-photo-upload button{min-height:64px;padding:14px 16px;font-size:14px}.demo-controls button,.demo-controls input,.demo-controls select,.demo-controls summary{scroll-margin-top:24px}.demo-picture{scroll-margin-top:15px}.demo-photo-caption{font-size:12px}}@media (max-width:800px) and (min-height:650px){.demo-workspace:not(.is-ai-open) .demo-controls :is(button,input,select,summary){scroll-margin-top:calc(75vw + 209px)}}@media (prefers-reduced-motion:reduce){.demo-ai-line{opacity:.5;width:100%;animation:none}}