.showroom-section .module-showcase .module-layout,.showroom-section .style-playground.style-experience{border-radius:0}.showroom-section .module-note{padding-inline:24px}.module-showcase,.style-playground.style-experience{--showroom-ink:#1c1c20;--showroom-muted:#626169;--showroom-paper:#f0f0f2;--showroom-stage:#e7e3f1;--showroom-line:#d8d6df;min-width:0;color:var(--showroom-ink)}.module-showcase .module-layout{background:var(--showroom-paper);border:0;border-radius:28px;grid-template-columns:minmax(270px,.8fr) minmax(0,1.5fr);gap:clamp(28px,4vw,72px);padding:clamp(24px,4vw,72px);overflow:visible}.module-showcase .module-selector{min-width:0}.module-showcase .showroom-kicker{color:var(--showroom-muted);margin:0 0 28px;font-size:clamp(16px,1.29vw,21px);line-height:1.5}.module-showcase .module-menu{background:0 0;border:0;flex-direction:column;gap:10px;padding:0;display:flex;overflow:visible}.module-showcase .module-menu button{width:100%;min-width:0;min-height:76px;color:var(--showroom-ink);letter-spacing:-.04em;box-shadow:none;background:0 0;border:1px solid #0000;border-radius:48px;gap:16px;padding:18px 24px;font-size:clamp(18px,1.72vw,29px);font-weight:500;line-height:1.18;transition:background .18s,color .18s,transform .18s}.module-showcase .module-menu button>span:nth-child(2){min-width:0}.module-showcase .module-menu button>svg{flex:none}.module-showcase .module-menu button:hover{background:#e3e0ea;transform:translate(4px)}.module-showcase .module-menu button.active{background:var(--showroom-ink);border-color:var(--showroom-ink);color:#fff;box-shadow:none}.module-showcase .module-index{letter-spacing:0;color:inherit;opacity:.65;flex:none;font-size:13px}.module-showcase .module-stage{background:var(--showroom-stage);border-radius:22px;align-self:start;min-width:0;padding:clamp(24px,2.6vw,48px)}.module-showcase-full .module-stage{position:sticky;top:128px}.module-showcase .module-stage-header{border:0;flex-wrap:wrap;gap:24px;padding:0 0 38px;display:flex}.module-showcase .module-stage-header>div{flex:300px}.module-showcase .module-stage-header h3{letter-spacing:-.065em;margin:0 0 20px;font-size:clamp(29px,2.72vw,50px);line-height:1.02}.module-showcase .module-stage-header p{color:#53505d;max-width:620px;font-size:clamp(17px,1.25vw,21px);line-height:1.5}.module-showcase .showroom-live-label{color:#494452;white-space:nowrap;border:1px solid #cbc5db;border-radius:30px;align-items:center;gap:9px;padding:9px 14px;font-size:15px;display:inline-flex}.module-showcase .showroom-preview-window,.style-experience .showroom-preview-window{background:#fff;border:1px solid #d4cfdf;border-radius:14px;min-width:0;overflow:hidden;box-shadow:0 18px 45px #3023450b}.module-showcase .showroom-window-bar,.style-experience .showroom-window-bar{background:#fbfafc;border-bottom:1px solid #e8e6ed;align-items:center;gap:6px;min-height:44px;padding:12px 18px;display:flex}.showroom-window-bar>span:not(.showroom-window-title){background:#d0ccd7;border-radius:50%;flex:none;width:6px;height:6px}.showroom-window-bar .showroom-window-title{color:#747079;letter-spacing:0;margin-left:auto;font-size:12px}.module-showcase .live-preview iframe{min-height:390px;max-height:820px}.module-showcase .preview-source,.style-experience .preview-source{color:#67616f;text-align:center;background:#fbfafc;padding:16px 12px;font-family:inherit;font-size:13px;line-height:1.4}.module-showcase .module-note{max-width:900px;color:var(--showroom-muted);margin:26px auto 0;font-size:17px;line-height:1.6}.module-showcase .filter-tabs{gap:12px;margin-bottom:32px}.module-showcase .filter-tabs button{border-color:var(--showroom-line);min-height:56px;padding:12px 26px;font-size:18px;transition:background .18s,color .18s}.module-showcase .filter-tabs button:hover{background:var(--showroom-paper)}.module-showcase .filter-tabs button.active{background:var(--showroom-ink);color:#fff;border-color:var(--showroom-ink)}.style-playground.style-experience{box-shadow:none;background:#eae9ee;border:0;border-radius:28px;grid-template-columns:minmax(350px,.85fr) minmax(0,1.5fr);gap:clamp(28px,3.4vw,60px);padding:clamp(28px,3.4vw,60px);overflow:visible}.style-experience .style-controls{background:0 0;border:0;flex-direction:column;gap:32px;min-width:0;padding:0;display:flex}.style-experience .control-heading{color:var(--showroom-ink);letter-spacing:-.06em;border-color:#cfccd7;padding:0 0 28px;font-family:inherit;font-size:clamp(27px,2.4vw,42px);line-height:1.04}.style-experience .style-reset{min-height:48px;color:var(--showroom-ink);letter-spacing:0;background:0 0;border:1px solid #ccc8d3;border-radius:28px;justify-content:center;align-items:center;gap:10px;padding:12px 16px;font-size:16px;transition:background .18s;display:inline-flex}.style-experience .style-reset:hover{background:#fff}.style-experience .style-controls fieldset{min-width:0}.style-experience .style-controls label,.style-experience .style-controls legend{color:#37333e;letter-spacing:-.025em;min-width:0;font-size:clamp(17px,1.29vw,21px);font-weight:500;line-height:1.4}.style-experience .palette-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0;display:grid}.style-experience .palette-options button{width:100%;height:auto;min-height:62px;box-shadow:none;border-width:1px;border-radius:14px;gap:10px;padding:14px 15px;transition:transform .18s,box-shadow .18s}.style-experience .palette-options button:hover{transform:translateY(-2px)}.style-experience .palette-options button[aria-pressed=true]{box-shadow:0 0 0 2px #6851da}.style-experience .palette-options .palette-signal{border-radius:8px;flex:none;width:9px;height:26px}.style-experience .palette-options .palette-name{letter-spacing:-.035em;min-width:0;font-size:17px;font-weight:500}.style-experience .palette-options svg{flex:none;margin-left:auto}.style-experience .control-caption{color:#625d6c;font-size:16px;line-height:1.5}.style-experience .style-controls select{background:#faf9fc;border:1px solid #cfccd7;border-radius:14px;margin-top:12px;padding:18px 16px;font-size:16px;line-height:1.4}.style-experience .color-control{background:#faf9fc;border:1px solid #cfccd7;border-radius:14px;gap:16px;min-height:66px;margin-top:12px;padding:10px 14px}.style-experience .color-control input{flex:none;width:42px;height:42px}.style-experience .color-control input::-webkit-color-swatch{border-radius:8px}.style-experience .color-control>span{font-family:inherit;font-size:17px}.style-experience .segmented-control{background:#dedbe5;border-radius:15px;gap:4px;margin-top:12px;padding:5px}.style-experience .segmented-control button{color:#585260;border-radius:11px;min-width:0;min-height:54px;padding:10px 6px;font-size:16px}.style-experience .segmented-control button[aria-pressed=true]{color:#242027;background:#fff;box-shadow:0 2px 6px #3322450a}.style-experience .style-controls input[type=range]{width:100%;height:32px;margin-top:14px}.style-experience .range-value{color:#625c6a;font-family:inherit;font-size:16px}.style-experience .control-footnote{color:#625d6c;border-top:1px solid #cfccd7;margin:0;padding-top:24px;font-size:17px;line-height:1.6}.style-experience .style-stage{background:var(--showroom-stage);border-radius:20px;align-self:start;min-width:0;overflow:hidden}.style-experience .style-stage-bar{color:#494350;background:0 0;border:0;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;padding:22px 26px;font-size:17px;display:flex}.style-experience .style-stage-bar>span{align-items:center;gap:10px;display:inline-flex}.style-experience .device-controls{background:#d9d3e5;border-radius:40px;gap:4px;padding:4px;display:flex}.style-experience .device-controls .icon-button{color:#605768;border-radius:28px;align-items:center;gap:9px;width:auto;min-width:46px;min-height:46px;padding:10px 15px;font-size:16px;display:inline-flex}.style-experience .device-controls .icon-button[aria-pressed=true]{color:#211a29;box-shadow:none;background:#fff}.style-experience .style-preview-canvas{min-width:0;padding:0 26px 26px}.style-experience .live-preview{background:#f4f2f8}.style-experience .live-preview iframe{min-height:700px;max-height:900px}.style-experience .live-preview.preview-mobile{border-inline:1px solid #d5cfe0;max-width:390px}.module-showcase button:focus-visible,.style-experience button:focus-visible,.style-experience input:focus-visible,.style-experience select:focus-visible{outline-offset:4px;outline:3px solid #7154ef}@media (min-width:1500px){.style-experience .style-stage{position:sticky;top:130px}}@media (max-width:1120px){.module-showcase .module-layout{grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr);gap:24px;padding:28px}.module-showcase .module-menu button{gap:12px;padding:17px 18px;font-size:21px}.module-showcase .module-stage{padding:24px}.style-playground.style-experience{grid-template-columns:minmax(300px,.9fr) minmax(0,1.25fr);gap:24px;padding:28px}.style-experience .palette-options button{padding-inline:12px}.style-experience .palette-options .palette-name{font-size:16px}.style-experience .style-stage-bar{padding:20px}.style-experience .device-controls .icon-button>span{display:none}.style-experience .style-preview-canvas{padding:0 16px 16px}}@media (max-width:850px){.module-showcase .module-layout{grid-template-columns:minmax(0,1fr)}.module-showcase .module-stage{position:static}.module-showcase .module-menu{flex-flow:wrap;gap:9px}.module-showcase .module-menu button{width:auto;min-height:58px;padding:14px 20px;font-size:19px}.module-showcase .module-menu button>svg{display:none}.module-showcase .showroom-kicker{margin-bottom:20px}.style-playground.style-experience{grid-template-columns:minmax(0,1fr)}.style-experience .style-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;display:grid}.style-experience .control-heading,.style-experience .style-controls fieldset:first-of-type,.style-experience .control-footnote{grid-column:1/-1}.style-experience .style-controls fieldset:first-of-type .palette-options{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:540px){.module-showcase .module-layout,.style-playground.style-experience{border-radius:20px;gap:28px;padding:20px 16px}.module-showcase .filter-tabs{gap:8px;margin-bottom:22px}.module-showcase .filter-tabs button{min-height:48px;padding:10px 17px;font-size:17px}.module-showcase .module-menu{gap:8px}.module-showcase .module-menu button{gap:10px;min-height:52px;padding:13px 16px;font-size:17px}.module-showcase .module-index{font-size:11px}.module-showcase .module-stage{border-radius:14px;padding:22px 12px 12px}.module-showcase .module-stage-header{gap:18px;padding:0 8px 28px}.module-showcase .module-stage-header h3{margin-bottom:18px;font-size:30px}.module-showcase .module-stage-header p{font-size:17px;line-height:1.45}.module-showcase .showroom-live-label{font-size:14px}.module-showcase .showroom-window-bar,.style-experience .showroom-window-bar{padding-inline:12px}.showroom-window-bar .showroom-window-title{font-size:10px}.module-showcase .preview-source,.style-experience .preview-source{padding:13px 10px;font-size:12px}.module-showcase .module-note{padding-inline:8px;font-size:15px}.style-experience .style-controls{gap:26px;display:flex}.style-experience .control-heading{padding-bottom:24px;font-size:30px}.style-experience .style-controls fieldset:first-of-type .palette-options{grid-template-columns:repeat(2,minmax(0,1fr))}.style-experience .palette-options button{gap:8px;min-height:60px;padding:12px}.style-experience .palette-options .palette-name{font-size:16px}.style-experience .style-controls label,.style-experience .style-controls legend{font-size:18px}.style-experience .style-controls select{padding:16px 12px;font-size:16px}.style-experience .segmented-control button{padding-inline:4px;font-size:14px}.style-experience .style-reset{padding:10px 13px}.style-experience .style-stage-bar{gap:10px;padding:18px 12px;font-size:17px}.style-experience .device-controls .icon-button{min-width:44px;min-height:44px;padding:10px}.style-experience .style-preview-canvas{padding:0 8px 8px}.style-experience .live-preview iframe{min-height:700px}.style-experience .control-footnote{font-size:16px}}@media (prefers-reduced-motion:reduce){.module-showcase .module-menu button,.style-experience .palette-options button,.style-experience .live-preview{transition:none}.module-showcase .module-menu button:hover,.style-experience .palette-options button:hover{transform:none}}
