:root{font-family:DM Sans,sans-serif;color:#222b29;background:#eeeae2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}button:focus-visible,input:focus-visible+span{outline:3px solid #448d81;outline-offset:3px}.topbar{height:76px;padding:0 35px;display:flex;align-items:center;justify-content:space-between;background:#f6f3ed;border-bottom:1px solid #dedbd3}.brand{display:flex;align-items:center;gap:13px;font-family:Manrope,sans-serif;font-size:16px;font-weight:800;letter-spacing:.11em}.brand-light{font-weight:500}.brand-icon{width:27px;height:27px;border:2px solid #1c3d37;border-radius:4px;display:flex;gap:3px;padding:4px}.brand-icon span{flex:1;background:#1c3d37;border-radius:1px}.topbar-right{display:flex;align-items:center;gap:26px}.topbar-label,.eyebrow,.viewer-top,.dialog-eyebrow{font-size:10px;font-weight:800;letter-spacing:.18em}.topbar-label{color:#89918a}.photo-button{border:1px solid #d4d8d0;background:#fff;color:#29423c;border-radius:8px;padding:10px 15px;font-size:12px;font-weight:700;display:flex;align-items:center;gap:8px}.photo-button:hover{border-color:#7b9990;background:#f6faf6}.photo-icon{font-size:17px;line-height:10px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 385px;height:calc(100vh - 76px);min-height:640px}.viewer-panel{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 25%,#e7e9e4,#cbd6d0)}.canvas-host{position:absolute;inset:0}.canvas-host canvas{display:block;width:100%;height:100%}.viewer-top{position:absolute;left:31px;top:29px;display:flex;align-items:center;gap:9px;color:#304942;background:#f9faf6df;padding:11px 14px;border-radius:7px;box-shadow:0 3px 16px #53695a12;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.live-dot{width:7px;height:7px;background:#59a58a;border-radius:50%;box-shadow:0 0 0 4px #59a58a28}.viewer-bottom{position:absolute;bottom:25px;left:31px;color:#3b4a45;background:#f9faf6e5;padding:10px 14px;border-radius:7px;font-size:11px;font-weight:700;display:flex;align-items:center;gap:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.drag-icon{font-size:17px;line-height:10px}.view-buttons{position:absolute;right:26px;bottom:25px;display:flex;gap:2px;background:#f9faf6e5;padding:4px;border-radius:9px;box-shadow:0 4px 20px #1d33221a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.view-button{border:0;background:transparent;padding:9px 14px;border-radius:6px;font-size:11px;font-weight:700;color:#61726c}.view-button:hover{color:#213e35}.view-button.active{color:#fff;background:#244f42;box-shadow:0 2px 7px #0b2d2840}.controls{overflow-y:auto;background:#f8f6f1;padding:44px 37px 24px;border-left:1px solid #e1dfd7}.eyebrow{display:flex;align-items:center;gap:10px;color:#4c8272}.eyebrow-line{width:17px;height:1px;background:#4c8272}.controls h1{font-family:Manrope,sans-serif;font-size:33px;line-height:1.23;letter-spacing:-.06em;margin:16px 0 12px;font-weight:800}.controls h1 em{font-style:normal;color:#517866}.intro{font-size:13px;line-height:1.65;color:#7e8981;margin:0;max-width:280px}.divider{height:1px;background:#e4e4dc;margin:29px 0}.control-section{margin-bottom:28px}.section-heading{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}.section-number{font-family:Manrope,sans-serif;color:#8aa697;font-weight:800;font-size:11px}.section-heading h2{font-family:Manrope,sans-serif;font-size:13px;letter-spacing:-.01em;margin:0;font-weight:800}.style-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.style-option{height:102px;border:1px solid #e3e5dd;border-radius:9px;background:#fff;color:#43524a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;font-size:10px;font-weight:700;text-align:center}.style-option:hover{border-color:#8baa9c}.style-option.active{border-color:#2d6653;background:#f3f9f4;box-shadow:inset 0 0 0 1px #2d6653;color:#234936}.style-glyph{width:29px;height:47px;border:2px solid currentColor;border-radius:2px;position:relative;display:flex;flex-direction:column;padding:3px;gap:3px;overflow:hidden}.style-glyph.louvered i{display:block;height:2px;background:currentColor;box-shadow:0 1px #fff5;flex:1}.style-glyph.board i{display:block;width:1px;height:100%;background:currentColor;position:absolute;left:50%;top:0}.style-glyph.board:before,.style-glyph.board:after{content:"";height:2px;background:currentColor;position:absolute;left:0;right:0;top:10px}.style-glyph.board:after{top:auto;bottom:10px}.style-glyph.panel:before,.style-glyph.panel:after{content:"";border:1px solid currentColor;position:absolute;inset:3px 3px 23px}.style-glyph.panel:after{inset:23px 3px 3px}.colors-section{margin-bottom:30px}.color-options{display:flex;gap:10px;flex-wrap:wrap}.color-option{width:34px;height:34px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #d9ded6;position:relative;padding:0}.color-option.active{box-shadow:0 0 0 2px #285947}.color-option.active:after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:15px;font-weight:800;text-shadow:0 1px 2px #0009}.color-option[data-light=true].active:after{color:#263c34;text-shadow:none}.color-name{margin-top:11px;font-size:11px;color:#7c8980;font-weight:700}.toggle-row{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;border:1px solid #e3e5dd;border-radius:9px;background:#fff;cursor:pointer}.toggle-row strong{display:block;font-size:12px}.toggle-row small{display:block;margin-top:4px;font-size:10px;color:#96a097}.switch{position:relative;display:inline-block;width:35px;height:20px}.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.switch-track{display:block;width:100%;height:100%;border-radius:20px;background:#adb4ac;transition:background .2s}.switch-track:after{content:"";position:absolute;width:14px;height:14px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}.switch input:checked+.switch-track{background:#336f57}.switch input:checked+.switch-track:after{transform:translate(15px)}.controls-footer{display:flex;gap:10px;border-top:1px solid #e4e4dc;padding-top:20px;color:#97a29a}.note-icon{flex:none;width:15px;height:15px;border:1px solid #9ba9a0;border-radius:50%;display:grid;place-items:center;font:700 10px Georgia,serif}.controls-footer p{font-size:10px;line-height:1.55;margin:0}.loading{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#d8e2da;z-index:3;color:#426755;font-size:13px;font-weight:700;transition:opacity .4s}.loading.hidden{opacity:0;pointer-events:none}.spinner{margin:auto;width:28px;height:28px;border:2px solid #acc4b3;border-top-color:#336f57;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.photo-dialog{border:0;border-radius:15px;padding:21px;background:#f8f6f1;box-shadow:0 30px 80px #152e2880;max-width:min(930px,90vw);width:100%}.photo-dialog::backdrop{background:#1e2929bd}.dialog-top{display:flex;align-items:start;justify-content:space-between;margin-bottom:15px}.dialog-eyebrow{color:#6a927e}.dialog-top h2{font-family:Manrope,sans-serif;font-size:20px;letter-spacing:-.04em;margin:5px 0 0}.dialog-top button{border:0;background:#e8eae3;width:29px;height:29px;border-radius:50%;font-size:21px;color:#43544b}.photo-dialog img{width:100%;height:auto;display:block;border-radius:7px}.photo-dialog p{font-size:11px;color:#6c7b71;margin:13px 0 0}@media(max-width:900px){.workspace{grid-template-columns:1fr;height:auto}.viewer-panel{height:min(66vh,650px);min-height:420px}.controls{border-left:0;border-top:1px solid #e1dfd7;padding:30px 24px}.controls h1{font-size:29px}.topbar{padding:0 22px}}@media(max-width:500px){.topbar{height:64px;padding:0 14px}.brand{font-size:12px;gap:7px}.brand-icon{width:22px;height:22px}.topbar-label{display:none}.photo-button{padding:8px;font-size:11px}.workspace{min-height:0}.viewer-panel{height:51vh;min-height:340px}.viewer-top{left:14px;top:14px;font-size:9px}.viewer-bottom{display:none}.view-buttons{right:10px;bottom:12px}.view-button{padding:8px 11px}.controls{padding:27px 20px}.controls h1{font-size:26px}.intro{font-size:12px}.style-option{height:91px}}.photo-canvas{position:absolute;inset:0;z-index:1;display:none!important}.photo-canvas.visible{display:block!important}.viewer-top,.viewer-bottom,.view-buttons{z-index:2}.view-button[data-view=photo]{white-space:nowrap}@media(max-width:500px){.view-button{padding:8px 7px;font-size:10px}}a.photo-button{text-decoration:none}@media(max-width:600px){.topbar-right{gap:7px}.topbar-right a.photo-button{display:none}}