:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#17313a;background:#f7f2e9;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header{max-width:1440px;margin:auto;padding:24px 38px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d2d8d5}.brand{font-size:23px;font-weight:800;color:inherit;text-decoration:none;letter-spacing:-1px}.brand span{display:inline-block;border-radius:10px;padding:8px;background:#17313a;color:#f5f1e7;margin-right:8px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#7a6851}.intro{max-width:1360px;margin:0 auto;padding:44px 38px 30px;display:grid;grid-template-columns:1.4fr 1fr;align-items:end;gap:16px}.intro .eyebrow{grid-column:1/-1}h1{font-size:clamp(36px,4.2vw,65px);line-height:1.06;letter-spacing:-3px;margin:0;font-weight:750}h1 em{font-family:Georgia,serif;font-weight:400;color:#9e4f39}p{line-height:1.65;color:#50636a}h2{font-size:21px;letter-spacing:-.5px}.workspace{max-width:1440px;margin:auto;padding:10px 38px 48px;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px;align-items:start}.slider-panel{min-width:0;background:#e7e4dc;border-radius:20px;padding:18px}.slider-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:0 2px 16px;font-size:13px}.slider-heading span{font-size:11px;color:#617272}.slider-panel .sw-slider{border:0;background:none;padding:0}.slider-panel .sw-stage{max-height:66vh}.hint,.small{font-size:12px}#message{border-left:3px solid #9aaa93;background:#f6f6ef;padding:12px;font-size:13px}.error{border-color:#a13a29!important;color:#7a2b1d}aside{background:#fffdf8;border:1px solid #d3d9d5;border-radius:18px;padding:22px}aside h2{margin:0}aside p{font-size:12px}button,input,select,textarea{font:inherit}button{background:#fffdf8;border:1px solid #becac7;color:#17313a;border-radius:7px;padding:10px 12px;min-height:42px;cursor:pointer}button:disabled{opacity:.4;cursor:default}aside>button,form>button{width:100%;margin-bottom:8px}.primary{background:#1c4840;color:#fff;border-color:#1c4840}.text-button{border:0;text-decoration:underline;background:none;font-size:12px}label{display:block;font-size:12px;font-weight:600;margin:14px 0}input:not([type=checkbox]),textarea{display:block;width:100%;min-width:0;margin-top:7px;border:1px solid #c4ceca;border-radius:6px;padding:10px;background:white;color:#17313a}textarea{resize:vertical}.check{display:flex;gap:8px;align-items:center;font-weight:400}.check input{width:18px;height:18px}.row{display:flex;gap:8px;margin-bottom:8px}.row button{flex:1;font-size:12px}hr{border:0;border-top:1px solid #e0e4df;margin:20px 0}.benefits{max-width:1360px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding:12px 38px 60px}.benefits span{font-size:10px;letter-spacing:1.8px;color:#897357}.benefits p{font-size:14px}footer{padding:26px 38px;border-top:1px solid #d7ddd8;font-size:10px;color:#7a7f79;letter-spacing:1px}button:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #b67d49;outline-offset:3px}@media(max-width:950px){.workspace{grid-template-columns:minmax(0,1fr) 280px;padding:10px 20px 36px;gap:16px}.intro{padding:32px 20px}.intro>p:last-child{grid-column:1/-1}}@media(max-width:700px){header{padding:16px 20px}header>.eyebrow{display:none}.intro{display:block}.intro .eyebrow{font-size:9px;line-height:1.8}h1{letter-spacing:-1.5px}.intro p{font-size:14px}.workspace{display:flex;flex-direction:column}.slider-panel,aside{width:100%}.slider-panel{padding:14px}.slider-heading{font-size:12px;flex-wrap:wrap}.slider-panel .sw-stage{max-height:65vh}.benefits{display:block;padding:12px 22px 30px}.benefits article{margin-bottom:28px}footer{font-size:9px;line-height:1.8;padding:22px}.sw-controls select{flex-basis:100%;order:1}}

[hidden]{display:none!important}

select{display:block;width:100%;margin-top:7px;padding:10px;border:1px solid #c4ceca;border-radius:6px;background:white;color:#17313a;min-height:42px}.pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}.callout{border-top:1px solid #c4cec7;margin-top:28px;padding:20px 8px}.callout span{font-size:10px;letter-spacing:1.6px;font-weight:700}.callout p{font-size:13px}.slider-panel .sw-slider{padding:12px}.slider-panel .sw-stage{max-height:none}

.slider-panel .sw-slider{background:#163943;border:1px solid #bac9c8;padding:12px}

.code-panel{padding:20px 6px}.code-panel textarea{font:11px/1.6 ui-monospace,monospace;resize:vertical;max-height:260px}.code-panel a{color:#1c4840}.sw-slider{max-width:100%}